Nikolay Suslov 7 år sedan
förälder
incheckning
6271d8355d
94 ändrade filer med 79923 tillägg och 141 borttagningar
  1. 1 1
      public/aframe2/index.vwf.config.yaml
  2. 13 2
      support/client/lib/index.html
  3. 4 2
      support/client/lib/vwf.js
  4. 209 136
      support/client/lib/vwf/model/aframe/aframe-master.js
  5. 0 0
      support/client/lib/vwf/model/aframe/aframe-master.js.map
  6. 0 0
      support/client/lib/vwf/model/aframe/aframe-master.min.js
  7. 0 0
      support/client/lib/vwf/model/aframe/aframe-master.min.js.map
  8. 2812 0
      support/client/lib/vwf/view/editor-new.js
  9. 578 0
      support/client/lib/vwf/view/lib/cell.js
  10. 41 0
      support/client/lib/vwf/view/lib/editorLive.css
  11. 30 0
      support/client/lib/vwf/view/lib/he.js
  12. 14505 0
      support/client/lib/vwf/view/lib/mdc/dist/material-components-web.css
  13. 81 0
      support/client/lib/vwf/view/lib/mdc/dist/material-components-web.css-entry
  14. 12486 0
      support/client/lib/vwf/view/lib/mdc/dist/material-components-web.js
  15. 20 0
      support/client/lib/vwf/view/lib/mdc/dist/mdc.animation.css
  16. 82 0
      support/client/lib/vwf/view/lib/mdc/dist/mdc.animation.css-entry
  17. 243 0
      support/client/lib/vwf/view/lib/mdc/dist/mdc.animation.js
  18. 178 0
      support/client/lib/vwf/view/lib/mdc/dist/mdc.autoInit.js
  19. 438 0
      support/client/lib/vwf/view/lib/mdc/dist/mdc.base.js
  20. 1059 0
      support/client/lib/vwf/view/lib/mdc/dist/mdc.button.css
  21. 83 0
      support/client/lib/vwf/view/lib/mdc/dist/mdc.button.css-entry
  22. 457 0
      support/client/lib/vwf/view/lib/mdc/dist/mdc.card.css
  23. 83 0
      support/client/lib/vwf/view/lib/mdc/dist/mdc.card.css-entry
  24. 1015 0
      support/client/lib/vwf/view/lib/mdc/dist/mdc.checkbox.css
  25. 83 0
      support/client/lib/vwf/view/lib/mdc/dist/mdc.checkbox.css-entry
  26. 2585 0
      support/client/lib/vwf/view/lib/mdc/dist/mdc.checkbox.js
  27. 449 0
      support/client/lib/vwf/view/lib/mdc/dist/mdc.dialog.css
  28. 83 0
      support/client/lib/vwf/view/lib/mdc/dist/mdc.dialog.css-entry
  29. 2486 0
      support/client/lib/vwf/view/lib/mdc/dist/mdc.dialog.js
  30. 1888 0
      support/client/lib/vwf/view/lib/mdc/dist/mdc.drawer.css
  31. 83 0
      support/client/lib/vwf/view/lib/mdc/dist/mdc.drawer.css-entry
  32. 1609 0
      support/client/lib/vwf/view/lib/mdc/dist/mdc.drawer.js
  33. 143 0
      support/client/lib/vwf/view/lib/mdc/dist/mdc.elevation.css
  34. 83 0
      support/client/lib/vwf/view/lib/mdc/dist/mdc.elevation.css-entry
  35. 489 0
      support/client/lib/vwf/view/lib/mdc/dist/mdc.fab.css
  36. 83 0
      support/client/lib/vwf/view/lib/mdc/dist/mdc.fab.css-entry
  37. 279 0
      support/client/lib/vwf/view/lib/mdc/dist/mdc.form-field.css
  38. 83 0
      support/client/lib/vwf/view/lib/mdc/dist/mdc.form-field.css-entry
  39. 666 0
      support/client/lib/vwf/view/lib/mdc/dist/mdc.formField.js
  40. 389 0
      support/client/lib/vwf/view/lib/mdc/dist/mdc.grid-list.css
  41. 83 0
      support/client/lib/vwf/view/lib/mdc/dist/mdc.grid-list.css-entry
  42. 673 0
      support/client/lib/vwf/view/lib/mdc/dist/mdc.gridList.js
  43. 675 0
      support/client/lib/vwf/view/lib/mdc/dist/mdc.icon-toggle.css
  44. 83 0
      support/client/lib/vwf/view/lib/mdc/dist/mdc.icon-toggle.css-entry
  45. 2332 0
      support/client/lib/vwf/view/lib/mdc/dist/mdc.iconToggle.js
  46. 508 0
      support/client/lib/vwf/view/lib/mdc/dist/mdc.layout-grid.css
  47. 83 0
      support/client/lib/vwf/view/lib/mdc/dist/mdc.layout-grid.css-entry
  48. 424 0
      support/client/lib/vwf/view/lib/mdc/dist/mdc.linear-progress.css
  49. 83 0
      support/client/lib/vwf/view/lib/mdc/dist/mdc.linear-progress.css-entry
  50. 881 0
      support/client/lib/vwf/view/lib/mdc/dist/mdc.linearProgress.js
  51. 732 0
      support/client/lib/vwf/view/lib/mdc/dist/mdc.list.css
  52. 83 0
      support/client/lib/vwf/view/lib/mdc/dist/mdc.list.css-entry
  53. 272 0
      support/client/lib/vwf/view/lib/mdc/dist/mdc.menu.css
  54. 83 0
      support/client/lib/vwf/view/lib/mdc/dist/mdc.menu.css-entry
  55. 1790 0
      support/client/lib/vwf/view/lib/mdc/dist/mdc.menu.js
  56. 467 0
      support/client/lib/vwf/view/lib/mdc/dist/mdc.radio.css
  57. 83 0
      support/client/lib/vwf/view/lib/mdc/dist/mdc.radio.css-entry
  58. 2131 0
      support/client/lib/vwf/view/lib/mdc/dist/mdc.radio.js
  59. 514 0
      support/client/lib/vwf/view/lib/mdc/dist/mdc.ripple.css
  60. 83 0
      support/client/lib/vwf/view/lib/mdc/dist/mdc.ripple.css-entry
  61. 1607 0
      support/client/lib/vwf/view/lib/mdc/dist/mdc.ripple.js
  62. 478 0
      support/client/lib/vwf/view/lib/mdc/dist/mdc.select.css
  63. 83 0
      support/client/lib/vwf/view/lib/mdc/dist/mdc.select.css-entry
  64. 2458 0
      support/client/lib/vwf/view/lib/mdc/dist/mdc.select.js
  65. 510 0
      support/client/lib/vwf/view/lib/mdc/dist/mdc.slider.css
  66. 83 0
      support/client/lib/vwf/view/lib/mdc/dist/mdc.slider.css-entry
  67. 1391 0
      support/client/lib/vwf/view/lib/mdc/dist/mdc.slider.js
  68. 397 0
      support/client/lib/vwf/view/lib/mdc/dist/mdc.snackbar.css
  69. 83 0
      support/client/lib/vwf/view/lib/mdc/dist/mdc.snackbar.css-entry
  70. 1086 0
      support/client/lib/vwf/view/lib/mdc/dist/mdc.snackbar.js
  71. 254 0
      support/client/lib/vwf/view/lib/mdc/dist/mdc.switch.css
  72. 83 0
      support/client/lib/vwf/view/lib/mdc/dist/mdc.switch.css-entry
  73. 1393 0
      support/client/lib/vwf/view/lib/mdc/dist/mdc.tabs.css
  74. 83 0
      support/client/lib/vwf/view/lib/mdc/dist/mdc.tabs.css-entry
  75. 3164 0
      support/client/lib/vwf/view/lib/mdc/dist/mdc.tabs.js
  76. 1068 0
      support/client/lib/vwf/view/lib/mdc/dist/mdc.textfield.css
  77. 83 0
      support/client/lib/vwf/view/lib/mdc/dist/mdc.textfield.css-entry
  78. 2167 0
      support/client/lib/vwf/view/lib/mdc/dist/mdc.textfield.js
  79. 259 0
      support/client/lib/vwf/view/lib/mdc/dist/mdc.theme.css
  80. 83 0
      support/client/lib/vwf/view/lib/mdc/dist/mdc.theme.css-entry
  81. 488 0
      support/client/lib/vwf/view/lib/mdc/dist/mdc.toolbar.css
  82. 83 0
      support/client/lib/vwf/view/lib/mdc/dist/mdc.toolbar.css-entry
  83. 963 0
      support/client/lib/vwf/view/lib/mdc/dist/mdc.toolbar.js
  84. 181 0
      support/client/lib/vwf/view/lib/mdc/dist/mdc.typography.css
  85. 83 0
      support/client/lib/vwf/view/lib/mdc/dist/mdc.typography.css-entry
  86. BIN
      support/client/lib/vwf/view/lib/mdc/iconfont/MaterialIcons-Regular.eot
  87. 0 0
      support/client/lib/vwf/view/lib/mdc/iconfont/MaterialIcons-Regular.ijmap
  88. 2373 0
      support/client/lib/vwf/view/lib/mdc/iconfont/MaterialIcons-Regular.svg
  89. BIN
      support/client/lib/vwf/view/lib/mdc/iconfont/MaterialIcons-Regular.ttf
  90. BIN
      support/client/lib/vwf/view/lib/mdc/iconfont/MaterialIcons-Regular.woff
  91. BIN
      support/client/lib/vwf/view/lib/mdc/iconfont/MaterialIcons-Regular.woff2
  92. 9 0
      support/client/lib/vwf/view/lib/mdc/iconfont/README.md
  93. 932 0
      support/client/lib/vwf/view/lib/mdc/iconfont/codepoints
  94. 36 0
      support/client/lib/vwf/view/lib/mdc/iconfont/material-icons.css

+ 1 - 1
public/aframe2/index.vwf.config.yaml

@@ -5,4 +5,4 @@ model:
   vwf/model/aframe:
 view:
   vwf/view/aframe:
-  vwf/view/editor-live:
+  vwf/view/editor-new:

+ 13 - 2
support/client/lib/index.html

@@ -32,6 +32,13 @@
     <script type="text/javascript" src="socket.io/socket.io.js"></script>
    <!-- <script type="text/javascript" src="socket.io-sessionid-patch.js"></script> -->
 
+     
+    <script type="text/javascript" src="vwf/view/lib/cell.js"></script>
+    <script type="text/javascript" src="vwf/view/lib/he.js"></script>
+
+    <link rel="stylesheet" href="vwf/view/lib/mdc/dist/material-components-web.css">
+    <script src= "vwf/view/lib/mdc/dist/material-components-web.js"></script>
+
     <script type="text/javascript" src="require.js"></script>
 
     <script type="text/javascript" src="async.js"></script>
@@ -129,7 +136,9 @@
             googleEarth && document.write( "<scr" + "ipt type='text/javascript' src='http://www.google.com/jsapi?hl=en&amp;key=ABQIAAAAwbkbZLyhsmTCWXbTcjbgbRSzHs7K5SvaUdm8ua-Xxy_-2dYwMxQMhnagaawTo7L1FE1-amhuQxIlXw'></scr" + "ipt>");
 
             vwf.loadConfiguration(application, userLibraries, compatibilityCheck);
+            
         });
+
     </script>
     <script type="text/javascript">googleEarth && google.load( "earth", "1" )</script>
     
@@ -142,8 +151,7 @@
 
   </head>
 
-  <body>
-
+  <body class="mdc-typography">
     <!-- Generic clients may have nearly empty pages, but pages for custom clients may be laid   -->
     <!-- out in any manner desired. Any view and models that render to the page should be        -->
     <!-- instructed where to attach their content.                                               -->
@@ -160,6 +168,9 @@
     </div>
     <div id="vwf-root"></div>
   
+
+    <script>mdc.autoInit()</script>
+
   </body>
 
 </html>

+ 4 - 2
support/client/lib/vwf.js

@@ -398,8 +398,9 @@
                 },
                 { library: "vwf/kernel/view", active: true },
                 { library: "vwf/view/document", active: true },
-            	{ library: "vwf/view/editor", active: false },
+                { library: "vwf/view/editor", active: false },
                 { library: "vwf/view/editor-live", active: false },
+                { library: "vwf/view/editor-new", active: false },
                 { library: "vwf/view/glge", 
                     disabledBy: ["vwf/model/threejs", "vwf/view/threejs"], 
                     active: false 
@@ -482,8 +483,9 @@
                     { library: "vwf/view/glge", parameters: {"application-root":"#vwf-root"}, active: false },
                     { library: "vwf/view/threejs", parameters: {"application-root":"#vwf-root"}, active: false },
                     { library: "vwf/view/document", active: true },
-                	{ library: "vwf/view/editor", active: false },
+                    { library: "vwf/view/editor", active: false },
                     { library: "vwf/view/editor-live", active: false },
+                    { library: "vwf/view/editor-new", active: false },
                     { library: "vwf/view/lesson", active: false},
                     { library: "vwf/view/google-earth", active: false },
                     { library: "vwf/view/cesium", active: false },

+ 209 - 136
support/client/lib/vwf/model/aframe/aframe-master.js

@@ -66932,7 +66932,7 @@ module.exports.Component = registerComponent('line', {
 
 function isEqualVec3 (a, b) {
   if (!a || !b) { return false; }
-  return a.x !== b.x || a.y !== b.y || a.z !== b.z;
+  return (a.x === b.x && a.y === b.y && a.z === b.z);
 }
 
 },{"../core/component":126}],90:[function(_dereq_,module,exports){
@@ -66972,7 +66972,9 @@ module.exports.Component = registerComponent('link', {
     var strokeColor = data.highlighted ? data.highlightedColor : data.color;
     el.setAttribute('material', 'strokeColor', strokeColor);
     if (data.on !== oldData.on) { this.updateEventListener(); }
-    if (data.peekMode !== oldData.peekMode) { this.updatePeekMode(); }
+    if (data.visualAspectEnabled && oldData.peekMode !== undefined && data.peekMode !== oldData.peekMode) {
+      this.updatePeekMode();
+    }
     if (!data.image || oldData.image === data.image) { return; }
     el.setAttribute('material', 'pano',
                     typeof data.image === 'string' ? data.image : data.image.src);
@@ -67105,6 +67107,7 @@ module.exports.Component = registerComponent('link', {
     var scale = new THREE.Vector3();
     var quaternion = new THREE.Quaternion();
     return function () {
+      if (!this.data.visualAspectEnabled) { return; }
       var el = this.el;
       var object3D = el.object3D;
       var camera = el.sceneEl.camera;
@@ -67694,18 +67697,19 @@ var shaderNames = shader.shaderNames;
  */
 module.exports.Component = registerComponent('material', {
   schema: {
+    alphaTest: {default: 0.0, min: 0.0, max: 1.0},
     depthTest: {default: true},
     depthWrite: {default: true},
-    alphaTest: {default: 0.0, min: 0.0, max: 1.0},
     flatShading: {default: false},
+    npot: {default: false},
+    offset: {type: 'vec2', default: {x: 0, y: 0}},
     opacity: {default: 1.0, min: 0.0, max: 1.0},
+    repeat: {type: 'vec2', default: {x: 1, y: 1}},
     shader: {default: 'standard', oneOf: shaderNames},
     side: {default: 'front', oneOf: ['front', 'back', 'double']},
     transparent: {default: false},
-    visible: {default: true},
-    offset: {type: 'vec2', default: {x: 0, y: 0}},
-    repeat: {type: 'vec2', default: {x: 1, y: 1}},
-    npot: {default: false}
+    vertexColors: {type: 'string', default: 'none', oneOf: ['face', 'vertex']},
+    visible: {default: true}
   },
 
   init: function () {
@@ -67723,7 +67727,7 @@ module.exports.Component = registerComponent('material', {
       this.updateShader(data.shader);
     }
     this.shader.update(this.data);
-    this.updateMaterial();
+    this.updateMaterial(oldData);
   },
 
   updateSchema: function (data) {
@@ -67778,25 +67782,32 @@ module.exports.Component = registerComponent('material', {
     this.updateSchema(data);
   },
 
-  updateMaterial: function () {
+  /**
+   * Set and update base material properties.
+   * Set `needsUpdate` when needed.
+   */
+  updateMaterial: function (oldData) {
     var data = this.data;
     var material = this.material;
-    var needsUpdate = false;
-    var side = parseSide(data.side);
-    if (material.side === THREE.DoubleSide && side !== THREE.DoubleSide ||
-      material.side !== THREE.DoubleSide && side === THREE.DoubleSide) {
-      needsUpdate = true;
-    }
-    material.side = side;
-    material.opacity = data.opacity;
-    material.transparent = data.transparent !== false || data.opacity < 1.0;
+
+    // Base material properties.
+    material.alphaTest = data.alphaTest;
     material.depthTest = data.depthTest !== false;
     material.depthWrite = data.depthWrite !== false;
+    material.opacity = data.opacity;
     material.shading = data.flatShading ? THREE.FlatShading : THREE.SmoothShading;
+    material.side = parseSide(data.side);
+    material.transparent = data.transparent !== false || data.opacity < 1.0;
+    material.vertexColors = parseVertexColors(data.vertexColors);
     material.visible = data.visible;
-    if (data.alphaTest !== material.alphaTest) { needsUpdate = true; }
-    material.alphaTest = data.alphaTest;
-    if (needsUpdate) { material.needsUpdate = true; }
+
+    // Check if material needs update.
+    if (Object.keys(oldData).length &&
+        (oldData.alphaTest !== data.alphaTest ||
+         oldData.side !== data.side ||
+         oldData.vertexColors !== data.vertexColors)) {
+      material.needsUpdate = true;
+    }
   },
 
   /**
@@ -67829,7 +67840,7 @@ module.exports.Component = registerComponent('material', {
 });
 
 /**
- * Returns a three.js constant determining which material face sides to render
+ * Return a three.js constant determining which material face sides to render
  * based on the side parameter (passed as a component property).
  *
  * @param {string} [side=front] - `front`, `back`, or `double`.
@@ -67850,6 +67861,23 @@ function parseSide (side) {
   }
 }
 
+/**
+ * Return a three.js constant determining vertex coloring.
+ */
+function parseVertexColors (coloring) {
+  switch (coloring) {
+    case 'face': {
+      return THREE.FaceColors;
+    }
+    case 'vertex': {
+      return THREE.VertexColors;
+    }
+    default: {
+      return THREE.NoColors;
+    }
+  }
+}
+
 /**
  * Dispose of material from memory and unsubscribe material from scene updates like fog.
  */
@@ -68332,74 +68360,87 @@ module.exports.Component = registerComponent('raycaster', {
   /**
    * Check for intersections and cleared intersections on an interval.
    */
-  tick: function (time) {
-    var el = this.el;
-    var data = this.data;
-    var i;
-    var intersectedEls = this.intersectedEls;
-    var intersections;
-    var lineLength;
-    var prevCheckTime = this.prevCheckTime;
-    var prevIntersectedEls = this.prevIntersectedEls;
-
-    // Only check for intersection if interval time has passed.
-    if (prevCheckTime && (time - prevCheckTime < data.interval)) { return; }
-    // Update check time.
-    this.prevCheckTime = time;
-
-    // Store old previously intersected entities.
-    copyArray(this.prevIntersectedEls, this.intersectedEls);
-
-    // Raycast.
-    this.updateOriginDirection();
-    intersections = this.raycaster.intersectObjects(this.objects, data.recursive);
+  tick: (function () {
+    var intersections = [];
 
-    // Only keep intersections against objects that have a reference to an entity.
-    intersections = intersections.filter(function hasEl (intersection) {
-      // Don't intersect with own line.
-      if (data.showLine && intersection.object === el.getObject3D('line')) { return false; }
-      return !!intersection.object.el;
-    });
+    return function (time) {
+      var el = this.el;
+      var data = this.data;
+      var i;
+      var intersectedEls = this.intersectedEls;
+      var intersection;
+      var lineLength;
+      var prevCheckTime = this.prevCheckTime;
+      var prevIntersectedEls = this.prevIntersectedEls;
+      var rawIntersections;
+
+      // Only check for intersection if interval time has passed.
+      if (prevCheckTime && (time - prevCheckTime < data.interval)) { return; }
+      // Update check time.
+      this.prevCheckTime = time;
+
+      // Store old previously intersected entities.
+      copyArray(this.prevIntersectedEls, this.intersectedEls);
+
+      // Raycast.
+      this.updateOriginDirection();
+      rawIntersections = this.raycaster.intersectObjects(this.objects, data.recursive);
+
+      // Only keep intersections against objects that have a reference to an entity.
+      intersections.length = 0;
+      for (i = 0; i < rawIntersections.length; i++) {
+        intersection = rawIntersections[i];
+        // Don't intersect with own line.
+        if (data.showLine && intersection.object === el.getObject3D('line')) {
+          continue;
+        }
+        if (intersection.object.el) {
+          intersections.push(intersection);
+        }
+      }
 
-    // Update intersectedEls.
-    intersectedEls.length = intersections.length;
-    for (i = 0; i < intersections.length; i++) {
-      intersectedEls[i] = intersections[i].object.el;
-    }
+      // Update intersectedEls.
+      intersectedEls.length = intersections.length;
+      for (i = 0; i < intersections.length; i++) {
+        intersectedEls[i] = intersections[i].object.el;
+      }
 
-    // Emit intersected on intersected entity per intersected entity.
-    intersections.forEach(function emitEvents (intersection) {
-      var intersectedEl = intersection.object.el;
-      intersectedEl.emit('raycaster-intersected', {el: el, intersection: intersection});
-    });
+      // Emit intersected on intersected entity per intersected entity.
+      for (i = 0; i < intersections.length; i++) {
+        intersections[i].object.el.emit('raycaster-intersected', {
+          el: el,
+          intersection: intersections[i]
+        });
+      }
 
-    // Emit all intersections at once on raycasting entity.
-    if (intersections.length) {
-      el.emit('raycaster-intersection', {
-        els: intersectedEls,
-        intersections: intersections
-      });
-    }
+      // Emit all intersections at once on raycasting entity.
+      if (intersections.length) {
+        el.emit('raycaster-intersection', {
+          els: intersectedEls,
+          intersections: intersections
+        });
+      }
 
-    // Emit intersection cleared on both entities per formerly intersected entity.
-    prevIntersectedEls.forEach(function checkStillIntersected (intersectedEl) {
-      if (intersectedEls.indexOf(intersectedEl) !== -1) { return; }
-      el.emit('raycaster-intersection-cleared', {el: intersectedEl});
-      intersectedEl.emit('raycaster-intersected-cleared', {el: el});
-    });
+      // Emit intersection cleared on both entities per formerly intersected entity.
+      for (i = 0; i < prevIntersectedEls.length; i++) {
+        if (intersectedEls.indexOf(prevIntersectedEls[i]) !== -1) { return; }
+        el.emit('raycaster-intersection-cleared', {el: prevIntersectedEls[i]});
+        prevIntersectedEls[i].emit('raycaster-intersected-cleared', {el: el});
+      }
 
-    // Update line length.
-    if (data.showLine) {
-      if (intersections.length) {
-        if (intersections[0].object.el === el && intersections[1]) {
-          lineLength = intersections[1].distance;
-        } else {
-          lineLength = intersections[0].distance;
+      // Update line length.
+      if (data.showLine) {
+        if (intersections.length) {
+          if (intersections[0].object.el === el && intersections[1]) {
+            lineLength = intersections[1].distance;
+          } else {
+            lineLength = intersections[0].distance;
+          }
         }
+        this.drawLine(lineLength);
       }
-      this.drawLine(lineLength);
-    }
-  },
+    };
+  })(),
 
   /**
    * Update origin and direction of raycaster using entity transforms and supplied origin or
@@ -69378,6 +69419,7 @@ function createEnterVRButton (enterVRHandler) {
   wrapper.setAttribute(constants.AFRAME_INJECTED, '');
   vrButton = document.createElement('button');
   vrButton.className = ENTER_VR_BTN_CLASS;
+  vrButton.setAttribute('title', 'Enter VR mode with a headset or fullscreen mode on a desktop. Visit https://webvr.rocks or https://webvr.info for more information.');
   vrButton.setAttribute(constants.AFRAME_INJECTED, '');
 
   // Insert elements.
@@ -70150,11 +70192,13 @@ function PromiseCache () {
 },{"../core/component":126,"../core/shader":135,"../lib/three":174,"../utils/":197,"load-bmfont":24,"path":32,"three-bmfont-text":38}],112:[function(_dereq_,module,exports){
 var registerComponent = _dereq_('../core/component').registerComponent;
 var THREE = _dereq_('../lib/three');
-var DEFAULT_USER_HEIGHT = _dereq_('../constants').DEFAULT_USER_HEIGHT;
+var DEFAULT_CAMERA_HEIGHT = _dereq_('../constants').DEFAULT_CAMERA_HEIGHT;
 
 var DEFAULT_HANDEDNESS = _dereq_('../constants').DEFAULT_HANDEDNESS;
-var EYES_TO_ELBOW = {x: 0.175, y: -0.3, z: -0.03}; // vector from eyes to elbow (divided by user height)
-var FOREARM = {x: 0, y: 0, z: -0.175}; // vector from eyes to elbow (divided by user height)
+// Vector from eyes to elbow (divided by user height).
+var EYES_TO_ELBOW = {x: 0.175, y: -0.3, z: -0.03};
+// Vector from eyes to elbow (divided by user height).
+var FOREARM = {x: 0, y: 0, z: -0.175};
 
 /**
  * Tracked controls component.
@@ -70204,7 +70248,7 @@ module.exports.Component = registerComponent('tracked-controls', {
   /**
    * Return default user height to use for non-6DOF arm model.
    */
-  defaultUserHeight: function () { return DEFAULT_USER_HEIGHT; }, // default user height (for cameras with zero)
+  defaultUserHeight: function () { return DEFAULT_CAMERA_HEIGHT; }, // default camera height (for cameras with zero)
 
   /**
    * Return head element to use for non-6DOF arm model.
@@ -70217,15 +70261,20 @@ module.exports.Component = registerComponent('tracked-controls', {
   updateGamepad: function () {
     var controllers = this.system.controllers;
     var data = this.data;
-    var matchingControllers;
+    var i;
+    var matchCount = 0;
 
     // Hand IDs: 0 is right, 1 is left.
-    matchingControllers = controllers.filter(function hasIdOrPrefix (controller) {
-      if (data.idPrefix) { return controller.id.indexOf(data.idPrefix) === 0; }
-      return controller.id === data.id;
-    });
-
-    this.controller = matchingControllers[data.controller];
+    for (i = 0; i < controllers.length; i++) {
+      if ((data.idPrefix && controllers[i].id.indexOf(data.idPrefix) === 0) ||
+          (!data.idPrefix && controllers[i].id === data.id)) {
+        matchCount++;
+        if (matchCount - 1 === data.controller) {
+          this.controller = controllers[i];
+          return;
+        }
+      }
+    }
   },
 
   applyArmModel: function (controllerPosition) {
@@ -73655,9 +73704,10 @@ Component.prototype = {
       this.init();
       this.initialized = true;
       delete el.initializingComponents[this.name];
-      // We pass empty object to multiple property schemas and single property schemas that parse to objects like position, rotation, scale
-      // undefined is passed to the rest of types.
-      oldData = (!isSinglePropSchema || typeof parseProperty(undefined, this.schema) === 'object') ? {} : undefined;
+      // For oldData, pass empty object to multiple-prop schemas or object single-prop schema.
+      // Pass undefined to rest of types.
+      oldData = (!isSinglePropSchema ||
+                 typeof parseProperty(undefined, this.schema) === 'object') ? {} : undefined;
       // Store current data as previous data for future updates.
       this.oldData = extendProperties({}, this.data, isSinglePropSchema);
       this.update(oldData);
@@ -73670,7 +73720,7 @@ Component.prototype = {
       }, false);
     } else {
       // Don't update if properties haven't changed
-      if (!skipTypeChecking && utils.deepEqual(this.oldData, this.data)) { return; }
+      if (utils.deepEqual(this.oldData, this.data)) { return; }
      // Store current data as previous data for future updates.
       this.oldData = extendProperties({}, this.data, isSinglePropSchema);
       // Update component.
@@ -73734,10 +73784,14 @@ Component.prototype = {
    * @return {object} The component data
    */
   buildData: function (newData, clobber, silent, skipTypeChecking) {
-    var self = this;
     var componentDefined = newData !== undefined && newData !== null;
     var data;
+    var defaultValue;
+    var keys;
+    var keysLength;
+    var mixinData;
     var schema = this.schema;
+    var i;
     var isSinglePropSchema = isSingleProp(schema);
     var mixinEls = this.el.mixinEls;
     var previousData;
@@ -73745,28 +73799,30 @@ Component.prototype = {
     // 1. Default values (lowest precendence).
     if (isSinglePropSchema) {
       // Clone default value if object so components don't share object.
-      data = typeof schema.default === 'object' ? utils.extend({}, schema.default) : schema.default;
+      data = typeof schema.default === 'object' ? utils.clone(schema.default) : schema.default;
     } else {
       // Preserve previously set properties if clobber not enabled.
       previousData = !clobber && this.attrValue;
       // Clone default value if object so components don't share object
-      data = typeof previousData === 'object' ? utils.extend({}, previousData) : {};
-      Object.keys(schema).forEach(function applyDefault (key) {
-        var defaultValue = schema[key].default;
-        if (data[key] !== undefined) { return; }
-        data[key] = defaultValue && defaultValue.constructor === Object
-          ? utils.extend({}, defaultValue)
+      data = typeof previousData === 'object' ? utils.clone(previousData) : {};
+
+      // Apply defaults.
+      for (i = 0, keys = Object.keys(schema), keysLength = keys.length; i < keysLength; i++) {
+        defaultValue = schema[keys[i]].default;
+        if (data[keys[i]] !== undefined) { continue; }
+        data[keys[i]] = defaultValue && defaultValue.constructor === Object
+          ? utils.clone(defaultValue)
           : defaultValue;
-      });
+      }
     }
 
     // 2. Mixin values.
-    mixinEls.forEach(function handleMixinUpdate (mixinEl) {
-      var mixinData = mixinEl.getAttribute(self.attrName);
+    for (i = 0; i < mixinEls.length; i++) {
+      mixinData = mixinEls[i].getAttribute(this.attrName);
       if (mixinData) {
         data = extendProperties(data, mixinData, isSinglePropSchema);
       }
-    });
+    }
 
     // 3. Attribute values (highest precendence).
     if (componentDefined) {
@@ -74023,8 +74079,8 @@ registerPropertyType('int', 0, intParse);
 registerPropertyType('number', 0, numberParse);
 registerPropertyType('map', '', assetParse);
 registerPropertyType('model', '', assetParse);
-registerPropertyType('selector', '', selectorParse, selectorStringify);
-registerPropertyType('selectorAll', '', selectorAllParse, selectorAllStringify);
+registerPropertyType('selector', null, selectorParse, selectorStringify);
+registerPropertyType('selectorAll', null, selectorAllParse, selectorAllStringify);
 registerPropertyType('src', '', srcParse);
 registerPropertyType('string', '', defaultParse, defaultStringify);
 registerPropertyType('time', 0, intParse);
@@ -74283,6 +74339,7 @@ module.exports.AScene = registerElement('a-scene', {
         this.object3D = new THREE.Scene();
         this.render = bind(this.render, this);
         this.systems = {};
+        this.systemNames = [];
         this.time = 0;
         this.init();
       }
@@ -74290,7 +74347,7 @@ module.exports.AScene = registerElement('a-scene', {
 
     init: {
       value: function () {
-        this.behaviors = { tick: [], tock: [] };
+        this.behaviors = {tick: [], tock: []};
         this.hasLoaded = false;
         this.isPlaying = false;
         this.originalHTML = this.innerHTML;
@@ -74369,6 +74426,7 @@ module.exports.AScene = registerElement('a-scene', {
       value: function (name) {
         if (this.systems[name]) { return; }
         this.systems[name] = new systems[name](this);
+        this.systemNames.push(name);
       }
     },
 
@@ -74533,8 +74591,10 @@ module.exports.AScene = registerElement('a-scene', {
      */
     onVRPresentChange: {
       value: function (evt) {
+        // Polyfill places display inside the detail property
+        var display = evt.display || evt.detail.display;
         // Entering VR.
-        if (evt.display.isPresenting) {
+        if (display.isPresenting) {
           this.enterVR(true);
           return;
         }
@@ -74735,20 +74795,23 @@ module.exports.AScene = registerElement('a-scene', {
      */
     tick: {
       value: function (time, timeDelta) {
+        var i;
         var systems = this.systems;
+
         // Animations.
         TWEEN.update();
 
         // Components.
-        this.behaviors.tick.forEach(function (component) {
-          if (!component.el.isPlaying) { return; }
-          component.tick(time, timeDelta);
-        });
+        for (i = 0; i < this.behaviors.tick.length; i++) {
+          if (!this.behaviors.tick[i].el.isPlaying) { continue; }
+          this.behaviors.tick[i].tick(time, timeDelta);
+        }
+
         // Systems.
-        Object.keys(systems).forEach(function (key) {
-          if (!systems[key].tick) { return; }
-          systems[key].tick(time, timeDelta);
-        });
+        for (i = 0; i < this.systemNames.length; i++) {
+          if (!systems[this.systemNames[i]].tick) { continue; }
+          systems[this.systemNames[i]].tick(time, timeDelta);
+        }
       }
     },
 
@@ -74759,18 +74822,20 @@ module.exports.AScene = registerElement('a-scene', {
      */
     tock: {
       value: function (time, timeDelta) {
+        var i;
         var systems = this.systems;
 
         // Components.
-        this.behaviors.tock.forEach(function (component) {
-          if (!component.el.isPlaying) { return; }
-          component.tock(time, timeDelta);
-        });
+        for (i = 0; i < this.behaviors.tock.length; i++) {
+          if (!this.behaviors.tock[i].el.isPlaying) { continue; }
+          this.behaviors.tock[i].tock(time, timeDelta);
+        }
+
         // Systems.
-        Object.keys(systems).forEach(function (key) {
-          if (!systems[key].tock) { return; }
-          systems[key].tock(time, timeDelta);
-        });
+        for (i = 0; i < this.systemNames.length; i++) {
+          if (!systems[this.systemNames[i]].tock) { continue; }
+          systems[this.systemNames[i]].tock(time, timeDelta);
+        }
       }
     },
 
@@ -75076,7 +75141,8 @@ function processPropertyDefinition (propDefinition, componentName) {
   // Check that default value exists.
   if ('default' in propDefinition) {
     // Check that default values are valid.
-    if (!isValidDefaultValue(typeName, defaultVal)) {
+    if (!isValidDefaultValue(typeName, defaultVal) &&
+        typeName !== 'selector' && typeName !== 'selectorAll') {
       warn('Default value `' + defaultVal + '` does not match type `' + typeName +
            '` in component `' + componentName + '`');
     }
@@ -76155,7 +76221,9 @@ registerGeometry('box', {
   },
 
   init: function (data) {
-    this.geometry = new THREE.BoxGeometry(data.width, data.height, data.depth);
+    this.geometry = new THREE.BoxGeometry(
+      data.width, data.height, data.depth,
+      data.segmentsWidth, data.segmentsHeight, data.segmentsDepth);
   }
 });
 
@@ -76553,7 +76621,7 @@ _dereq_('./core/a-mixin');
 _dereq_('./extras/components/');
 _dereq_('./extras/primitives/');
 
-console.log('A-Frame Version: 0.6.1 (Date 19-07-2017, Commit #83eb39b)');
+console.log('A-Frame Version: 0.6.1 (Date 07-08-2017, Commit #5e3e775)');
 console.log('three Version:', pkg.dependencies['three']);
 console.log('WebVR Polyfill Version:', pkg.dependencies['webvr-polyfill']);
 
@@ -76997,6 +77065,8 @@ module.exports.Shader = registerShader('standard', {
     displacementBias: {default: 0.5},
     displacementTextureOffset: {type: 'vec2'},
     displacementTextureRepeat: {type: 'vec2', default: {x: 1, y: 1}},
+    emissive: {type: 'color', default: '#000'},
+    emissiveIntensity: {default: 1},
     envMap: {default: ''},
 
     fog: {default: true},
@@ -77118,6 +77188,8 @@ module.exports.Shader = registerShader('standard', {
 function getMaterialData (data) {
   var newData = {
     color: new THREE.Color(data.color),
+    emissive: new THREE.Color(data.emissive),
+    emissiveIntensity: data.emissiveIntensity,
     fog: data.fog,
     metalness: data.metalness,
     roughness: data.roughness,
@@ -77529,14 +77601,15 @@ module.exports.System = registerSystem('light', {
     if (this.userDefinedLights || this.defaultLights || !this.data.defaultLightsEnabled) {
       return;
     }
+
     ambientLight = document.createElement('a-entity');
-    directionalLight = document.createElement('a-entity');
     ambientLight.setAttribute('light', {color: '#BBB', type: 'ambient'});
     ambientLight.setAttribute(DEFAULT_LIGHT_ATTR, '');
     ambientLight.setAttribute(constants.AFRAME_INJECTED, '');
     sceneEl.appendChild(ambientLight);
 
-    directionalLight.setAttribute('light', {color: '#FFF', intensity: 0.6});
+    directionalLight = document.createElement('a-entity');
+    directionalLight.setAttribute('light', {color: '#FFF', intensity: 0.6, castShadow: true});
     directionalLight.setAttribute('position', {x: -0.5, y: 1, z: 1});
     directionalLight.setAttribute(DEFAULT_LIGHT_ATTR, '');
     directionalLight.setAttribute(constants.AFRAME_INJECTED, '');
@@ -80650,9 +80723,9 @@ function iOSWakeLock() {
   this.request = function() {
     if (!timer) {
       timer = setInterval(function() {
-        window.location = window.location;
+        window.location.href = '/';
         setTimeout(window.stop, 0);
-      }, 30000);
+      }, 15000);
     }
   }
 

Filskillnaden har hållts tillbaka eftersom den är för stor
+ 0 - 0
support/client/lib/vwf/model/aframe/aframe-master.js.map


Filskillnaden har hållts tillbaka eftersom den är för stor
+ 0 - 0
support/client/lib/vwf/model/aframe/aframe-master.min.js


Filskillnaden har hållts tillbaka eftersom den är för stor
+ 0 - 0
support/client/lib/vwf/model/aframe/aframe-master.min.js.map


+ 2812 - 0
support/client/lib/vwf/view/editor-new.js

@@ -0,0 +1,2812 @@
+"use strict";
+
+// Copyright 2012 United States Government, as represented by the Secretary of Defense, Under
+// Secretary of Defense (Personnel & Readiness).
+// 
+// Licensed under the Apache License, Version 2.0 (the "License"); you may not use this file except
+// in compliance with the License. You may obtain a copy of the License at
+// 
+//   http://www.apache.org/licenses/LICENSE-2.0
+// 
+// Unless required by applicable law or agreed to in writing, software distributed under the License
+// is distributed on an "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express
+// or implied. See the License for the specific language governing permissions and limitations under
+// the License.
+
+/// vwf/view/editor creates a view interface for editor functions. 
+/// 
+/// @module vwf/view/editor
+/// @requires version
+/// @requires vwf/view
+/// @requires vwf/utility
+
+define([
+    "module",
+    "version",
+    "vwf/view",
+    "vwf/utility",
+    "vwf/view/lib/ace/ace",
+    "jquery",
+    "jquery-ui",
+    "jquery-encoder-0.1.0"
+], function (module, version, view, utility, ace, $) {
+
+
+
+    return view.load(module, {
+
+        // == Module Definition ====================================================================
+
+        initialize: function () {
+            var self = this;
+            this.ace = window.ace;
+
+            this.nodes = {};
+            this.scenes = {};
+            this.allScripts = {};
+
+            // EDITOR CLOSED  --> 0
+            // HIERARCHY OPEN --> 1
+            // USER LIST OPEN --> 2
+            // TIMELINE OPEN  --> 3
+            // ABOUT OPEN     --> 4
+            this.editorView = 0;
+            this.editorOpen = false;
+            this.timelineInit = false;
+            this.aboutInit = false;
+            this.codeEditorInit = false;
+            this.modelsInit = false;
+            this.editingScript = false;
+
+            this.topdownName = '#topdown_a';
+            this.topdownTemp = '#topdown_b';
+            this.clientList = '#client_list';
+            this.timeline = '#time_control';
+            this.about = '#about_tab';
+            this.codeEditor = '#codeEditor_tab';
+            this.models = '#model_a';
+            this.modelsTemp = '#model_b';
+            this.currentNodeID = '';
+            this.currentModelID = '';
+            this.currentModelURL = '';
+            this.highlightedChild = '';
+            this.intervalTimer = 0;
+
+            this.activeCameraID = undefined;
+
+
+            $(document.head).append('<style type="text/css" media="screen"> #editorlive { height: 500px; width: 800px; } </style>');
+            document.querySelector('head').innerHTML += '<link rel="stylesheet" href="vwf/view/lib/editorLive.css">';
+
+
+
+            // $('body').append('<script>mdc.autoInit()</script>');
+
+
+
+
+            $('body').append(
+                "<div id='drawer'></div><div id='toolbar'></div<div id='clientsList'></div><div id='editor' class='relClass'>\n" +
+                "  <div class='uiContainer'>\n" +
+                "    <div class='editor-tabs' id='tabs'>\n" +
+                "      <img id='x' style='display:none' src='images/tab_X.png' alt='x' />\n" +
+                "      <img id='hierarchy' src='images/tab_Application.png' alt='application' />\n" +
+                "      <img id='userlist' src='images/tab_Users.png' alt='users' />\n" +
+                "      <img id='timeline' src='images/tab_Time.png' alt='time' />\n" +
+                "      <img id='models' src='images/tab_Models.png' alt='models' />\n" +
+                "      <img id='about' src='images/tab_About.png' alt='about' />\n" +
+                "      <img id='codeEditor' src='images/tab_CodeEditor.png' alt='code' />\n" +
+                "    </div>\n" +
+                "  </div>\n" +
+                "</div>" +
+                "<div class='relClass'><div class='uiContainer'><div class='vwf-tree' id='topdown_a'></div></div></div>" +
+                "<div class='relClass'><div class='uiContainer'><div class='vwf-tree' id='topdown_b'></div></div></div>" +
+                "<div class='relClass'><div class='uiContainer'><div class='vwf-tree' id='client_list'></div></div></div>" +
+                "<div class='relClass'><div class='uiContainer'><div class='vwf-tree' id='time_control'></div></div></div>" +
+                "<div class='relClass'><div class='uiContainer'><div class='vwf-tree' id='about_tab'></div></div></div>" +
+                "<div class='relClass'><div class='uiContainer'><div class='vwf-tree' id='codeEditor_tab'></div></div></div>" +
+                "<div class='relClass'><div class='uiContainer'><div class='vwf-tree' id='model_a'></div></div></div>" +
+                "<div class='relClass'><div class='uiContainer'><div class='vwf-tree' id='model_b'></div></div></div>"
+            );
+
+            //style: "position: absolute; top: 0; left: 0; z-index: 2",
+
+            
+
+            let protoPropertiesCell = function(m) {
+                return { 
+                    $type: "li",
+                    class: "mdc-list-item",
+                    _prop: {},
+                    $init: function () {
+                        let prop = m[1].prop;
+                        if (prop.value == undefined) {
+                            prop.value = JSON.stringify(utility.transform(vwf.getProperty(self.currentNodeID, prop.name, []), utility.transforms.transit));
+                        } 
+                        this._prop = prop
+                    },
+                    $update: function () {
+                        this.$components = [{
+                            $type: "span",
+                            class: "mdc-list-item",
+                            $text: this._prop.name,
+                            },
+                            {
+                                class: "mdc-textfield",
+                                $cell: true,
+                                $type: "div",
+                                $components: [{
+                                    class: "mdc-textfield__input",
+                                    $cell: true,
+                                    $type: "input",
+                                    type: "text",
+                                    value: this._prop.value,
+                                    onchange: function(e){
+                                        let propValue = this.value;
+                                        try {
+                                            propValue = JSON.parse(propValue);
+                                            self.kernel.setProperty(self.currentNodeID, m.name, propValue);
+                                        } catch (e) {
+                                            // restore the original value on error
+                                            this.value = propValue;
+                                        }
+                                    }
+                                }]
+    
+                            }
+                        ]
+
+                    }
+                }  
+
+            }
+
+            let propertiesCell = function(m) {
+                return { 
+                    $type: "li",
+                    class: "mdc-list-item",
+                    $components: [{
+                        $type: "span",
+                        class: "mdc-list-item",
+                        $text: m.name,
+                        },
+                        {
+                            class: "mdc-textfield",
+                            $cell: true,
+                            $type: "div",
+                            $components: [{
+                                class: "mdc-textfield__input",
+                                $cell: true,
+                                $type: "input",
+                                type: "text",
+                                value: m.getValue(),
+                                onchange: function(e){
+                                    let propValue = this.value;
+                                    try {
+                                        propValue = JSON.parse(propValue);
+                                        self.kernel.setProperty(self.currentNodeID, m.name, propValue);
+                                    } catch (e) {
+                                        // restore the original value on error
+                                        this.value = propValue;
+                                    }
+                                }
+                            }]
+
+                        }
+                    ]
+                    }
+
+
+            }
+
+            let nodeLink = function(m){ 
+                return { 
+                    $type: "li",
+                    class: "mdc-list-item",
+                    $components: [{
+                        $type: "a",
+                        class: "mdc-list-item mdc-persistent-drawer--selected",
+                        $href: "#",
+                        $text: m.name,
+                        
+                        onclick: function(e){
+                            self.currentNodeID = m.ID;
+                            document.querySelector('#currentNode')._setNode(m.ID);
+                          }
+                        }]
+                    } 
+                };
+
+            let listDivider = {
+               //<li role="separator" class="mdc-list-divider"></li>
+                    $cell: true,
+                    $type: "li",
+                    class: "mdc-list-divider",
+                    role: "separator"  
+            }
+
+            let nodesCell = {
+                style:"overflow: scroll; max-height: 600px;",
+                $cell: true,
+                $type: "div",
+                id: "currentNode",
+                _currentNode: '',
+                _setNode: function (aNode) {
+                    this._currentNode = aNode
+                },
+                $init: function () {
+                    //this._currentNode = vwf_view.kernel.find("", "/")[0];
+                    //this._currentNode = '3333';
+                },
+                _getChildNodes: function() {
+                            let node = self.nodes[this._currentNode];
+                            //let nodeIDAlpha = he.encode(this._currentNode);
+                            return node.children
+                        },
+                _getNodeProperties: function() {
+                    let node = self.nodes[this._currentNode];
+                    return node.properties
+                },
+                _getNodeProtoProperties: function() {
+                    let node = self.nodes[this._currentNode];
+                    let prototypeProperties = getProperties.call(self, self.kernel, node.extendsID);
+                    return prototypeProperties
+                },
+                $update: function () {
+                    //this.$text = this._currentNode;
+                    this.$components = [
+                        {
+                            $cell: true,
+                            $type: "a",
+                            class: "mdc-list-item mdc-persistent-drawer--selected",
+                            $href: "#",
+                            $text: "<--",
+                            onclick: function(e){
+                                let node = self.nodes[this._currentNode];
+                                if (node.parentID !== 0) {
+                                    self.currentNodeID = node.parentID,
+                                    document.querySelector('#currentNode')._setNode(self.currentNodeID)
+                                }
+                                
+                              }
+
+                        },
+                        {
+                            $cell: true,
+                            $type: "a",
+                            class: "mdc-list-item mdc-persistent-drawer--selected",
+                            $href: "#",
+                            $text: this._currentNode
+                        }, listDivider,
+                        {
+                            $cell: true,
+                            $type: "ul",
+                            class: "mdc-list",
+                            $components: this._getChildNodes().map(nodeLink)
+                        }, listDivider,
+                        {
+                            $cell: true,
+                            $type: "ul",
+                            class: "mdc-list",
+                            $components: this._getNodeProperties().map(propertiesCell)
+                        }, listDivider,
+                        {
+                            $cell: true,
+                            $type: "ul",
+                            class: "mdc-list",
+                            $components: Object.entries(this._getNodeProtoProperties()).map(protoPropertiesCell)
+                        }
+                        ]
+                }
+                
+            }
+
+            let clientListCell = {
+                $cell: true,
+                $type: "div",
+                _clientNodes: [],
+                _setNode: function (aNodes) {
+                    this._clientNodes = aNodes
+                },
+                $init: function () {
+                   // var t = this;
+                   // t._clientNodes = self.nodes["http://vwf.example.com/clients.vwf"];
+
+
+
+                },
+                $update: function () {
+                    this.$components = this._filteredItems.map(Tr);
+                },
+                $components: [{
+                    $cell: true,
+                    $type: "ul",
+                    class: "mdc-list",
+                    _items: [],
+                    $components: [{
+                        $cell: true,
+                        $type: "li",
+                        class: "mdc-list-item",
+                        $text: "client"
+                    }
+                    ]
+
+                }]
+            }
+
+            let drawerCell = {
+                $cell: true,
+                $type: "nav",
+                class: "mdc-persistent-drawer__drawer",
+                $components: [
+                    {
+                        $cell: true,
+                        $type: "div",
+                        class: "mdc-persistent-drawer__toolbar-spacer",
+                    },
+                    {
+                        $cell: true,
+                        $type: "div",
+                        class: "mdc-list-group",
+                        $components: [{
+                            $cell: true,
+                            $type: "nav",
+                            class: "mdc-list",
+                            $components: [{
+                                $cell: true,
+                                $type: "a",
+                                class: "mdc-list-item mdc-persistent-drawer--selected",
+                                $href: "#",
+                                $components: [{
+                                    $cell: true,
+                                    $type: "i",
+                                    class: "material-icons mdc-list-item__start-detail",
+                                    $text: "inbox"
+                                },
+                                {
+                                    $text: "Inbox "
+                                }
+                                ]
+
+                            },
+                            {
+                                $cell: true,
+                                $type: "a",
+                                class: "mdc-list-item mdc-persistent-drawer--selected",
+                                $href: "#",
+                                $components: [{
+                                    $type: "i",
+                                    class: "material-icons mdc-list-item__start-detail",
+                                    'aria-hidden': "true",
+                                    $text: "star"
+                                },
+                                {
+                                    $text: "Star "
+                                }]
+
+                            },
+
+                            {
+                                class: "mdc-textfield",
+                                $cell: true,
+                                $type: "div",
+                                $components: [{
+                                    class: "mdc-textfield__input",
+                                    $cell: true,
+                                    $type: "input",
+                                    type: "text"
+                                }]
+
+                            }, nodesCell
+                            ]
+                        }]
+                    }]
+
+            };
+
+            //             <div class="mdc-form-field">
+            //   <input type="checkbox" id="input">
+            //   <label for="input">Input Label</label>
+            // </div>
+
+            document.querySelector("#drawer").$cell({
+                $cell: true,
+                $type: "aside",
+                class: "mdc-persistent-drawer",
+                $components: [drawerCell]
+            }
+            );
+
+
+            let toolbar = {
+                $cell: true,
+                $type: "div",
+                class: "mdc-toolbar__row",
+                $components: [{
+                    $type: "section",
+                    class: "mdc-toolbar__section mdc-toolbar__section--align-start",
+                    $components: [
+                        {
+                            $type: "button",
+                            class: "demo-menu material-icons mdc-toolbar__icon--menu",
+                            $text: "menu"
+
+
+                        },
+                        {
+                            $type: "span",
+                            class: "mdc-toolbar__title catalog-title",
+                            $text: "LiveCoding.space"
+                        }
+                    ]
+                }]
+
+            };
+
+            document.querySelector("#toolbar").$cell({
+                $cell: true,
+                $type: "div",
+                class: "mdc-toolbar mdc-toolbar--fixed",
+                $components: [toolbar]
+            }
+            );
+
+            // let drawer = new mdc.drawer.MDCTemporaryDrawer(document.querySelector('.mdc-temporary-drawer'));
+            // document.querySelector('.menu').addEventListener('click', () => drawer.open = true);
+
+            var drawerEl = document.querySelector('.mdc-persistent-drawer');
+            var MDCPersistentDrawer = mdc.drawer.MDCPersistentDrawer;
+            var drawer = new MDCPersistentDrawer(drawerEl);
+            document.querySelector('.demo-menu').addEventListener('click', function () {
+                self.currentNodeID = (self.currentNodeID == '') ? (vwf_view.kernel.find("", "/")[0]) : self.currentNodeID; 
+                document.querySelector('#currentNode')._setNode(self.currentNodeID);
+                drawer.open = !drawer.open;
+            });
+            drawerEl.addEventListener('MDCPersistentDrawer:open', function () {
+                console.log('Received MDCPersistentDrawer:open');
+            });
+            drawerEl.addEventListener('MDCPersistentDrawer:close', function () {
+                console.log('Received MDCPersistentDrawer:close');
+            });
+
+
+
+
+            
+
+
+
+            $('#tabs').stop().animate({ opacity: 0.0 }, 0);
+
+            $('#tabs').mouseenter(function (evt) {
+                evt.stopPropagation();
+                $('#tabs').stop().animate({ opacity: 1.0 }, 175);
+                return false;
+            });
+
+            $('#tabs').mouseleave(function (evt) {
+                evt.stopPropagation();
+                $('#tabs').stop().animate({ opacity: 0.0 }, 175);
+                return false;
+            });
+
+            $('#hierarchy').click(function (evt) {
+                openEditor.call(self, 1);
+            });
+
+            $('#userlist').click(function (evt) {
+                openEditor.call(self, 2);
+            });
+
+            $('#timeline').click(function (evt) {
+                openEditor.call(self, 3);
+            });
+
+            $('#about').click(function (evt) {
+                openEditor.call(self, 4);
+            });
+
+            $('#models').click(function (evt) {
+                openEditor.call(self, 5);
+            });
+
+            $('#codeEditor').click(function (evt) {
+                openEditor.call(self, 6);
+            });
+
+            $('#x').click(function (evt) {
+                closeEditor.call(self);
+            });
+
+            $('#topdown_a').hide();
+            $('#topdown_b').hide();
+            $('#client_list').hide();
+            $('#time_control').hide();
+            $('#about_tab').hide();
+            $('#codeEditor_tab').hide();
+            $('#model_a').hide();
+            $('#model_b').hide();
+
+            var canvas = document.getElementById(vwf_view.kernel.find("", "/")[0]);
+            if (canvas) {
+                $('#topdown_a').height(canvas.height);
+                $('#topdown_b').height(canvas.height);
+                $('#client_list').height(canvas.height);
+                $('#time_control').height(canvas.height);
+                $('#about_tab').height(canvas.height);
+                $('#codeEditor_tab').height(canvas.height);
+                $('#model_a').height(canvas.height);
+                $('#model_b').height(canvas.height);
+            }
+            else {
+                $('#topdown_a').height(window.innerHeight - 20);
+                $('#topdown_b').height(window.innerHeight - 20);
+                $('#client_list').height(window.innerHeight - 20);
+                $('#time_control').height(window.innerHeight - 20);
+                $('#about_tab').height(window.innerHeight - 20);
+                $('#codeEditor_tab').height(window.innerHeight - 20);
+                $('#model_a').height(window.innerHeight - 20);
+                $('#model_b').height(window.innerHeight - 20);
+            }
+        },
+
+        createdNode: function (nodeID, childID, childExtendsID, childImplementsIDs,
+            childSource, childType, childIndex, childName, callback /* ( ready ) */) {
+
+            var nodeIDAttribute = $.encoder.encodeForHTMLAttribute("id", nodeID, true);
+            var childIDAttribute = $.encoder.encodeForHTMLAttribute("id", childID, true);
+            var childIDAlpha = $.encoder.encodeForAlphaNumeric(childID);
+
+            var kernel = this.kernel;
+            var self = this;
+            var parent = this.nodes[nodeID];
+            var node = this.nodes[childID] = {
+                children: [],
+                properties: [],
+                events: {},
+                methods: {},
+                parent: parent,
+                parentID: nodeID,
+                ID: childID,
+                extendsID: childExtendsID,
+                implementsIDs: childImplementsIDs,
+                source: childSource,
+                name: childName,
+            };
+
+            if (parent) {
+                parent.children.push(node);
+            }
+
+            if (childID == vwf_view.kernel.find("", "/")[0] && childExtendsID && this.kernel.test(childExtendsID,
+                "self::element(*,'http://vwf.example.com/aframe/ascene.vwf')", childExtendsID)) {
+                this.scenes[childID] = node;
+            }
+
+            if (nodeID === this.currentNodeID && this.editingScript == false) {
+                $('#children > div:last').css('border-bottom-width', '1px');
+                $("#children").append("<div id='" + childIDAlpha + "' data-nodeID='" + childIDAttribute + "' class='childContainer'><div class='childEntry'><b>" + $.encoder.encodeForHTML(childName) + "</b></div></div>");
+                $('#' + childIDAlpha).click(function (evt) {
+                    drillDown.call(self, $(this).attr("data-nodeID"), nodeIDAttribute);
+                });
+                $('#children > div:last').css('border-bottom-width', '3px');
+            }
+
+            if (nodeID === this.kernel.application() && childName === 'camera') {
+                this.activeCameraID = childID;
+            }
+
+            if (nodeID === this.kernel.application()) {
+                // document.querySelector('a-scene').classList.add("mdc-toolbar-fixed-adjust");
+                document.querySelector('body').classList.add("editor-body");
+            }
+
+
+
+        },
+
+        createdProperty: function (nodeID, propertyName, propertyValue) {
+
+            return this.initializedProperty(nodeID, propertyName, propertyValue);
+        },
+
+        initializedProperty: function (nodeID, propertyName, propertyValue) {
+
+            var node = this.nodes[nodeID];
+
+            if (!node) return;  // TODO: patch until full-graph sync is working; drivers should be able to assume that nodeIDs refer to valid objects
+
+            var property = node.properties[propertyName] = createProperty.call(this, node, propertyName, propertyValue);
+
+            node.properties.push(property);
+        },
+
+        deletedNode: function (nodeID) {
+            var node = this.nodes[nodeID];
+            node.parent.children.splice(node.parent.children.indexOf(node), 1);
+            delete this.nodes[nodeID];
+            var nodeIDAttribute = $.encoder.encodeForAlphaNumeric(nodeID); // $.encoder.encodeForHTMLAttribute("id", nodeID, true);
+            $('#' + nodeIDAttribute).remove();
+            $('#children > div:last').css('border-bottom-width', '3px');
+        },
+
+        //addedChild: [ /* nodeID, childID, childName */ ],
+        //removedChild: [ /* nodeID, childID */ ],
+
+        satProperty: function (nodeID, propertyName, propertyValue) {
+            var node = this.nodes[nodeID];
+
+            if (!node) return;  // TODO: patch until full-graph sync is working; drivers should be able to assume that nodeIDs refer to valid objects
+
+            // It is possible for a property to have satProperty called for it without ever getting an
+            // initializedProperty (if that property delegated to itself or another on replication)
+            // Catch that case here and create the property
+            if (!node.properties[propertyName]) {
+
+                var property = node.properties[propertyName] = createProperty.call(this, node, propertyName, propertyValue);
+
+                node.properties.push(property);
+            }
+
+            if (propertyName === "activeCamera") {
+                if (this.nodes[propertyValue] !== undefined) {
+                    this.activeCameraID = propertyValue;
+                }
+            }
+
+            try {
+                propertyValue = utility.transform(propertyValue, utility.transforms.transit);
+                node.properties[propertyName].value = JSON.stringify(propertyValue);
+                node.properties[propertyName].rawValue = propertyValue;
+            } catch (e) {
+                this.logger.warnx("satProperty", nodeID, propertyName, propertyValue,
+                    "stringify error:", e.message);
+                node.properties[propertyName].value = propertyValue;
+            }
+
+            if ((this.editorView == 1) && (this.currentNodeID == nodeID)) {
+                var nodeIDAttribute = $.encoder.encodeForAlphaNumeric(nodeID); // $.encoder.encodeForHTMLAttribute("id", nodeID, true);
+                var propertyNameAttribute = $.encoder.encodeForAlphaNumeric("id", propertyName, true);
+
+                // No need to escape propertyValue, because .val does its own escaping
+                $('#input-' + nodeIDAttribute + '-' + propertyNameAttribute).val(node.properties[propertyName].getValue());
+            }
+        },
+
+        //gotProperty: [ /* nodeID, propertyName, propertyValue */ ],
+
+        createdMethod: function (nodeID, methodName, methodParameters, methodBody) {
+            var node = this.nodes[nodeID];
+            if (node) {
+                node.methods[methodName] = methodParameters;
+            }
+        },
+
+        //calledMethod: function( nodeID, methodName, methodParameters, methodValue ) {
+
+        //},
+
+        createdEvent: function (nodeID, eventName, eventParameters) {
+            var node = this.nodes[nodeID];
+            if (node) {
+                node.events[eventName] = eventParameters;
+            }
+        },
+
+        firedEvent: function (nodeID, eventName, eventParameters) {
+            if (eventName == "pointerHover") {
+                highlightChildInHierarchy.call(this, nodeID);
+            }
+        },
+
+        executed: function (nodeID, scriptText, scriptType) {
+
+            // var nodeScript = {
+            //     text: scriptText,
+            //     type: scriptType,
+            // };
+
+            // if ( !this.allScripts[ nodeID ] ) {
+            //     var nodeScripts = new Array();
+            //     nodeScripts.push(nodeScript);
+
+            //     this.allScripts[ nodeID ] = nodeScripts;
+            // }
+
+            // else {
+            //     this.allScripts[ nodeID ].push(nodeScript);
+            // }
+        },
+
+        //ticked: [ /* time */ ],
+
+    });
+
+    // -- getChildByName --------------------------------------------------------------------
+
+    
+
+
+    function getChildByName(node, childName) {
+        var childNode = undefined;
+        for (var i = 0; i < node.children.length && childNode === undefined; i++) {
+            if (node.children[i].name == childName) {
+                childNode = node.children[i];
+            }
+        }
+        return childNode;
+    };
+
+    function updateCameraProperties() {
+
+        if (this.currentNodeID == this.activeCameraID) {
+            if (!this.intervalTimer) {
+                var self = this;
+                this.intervalTimer = setInterval(function () { updateProperties.call(self, self.activeCameraID) }, 200);
+            }
+        }
+        else {
+            if (this.intervalTimer) {
+                clearInterval(this.intervalTimer);
+                this.intervalTimer = 0;
+            }
+        }
+    }
+
+    function updateProperties(nodeName) {
+
+        var nodeID = nodeName;
+        var properties = getProperties.call(this, this.kernel, nodeID);
+
+        for (var i in properties) {
+            try {
+                var propertyName = properties[i].prop.name;
+                var propertyValue = JSON.stringify(utility.transform(vwf.getProperty(nodeID, propertyName, []), utility.transforms.transit));
+            } catch (e) {
+                this.logger.warnx("satProperty", nodeID, propertyName, propertyValue, "stringify error:", e.message);
+            }
+
+            if (propertyValue) {
+                var nodeIDAttribute = $.encoder.encodeForAlphaNumeric(nodeID);
+                var propertyNameAttribute = $.encoder.encodeForHTMLAttribute("id", propertyName, true);
+                var inputElement$ = $('#input-' + nodeIDAttribute + '-' + propertyNameAttribute);
+                // Only update if property value input is not in focus
+                // If in focus, change font style to italic
+                if (!inputElement$.is(":focus")) {
+                    inputElement$.val(propertyValue);
+                    inputElement$.css("font-style", "normal");
+                } else {
+                    inputElement$.css("font-style", "italic");
+                }
+            }
+        }
+    }
+
+    // -- openEditor ------------------------------------------------------------------------
+
+    function openEditor(eView) // invoke with the view as "this"
+    {
+        if (eView == 0) {
+            closeEditor.call(this);
+        }
+
+        if (this.editorView != eView) {
+            // Hierarchy
+            if (eView == 1) {
+                var topdownName = this.topdownName;
+                var topdownTemp = this.topdownTemp;
+
+                if (!this.currentNodeID) {
+                    this.currentNodeID = vwf_view.kernel.find("", "/")[0];
+                }
+
+                drill.call(this, this.currentNodeID, undefined);
+                $(this.clientList).hide();
+                $(this.timeline).hide();
+                $(this.about).hide();
+                $(this.codeEditor).hide();
+                $(this.models).hide();
+
+                if (this.editorOpen) {
+                    $(topdownName).hide();
+                    $(topdownTemp).show();
+                }
+
+                else {
+                    $(topdownTemp).show('slide', { direction: 'right' }, 175);
+                }
+
+                this.topdownName = topdownTemp;
+                this.topdownTemp = topdownName;
+            }
+
+            else if (this.editingScript) {
+                // Reset width if on script
+                this.editingScript = false;
+                $('#editor').animate({ 'left': "-260px" }, 175);
+                $('.vwf-tree').animate({ 'width': "260px" }, 175);
+            }
+
+            // User List
+            if (eView == 2) {
+                $(this.topdownName).hide();
+                $(this.topdownTemp).hide();
+                $(this.timeline).hide();
+                $(this.about).hide();
+                $(this.codeEditor).hide();
+                $(this.models).hide();
+                $(this.modelsTemp).hide();
+                showUserList.call(this);
+            }
+
+            // Timeline
+            else if (eView == 3) {
+                $(this.topdownName).hide();
+                $(this.topdownTemp).hide();
+                $(this.clientList).hide();
+                $(this.about).hide();
+                $(this.codeEditor).hide();
+                $(this.models).hide();
+                $(this.modelsTemp).hide();
+                showTimeline.call(this);
+            }
+
+            // About
+            else if (eView == 4) {
+                $(this.topdownName).hide();
+                $(this.topdownTemp).hide();
+                $(this.clientList).hide();
+                $(this.timeline).hide();
+                $(this.models).hide();
+                $(this.modelsTemp).hide();
+                $(this.codeEditor).hide();
+                showAboutTab.call(this);
+            }
+
+            // Models
+            else if (eView == 5) {
+                var models = this.models;
+                var modelsTemp = this.modelsTemp;
+
+                showModelsTab.call(this, this.currentModelID, this.currentModelURL);
+                $(this.topdownName).hide();
+                $(this.topdownTemp).hide();
+                $(this.clientList).hide();
+                $(this.timeline).hide();
+                $(this.about).hide();
+                $(this.codeEditor).hide();
+
+                if (this.editorOpen) {
+                    $(models).hide();
+                    $(modelsTemp).show();
+                }
+
+                else {
+                    $(modelsTemp).show('slide', { direction: 'right' }, 175);
+                }
+
+                this.models = modelsTemp;
+                this.modelsTemp = models;
+            }
+
+            // Code Editor
+            else if (eView == 6) {
+                $(this.topdownName).hide();
+                $(this.topdownTemp).hide();
+                $(this.clientList).hide();
+                $(this.timeline).hide();
+                $(this.models).hide();
+                $(this.modelsTemp).hide();
+                $(this.about).hide();
+                showCodeEditorTab.call(this);
+            }
+
+            if (this.editorView == 0) {
+                $('#vwf-root').animate({ 'left': "-=260px" }, 175);
+                $('#editor').animate({ 'left': "-260px" }, 175);
+                $('#x').delay(1000).css({ 'display': 'inline' });
+            }
+
+            this.editorView = eView;
+            this.editorOpen = true;
+        }
+    }
+
+    // -- closeEditor -----------------------------------------------------------------------
+
+    function closeEditor() // invoke with the view as "this"
+    {
+        var topdownName = this.topdownName;
+
+        if (this.editorOpen && this.editorView == 1) // Hierarchy view open
+        {
+            $(topdownName).hide('slide', { direction: 'right' }, 175);
+            $(topdownName).empty();
+            $(this.clientList).hide();
+            $(this.timeline).hide();
+            $(this.about).hide();
+            $(this.codeEditor).hide();
+            $(this.models).hide();
+        }
+
+        else if (this.editorOpen && this.editorView == 2) // Client list open
+        {
+            $(this.clientList).hide('slide', { direction: 'right' }, 175);
+            $(topdownName).hide();
+            $(this.timeline).hide();
+            $(this.about).hide();
+            $(this.codeEditor).hide();
+            $(this.models).hide();
+        }
+
+        else if (this.editorOpen && this.editorView == 3) // Timeline open
+        {
+            $(this.timeline).hide('slide', { direction: 'right' }, 175);
+            $(topdownName).hide();
+            $(this.clientList).hide();
+            $(this.about).hide();
+            $(this.models).hide();
+        }
+
+        else if (this.editorOpen && this.editorView == 4) // About open
+        {
+            $(this.about).hide('slide', { direction: 'right' }, 175);
+            $(this.codeEditor).hide();
+            $(topdownName).hide();
+            $(this.clientList).hide();
+            $(this.timeline).hide();
+            $(this.models).hide();
+        }
+
+        else if (this.editorOpen && this.editorView == 5) // Models open
+        {
+            $(this.models).hide('slide', { direction: 'right' }, 175);
+            $(topdownName).hide();
+            $(this.clientList).hide();
+            $(this.timeline).hide();
+            $(this.about).hide();
+            $(this.codeEditor).hide();
+        }
+        else if (this.editorOpen && this.editorView == 6) // Code Editor open
+        {
+            $(this.codeEditor).hide('slide', { direction: 'right' }, 175);
+            $(this.about).hide();
+            $(topdownName).hide();
+            $(this.clientList).hide();
+            $(this.timeline).hide();
+            $(this.models).hide();
+        }
+
+
+        $('#vwf-root').animate({ 'left': "+=260px" }, 175);
+        $('#editor').animate({ 'left': "0px" }, 175);
+        $('#x').css({ 'display': 'none' });
+        this.editorView = 0;
+        this.editorOpen = false;
+    }
+
+    // -- showUserList ----------------------------------------------------------------------
+
+    function showUserList() // invoke with the view as "this"
+    {
+        var clientList = this.clientList;
+
+        viewClients.call(this);
+
+        if (!this.editorOpen) {
+            $(clientList).show('slide', { direction: 'right' }, 175);
+        }
+        else {
+            $(clientList).show();
+        }
+    }
+
+    // -- viewClients -----------------------------------------------------------------------
+
+    function viewClients() {
+        var self = this;
+        var app = window.location.pathname;
+        var pathSplit = app.split('/');
+        if (pathSplit[0] == "") {
+            pathSplit.shift();
+        }
+        if (pathSplit[pathSplit.length - 1] == "") {
+            pathSplit.pop();
+        }
+        var instIndex = pathSplit.length - 1;
+        if (pathSplit.length > 2) {
+            if (pathSplit[pathSplit.length - 2] == "load") {
+                instIndex = pathSplit.length - 3;
+            }
+        }
+        if (pathSplit.length > 3) {
+            if (pathSplit[pathSplit.length - 3] == "load") {
+                instIndex = pathSplit.length - 4;
+            }
+        }
+
+        var root = "";
+        for (var i = 0; i < instIndex; i++) {
+            if (root != "") {
+                root = root + "/";
+            }
+            root = root + pathSplit[i];
+        }
+
+        if (root.indexOf('.vwf') != -1) root = root.substring(0, root.lastIndexOf('/'));
+
+        var clients$ = $(this.clientList);
+        var node = this.nodes["http://vwf.example.com/clients.vwf"];
+
+        clients$.html("<div class='header'>Connected Clients</div>");
+
+        // Add node children
+        clients$.append("<div id='clientsChildren'></div>");
+        for (var i = 0; i < node.children.length; i++) {
+            var nodeChildIDAttribute = $.encoder.encodeForHTMLAttribute("id", node.children[i].ID, true);
+            var nodeChildIDAlpha = $.encoder.encodeForAlphaNumeric(node.children[i].ID);
+            var nodeChildNameHTML = $.encoder.encodeForHTML(node.children[i].name);
+            $('#clientsChildren').append("<div id='" + nodeChildIDAlpha + "' data-nodeID='" + nodeChildIDAttribute + "' class='childContainer'><div class='childEntry'><b>" + nodeChildNameHTML + "</b></div></div>");
+            $('#' + nodeChildIDAlpha).click(function (evt) {
+                viewClient.call(self, $(this).attr("data-nodeID"));
+            });
+        }
+
+        // Login Information
+        clients$.append("<div style='padding:6px'><input class='filename_entry' type='text' id='userName' placeholder='Username' /><!-- <input class='filename_entry' type='password' id='password' placeholder='Password'/> --><input class='update_button' type='button' id='login' value='Login' /></div>");
+        clients$.append("<hr/>");
+        $('#userName').keydown(function (evt) {
+            evt.stopPropagation();
+        });
+        $('#userName').keypress(function (evt) {
+            evt.stopPropagation();
+        });
+        $('#userName').keyup(function (evt) {
+            evt.stopPropagation();
+        });
+        $('#password').keydown(function (evt) {
+            evt.stopPropagation();
+        });
+        $('#password').keypress(function (evt) {
+            evt.stopPropagation();
+        });
+        $('#password').keyup(function (evt) {
+            evt.stopPropagation();
+        });
+        $('#login').click(function (evt) {
+            // Future call to validate username and password
+            //login.call(self, $('#userName').val(), $('#password').val());
+
+            var moniker = vwf_view.kernel.moniker();
+            var clients = vwf_view.kernel.findClients("", "/*");
+            var client = undefined;
+            for (var i = 0; i < clients.length; i++) {
+                if (clients[i].indexOf(moniker) != -1) {
+                    client = clients[i];
+                    break;
+                }
+            }
+            // var client = vwf_view.kernel.findClients("", "/" + moniker)[0];
+
+            if (client) {
+                vwf_view.kernel.setProperty(client, "displayName", $('#userName').val());
+            }
+        });
+
+
+        // clients$.append("<div style='padding:6px'><input class='live_button' type='button' id='liveeditor' value='Open Code Editor' /></div>");
+        //  $('#liveeditor').click(function(evt) {
+        //     openLiveEditor.call(self);
+        // });
+
+        // Save / Load
+        clients$.append("<div style='padding:6px'><input class='filename_entry' type='text' id='fileName' /><input class='update_button' type='button' id='save' value='Save' /></div>");
+        $('#fileName').keydown(function (evt) {
+            evt.stopPropagation();
+        });
+        $('#fileName').keypress(function (evt) {
+            evt.stopPropagation();
+        });
+        $('#fileName').keyup(function (evt) {
+            evt.stopPropagation();
+        });
+        $('#save').click(function (evt) {
+            saveStateAsFile.call(self, $('#fileName').val());
+        });
+
+        clients$.append("<div style='padding:6px'><select class='filename_select' id='fileToLoad' /></select></div>");
+        $('#fileToLoad').append("<option value='none'></option>");
+
+        $.getJSON("/" + root + "/listallsaves", function (data) {
+            $.each(data, function (key, value) {
+                var applicationName = value['applicationpath'].split("/");
+                if (applicationName.length > 0) {
+                    applicationName = applicationName[applicationName.length - 1];
+                }
+                if (applicationName.length > 0) {
+                    applicationName = applicationName.charAt(0).toUpperCase() + applicationName.slice(1);
+                }
+                if (value['latestsave']) {
+                    $('#fileToLoad').append("<option value='" + value['savename'] + "' applicationpath='" + value['applicationpath'] + "'>" + applicationName + ": " + value['savename'] + "</option>");
+                }
+                else {
+                    $('#fileToLoad').append("<option value='" + value['savename'] + "' applicationpath='" + value['applicationpath'] + "' revision='" + value['revision'] + "'>" + applicationName + ": " + value['savename'] + " Rev(" + value['revision'] + ")</option>");
+                }
+            });
+        });
+
+        clients$.append("<div style='padding:6px'><input class='update_button' type='button' id='load' value='Load' /></div>");
+        $('#load').click(function (evt) {
+            loadSavedState.call(self, $('#fileToLoad').val(), $('#fileToLoad').find(':selected').attr('applicationpath'), $('#fileToLoad').find(':selected').attr('revision'));
+        });
+    }
+
+    // -- editor ---
+
+    function openLiveEditor(value) {
+
+        //this.liveditor = document.createElement('div');
+        //this.liveditor.setAttribute('id', "editorlive");
+        // $('body').append(this.liveditor); 
+
+        var editor = this.ace.edit("editorlive");
+        editor.setTheme("ace/theme/monokai");
+        editor.getSession().setMode("ace/mode/javascript");
+
+
+    }
+
+    // -- viewClient ------------------------------------------------------------------------
+
+    function viewClient(clientID) {
+        var self = this;
+
+        var clients$ = $(this.clientList);
+        var node = this.nodes[clientID];
+
+        clients$.html("<div class='header'><img src='images/back.png' id='back' alt='back'/> " + $.encoder.encodeForHTML(node.name) + "</div>");
+        $('#back').click(function (evt) {
+            viewClients.call(self);
+        });
+
+        // Add node properties
+        clients$.append("<div id='clientProperties'></div>");
+        var displayedProperties = {};
+        for (var i = 0; i < node.properties.length; i++) {
+            if (!displayedProperties[node.properties[i].name]) {
+                displayedProperties[node.properties[i].name] = "instance";
+                var nodeIDAlpha = $.encoder.encodeForAlphaNumeric(clientID);
+                var propertyNameAttribute = $.encoder.encodeForHTMLAttribute("id", node.properties[i].name, true);
+                var propertyNameAlpha = $.encoder.encodeForAlphaNumeric(node.properties[i].name);
+                var propertyNameHTML = $.encoder.encodeForHTML(node.properties[i].name);
+                var propertyValueAttribute = $.encoder.encodeForHTMLAttribute("val", node.properties[i].getValue(), true);
+                $('#clientProperties').append("<div id='" + nodeIDAlpha + "-" + propertyNameAlpha + "' class='propEntry'><table><tr><td><b>" + propertyNameHTML + " </b></td><td><input type='text' class='input_text' id='input-" + nodeIDAlpha + "-" + propertyNameAlpha + "' value='" + propertyValueAttribute + "' data-propertyName='" + propertyNameAttribute + "' readonly></td></tr></table></div>");
+            }
+        }
+    }
+
+    // -- drillDown -------------------------------------------------------------------------
+
+    function drillDown(nodeID, drillBackID) // invoke with the view as "this"
+    {
+        var topdownName = this.topdownName;
+        var topdownTemp = this.topdownTemp;
+
+        drill.call(this, nodeID, drillBackID);
+
+        if (nodeID != vwf_view.kernel.find("", "/")[0]) $(topdownName).hide('slide', { direction: 'left' }, 175);
+        $(topdownTemp).show('slide', { direction: 'right' }, 175);
+
+        this.topdownName = topdownTemp;
+        this.topdownTemp = topdownName;
+    }
+
+    // -- drillUp ---------------------------------------------------------------------------
+
+    function drillUp(nodeID) // invoke with the view as "this"
+    {
+        var topdownName = this.topdownName;
+        var topdownTemp = this.topdownTemp;
+
+        drill.call(this, nodeID, undefined);
+
+        $(topdownName).hide('slide', { direction: 'right' }, 175);
+        $(topdownTemp).show('slide', { direction: 'left' }, 175);
+
+        this.topdownName = topdownTemp;
+        this.topdownTemp = topdownName;
+    }
+
+    // -- drillBack---------------------------------------------------------------------------
+
+    function drillBack(nodeID) // invoke with the view as "this"
+    {
+        var topdownName = this.topdownName;
+        var topdownTemp = this.topdownTemp;
+
+        drill.call(this, nodeID, undefined);
+
+        // No slide motion, when resizing script window back to normal
+        $(topdownName).hide();
+        $(topdownTemp).show();
+
+        this.topdownName = topdownTemp;
+        this.topdownTemp = topdownName;
+    }
+
+    // -- drill -----------------------------------------------------------------------------
+
+    function drill(nodeID, drillBackID) // invoke with the view as "this"
+    {
+        var node = this.nodes[nodeID];
+
+        if (!node) {
+            this.logger.errorx("drill: Cannot find node '" + nodeID + "'");
+            return;
+        }
+
+        var self = this;
+        var topdownName = this.topdownName;
+        var topdownTemp = this.topdownTemp;
+        var nodeIDAlpha = $.encoder.encodeForAlphaNumeric(nodeID);
+
+        $(topdownName).html(''); // Clear alternate div first to ensure content is added correctly
+        this.currentNodeID = nodeID;
+
+        if (!drillBackID) drillBackID = node.parentID;
+
+        if (nodeID == vwf_view.kernel.find("", "/")[0]) {
+            $(topdownTemp).html("<div class='header'>index</div>");
+        }
+        else {
+            $(topdownTemp).html("<div class='header'><img src='images/back.png' id='" + nodeIDAlpha + "-back' alt='back'/> " + $.encoder.encodeForHTML(node.name) + "</div>");
+            $('#' + nodeIDAlpha + '-back').click(function (evt) {
+                drillUp.call(self, drillBackID);
+            });
+        }
+
+        // Add node children
+        $(topdownTemp).append("<div id='children'></div>");
+        for (var i = 0; i < node.children.length; i++) {
+            var nodeChildIDAttribute = $.encoder.encodeForHTMLAttribute("id", node.children[i].ID, true);
+            var nodeChildIDAlpha = $.encoder.encodeForAlphaNumeric(node.children[i].ID);
+            $('#children').append("<div id='" + nodeChildIDAlpha + "' data-nodeID='" + nodeChildIDAttribute + "' class='childContainer'><div class='childEntry'><b>" + $.encoder.encodeForHTML(node.children[i].name) + "</b></div></div>");
+            $('#' + nodeChildIDAlpha).click(function (evt) {
+                drillDown.call(self, $(this).attr("data-nodeID"), nodeID);
+            });
+        }
+
+        $('#children > div:last').css('border-bottom-width', '3px');
+
+        // Add prototype children
+        // TODO: Commented out until prototype children inherit from prototypes
+        /*
+        $(topdownTemp).append("<div id='prototypeChildren'></div>");
+        var prototypeChildren = getChildren.call( this, this.kernel, node.extendsID ); 
+        for ( var key in prototypeChildren)       
+        {
+            var child = prototypeChildren[key];
+            var prototypeChildIDAttribute = $.encoder.encodeForHTMLAttribute("id", child.ID, true);
+            var prototypeChildIDAlpha = $.encoder.encodeForAlphaNumeric(child.ID);
+            $('#prototypeChildren').append("<div id='" + prototypeChildIDAlpha + "' data-nodeID='" + prototypeChildIDAttribute + "' class='childContainer'><div class='childEntry'><b>" + $.encoder.encodeForHTML(child.name) + "</b></div></div>");
+            $('#' + prototypeChildIDAlpha).click( function(evt) {
+                drillDown.call(self, $(this).attr("data-nodeID"), nodeID);
+            });
+        } 
+        */   // END TODO:
+
+        $('#prototypeChildren > div:last').css('border-bottom-width', '3px');
+
+        // Add node properties
+        $(topdownTemp).append("<div id='properties'></div>");
+        var displayedProperties = {};
+        for (var i = 0; i < node.properties.length; i++) {
+            if (!displayedProperties[node.properties[i].name] && node.properties[i].name.indexOf('$') === -1) {
+                displayedProperties[node.properties[i].name] = "instance";
+                var propertyNameAttribute = $.encoder.encodeForHTMLAttribute("id", node.properties[i].name, true);
+                var propertyNameAlpha = $.encoder.encodeForAlphaNumeric(node.properties[i].name);
+                var propertyNameHTML = $.encoder.encodeForHTML(node.properties[i].name);
+                var propertyValueAttribute = $.encoder.encodeForHTMLAttribute("val", node.properties[i].getValue(), true);
+
+                if (propertyNameAlpha.indexOf("semantics") > -1) {
+
+                } else if (propertyNameAlpha.indexOf("grammar") > -1) {
+
+                } else if (propertyNameAlpha.indexOf("ohm") > -1) {
+
+                    let propName = propertyNameAlpha;
+                    let propValue = node.properties[i].rawValue;
+
+                    $(topdownTemp).append("<div id='" + nodeIDAlpha + "-" + propertyNameAlpha + "'></div>");
+                    $('#' + nodeIDAlpha + '-' + propertyNameAlpha).append("<div class='childContainer'><div class='childEntry'><b>" + propertyNameHTML + "</div></div>");
+
+                    $('#' + nodeIDAlpha + '-' + propertyNameAlpha).click(function (evt) {
+                        editOhmLang.call(self, nodeID, propName, propValue);
+                    });
+
+                    // $('#properties').append("<div id='" + nodeIDAlpha + "-" + propertyNameAlpha + "' class='propEntry'><table><tr><td><b>" + propertyNameHTML + " </b></td><td><input type='text' class='input_text' id='input-" + nodeIDAlpha + "-" + propertyNameAlpha + "' value='" + propertyValueAttribute + "' data-propertyName='" + propertyNameAttribute + "'></td></tr></table></div>");
+
+                } else {
+
+                    $('#properties').append("<div id='" + nodeIDAlpha + "-" + propertyNameAlpha + "' class='propEntry'><table><tr><td><b>" + propertyNameHTML + " </b></td><td><input type='text' class='input_text' id='input-" + nodeIDAlpha + "-" + propertyNameAlpha + "' value='" + propertyValueAttribute + "' data-propertyName='" + propertyNameAttribute + "'></td></tr></table></div>");
+
+                }
+
+
+                $('#input-' + nodeIDAlpha + '-' + propertyNameAttribute).change(function (evt) {
+                    var propName = $.encoder.canonicalize($(this).attr("data-propertyName"));
+                    var propValue = $(this).val();
+
+                    try {
+                        propValue = JSON.parse($.encoder.canonicalize(propValue));
+                        self.kernel.setProperty(nodeID, propName, propValue);
+                    } catch (e) {
+                        // restore the original value on error
+                        $(this).val(propValue);
+                    }
+                });
+
+                $('#input-' + nodeIDAlpha + '-' + propertyNameAlpha).keydown(function (evt) {
+                    evt.stopPropagation();
+                });
+
+                $('#input-' + nodeIDAlpha + '-' + propertyNameAlpha).keypress(function (evt) {
+                    evt.stopPropagation();
+                });
+
+                $('#input-' + nodeIDAlpha + '-' + propertyNameAlpha).keyup(function (evt) {
+                    evt.stopPropagation();
+                });
+            }
+        }
+
+        $('#properties > div:last').css('border-bottom-width', '3px');
+
+        this.logger.info(self + "    " + nodeID);
+
+        // Add prototype properties
+        $(topdownTemp).append("<div id='prototypeProperties'></div>");
+        var prototypeProperties = getProperties.call(this, this.kernel, node.extendsID);
+        for (var key in prototypeProperties) {
+            var prop = prototypeProperties[key].prop;
+            if (!displayedProperties[prop.name]) {
+                displayedProperties[prop.name] = prototypeProperties[key].prototype;
+                if (prop.value == undefined) {
+                    prop.value = JSON.stringify(utility.transform(vwf.getProperty(nodeID, prop.name, []), utility.transforms.transit));
+                }
+
+                var propertyNameAttribute = $.encoder.encodeForHTMLAttribute("id", prop.name, true);
+                var propertyNameAlpha = $.encoder.encodeForAlphaNumeric(prop.name);
+                var propertyNameHTML = $.encoder.encodeForHTML(prop.name);
+                var propertyValueAttribute = $.encoder.encodeForHTMLAttribute("val", prop.value, true);
+                $('#prototypeProperties').append("<div id='" + nodeIDAlpha + "-" + propertyNameAlpha + "' class='propEntry'><table><tr><td><b>" + propertyNameHTML + " </b></td><td><input type='text' class='input_text' id='input-" + nodeIDAlpha + "-" + propertyNameAlpha + "' value='" + propertyValueAttribute + "' data-propertyName='" + propertyNameAttribute + "'></td></tr></table></div>");
+
+                $('#input-' + nodeIDAlpha + '-' + propertyNameAlpha).change(function (evt) {
+                    var propName = $.encoder.canonicalize($(this).attr("data-propertyName"));
+                    var propValue = $(this).val();
+
+                    try {
+                        propValue = JSON.parse($.encoder.canonicalize(propValue));
+                        self.kernel.setProperty(nodeID, propName, propValue);
+                    } catch (e) {
+                        // restore the original value on error
+                        $(this).val(propValue);
+                    }
+                });
+
+                $('#input-' + nodeIDAlpha + '-' + propertyNameAlpha).keydown(function (evt) {
+                    evt.stopPropagation();
+                });
+
+                $('#input-' + nodeIDAlpha + '-' + propertyNameAlpha).keypress(function (evt) {
+                    evt.stopPropagation();
+                });
+
+                $('#input-' + nodeIDAlpha + '-' + propertyNameAlpha).keyup(function (evt) {
+                    evt.stopPropagation();
+                });
+            }
+        }
+
+        $('#prototypeProperties > div:last').css('border-bottom-width', '3px');
+
+        // Add node methods
+        $(topdownTemp).append("<div id='methods'></div>");
+        for (var key in node.methods) {
+            var method = node.methods[key];
+            var methodNameAlpha = $.encoder.encodeForAlphaNumeric(key);
+            var methodNameAttribute = $.encoder.encodeForHTMLAttribute("id", key, true);
+            var methodNameHTML = $.encoder.encodeForHTML(key);
+            $('#methods').append("<div id='" + methodNameAlpha + "' class='methodEntry'><table><tr><td><b>" + methodNameHTML + " </b></td><td style='text-align:right;overflow:visible'><div id='rollover-" + methodNameAlpha + "' style='position:relative;left:12px'><input type='button' class='input_button_call' id='call-" + methodNameAlpha + "' value='Call' data-methodName='" + methodNameAttribute + "'><img id='param-" + methodNameAlpha + "' data-methodName='" + methodNameAttribute + "' src='images/arrow.png' alt='arrow' style='position:relative;top:4px;left:2px;visibility:hidden'></div></td></tr></table></div>");
+            $('#rollover-' + methodNameAlpha).mouseover(function (evt) {
+                $('#param-' + $(this).attr("id").substring(9)).css('visibility', 'visible');
+            });
+            $('#rollover-' + methodNameAlpha).mouseleave(function (evt) {
+                $('#param-' + $(this).attr("id").substring(9)).css('visibility', 'hidden');
+            });
+            $('#call-' + methodNameAlpha).click(function (evt) {
+                self.kernel.callMethod(nodeID, $.encoder.canonicalize($(this).attr("data-methodName")));
+            });
+            $('#param-' + methodNameAlpha).click(function (evt) {
+                setParams.call(self, $.encoder.canonicalize($(this).attr("data-methodName")), method, nodeID);
+            });
+        }
+
+        $('#methods > div:last').css('border-bottom-width', '3px');
+
+        // Add prototype methods
+        $(topdownTemp).append("<div id='prototypeMethods'></div>");
+        var prototypeMethods = getMethods.call(this, this.kernel, node.extendsID);
+        for (var key in prototypeMethods) {
+            var method = prototypeMethods[key];
+            var prototypeMethodNameAlpha = $.encoder.encodeForAlphaNumeric(key);
+            var prototypeMethodNameAttribute = $.encoder.encodeForHTMLAttribute("id", key, true);
+            var prototypeMethodNameHTML = $.encoder.encodeForHTML(key);
+            $('#prototypeMethods').append("<div id='" + prototypeMethodNameAlpha + "' class='methodEntry'><table><tr><td><b>" + prototypeMethodNameHTML + " </b></td><td style='text-align:right;overflow:visible'><div id='rollover-" + prototypeMethodNameAlpha + "' style='position:relative;left:12px'><input type='button' class='input_button_call' id='call-" + prototypeMethodNameAlpha + "' value='Call' data-methodName='" + prototypeMethodNameAttribute + "'><img id='param-" + prototypeMethodNameAlpha + "' data-methodName='" + prototypeMethodNameAttribute + "' src='images/arrow.png' alt='arrow' style='position:relative;top:4px;left:2px;visibility:hidden'></div></td></tr></table></div>");
+            $('#rollover-' + prototypeMethodNameAlpha).mouseover(function (evt) {
+                $('#param-' + $(this).attr("id").substring(9)).css('visibility', 'visible');
+            });
+            $('#rollover-' + prototypeMethodNameAlpha).mouseleave(function (evt) {
+                $('#param-' + $(this).attr("id").substring(9)).css('visibility', 'hidden');
+            });
+            $('#call-' + prototypeMethodNameAlpha).click(function (evt) {
+                self.kernel.callMethod(nodeID, $.encoder.canonicalize($(this).attr("data-methodName")));
+            });
+            $('#param-' + prototypeMethodNameAlpha).click(function (evt) {
+                setParams.call(self, $.encoder.canonicalize($(this).attr("data-methodName")), method, nodeID);
+            });
+        }
+
+        $('#prototypeMethods > div:last').css('border-bottom-width', '3px');
+
+        // Add node events
+        $(topdownTemp).append("<div id='events'></div>");
+        for (var key in node.events) {
+            var nodeEvent = node.events[key];
+            var eventNameAlpha = $.encoder.encodeForAlphaNumeric(key);
+            var eventNameAttribute = $.encoder.encodeForHTMLAttribute("id", key, true);
+            var eventNameHTML = $.encoder.encodeForHTML(key);
+            $('#events').append("<div id='" + eventNameAlpha + "' class='methodEntry'><table><tr><td><b>" + eventNameHTML + " </b></td><td style='text-align:right;overflow:visible'><div id='rollover-" + eventNameAlpha + "' style='position:relative;left:12px'><input type='button' class='input_button_call' id='fire-" + eventNameAlpha + "' value='Fire' data-eventName='" + eventNameAttribute + "'><img id='arg-" + eventNameAlpha + "' data-eventName='" + eventNameAttribute + "' src='images/arrow.png' alt='arrow' style='position:relative;top:4px;left:2px;visibility:hidden'></div></td></tr></table></div>");
+            $('#rollover-' + eventNameAlpha).mouseover(function (evt) {
+                $('#arg-' + $(this).attr("id").substring(9)).css('visibility', 'visible');
+            });
+            $('#rollover-' + eventNameAlpha).mouseleave(function (evt) {
+                $('#arg-' + $(this).attr("id").substring(9)).css('visibility', 'hidden');
+            });
+            $('#fire-' + eventNameAlpha).click(function (evt) {
+                self.kernel.fireEvent(nodeID, $.encoder.canonicalize($(this).attr("data-eventName")));
+            });
+            $('#arg-' + eventNameAlpha).click(function (evt) {
+                setArgs.call(self, $.encoder.canonicalize($(this).attr("data-eventName")), nodeEvent, nodeID);
+            });
+        }
+
+        $('#events > div:last').css('border-bottom-width', '3px');
+
+        // Add prototype events
+        $(topdownTemp).append("<div id='prototypeEvents'></div>");
+        var prototypeEvents = getEvents.call(this, this.kernel, node.extendsID);
+        for (var key in prototypeEvents) {
+            var nodeEvent = prototypeEvents[key];
+            var prototypeEventNameAlpha = $.encoder.encodeForAlphaNumeric(key);
+            var prototypeEventNameAttribute = $.encoder.encodeForHTMLAttribute("id", key, true);
+            var prototypeEventNameHTML = $.encoder.encodeForHTML(key);
+            $('#prototypeEvents').append("<div id='" + prototypeEventNameAlpha + "' class='methodEntry'><table><tr><td><b>" + prototypeEventNameHTML + " </b></td><td style='text-align:right;overflow:visible'><div id='rollover-" + prototypeEventNameAlpha + "' style='position:relative;left:12px'><input type='button' class='input_button_call' id='fire-" + prototypeEventNameAlpha + "' value='Fire' data-eventName='" + prototypeEventNameAttribute + "'><img id='arg-" + prototypeEventNameAlpha + "' data-eventName='" + prototypeEventNameAttribute + "' src='images/arrow.png' alt='arrow' style='position:relative;top:4px;left:2px;visibility:hidden'></div></td></tr></table></div>");
+            $('#rollover-' + prototypeEventNameAlpha).mouseover(function (evt) {
+                $('#arg-' + $(this).attr("id").substring(9)).css('visibility', 'visible');
+            });
+            $('#rollover-' + prototypeEventNameAlpha).mouseleave(function (evt) {
+                $('#arg-' + $(this).attr("id").substring(9)).css('visibility', 'hidden');
+            });
+            $('#fire-' + prototypeEventNameAlpha).click(function (evt) {
+                self.kernel.fireEvent(nodeID, $.encoder.canonicalize($(this).attr("data-eventName")));
+            });
+            $('#arg-' + prototypeEventNameAlpha).click(function (evt) {
+                setArgs.call(self, $.encoder.canonicalize($(this).attr("data-eventName")), nodeEvent, nodeID);
+            });
+        }
+
+        $('#prototypeEvents > div:last').css('border-bottom-width', '3px');
+
+        // Add node behaviors
+        $(topdownTemp).append("<div id='behaviors'></div>");
+        for (var i = 0; i < node.implementsIDs.length; i++) {
+            var nodeImplementsIDAlpha = $.encoder.encodeForAlphaNumeric(node.implementsIDs[i]);
+            var nodeImplementsIDHTML = $.encoder.encodeForHTML(node.implementsIDs[i]);
+            $('#behaviors').append("<div class='propEntry'><table><tr><td style='width:92%'><b>" + nodeImplementsIDHTML + "</b></td><td><input id='" + nodeImplementsIDAlpha + "-enable' type='checkbox' checked='checked' disabled='disabled' /></td></tr></table></div>");
+
+            /* 
+            //Placeholder to Enable/Disable behaviors
+            $('#' + node.implementsID[i] + '-enable').change( function(evt) {
+            
+            }); 
+            */
+        }
+
+        $('#behaviors > div:last').css('border-bottom-width', '3px');
+
+        // Add prototype behaviors
+        $(topdownTemp).append("<div id='prototypeBehaviors'></div>");
+        var prototypeNode = this.nodes[node.extendsID];
+        for (var i = 0; i < prototypeNode.implementsIDs.length; i++) {
+            var prototypeImplementsIDAlpha = $.encoder.encodeForAlphaNumeric(prototypeNode.implementsIDs[i]);
+            var prototypeImplementsIDHTML = $.encoder.encodeForHTML(prototypeNode.implementsIDs[i]);
+            $('#prototypeBehaviors').append("<div class='propEntry'><table><tr><td style='width:92%'><b>" + prototypeImplementsIDHTML + "</b></td><td><input id='" + prototypeImplementsIDAlpha + "-enable' type='checkbox' checked='checked' disabled='disabled' /></td></tr></table></div>");
+        }
+
+        $('#prototypeBehaviors > div:last').css('border-bottom-width', '3px');
+
+        // Create new method
+
+        $(topdownTemp).append("<div id='createMethodID'></div>");
+        $('#createMethodID').append("<div class='childContainer'><div class='childEntry'><b>New Method</div></div>");
+        $('#createMethodID').click(function (evt) {
+            createMethod.call(self, nodeID);
+        });
+
+        // Create new Event
+
+        $(topdownTemp).append("<div id='createEventID'></div>");
+        $('#createEventID').append("<div class='childContainer'><div class='childEntry'><b>New Event</div></div>");
+        $('#createEventID').click(function (evt) {
+            createEvent.call(self, nodeID);
+        });
+
+        // Create new script
+        $(topdownTemp).append("<div id='createScript'></div>");
+        $('#createScript').append("<div class='childContainer'><div class='childEntry'><b>New Script</div></div>");
+        $('#createScript').click(function (evt) {
+            createScript.call(self, nodeID);
+        });
+        $('#createScript > div:last').css('border-bottom-width', '3px');
+
+        if (this.allScripts[nodeID] !== undefined) {
+            // Add node scripts
+            $(topdownTemp).append("<div id='scripts'></div>");
+            for (var i = 0; i < this.allScripts[nodeID].length; i++) {
+                var scriptFull = this.allScripts[nodeID][i].text;
+                if (scriptFull != undefined) {
+                    var scriptName = scriptFull.substring(0, scriptFull.indexOf('='));
+                    $('#scripts').append("<div id='script-" + nodeIDAlpha + "-" + i + "' class='childContainer'><div class='childEntry'><b>script </b>" + scriptName + "</div></div>");
+                    $('#script-' + nodeIDAlpha + "-" + i).click(function (evt) {
+                        var scriptID = $(this).attr("id").substring($(this).attr("id").lastIndexOf('-') + 1);
+                        viewScript.call(self, nodeID, scriptID, undefined);
+                    });
+                }
+            }
+
+            $('#scripts > div:last').css('border-bottom-width', '3px');
+        }
+
+        if (this.allScripts[node.extendsID] !== undefined) {
+            // Add prototype scripts
+            $(topdownTemp).append("<div id='prototypeScripts'></div>");
+            for (var i = 0; i < this.allScripts[node.extendsID].length; i++) {
+                var scriptFull = this.allScripts[node.extendsID][i].text;
+                if (scriptFull != undefined) {
+                    var nodeExtendsIDAlpha = $.encoder.encodeForAlphaNumeric(node.extendsID);
+                    var nodeExtendsIDAttribute = $.encoder.encodeForHTMLAttribute("id", node.extendsID, true);
+                    var scriptName = scriptFull.substring(0, scriptFull.indexOf('='));
+                    $('#prototypeScripts').append("<div id='script-" + nodeExtendsIDAlpha + "-" + i + "' class='childContainer' data-nodeExtendsID='" + nodeExtendsIDAttribute + "'><div class='childEntry'><b>script </b>" + scriptName + "</div></div>");
+                    $('#script-' + nodeExtendsIDAlpha + "-" + i).click(function (evt) {
+                        var extendsId = $.encoder.canonicalize($(this).attr("data-nodeExtendsID"));
+                        var scriptID = $(this).attr("id").substring($(this).attr("id").lastIndexOf('-') + 1);
+                        viewScript.call(self, nodeID, scriptID, extendsId);
+                    });
+                }
+            }
+
+            $('#prototypeScripts > div:last').css('border-bottom-width', '3px');
+        }
+        updateCameraProperties.call(self);
+    }
+
+    // createEvent
+
+    function createEvent(nodeID) // invoke with the view as "this"
+    {
+        var self = this;
+        var topdownName = this.topdownName;
+        var topdownTemp = this.topdownTemp;
+
+        var nodeIDAlpha = $.encoder.encodeForAlphaNumeric(nodeID);
+
+        $(topdownTemp).html("<div class='header'><img src='images/back.png' id='script-" + nodeIDAlpha + "-back' alt='back'/> New event</div>");
+        $('#script-' + nodeIDAlpha + '-back').click(function (evt) {
+            self.editingScript = false;
+            drillBack.call(self, nodeID);
+
+            // Return editor to normal width
+            $('#editor').animate({ 'left': "-260px" }, 175);
+            $('.vwf-tree').animate({ 'width': "260px" }, 175);
+        });
+
+        $(topdownTemp).append("<div id='cm'>Name:<br/><input type='text' class='input_text' id='eventName'/><br/>Parameters:<br/><input type='text' class='input_text' id='eventParams'/></div><hr><input class='update_button' type='button' id='createEvent' value='Create' />");
+
+
+        $("#createEvent").click(function (evt) {
+            console.log("not yet created");
+
+
+            if ($('#eventName').val()) {
+                var eventName = $('#eventName').val();
+                //prmtr = JSON.parse(JSON.stringify($.encoder.canonicalize(prmtr)));
+                console.log(eventName);
+
+                if ($('#eventParams').val()) {
+                    var params = $('#eventParams').val();
+                    params = params.split(',');
+                    var cleanParams = [];
+
+                    for (var i = 0; i < params.length; i++) {
+                        params[i] = $.trim(params[i]);
+                        if (params[i] != '' && params[i] != null && params[i] !== undefined)
+                            cleanParams.push(params[i]);
+                    }
+                    console.log(cleanParams);
+                    //prmtr = JSON.parse(JSON.stringify($.encoder.canonicalize(prmtr)));
+                }
+
+                let body = '';
+                self.kernel.createEvent(nodeID, eventName, cleanParams);
+            }
+            //self.kernel.execute( nodeID, editor.getValue() );
+            // self.kernel.execute( nodeID, $("#newScriptArea").val() );
+        });
+
+        $(topdownName).hide();
+        $(topdownTemp).show();
+
+        this.topdownName = topdownTemp;
+        this.topdownTemp = topdownName;
+    }
+
+    // -- createMethod
+
+    function createMethod(nodeID) // invoke with the view as "this"
+    {
+        var self = this;
+        var topdownName = this.topdownName;
+        var topdownTemp = this.topdownTemp;
+
+        var nodeIDAlpha = $.encoder.encodeForAlphaNumeric(nodeID);
+
+        $(topdownTemp).html("<div class='header'><img src='images/back.png' id='script-" + nodeIDAlpha + "-back' alt='back'/> New method</div>");
+        $('#script-' + nodeIDAlpha + '-back').click(function (evt) {
+            self.editingScript = false;
+            drillBack.call(self, nodeID);
+
+            // Return editor to normal width
+            $('#editor').animate({ 'left': "-260px" }, 175);
+            $('.vwf-tree').animate({ 'width': "260px" }, 175);
+        });
+
+        $(topdownTemp).append("<div id='cm'>Name:<br/><input type='text' class='input_text' id='methodName'/><br/>Parameters:<br/><input type='text' class='input_text' id='methodParams'/></div><hr><input class='update_button' type='button' id='createMethod' value='Create' />");
+
+
+        $("#createMethod").click(function (evt) {
+            console.log("not yet created");
+
+
+            if ($('#methodName').val()) {
+                var methodName = $('#methodName').val();
+                //prmtr = JSON.parse(JSON.stringify($.encoder.canonicalize(prmtr)));
+                console.log(methodName);
+
+                if ($('#methodParams').val()) {
+                    var params = $('#methodParams').val();
+                    params = params.split(',');
+                    var cleanParams = [];
+
+                    for (var i = 0; i < params.length; i++) {
+                        params[i] = $.trim(params[i]);
+                        if (params[i] != '' && params[i] != null && params[i] !== undefined)
+                            cleanParams.push(params[i]);
+                    }
+                    console.log(cleanParams);
+                    //prmtr = JSON.parse(JSON.stringify($.encoder.canonicalize(prmtr)));
+                }
+
+                let body = '';
+                self.kernel.createMethod(nodeID, methodName, cleanParams, body);
+            }
+            //self.kernel.execute( nodeID, editor.getValue() );
+            // self.kernel.execute( nodeID, $("#newScriptArea").val() );
+        });
+
+        $(topdownName).hide();
+        $(topdownTemp).show();
+
+        this.topdownName = topdownTemp;
+        this.topdownTemp = topdownName;
+    }
+
+    // -- createScript ----------------------------------------------------------------------
+
+    function createScript(nodeID) // invoke with the view as "this"
+    {
+        var self = this;
+        var topdownName = this.topdownName;
+        var topdownTemp = this.topdownTemp;
+        var allScripts = this.allScripts;
+
+        var nodeIDAlpha = $.encoder.encodeForAlphaNumeric(nodeID);
+
+        $(topdownTemp).html("<div class='header'><img src='images/back.png' id='script-" + nodeIDAlpha + "-back' alt='back'/> script</div>");
+        $('#script-' + nodeIDAlpha + '-back').click(function (evt) {
+            self.editingScript = false;
+            drillBack.call(self, nodeID);
+
+            // Return editor to normal width
+            $('#editor').animate({ 'left': "-260px" }, 175);
+            $('.vwf-tree').animate({ 'width': "260px" }, 175);
+        });
+
+        // $(topdownTemp).append("<div class='scriptEntry'><pre class='scriptCode'><textarea id='newScriptArea' class='scriptEdit' spellcheck='false' wrap='off'></textarea></pre><input class='update_button' type='button' id='create-" + nodeIDAlpha + "' value='Create' /></div><hr>");
+
+        $(topdownTemp).append("<div class='scriptEntry'><pre class='scriptCode'> <div id='editorlive'></div></pre><input class='update_button' type='button' id='create-" + nodeIDAlpha + "' value='Create' /></div><hr>");
+
+        var editor = createAceEditor(self, nodeID);
+
+
+        $("#create-" + nodeIDAlpha).click(function (evt) {
+            self.kernel.execute(nodeID, editor.getValue());
+            // self.kernel.execute( nodeID, $("#newScriptArea").val() );
+        });
+
+        // $('#newScriptArea').focus( function(evt) { 
+        //     // Expand the script editor
+        //     self.editingScript = true;
+        //     $('#editor').animate({ 'left' : "-500px" }, 175);
+        //     $('.vwf-tree').animate({ 'width' : "500px" }, 175);
+        // });
+        $('#editorlive').keydown(function (evt) {
+            evt.stopPropagation();
+        });
+
+        $(topdownName).hide();
+        $(topdownTemp).show();
+
+        this.topdownName = topdownTemp;
+        this.topdownTemp = topdownName;
+    }
+
+    // -- viewScript ------------------------------------------------------------------------
+
+    function createAceEditor(view, nodeID) {
+        var editor = view.ace.edit("editorlive");
+        editor.setTheme("ace/theme/monokai");
+        editor.setFontSize(16);
+        editor.getSession().setMode("ace/mode/javascript");
+
+        editor.commands.addCommand({
+            name: "doit",
+            bindKey: { win: "Ctrl-e", mac: "Command-e" },
+            exec: function () {
+                codeEditorDoit(editor, nodeID);
+            }
+        });
+
+        editor.commands.addCommand({
+            name: "printit",
+            bindKey: { win: "Ctrl-b", mac: "Command-b" },
+            exec: function () {
+                codeEditorPrintit(editor, nodeID);
+            }
+        });
+
+        editor.on('focus', function (event, editor) {
+            // Expand the script editor
+            self.editingScript = true;
+            $('#editor').animate({ 'left': "-800px" }, 175);
+            $('.vwf-tree').animate({ 'width': "800px" }, 175);
+        });
+
+        editor.on('blur', function (event, editor) {
+            //    $('#editor').animate({ 'left' : "-260px" }, 175);
+            //     $('.vwf-tree').animate({ 'width' : "260px" }, 175);
+
+        });
+
+        return editor;
+
+    }
+
+    function editOhmLang(nodeID, propertyName, propertyValue) {
+
+        var self = this;
+        var topdownName = this.topdownName;
+        var topdownTemp = this.topdownTemp;
+
+        var nodeIDAlpha = $.encoder.encodeForAlphaNumeric(nodeID);
+
+        $(topdownTemp).html("<div class='header'><img src='images/back.png' id='script-" + nodeIDAlpha + "-back' alt='back'/> script</div>");
+        $('#script-' + nodeIDAlpha + '-back').click(function (evt) {
+            self.editingScript = false;
+            drillBack.call(self, nodeID);
+
+            // Return editor to normal width
+            $('#editor').animate({ 'left': "-260px" }, 175);
+            $('.vwf-tree').animate({ 'width': "260px" }, 175);
+        });
+
+        if (propertyValue != undefined) {
+
+            var propText = propertyValue;
+            // var propText = propertyValue.split("\n").map($.trim).filter(function(line) { return line != "" }).join("\n");
+
+            $(topdownTemp).append("<div style='padding:6px'><input class='live_button' type='button' id='update-" + nodeIDAlpha + "-" + propertyName + "' value='Update' /></div>");
+
+            $(topdownTemp).append("<div class='scriptEntry'><pre class='scriptCode'> <div id='editorlive'> </div></pre></div><hr>");
+
+            var editor = createAceEditor(self, nodeID);
+            editor.setValue(propText);
+
+            $("#update-" + nodeIDAlpha + "-" + propertyName).click(function (evt) {
+                var evalText = editor.getValue();
+                self.kernel.setProperty(nodeID, propertyName, evalText);
+            });
+
+            $('#editorlive').keydown(function (evt) {
+                evt.stopPropagation();
+            });
+        }
+
+        $(topdownName).hide();
+        $(topdownTemp).show();
+
+        this.topdownName = topdownTemp;
+        this.topdownTemp = topdownName;
+
+
+    }
+
+
+
+    function viewScript(nodeID, scriptID, extendsID) // invoke with the view as "this"
+    {
+        var self = this;
+        var topdownName = this.topdownName;
+        var topdownTemp = this.topdownTemp;
+        var allScripts = this.allScripts;
+
+        var nodeIDAlpha = $.encoder.encodeForAlphaNumeric(nodeID);
+
+        $(topdownTemp).html("<div class='header'><img src='images/back.png' id='script-" + nodeIDAlpha + "-back' alt='back'/> script</div>");
+        $('#script-' + nodeIDAlpha + '-back').click(function (evt) {
+            self.editingScript = false;
+            drillBack.call(self, nodeID);
+
+            // Return editor to normal width
+            $('#editor').animate({ 'left': "-260px" }, 175);
+            $('.vwf-tree').animate({ 'width': "260px" }, 175);
+        });
+
+        if (extendsID) {
+            nodeID = extendsID;
+            nodeIDAlpha = $.encoder.encodeForAlphaNumeric(extendsID);
+        }
+
+        var scriptText = self.allScripts[nodeID][scriptID].text;
+        if (scriptText != undefined) {
+            // $(topdownTemp).append("<div class='scriptEntry'><pre class='scriptCode'><textarea id='scriptTextArea' class='scriptEdit' spellcheck='false' wrap='off'>" + scriptText + "</textarea></pre><input class='update_button' type='button' id='update-" + nodeIDAlpha + "-" + scriptID + "' value='Update' /></div><hr>");
+
+            //Open Live Editor
+
+            $(topdownTemp).append("<div style='padding:6px'><input class='live_button' type='button' id='printit' value='Print It' /><span> </span><input class='live_button' type='button' id='doit-" + nodeIDAlpha + "-" + scriptID + "' value='DoIt' /><span> </span><input class='live_button' type='button' id='update-" + nodeIDAlpha + "-" + scriptID + "' value='Update' /></div>");
+
+            $(topdownTemp).append("<div class='scriptEntry'><pre class='scriptCode'> <div id='editorlive'>" + scriptText + "</div></pre></div><hr>");
+
+            var editor = createAceEditor(self, nodeID);
+
+            //  $(topdownTemp).append("<div style='padding:6px'><input class='live_button' type='button' id='doit' value='DoIt' /></div>");
+            $("#doit-" + nodeIDAlpha + "-" + scriptID).click(function (evt) {
+                var s_id = $(this).attr("id").substring($(this).attr("id").lastIndexOf('-') + 1);
+                self.allScripts[nodeID][s_id].text = undefined;;
+                codeEditorDoit.call(self, editor, nodeID);
+            });
+
+            $("#printit").click(function (evt) {
+                codeEditorPrintit.call(self, editor, nodeID);
+            });
+
+            $("#update-" + nodeIDAlpha + "-" + scriptID).click(function (evt) {
+                var s_id = $(this).attr("id").substring($(this).attr("id").lastIndexOf('-') + 1);
+                self.allScripts[nodeID][s_id].text = undefined;
+
+                var evalText = editor.getValue();
+                self.kernel.execute(nodeID, evalText);
+            });
+            // $('#editorlive').focus( function(evt) { 
+            //     // Expand the script editor
+            //     self.editingScript = true;
+            //     $('#editor').animate({ 'left' : "-500px" }, 175);
+            //     $('.vwf-tree').animate({ 'width' : "500px" }, 175);
+            // });
+            $('#editorlive').keydown(function (evt) {
+                evt.stopPropagation();
+            });
+        }
+
+        $(topdownName).hide();
+        $(topdownTemp).show();
+
+        this.topdownName = topdownTemp;
+        this.topdownTemp = topdownName;
+    }
+
+    // -- setParams -------------------------------------------------------------------------
+
+    function setParams(methodName, methodParams, nodeID) // invoke with the view as "this"
+    {
+        var self = this;
+        var topdownName = this.topdownName;
+        var topdownTemp = this.topdownTemp;
+
+        var methodNameAlpha = $.encoder.encodeForAlphaNumeric(methodName);
+        var methodNameHTML = $.encoder.encodeForHTML(methodName);
+
+        $(topdownTemp).html("<div class='header'><img src='images/back.png' id='" + methodNameAlpha + "-back' alt='back'/> " + methodNameHTML + "</div>");
+        $('#' + methodNameAlpha + '-back').click(function (evt) {
+
+            self.editingScript = false;
+
+            drillUp.call(self, nodeID);
+
+            // Return editor to normal width
+            $('#editor').animate({ 'left': "-260px" }, 175);
+            $('.vwf-tree').animate({ 'width': "260px" }, 175);
+
+
+        });
+
+        var nodeIDAlpha = $.encoder.encodeForAlphaNumeric(nodeID);
+
+        var method = vwf.getMethod(nodeID, methodNameAlpha);
+
+        $(topdownTemp).append("<div style='padding:6px'><input class='live_button' type='button' id='printit' value='Print It' /><span> </span><input class='live_button' type='button' id='doit' value='Do It' /><span> </span><input class='live_button' type='button' id='update-" + nodeIDAlpha + "-" + methodNameAlpha + "' value='Update' /><span> </span> <input class='live_button' type='button' id='call' value='Call' /></div>");
+
+        //$(topdownTemp).append("<input class='update_button' type='button' id='call' value='Call' />");
+
+
+        $(topdownTemp).append("<div id='editorlive'>" + method.body + "</div>");
+
+
+
+        var editor = createAceEditor(self, nodeID);
+
+        $("#printit").click(function (evt) {
+            codeEditorPrintit.call(self, editor, nodeID);
+        });
+
+
+        $("#doit").click(function (evt) {
+            codeEditorDoit.call(self, editor, nodeID);
+        });
+
+        $("#update-" + nodeIDAlpha + "-" + methodNameAlpha).click(function (evt) {
+            var evalText = editor.getValue();
+            self.kernel.setMethod(nodeID, methodNameAlpha,
+                { body: evalText, type: "application/javascript", parameters: method.parameters });
+        });
+
+
+        var params = [];
+        if (method.parameters) {
+            params = method.parameters.length
+        };
+
+        if (params >= 1) {
+
+            for (var i = 1; i <= params; i++) {
+                $(topdownTemp).append("<div id='param" + i + "' class='propEntry'><table><tr><td><b>" + method.parameters[i - 1] + ": " + i + ": </b></td><td><input type='text' class='input_text' id='input-param" + i + "'></td></tr></table></div>");
+                $('#input-param' + i).keydown(function (evt) {
+                    evt.stopPropagation();
+                });
+                $('#input-param' + i).keypress(function (evt) {
+                    evt.stopPropagation();
+                });
+                $('#input-param' + i).keyup(function (evt) {
+                    evt.stopPropagation();
+                });
+            }
+        }
+
+
+
+        $('#call').click(function (evt) {
+
+            if (params >= 1) {
+                var parameters = new Array();
+                for (var i = 1; i <= params; i++) {
+                    if ($('#input-param' + i).val()) {
+                        var prmtr = $('#input-param' + i).val();
+                        try {
+                            prmtr = JSON.parse(JSON.stringify($.encoder.canonicalize(prmtr)));
+                            parameters.push(prmtr);
+                        } catch (e) {
+                            self.logger.error('Invalid Value');
+                        }
+                    }
+                }
+            }
+
+            self.kernel.callMethod(nodeID, methodName, parameters);
+        });
+
+        $(topdownName).hide('slide', { direction: 'left' }, 175);
+        $(topdownTemp).show('slide', { direction: 'right' }, 175);
+
+        this.topdownName = topdownTemp;
+        this.topdownTemp = topdownName;
+    }
+
+    // -- setArgs ---------------------------------------------------------------------------
+
+    function setArgs(eventName, eventArgs, nodeID) // invoke with the view as "this"
+    {
+        var self = this;
+        var topdownName = this.topdownName;
+        var topdownTemp = this.topdownTemp;
+
+        var eventNameAlpha = $.encoder.encodeForAlphaNumeric(eventName);
+        var eventNameHTML = $.encoder.encodeForHTML(eventName);
+
+        $(topdownTemp).html("<div class='header'><img src='images/back.png' id='" + eventNameAlpha + "-back' alt='back'/> " + eventNameHTML + "<input type='button' class='input_button_call' id='fire' value='Fire' style='float:right;position:relative;top:5px;right:33px'></input></div>");
+        $('#' + eventNameAlpha + '-back').click(function (evt) {
+            drillUp.call(self, nodeID);
+        });
+
+        for (var i = 1; i <= 8; i++) {
+            $(topdownTemp).append("<div id='arg" + i + "' class='propEntry'><table><tr><td><b>Argument " + i + ": </b></td><td><input type='text' class='input_text' id='input-arg" + i + "'></td></tr></table></div>");
+            $('#input-arg' + i).keydown(function (evt) {
+                evt.stopPropagation();
+            });
+            $('#input-arg' + i).keypress(function (evt) {
+                evt.stopPropagation();
+            });
+            $('#input-arg' + i).keyup(function (evt) {
+                evt.stopPropagation();
+            });
+        }
+
+        $(topdownTemp).append("<div style='font-weight:bold;text-align:right;padding-right:10px'></div>");
+        $('#fire').click(function (evt) {
+
+            var args = new Array();
+            for (var i = 1; i <= 8; i++) {
+                if ($('#input-arg' + i).val()) {
+                    var arg = $('#input-arg' + i).val();
+                    try {
+                        arg = JSON.parse($.encoder.canonicalize(arg));
+                        args.push(arg);
+                    } catch (e) {
+                        self.logger.error('Invalid Value');
+                    }
+                }
+            }
+
+            self.kernel.fireEvent(nodeID, eventName, args);
+        });
+
+        $(topdownName).hide('slide', { direction: 'left' }, 175);
+        $(topdownTemp).show('slide', { direction: 'right' }, 175);
+
+        this.topdownName = topdownTemp;
+        this.topdownTemp = topdownName;
+
+    }
+
+    function getPrototypes(kernel, extendsID) {
+        var prototypes = [];
+        var id = extendsID;
+
+        while (id !== undefined) {
+            prototypes.push(id);
+            id = kernel.prototype(id);
+        }
+
+        return prototypes;
+    }
+
+    function getPrototypes(kernel, extendsID) {
+        var prototypes = [];
+        var id = extendsID;
+
+        while (id !== undefined) {
+            prototypes.push(id);
+            id = kernel.prototype(id);
+        }
+
+        return prototypes;
+    }
+
+    function createProperty(node, propertyName, propertyValue) {
+        var property = {
+            name: propertyName,
+            rawValue: propertyValue,
+            value: undefined,
+            getValue: function () {
+                var propertyValue;
+                if (this.value == undefined) {
+                    try {
+                        propertyValue = utility.transform(this.rawValue, utility.transforms.transit);
+                        this.value = JSON.stringify(propertyValue);
+                    } catch (e) {
+                        this.logger.warnx("createdProperty", nodeID, this.propertyName, this.rawValue,
+                            "stringify error:", e.message);
+                        this.value = this.rawValue;
+                    }
+                }
+                return this.value;
+            }
+        };
+
+        return property;
+    }
+
+
+    function getProperties(kernel, extendsID) {
+        var pTypes = getPrototypes(kernel, extendsID);
+        var pProperties = {};
+        if (pTypes) {
+            for (var i = 0; i < pTypes.length; i++) {
+                var nd = this.nodes[pTypes[i]];
+                if (nd && nd.properties) {
+                    for (var key in nd.properties) {
+                        pProperties[key] = { "prop": nd.properties[key], "prototype": pTypes[i] };
+                    }
+                }
+            }
+        }
+        return pProperties;
+    }
+
+    function getChildren(kernel, extendsID) {
+        var pTypes = getPrototypes(kernel, extendsID);
+        var pChildren = {};
+        if (pTypes) {
+            for (var i = 0; i < pTypes.length; i++) {
+                var nd = this.nodes[pTypes[i]];
+                if (nd && nd.children) {
+                    for (var key in nd.children) {
+                        pChildren[key] = nd.children[key];
+                    }
+                }
+            }
+        }
+        return pChildren;
+    }
+
+    function getEvents(kernel, extendsID) {
+        var pTypes = getPrototypes(kernel, extendsID);
+        var events = {};
+        if (pTypes) {
+            for (var i = 0; i < pTypes.length; i++) {
+                var nd = this.nodes[pTypes[i]];
+                if (nd && nd.events) {
+                    for (var key in nd.events) {
+                        events[key] = nd.events[key];
+                    }
+                }
+            }
+        }
+        return events;
+    }
+
+    function getMethods(kernel, extendsID) {
+        var pTypes = getPrototypes(kernel, extendsID);
+        var methods = {};
+        if (pTypes) {
+            for (var i = 0; i < pTypes.length; i++) {
+                var nd = this.nodes[pTypes[i]];
+                if (nd && nd.methods) {
+                    for (var key in nd.methods) {
+                        methods[key] = nd.methods[key];
+                    }
+                }
+            }
+        }
+        return methods;
+    }
+
+    function highlightChildInHierarchy(nodeID) {
+        if (this.editorOpen && this.editorView == 1) // Hierarchy view open
+        {
+            var childDiv = $("div[id='" + nodeID + "']");
+            if (childDiv.length > 0) {
+                var previousChild = $("div[id='" + this.highlightedChild + "']");
+                if (previousChild.length > 0) {
+                    previousChild.removeClass('childContainerHighlight');
+                }
+                childDiv.addClass('childContainerHighlight');
+                this.highlightedChild = nodeID;
+            }
+        }
+    }
+
+    // -- showTimeline ----------------------------------------------------------------------
+
+    function showTimeline() // invoke with the view as "this"
+    {
+        var timeline = this.timeline;
+
+        if (!this.timelineInit) {
+            $('#time_control').append("<div class='header'>Timeline</div>" +
+                "<div style='text-align:center;padding-top:10px'><span><button id='play'></button><button id='stop'></button></span>" +
+                "<span><span class='rate slider'></span>&nbsp;" +
+                "<span class='rate vwf-label' style='display: inline-block; width:8ex'></span></span></div>");
+
+            var options = {};
+
+            ["play", "pause", "stop"].forEach(function (state) {
+                options[state] = { icons: { primary: "ui-icon-" + state }, label: state, text: false };
+            });
+
+            options.rate = { value: 0, min: -2, max: 2, step: 0.1, };
+
+            var state = {};
+
+            $.get(
+                "admin/state",
+                undefined,
+                function (data) {
+                    state = data;
+
+                    $("button#play").button("option", state.playing ? options.pause : options.play);
+                    $("button#stop").button("option", "disabled", state.stopped);
+
+                    $(".rate.slider").slider("value", Math.log(state.rate) / Math.LN10);
+
+                    if (state.rate < 1.0) {
+                        var label_rate = 1.0 / state.rate;
+                    }
+                    else {
+                        var label_rate = state.rate;
+                    }
+
+                    var label = label_rate.toFixed(2).toString().replace(/(\.\d*?)0+$/, "$1").replace(/\.$/, "");
+
+                    if (state.rate < 1.0) {
+                        label = "&#x2215; " + label;
+                    } else {
+                        label = label + " &times;";
+                    }
+
+                    $(".rate.vwf-label").html(label);
+                },
+                "json"
+            );
+
+            $("button#play").button(
+                options.pause
+            ).click(function () {
+                $.post(
+                    state.playing ? "admin/pause" : "admin/play",
+                    undefined,
+                    function (data) {
+                        state = data;
+
+                        $("button#play").button("option", state.playing ? options.pause : options.play);
+                        $("button#stop").button("option", "disabled", state.stopped);
+                    },
+                    "json"
+                );
+            });
+
+
+            $("button#stop").button(
+                options.stop
+            ).click(function () {
+                $.post(
+                    "admin/stop",
+                    undefined,
+                    function (data) {
+                        state = data;
+
+                        $("button#play").button("option", state.playing ? options.pause : options.play);
+                        $("button#stop").button("option", "disabled", state.stopped);
+                    },
+                    "json"
+                );
+            });
+
+            $(".rate.slider").slider(
+                options.rate
+            ).bind("slide", function (event, ui) {
+                $.get(
+                    "admin/state",
+
+                    { "rate": Math.pow(10, Number(ui.value)) },
+
+                    function (data) {
+                        state = data;
+
+                        $(".rate.slider").slider("value", Math.log(state.rate) / Math.LN10);
+
+                        if (state.rate < 1.0) {
+                            var label_rate = 1.0 / state.rate;
+                        }
+                        else {
+                            var label_rate = state.rate;
+                        }
+
+                        var label = label_rate.toFixed(2).toString().replace(/(\.\d*?)0+$/, "$1").replace(/\.$/, "");
+
+                        if (state.rate < 1.0) {
+                            label = "&#x2215; " + label;
+                        } else {
+                            label = label + " &times;";
+                        }
+
+                        $(".rate.vwf-label").html(label);
+                    },
+                    "json"
+                );
+            });
+
+            this.timelineInit = true;
+        }
+
+        if (!this.editorOpen) {
+            $(timeline).show('slide', { direction: 'right' }, 175);
+        }
+        else {
+            $(timeline).show();
+        }
+    }
+
+    // -- Show Code Editor tab
+
+    function showCodeEditorTab() // invoke with the view as "this"
+    {
+        var self = this;
+        var codeEditor = this.codeEditor;
+
+        if (!this.codeEditorInit) {
+            $('#codeEditor_tab').append("<div class='header'>Live Code Editor</div>");
+
+            $('#codeEditor_tab').append("<div style='padding:6px'><input type='button' id='min' value='Min Window' /><span> </span><input class='live_button' type='button' id='printit' value='Print It' /><span> </span><input class='live_button' type='button' id='doit' value='Do It' /></div>");
+
+            $("#doit").click(function (evt) {
+                codeEditorDoit.call(self, editor, sceneID);
+            });
+
+            $("#printit").click(function (evt) {
+                codeEditorPrintit.call(self, editor, sceneID);
+            });
+
+            // $('#codeEditor_tab').append("<div style='padding:6px'></div>");
+            $('#min').click(function (evt) {
+                $('#editor').animate({ 'left': "-260px" }, 175);
+                $('.vwf-tree').animate({ 'width': "260px" }, 175);
+            });
+
+            //Open Live Editor
+            $('#codeEditor_tab').append('<div id="editorlive">console.log("test")</div>');
+
+            var sceneID = self.kernel.application();
+            var editor = createAceEditor(self, sceneID);
+
+            editor.on('blur', function (event, editor) {
+                //    $('#editor').animate({ 'left' : "-260px" }, 175);
+                //     $('.vwf-tree').animate({ 'width' : "260px" }, 175);
+            });
+
+
+            this.codeEditorInit = true;
+        }
+
+        if (!this.editorOpen) {
+            $(codeEditor).show('slide', { direction: 'right' }, 175);
+        }
+        else {
+            $(codeEditor).show();
+            // $('#editor').animate({ 'left' : "-500px" }, 175);
+            // $('.vwf-tree').animate({ 'width' : "500px" }, 175);
+        }
+    }
+
+    function codeEditorDoit(editor, nodeID) {
+        var selectedText = editor.getSession().doc.getTextRange(editor.selection.getRange());
+
+        if (selectedText == "") {
+
+            var currline = editor.getSelectionRange().start.row;
+            var selectedText = editor.session.getLine(currline);
+
+        }
+
+        //console.log(selectedText);
+        //var sceneID = self.kernel.application();
+        vwf_view.kernel.execute(nodeID, selectedText);
+
+    }
+
+    function codeEditorPrintit(editor, nodeID) {
+        var selectedText = editor.getSession().doc.getTextRange(editor.selection.getRange());
+
+        if (selectedText == "") {
+
+            var currline = editor.getSelectionRange().start.row;
+            var selectedText = editor.session.getLine(currline);
+
+        }
+
+        //console.log(selectedText);
+        //var sceneID = self.kernel.application();
+        let scriptText = 'console.log(' + selectedText + ');'
+        self.kernel.execute(nodeID, scriptText);
+
+    }
+
+
+
+
+    // -- showAboutTab ----------------------------------------------------------------------
+
+    function showAboutTab() // invoke with the view as "this"
+    {
+        var about = this.about;
+
+        if (!this.aboutInit) {
+            $('#about_tab').append("<div id='aboutHeader' class='header'>About</div>" +
+                "<div class='about'><p style='font:bold 12pt Arial'>Virtual World Framework & LiveCode editor</p>" +
+                "<p><b>Version: </b> 0.1 <b>VWF version: </b>" + version.toString() + "</p>" +
+                "<p><b>This project site: </b><a href='http://demo.krestianstvo.org' target='_blank'>http://demo.krestianstvo.org</a></p>" +
+                "<p><b>Site VWF: </b><a href='http://virtualworldframework.com' target='_blank'>http://virtualworldframework.com</a></p>" +
+                "<p><b>Project source: </b><a href='https://github.com/NikolaySuslov/vwf/tree/aframe' target='_blank'>https://github.com/NikolaySuslov/vwf/tree/aframe</a></p></div>");
+
+
+
+
+
+            let anotherCell =
+                {
+                    $cell: true,
+                    $text: "About: ",
+                    class: "mdc-typography--display2",
+                    $type: "h2"
+                }
+            let andAnotherCell =
+                {
+                    $cell: true,
+                    $text: "hello world"
+                }
+
+            document.querySelector("#aboutHeader").$cell({
+                $cell: true,
+                class: 'header',
+                $components: [anotherCell, andAnotherCell]
+            });
+
+            // document.querySelector("body").$cell({
+            //     $cell: true,
+            //     $components: [toolbarCell]
+            // });
+
+            this.aboutInit = true;
+
+
+
+        }
+
+        if (!this.editorOpen) {
+            $(about).show('slide', { direction: 'right' }, 175);
+        }
+        else {
+            $(about).show();
+        }
+    }
+
+    //  -- showModelsTab ----------------------------------------------------------------------
+
+    function showModelsTab(modelID, modelURL) // invoke with the view as "this"
+    {
+        var self = this;
+        var models = this.models;
+        var modelsTemp = this.modelsTemp;
+        this.currentModelID = modelID;
+        this.currentModelURL = modelURL;
+
+        $(models).html("");
+
+        if (modelID == "") {
+            $(modelsTemp).html("<div class='header'>Models</div>");
+
+            $.getJSON("admin/models", function (data) {
+                if (data.length > 0) {
+                    $.each(data, function (key, value) {
+                        var fileName = encodeURIComponent(value['basename']);
+                        var divId = fileName;
+                        if (divId.indexOf('.') != -1) {
+                            divId = divId.replace(/\./g, "_");
+                        }
+                        var url = value['url'];
+
+                        $(modelsTemp).append("<div class='childContainer'><div id='" + divId + "' class='modelEntry' data-url='" + url + "'>"
+                            + fileName + "</div></div>");
+                        $("#" + divId).click(function (e) {
+                            modelDrillDown.call(self, e.target.textContent, e.target.getAttribute("data-url"));
+                        })
+                    });
+                }
+                else {
+                    $(modelsTemp).append("<div class='childEntry'><p style='font:bold 12pt Arial'>No Models Found</p></div>");
+                }
+            });
+        }
+        else {
+            var divId = modelID;
+            if (divId.indexOf('.') != -1) {
+                divId = divId.replace(/\./g, "_");
+            }
+            $(modelsTemp).html("<div id='" + divId + "-backDiv' class='header'><img src='images/back.png' id='" + divId + "-back' alt='back'/>" + modelID + "</div>");
+            $("#" + divId + "-back").click(function (e) {
+                modelDrillUp.call(self, '');
+            });
+
+            $(modelsTemp).append("<div id='" + divId + "-rotation' class='propEntry'><table><tr><td><b>Rotation</b></td><td>" +
+                "<input type='text' class='input_text' id='input-" + divId + "-rotation' value='[1,0,0,0]'></td></tr></table></div>");
+            $('#input-' + divId + '-rotation').keydown(function (evt) {
+                evt.stopPropagation();
+            });
+            $('#input-' + divId + '-rotation').keypress(function (evt) {
+                evt.stopPropagation();
+            });
+            $('#input-' + divId + '-rotation').keyup(function (evt) {
+                evt.stopPropagation();
+            });
+
+            $(modelsTemp).append("<div id='" + divId + "-scale' class='propEntry'><table><tr><td><b>Scale</b></td><td>" +
+                "<input type='text' class='input_text' id='input-" + divId + "-scale' value='[1,1,1]'></td></tr></table></div>");
+            $('#input-' + divId + '-scale').keydown(function (evt) {
+                evt.stopPropagation();
+            });
+            $('#input-' + divId + '-scale').keypress(function (evt) {
+                evt.stopPropagation();
+            });
+            $('#input-' + divId + '-scale').keyup(function (evt) {
+                evt.stopPropagation();
+            });
+
+            $(modelsTemp).append("<div id='" + divId + "-translation' class='propEntry'><table><tr><td><b>Translation Offset</b></td><td>" +
+                "<input type='text' class='input_text' id='input-" + divId + "-translation' value='[0,0,0]'></td></tr></table></div>");
+            $('#input-' + divId + '-translation').keydown(function (evt) {
+                evt.stopPropagation();
+            });
+            $('#input-' + divId + '-translation').keypress(function (evt) {
+                evt.stopPropagation();
+            });
+            $('#input-' + divId + '-translation').keyup(function (evt) {
+                evt.stopPropagation();
+            });
+
+            $(modelsTemp).append("<div class='drag'><div id='" + divId + "-drag' class='modelEntry' draggable='true' data-escaped-name='" + divId + "' data-url='" + modelURL + "'>Drag To Create</div></div>");
+
+            $("#" + divId + "-drag").on("dragstart", function (e) {
+                var fileName = $("#" + e.target.getAttribute("data-escaped-name") + "-backDiv").text();
+                var rotation = encodeURIComponent($("#input-" + e.target.getAttribute("data-escaped-name") + "-rotation").val());
+                var scale = encodeURIComponent($("#input-" + e.target.getAttribute("data-escaped-name") + "-scale").val());
+                var translation = encodeURIComponent($("#input-" + e.target.getAttribute("data-escaped-name") + "-translation").val());
+                var fileData = "{\"fileName\":\"" + fileName + "\", \"fileUrl\":\"" + e.target.getAttribute("data-url") + "\", " +
+                    "\"rotation\":\"" + rotation + "\", \"scale\":\"" + scale + "\", \"translation\":\"" + translation + "\"}";
+                e.originalEvent.dataTransfer.setData('text/plain', fileData);
+                e.originalEvent.dataTransfer.setDragImage(e.target, 0, 0);
+                return true;
+            });
+        }
+    }
+
+    // -- Model drillDown -------------------------------------------------------------------------
+
+    function modelDrillDown(modelID, modelURL) // invoke with the view as "this"
+    {
+        var models = this.models;
+        var modelsTemp = this.modelsTemp;
+
+        showModelsTab.call(this, modelID, modelURL);
+
+        if (modelID != "") $(models).hide('slide', { direction: 'left' }, 175);
+        $(modelsTemp).show('slide', { direction: 'right' }, 175);
+
+        this.models = modelsTemp;
+        this.modelsTemp = models;
+    }
+
+    // -- Model drillUp ---------------------------------------------------------------------------
+
+    function modelDrillUp(modelID) // invoke with the view as "this"
+    {
+        var models = this.models;
+        var modelsTemp = this.modelsTemp;
+
+        showModelsTab.call(this, modelID);
+
+        $(models).hide('slide', { direction: 'right' }, 175);
+        $(modelsTemp).show('slide', { direction: 'left' }, 175);
+
+        this.models = modelsTemp;
+        this.modelsTemp = models;
+    }
+
+    // -- SaveStateAsFile -------------------------------------------------------------------------
+
+    function saveStateAsFile(filename) // invoke with the view as "this"
+    {
+        this.logger.info("Saving: " + filename);
+
+        if (supportAjaxUploadWithProgress.call(this)) {
+            var xhr = new XMLHttpRequest();
+
+            // Save State Information
+            var state = vwf.getState();
+
+            var timestamp = state["queue"].time;
+            timestamp = Math.round(timestamp * 1000);
+
+            var objectIsTypedArray = function (candidate) {
+                var typedArrayTypes = [
+                    Int8Array,
+                    Uint8Array,
+                    // Uint8ClampedArray,
+                    Int16Array,
+                    Uint16Array,
+                    Int32Array,
+                    Uint32Array,
+                    Float32Array,
+                    Float64Array
+                ];
+
+                var isTypedArray = false;
+
+                if (typeof candidate == "object" && candidate != null) {
+                    typedArrayTypes.forEach(function (typedArrayType) {
+                        isTypedArray = isTypedArray || candidate instanceof typedArrayType;
+                    });
+                }
+
+                return isTypedArray;
+            };
+
+            var transitTransformation = function (object) {
+                return objectIsTypedArray(object) ?
+                    Array.prototype.slice.call(object) : object;
+            };
+
+            var json = JSON.stringify(
+                require("vwf/utility").transform(
+                    state, transitTransformation
+                )
+            );
+
+            json = $.encoder.encodeForURL(json);
+
+            var path = window.location.pathname;
+            var pathSplit = path.split('/');
+            if (pathSplit[0] == "") {
+                pathSplit.shift();
+            }
+            if (pathSplit[pathSplit.length - 1] == "") {
+                pathSplit.pop();
+            }
+            var inst = undefined;
+            var instIndex = pathSplit.length - 1;
+            if (pathSplit.length > 2) {
+                if (pathSplit[pathSplit.length - 2] == "load") {
+                    instIndex = pathSplit.length - 3;
+                }
+            }
+            if (pathSplit.length > 3) {
+                if (pathSplit[pathSplit.length - 3] == "load") {
+                    instIndex = pathSplit.length - 4;
+                }
+            }
+            inst = pathSplit[instIndex];
+
+            var root = "";
+            for (var i = 0; i < instIndex; i++) {
+                if (root != "") {
+                    root = root + "/";
+                }
+                root = root + pathSplit[i];
+            }
+
+            if (filename == '') filename = inst;
+
+            if (root.indexOf('.vwf') != -1) root = root.substring(0, root.lastIndexOf('/'));
+
+            xhr.open("POST", "/" + root + "/save/" + filename, true);
+            xhr.setRequestHeader("Content-type", "application/x-www-form-urlencoded");
+            xhr.send("root=" + root + "/" + filename + "&filename=saveState&inst=" + inst + "&timestamp=" + timestamp + "&extension=.vwf.json" + "&jsonState=" + json);
+
+            // Save Config Information
+            var config = { "info": {}, "model": {}, "view": {} };
+
+            // Save browser title
+            config["info"]["title"] = $('title').html();
+
+            // Save model drivers
+            Object.keys(vwf_view.kernel.kernel.models).forEach(function (modelDriver) {
+                if (modelDriver.indexOf('vwf/model/') != -1) config["model"][modelDriver] = "";
+            });
+
+            // If neither glge or threejs model drivers are defined, specify nodriver
+            if (config["model"]["vwf/model/glge"] === undefined && config["model"]["vwf/model/threejs"] === undefined) config["model"]["nodriver"] = "";
+
+            // Save view drivers and associated parameters, if any
+            Object.keys(vwf_view.kernel.kernel.views).forEach(function (viewDriver) {
+                if (viewDriver.indexOf('vwf/view/') != -1) {
+                    if (vwf_view.kernel.kernel.views[viewDriver].parameters) {
+                        config["view"][viewDriver] = vwf_view.kernel.kernel.views[viewDriver].parameters;
+                    }
+                    else config["view"][viewDriver] = "";
+                }
+            });
+
+            var jsonConfig = $.encoder.encodeForURL(JSON.stringify(config));
+
+            // Save config file to server
+            var xhrConfig = new XMLHttpRequest();
+            xhrConfig.open("POST", "/" + root + "/save/" + filename, true);
+            xhrConfig.setRequestHeader("Content-type", "application/x-www-form-urlencoded");
+            xhrConfig.send("root=" + root + "/" + filename + "&filename=saveState&inst=" + inst + "&timestamp=" + timestamp + "&extension=.vwf.config.json" + "&jsonState=" + jsonConfig);
+        }
+
+        else {
+            console.error("Unable to save state.");
+        }
+    }
+
+    // -- LoadSavedState --------------------------------------------------------------------------
+
+    function loadSavedState(filename, applicationpath, revision) {
+        this.logger.info("Loading: " + filename);
+
+        // Redirect until setState ID conflict is resolved
+        var path = window.location.pathname;
+        var inst = path.substring(path.length - 17, path.length - 1);
+
+        var pathSplit = path.split('/');
+        if (pathSplit[0] == "") {
+            pathSplit.shift();
+        }
+        if (pathSplit[pathSplit.length - 1] == "") {
+            pathSplit.pop();
+        }
+        var inst = undefined;
+        var instIndex = pathSplit.length - 1;
+        if (pathSplit.length > 2) {
+            if (pathSplit[pathSplit.length - 2] == "load") {
+                instIndex = pathSplit.length - 3;
+            }
+        }
+        if (pathSplit.length > 3) {
+            if (pathSplit[pathSplit.length - 3] == "load") {
+                instIndex = pathSplit.length - 4;
+            }
+        }
+        inst = pathSplit[instIndex];
+        if (revision) {
+            window.location.pathname = applicationpath + "/" + inst + '/load/' + filename + '/' + revision + '/';
+        }
+        else {
+            window.location.pathname = applicationpath + "/" + inst + '/load/' + filename + '/';
+        }
+
+        // $.get(filename,function(data,status){
+        //     vwf.setState(data);
+        // });
+    }
+
+    // -- SupportAjax -----------------------------------------------------------------------------
+
+    function supportAjaxUploadWithProgress() {
+        return supportAjaxUploadProgressEvents();
+
+        function supportAjaxUploadProgressEvents() {
+            var xhr = new XMLHttpRequest();
+            return !!(xhr && ('upload' in xhr) && ('onprogress' in xhr.upload));
+        }
+    }
+});

+ 578 - 0
support/client/lib/vwf/view/lib/cell.js

@@ -0,0 +1,578 @@
+/*
+ *   {cell}
+ *
+ *   - Membrane: "The cell membrane (also known as the plasma membrane or cytoplasmic membrane) is a biological membrane that separates the interior of all cells from the outside environment"
+ *   - Gene: "The transmission of genes to an organism's offspring is the basis of the inheritance of phenotypic traits. These genes make up different DNA sequences called genotypes. Genotypes along with environmental and developmental factors determine what the phenotypes will be."
+ *   - Genotype: "Genotype is an organism's full hereditary information."
+ *   - Phenotype: "Phenotype is an organism's actual observed properties, such as morphology, development, or behavior."
+ *   - Nucleus: "The nucleus maintains the integrity of genes and controls the activities of the cell by regulating gene expression—the nucleus is, therefore, the control center of the cell."
+ */
+(function($root) {
+  var Membrane = {
+    /*
+     *  [Membrane] The Shell
+     *
+     *  "The cell membrane (also known as the plasma membrane or cytoplasmic membrane) is a biological membrane that separates the interior of all cells from the outside environment"
+     *    - https://en.wikipedia.org/wiki/Cell_membrane
+     *
+     *  The Membrane module determines how a cell is inserted into the DOM. There are two ways: Replacing an existing node with cell (inject), or Creating an additional cell node (add).
+     *   - inject(): attempts to inject cell into an existing host node
+     *   - add(): creates a new cell node and adds it to the DOM without touching other nodes
+     */
+    inject: function($host, gene, namespace, replace) {
+      /*
+       *  Membrane.inject() : Inject cell into an existing node
+       *
+       *  @param {Object} $host - existing host node to inject into
+       *  @param {Object} gene - gene object
+       *  @param {String} namespace - for handling namespaced elements such as SVG https://developer.mozilla.org/en-US/docs/Web/API/Document/createElementNS
+       *  @param {Boolean} replace - if true, create a node and replace it with the host node. Used for manual instantiation
+       */
+      var $node = null;
+      var $replacement;
+      if (replace && $host) {
+        // 1. Inject into an existing node ($host) by explicit instantiation
+        $replacement = Phenotype.$type(gene, namespace);
+        if (gene.hasOwnProperty('$cell')) {
+          $node = $host;
+          if ($node.parentNode) $node.parentNode.replaceChild($replacement, $node);
+        }
+        $node = $replacement;
+      } else if (gene.$type && (gene.$type === 'head' || gene.$type === 'body') && $root.document.getElementsByTagName(gene.$type)) {
+        // 2. Inject into existing 'head' or 'body' nodes
+        $node = $root.document.getElementsByTagName(gene.$type)[0];
+      } else if (gene.id && $root.document.getElementById(gene.id)) {
+        // 3. Inject into an existing nodes by ID
+        $node = $root.document.getElementById(gene.id);
+        if ($node.nodeName.toLowerCase() !== (gene.$type || 'div')) {
+          $replacement = Phenotype.$type(gene, namespace);
+          $node.parentNode.replaceChild($replacement, $node);
+          $node = $replacement;
+        }
+      }
+      if ($node && !$node.Meta) $node.Meta = {};
+      return $node;
+    },
+    add: function($parent, gene, index, namespace) {
+      /*
+       *  Membrane.add() : Adds a new cell node into the DOM tree
+       *
+       *  @param $parent - The parent node to which the new cell node will be added
+       *  @param gene - gene object
+       *  @param index - the position within the parent's childNodes array to which this cell node will be added. Not used in the initial render but used for subsequent renders based on the diff logic
+       *  @param namespace - namespace URL for namespaced elements such as SVG
+       */
+      var $node = Phenotype.$type(gene, namespace);
+      if (index !== null && index !== undefined && $parent.childNodes && $parent.childNodes[index]) {
+        // Index is specified, so insert into that position
+        $parent.insertBefore($node, $parent.childNodes[index]);
+      } else {
+        // No index, simply apppend to the end
+        $parent.appendChild($node);
+      }
+      return $node;
+    },
+    build: function($parent, gene, index, namespace, replace) {
+      /*
+       * Membrane.build() : The main builder function that interfaces with Membrane.inject() and Membrane.add().
+       */
+      // 1. Attempt to inject into an existing node
+      var $existing = Membrane.inject($parent, gene, namespace, replace);
+      if ($existing) return $existing;
+      // 2. If it's not an injection into an existing node, we create a node
+      else return Membrane.add($parent, gene, index, namespace);
+    },
+  };
+  var Genotype = {
+    /*
+     *  [Genotype] Internal Storage of Genes
+     *
+     *  "Genotype is an organism's full hereditary information."
+     *    - https://en.wikipedia.org/wiki/Genotype
+     *
+     *   The Genotype module is an internal storage for all the variables required to construct a cell node (attributes, $variables, and _variables)
+     *   When you set a variable on a cell (for example: this._index=1), it's actually stored under the node's Genotype instead of directly on the node itself.
+     *
+     *   - set(): a low-level function to simply set a key/value pair on the Genotype object, used by update() and build()
+     *   - update(): updates a key/value pair from the genotype and schedules a phenotype (view) update event to be processed on the next tick
+     *   - build(): builds a fresh genotype object from a gene object
+     */
+    set: function($node, key, val) {
+      if (['$init'].indexOf(key) === -1) {
+        $node.Genotype[key] = Nucleus.bind($node, val);
+      } else {
+        val.snapshot = val; // snapshot of $init
+        $node.Genotype[key] = val;
+      }
+    },
+    update: function($node, key, val) {
+      Nucleus.queue($node, key, 'w');
+      Genotype.set($node, key, val);
+    },
+    build: function($node, gene, inheritance) {
+      $node.Genotype = {};
+      $node.Inheritance = inheritance;
+      for (var key in gene) {
+        Genotype.set($node, key, gene[key]);
+      }
+    },
+  };
+  var Gene = {
+    /*
+     *  [Gene] Gene manipulation/diff functions
+     *
+     *  "The transmission of genes to an organism's offspring is the basis of the inheritance of phenotypic traits. These genes make up different DNA sequences called genotypes. Genotypes along with environmental and developmental factors determine what the phenotypes will be."
+     *    - https://en.wikipedia.org/wiki/Gene
+     *
+     *  The Gene module is a collection of utility functions used for comparing gene objects to determine if a node needs to be replaced or left alone when there's an update.
+     *   - freeze(): stringifies a Javascript object snapshot for comparison
+     *   - LCS(): Longest Common Subsequence algorithm https://en.wikipedia.org/wiki/Longest_common_subsequence_problem
+     *   - diff(): A diff algorithm that returns what have been added (+), and removed (-)
+     */
+    freeze: function(gene) {
+      var cache = [];
+      var res = JSON.stringify(gene, function(key, val) {
+        if (typeof val === 'function') { return val.toString(); }
+        if (typeof val === 'object' && val !== null) {
+          if (cache.indexOf(val) !== -1) { return '[Circular]'; }
+          cache.push(val);
+        }
+        return val;
+      });
+      cache = null;
+      return res;
+    },
+    LCS: function(a, b) {
+      var m = a.length, n = b.length, C = [], i, j, af = [], bf = [];
+      for (i = 0; i < m; i++) af.push(Gene.freeze(a[i]));
+      for (j = 0; j < n; j++) bf.push(Gene.freeze(b[j]));
+      for (i = 0; i <= m; i++) C.push([0]);
+      for (j = 0; j < n; j++) C[0].push(0);
+      for (i = 0; i < m; i++) for (j = 0; j < n; j++) C[i+1][j+1] = af[i] === bf[j] ? C[i][j]+1 : Math.max(C[i+1][j], C[i][j+1]);
+      return (function bt(i, j) {
+        if (i*j === 0) { return []; }
+        if (af[i-1] === bf[j-1]) { return bt(i-1, j-1).concat([{ item: a[i-1], _old: i-1, _new: j-1 }]); }
+        return C[i][j-1] > C[i-1][j] ? bt(i, j-1) : bt(i-1, j);
+      }(m, n));
+    },
+    diff: function(_old, _new) {
+      var lcs = Gene.LCS(_old, _new);
+      var old_common = lcs.map(function(i) { return i._old; });
+      var minus = _old.map(function(item, index) {
+        return { item: item, index: index };
+      }).filter(function(item, index) {
+        return old_common.indexOf(index) === -1;
+      });
+      var new_common = lcs.map(function(i) { return i._new; });
+      var plus = _new.map(function(item, index) {
+        return { item: item, index: index };
+      }).filter(function(item, index) {
+        return new_common.indexOf(index) === -1;
+      });
+      return { '-': minus, '+': plus };
+    },
+  };
+  var Phenotype = {
+    /*
+     *  [Phenotype] Actual observed properties of a cell
+     *
+     *  "Phenotype is an organism's actual observed properties, such as morphology, development, or behavior."
+     *    - https://en.wikipedia.org/wiki/Phenotype
+     *
+     *  The Phenotype module manages a cell's actual observed properties, such as textContent ($text), nodeType ($type), innerHTML ($html), childNodes ($components), and DOM attributes
+     *
+     *   - build(): Build phenotype from genotype
+     *   - set(): Sets a key/value pair of phenotype
+     *   - $type(): translates the "$type" attribute to nodeType
+     *   - $text(): translates the "$type" attribute to textContent
+     *   - $html(): translates the "$type" attribute to innerHTML
+     *   - $components(): translates the "$components" attribute to childNodes
+     *   - $init(): executes the "$init" callback function after the element has been rendered
+     *   - $update(): executes the "$update" callback function when needed (called by Nucleus on every tick)
+     */
+    build: function($node, genotype) {
+      Phenotype.$init($node);
+      for (var key in genotype) {
+        if (genotype[key] !== null && genotype[key] !== undefined) {
+          Phenotype.set($node, key, genotype[key]);
+        }
+      }
+    },
+    multiline: function(fn) { return /\/\*!?(?:@preserve)?[ \t]*(?:\r\n|\n)([\s\S]*?)(?:\r\n|\n)[ \t]*\*\//.exec(fn.toString())[1]; },
+    get: function(key) {
+      return Object.getOwnPropertyDescriptor($root.HTMLElement.prototype, key) || Object.getOwnPropertyDescriptor($root.Element.prototype, key);
+    },
+    set: function($node, key, val) {
+      if (key[0] === '$') {
+        if (key === '$type') {
+          // recreate and rebind the node if it's different from the old one
+          var tag = $node.tagName ? $node.tagName.toLowerCase() : 'text';
+          if (val.toLowerCase() !== tag) {
+            var fragment = Phenotype.$type({ $type: 'fragment' });
+            var replacement = fragment.$build($node.Genotype, $node.Inheritance, null, $node.Meta.namespace);
+            $node.parentNode.replaceChild(replacement, $node);
+            $node = replacement;
+          }
+        } else if (key === '$text') {
+          if (typeof val === 'function') val = Phenotype.multiline(val);
+          $node.textContent = val;
+        } else if (key === '$html') {
+          if (typeof val === 'function') val = Phenotype.multiline(val);
+          $node.innerHTML = val;
+        } else if (key === '$components') {
+          Phenotype.$components($node, val);
+        }
+      } else if (key[0] === '_') {
+        // "_" variables don't directly alter the phenotype, so do nothing
+      } else if (key === 'value') {
+        $node[key] = val;
+      } else if (key === 'style' && typeof val === 'object') {
+        var CSSStyleDeclaration = Phenotype.get(key).get.call($node);
+        for (var attr in val) { CSSStyleDeclaration[attr] = val[attr]; }
+      } else if (typeof val === 'number' || typeof val === 'string' || typeof val === 'boolean') {
+        if ($node.setAttribute) $node.setAttribute(key, val);
+      } else if (typeof val === 'function') {
+        // For natively supported HTMLElement.prototype methods such as onclick()
+        var prop = Phenotype.get(key);
+        if (prop) prop.set.call($node, val);
+      }
+    },
+    $type: function(model, namespace) {
+      var meta = {};
+      var $node;
+      if (model.$type === 'text') {
+        if (model.$text && typeof model.$text === 'function') model.$text = Phenotype.multiline(model.$text);
+        $node = $root.document.createTextNode(model.$text);
+      } else if (model.$type === 'svg') {
+        $node = $root.document.createElementNS('http://www.w3.org/2000/svg', model.$type);
+        meta.namespace = $node.namespaceURI;
+      } else if (namespace) {
+        $node = $root.document.createElementNS(namespace, model.$type);
+        meta.namespace = $node.namespaceURI;
+      } else if (model.$type === 'fragment') {
+        $node = $root.document.createDocumentFragment();
+      } else {
+        $node = $root.document.createElement(model.$type || 'div');
+      }
+      $node.Meta = meta;
+      return $node;
+    },
+    $components: function($parent, components) {
+      if (!components) components = [];
+      var old = [].map.call($parent.childNodes, function($node) {
+        return $node.Genotype;
+      }).filter(function(item) {
+        return item; // only compare with Cells (that have Genotype), not additional elements created by another javascript library
+      });
+      if (old.length > 0) {
+        // If childNodes already exist, try to insert into a correct position.
+        var diff = Gene.diff(old, components);
+        diff['-'].forEach(function(item) { $parent.childNodes[item.index].Kill = true; });
+        [].filter.call($parent.childNodes, function($node) {
+          return $node.Kill;
+        }).forEach(function($node) {
+          $parent.removeChild($node);
+        });
+        diff['+'].forEach(function(item) {
+          var inheritance = $parent.Inheritance;
+          for (var key in $parent.Genotype) {
+            if (key[0] === '_') inheritance = inheritance.concat([key]);
+          }
+          $parent.$build(item.item, inheritance, item.index, $parent.Meta.namespace);
+          $parent.$components[item.index] = $parent.childNodes[item.index].Genotype;
+        });
+      } else {
+        // first time construction => no childNodes => build a fragment and insert at once
+        var $fragment = Phenotype.$type({ $type: 'fragment' });
+        var inheritance = $parent.Inheritance;
+        for (var key in $parent.Genotype) {
+          if (key[0] === '_') inheritance = inheritance.concat([key]);
+        }
+        while ($parent.firstChild) { $parent.removeChild($parent.firstChild); } // remove empty text nodes
+        components.forEach(function(component) {
+          $fragment.$build(component, inheritance, null, $parent.Meta.namespace);
+        });
+        $parent.appendChild($fragment);
+        $parent.$components = [].map.call($parent.childNodes, function($node) { return $node.Genotype; });
+      }
+    },
+    $init: function($node) {
+      Nucleus.tick.call($root, function() {
+        if ($node.Genotype && $node.Genotype.$init) Nucleus.bind($node, $node.Genotype.$init)();
+      });
+    },
+    $update: function($node) {
+      if ($node.parentNode && !$node.Meta.$updated && $node.$update) {
+        $node.Meta.$updated = true;
+        $node.$update();
+        for (var key in $node.Dirty) { Phenotype.set($node, key, $node.Genotype[key]); }
+        $node.Meta.$updated = false;
+        $node.Dirty = null;
+      }
+    },
+  };
+  var Nucleus = {
+    /*
+     *  [Nucleus] Handles the cell cycle
+     *
+     *  "The nucleus maintains the integrity of genes and controls the activities of the cell by regulating gene expression—the nucleus is, therefore, the control center of the cell."
+     *    - https://en.wikipedia.org/wiki/Cell_nucleus
+     *
+     *  The Nucleus module creates a proxy that lets Cell interface with the outside world. Its main job is to automatically trigger phenotype updates based on genotype updates
+     *
+     *   - set(): Starts listening to a single attribute.
+     *   - build(): Starts listening to all attributes defined on the gene
+     *   - bind(): Creates a wrapper function that executes the original function, and then automatically updates the Phenotype if necessary.
+     *   - queue(): A function that queues up all potential genotype mutation events so that they can be batch-processed in a single tick.
+     */
+    tick: $root.requestAnimationFrame || $root.webkitRequestAnimationFrame || $root.mozRequestAnimationFrame || $root.msRequestAnimationFrame || function(cb) { return $root.setTimeout(cb, 1000/60); },
+    set: function($node, key) {
+      // Object.defineProperty is used for overriding the default getter and setter behaviors.
+      try {
+        Object.defineProperty($node, key, {
+          configurable: true,
+          get: function() {
+            // 1. get() overrides the node's getter to create an illusion that users are directly accessing the attribute on the node (In reality they are accessing the genotype via nucleus)
+            // 2. get() also queues up the accessed variable so it can potentially trigger a phenotype update in case there's been a mutation
+            if (key[0] === '$' || key[0] === '_') {
+              if (key in $node.Genotype) {
+                Nucleus.queue($node, key, 'r');
+                return $node.Genotype[key];
+              } else if (key[0] === '_') {
+                // Context Inheritance: If a _variable cannot be found on the current node, propagate upwards until we find a node with the attribute.
+                var $current = $node;
+                while ($current = $current.parentNode) { // eslint-disable-line no-cond-assign
+                  if ($current && $current.Genotype && (key in $current.Genotype)) {
+                    Nucleus.queue($current, key, 'r');
+                    return $current.Genotype[key];
+                  }
+                }
+              } else {
+                return null;
+              }
+            } else {
+              // DOM Attributes.
+              if (key === 'value') {
+                // The "value" attribute needs a special treatment.
+                return Object.getOwnPropertyDescriptor(Object.getPrototypeOf($node), key).get.call($node);
+              } else if (key === 'style') {
+                return Phenotype.get(key).get.call($node);
+              } else if (key in $node.Genotype) {
+                // Otherwise utilize Genotype
+                return $node.Genotype[key];
+              } else {
+                // If the key doesn't exist on the Genotype, it means we're dealing with native DOM attributes we didn't explicitly define on the gene.
+                // For example, there are many DOM attributes such as "tagName" that come with the node by default.
+                // These are not something we directly define on a gene object, but we still need to be able to access them..
+                // In this case we just use the native HTMLElement.prototype accessor
+                return Phenotype.get(key).get.call($node);
+              }
+            }
+          },
+          set: function(val) {
+            // set() overrides the node's setter to create an illusion that users are directly setting an attribute on the node (In reality it's proxied to set the genotype value instead)
+            // set() also queues up the mutated variable so it can trigger a phenotype update once the current call stack becomes empty
+
+            // 0. Context Inheritance: If a _variable cannot be found on the current node, cell propagates upwards until it finds a node with the attribute.
+            var $current = $node;
+            if (!(key in $node.Genotype) && key[0] === '_') {
+              while ($current = $current.parentNode) { // eslint-disable-line no-cond-assign
+                if ($current && $current.Genotype && (key in $current.Genotype)) {
+                  break;
+                }
+              }
+            }
+            // 1. Set genotype by default
+            Genotype.update($current, key, val);
+            // 2. DOM attribute handling (anything that doesn't start with $ or _)
+            if (key[0] !== '$' && key[0] !== '_') {
+              if (key === 'value') {
+                return Object.getOwnPropertyDescriptor(Object.getPrototypeOf($node), key).set.call($node, val);
+              } else if (key === 'style' && typeof val === 'object') {
+                Phenotype.get(key).set.call($node, val);
+              } else if (typeof val === 'number' || typeof val === 'string' || typeof val === 'boolean') {
+                $node.setAttribute(key, val);
+              } else if (typeof val === 'function') {
+                Phenotype.get(key).set.call($node, val);
+              }
+            }
+          },
+        });
+      } catch (e) { /** native element edge case handling for electron **/ }
+    },
+    build: function($node) {
+      // 1. The special attributes "$type", "$text", "$html", "$components" are tracked by default even if not manually defined
+      ['$type', '$text', '$html', '$components'].forEach(function(key) {
+        if (!(key in $node.Genotype)) Nucleus.set($node, key);
+      });
+      // 2. Used for context inheritance. We want to track not just the attributes directly defined on the current node but all the attributes inherited from ancestors.
+      if ($node.Inheritance) {
+        $node.Inheritance.forEach(function(key) {
+          Nucleus.set($node, key);
+        });
+      }
+      // 3. Track all keys defined on the gene object
+      for (var key in $node.Genotype) {
+        Nucleus.set($node, key);
+      }
+    },
+    _queue: [],
+    bind: function($node, v) {
+      // Binding an attribute to the nucleus.
+      // 1. No difference if the attribute is just a regular variable
+      // 2. If the attribute is a function, we create a wrapper function that first executes the original function, and then triggers a phenotype update depending on the queue condition
+      if (typeof v === 'function') {
+        var fun = function() {
+          // In the following code, everything inside Nucleus.tick.call is executed AFTER the last line--v.apply($node, arguments)--because it gets added to the event loop and waits until the next render cycle.
+
+          // 1. Schedule phenotype update by wrapping them in a single tick (requestAnimationFrame)
+          Nucleus.tick.call($root, function() {
+            // At this point, Nucleus._queue contains all the nodes that have been touched since the last tick.
+            // We process each node one by one to determine whether to update phenotype and whether to auto-trigger $update().
+
+            // Note: If we're in a middle of multiple nested function calls (fnA calls fnB calls fnC), the queue will be processed from the first function (fnA) only,
+            // This is because the Nucleus._queue will have been drained empty by the time the second function (fnB)'s Nucleus.tick.call reaches this point.
+            Nucleus._queue.forEach(function($node) {
+              var needs_update = false;
+              /*
+               *  At this point, $node.Dirty looks something like this:
+               *  { "_index": 1, "_items": [0,1,2]  }
+               *
+               *  We go through each and compare with the latest version of the Genotype.
+               *  If there's been a change we set the Phenotype and mark it as "needs_update"
+               */
+              for (var key in $node.Dirty) {
+                if (Gene.freeze($node.Genotype[key]) !== $node.Dirty[key]) { // Update phenotype if the new value is different from old (Dirty)
+                  Phenotype.set($node, key, $node.Genotype[key]);
+                  if (key[0] === '_') { needs_update = true; } // If any of the _ variables have changed, need to call $update
+                }
+              }
+              if (needs_update && '$update' in $node.Genotype && (typeof $node.Genotype.$update === 'function')) {
+                Phenotype.$update($node);
+              } else { $node.Dirty = null; }
+            });
+
+            // Remove the $node from the queue
+            var index = Nucleus._queue.indexOf($node);
+            if (index !== -1) Nucleus._queue.splice(index, 1);
+          });
+
+          // 2. Run the actual function, which will modify the queue
+          return v.apply($node, arguments);
+        };
+        fun.snapshot = v;
+        return fun;
+      } else {
+        return v;
+      }
+    },
+    queue: function($node, key, mode) {
+      var val = $node.Genotype[key];
+      if (mode === 'r') {
+        /*
+         * Read mode access => the key was queued as a result of a "get()", which doesn't normally mutate the variable.
+         *
+         * But we still need to take into account the cases where its descendants get mutated, which happens when we're dealing with an array or an object. For example:
+         *  - this._items.push(item);
+         *  - this._module.name="cell";
+         *
+         * In these cases we didn't directly mutate the variables (Direct mutations would have been something like: this._items=[1,2]; or this._module={name: "cell"};)
+         * but each variable's value *did* change as a result of each expression. To make sure we don't miss these types, we queue them up with a "r" (read) type.
+         * But we only need to do this for objects and arrays. (not string, number, etc. because they can't have descendants)
+         */
+        if (typeof val !== 'object' && !Array.isArray(val)) return;
+      }
+      if (Nucleus._queue.indexOf($node) === -1) { Nucleus._queue.push($node); }
+      if (!$node.Dirty) $node.Dirty = {};
+      if (!(key in $node.Dirty)) {
+        /*
+         * Caches the original gene under $node.Dirty when a key is touched.
+         *
+         * {
+         *   Dirty: {
+         *     "_index": 1,
+         *     "_items": [0,1,2]
+         *   }
+         * }
+         *
+         */
+        $node.Dirty[key] = Gene.freeze($node.Genotype[key]); // stores the original value under "Dirty"
+      }
+    },
+  };
+  var God = {
+    /*
+     * The Creator
+     * The only purpose of this module is to create cells and get out of the way.
+     */
+    detect: function($context) {
+      // takes a context, returns all the objects containing thew '$cell' key
+      if ($context === undefined) $context = this;
+      return Object.keys($context).filter(function(k) {
+        try {
+          if (/webkitStorageInfo|webkitIndexedDB/.test(k) || $context[k] instanceof $root.Element) return false; // Only look for plain javascript object
+          return $context[k] && Object.prototype.hasOwnProperty.call($context[k], '$cell');
+        } catch (e) { return false; }
+      }).map(function(k) {
+        return $context[k];
+      });
+    },
+    plan: function($context) {
+      // Prepare the DOM for cell creation by adding prototype methods to nodes.
+      // As a result, all HTML elements become autonomous.
+      if ($context === undefined) $context = $root;
+      else $root = $context;
+      $context.DocumentFragment.prototype.$build = $context.Element.prototype.$build = function(gene, inheritance, index, namespace, replace) {
+        var $node = Membrane.build(this, gene, index, namespace, replace);
+        Genotype.build($node, gene, inheritance || [], index);
+        Nucleus.build($node);
+        Phenotype.build($node, $node.Genotype);
+        return $node;
+      };
+      $context.DocumentFragment.prototype.$cell = $context.Element.prototype.$cell = function(gene, options) {
+        return this.$build(gene, [], null, (options && options.namespace) || null, true);
+      };
+      $context.DocumentFragment.prototype.$snapshot = $context.Element.prototype.$snapshot = function() {
+        var json = JSON.stringify(this.Genotype, function(k, v) {
+          if (typeof v === 'function' && v.snapshot) { return '(' + v.snapshot.toString() + ')'; }
+          return v;
+        });
+        return JSON.parse(json, function(k, v) {
+          if (typeof v === 'string' && v.indexOf('function') >= 0) { return eval(v); }
+          return v;
+        });
+      };
+      if ($root.NodeList && !$root.NodeList.prototype.forEach) $root.NodeList.prototype.forEach = Array.prototype.forEach; // NodeList.forEach override polyfill
+    },
+    create: function($context) {
+      // Automatic cell generation based on declarative rules
+      return God.detect($context).map(function(gene) {
+        return $context.document.body.$build(gene, []);
+      });
+    },
+  };
+
+  // For testing
+  if (typeof exports !== 'undefined') {
+    var x = {
+      Phenotype: Phenotype,
+      Genotype: Genotype,
+      Nucleus: Nucleus,
+      Gene: Gene,
+      Membrane: Membrane,
+      God: God,
+      plan: God.plan.bind(God),
+      create: God.create.bind(God),
+    };
+    if (typeof module !== 'undefined' && module.exports) { exports = module.exports = x; }
+    exports = x;
+  } else {
+    God.plan(this);
+    if (this.addEventListener) {
+      // Let there be Cell
+      this.addEventListener('load', function() {
+        God.create(this);
+      });
+    }
+  }
+}(this));

+ 41 - 0
support/client/lib/vwf/view/lib/editorLive.css

@@ -0,0 +1,41 @@
+.editor-body {
+  display: flex;
+  flex-direction: row;
+}
+
+@font-face {
+  font-family: 'Material Icons';
+  font-style: normal;
+  font-weight: 400;
+  src: url(./mdc/iconfont/MaterialIcons-Regular.eot); /* For IE6-8 */
+  src: local('Material Icons'),
+    local('MaterialIcons-Regular'),
+    url(./mdc/iconfont/MaterialIcons-Regular.woff2) format('woff2'),
+    url(./mdc/iconfont/MaterialIcons-Regular.woff) format('woff'),
+    url(./mdc/iconfont/MaterialIcons-Regular.ttf) format('truetype');
+}
+
+.material-icons {
+  font-family: 'Material Icons';
+  font-weight: normal;
+  font-style: normal;
+  font-size: 24px;  /* Preferred icon size */
+  display: inline-block;
+  line-height: 1;
+  text-transform: none;
+  letter-spacing: normal;
+  word-wrap: normal;
+  white-space: nowrap;
+  direction: ltr;
+
+  /* Support for all WebKit browsers. */
+  -webkit-font-smoothing: antialiased;
+  /* Support for Safari and Chrome. */
+  text-rendering: optimizeLegibility;
+
+  /* Support for Firefox. */
+  -moz-osx-font-smoothing: grayscale;
+
+  /* Support for IE. */
+  font-feature-settings: 'liga';
+}

Filskillnaden har hållts tillbaka eftersom den är för stor
+ 30 - 0
support/client/lib/vwf/view/lib/he.js


+ 14505 - 0
support/client/lib/vwf/view/lib/mdc/dist/material-components-web.css

@@ -0,0 +1,14505 @@
+/*!
+ Material Components for the web
+ Copyright (c) 2017 Google Inc.
+ License: Apache-2.0
+*/
+.mdc-animation-deceleration-curve {
+  -webkit-animation-timing-function: cubic-bezier(0, 0, 0.2, 1);
+          animation-timing-function: cubic-bezier(0, 0, 0.2, 1); }
+
+.mdc-animation-standard-curve {
+  -webkit-animation-timing-function: cubic-bezier(0.4, 0, 0.2, 1);
+          animation-timing-function: cubic-bezier(0.4, 0, 0.2, 1); }
+
+.mdc-animation-acceleration-curve {
+  -webkit-animation-timing-function: cubic-bezier(0.4, 0, 1, 1);
+          animation-timing-function: cubic-bezier(0.4, 0, 1, 1); }
+
+.mdc-animation-sharp-curve {
+  -webkit-animation-timing-function: cubic-bezier(0.4, 0, 0.6, 1);
+          animation-timing-function: cubic-bezier(0.4, 0, 0.6, 1); }
+
+/**
+ * The css property used for elevation. In most cases this should not be changed. It is exposed
+ * as a variable for abstraction / easy use when needing to reference the property directly, for
+ * example in a `will-change` rule.
+ */
+/**
+ * The default duration value for elevation transitions.
+ */
+/**
+ * The default easing value for elevation transitions.
+ */
+/**
+ * Applies the correct css rules to an element to give it the elevation specified by $z-value.
+ * The $z-value must be between 0 and 24.
+ */
+/**
+ * Returns a string that can be used as the value for a `transition` property for elevation.
+ * Calling this function directly is useful in situations where a component needs to transition
+ * more than one property.
+ *
+ * ```scss
+ * .foo {
+ *   transition: mdc-elevation-transition-rule(), opacity 100ms ease;
+ *   will-change: $mdc-elevation-property, opacity;
+ * }
+ * ```
+ */
+/**
+ * Applies the correct css rules needed to have an element transition between elevations.
+ * This mixin should be applied to elements whose elevation values will change depending on their
+ * context (e.g. when active or disabled).
+ */
+/*
+  Precomputed linear color channel values, for use in contrast calculations.
+  See https://www.w3.org/TR/WCAG20-TECHS/G17.html#G17-tests
+
+  Algorithm, for c in 0 to 255:
+  f(c) {
+    c = c / 255;
+    return c < 0.03928 ? c / 12.92 : Math.pow((c + 0.055) / 1.055, 2.4);
+  }
+
+  This lookup table is needed since there is no `pow` in SASS.
+*/
+/**
+ * Calculate the luminance for a color.
+ * See https://www.w3.org/TR/WCAG20-TECHS/G17.html#G17-tests
+ */
+/**
+ * Calculate the contrast ratio between two colors.
+ * See https://www.w3.org/TR/WCAG20-TECHS/G17.html#G17-tests
+ */
+/**
+ * Determine whether to use dark or light text on top of given color.
+ * Returns "dark" for dark text and "light" for light text.
+ */
+/*
+  Main theme colors.
+  If you're a user customizing your color scheme in SASS, these are probably the only variables you need to change.
+*/
+/* Indigo 500 */
+/* Pink A200 */
+/* White */
+/* Which set of text colors to use for each main theme color (light or dark) */
+/* Text colors according to light vs dark and text type */
+/* Primary text colors for each of the theme colors */
+/** MDC Ripple keyframes are split into their own file so that _mixins.scss can rely on them. */
+@-webkit-keyframes mdc-ripple-fg-radius-in {
+  from {
+    -webkit-transform: translate(var(--mdc-ripple-fg-translate-start, 0)) scale(1);
+            transform: translate(var(--mdc-ripple-fg-translate-start, 0)) scale(1);
+    -webkit-animation-timing-function: cubic-bezier(0.4, 0, 0.2, 1);
+            animation-timing-function: cubic-bezier(0.4, 0, 0.2, 1); }
+  to {
+    -webkit-transform: translate(var(--mdc-ripple-fg-translate-end, 0)) scale(var(--mdc-ripple-fg-scale, 1));
+            transform: translate(var(--mdc-ripple-fg-translate-end, 0)) scale(var(--mdc-ripple-fg-scale, 1)); } }
+@keyframes mdc-ripple-fg-radius-in {
+  from {
+    -webkit-transform: translate(var(--mdc-ripple-fg-translate-start, 0)) scale(1);
+            transform: translate(var(--mdc-ripple-fg-translate-start, 0)) scale(1);
+    -webkit-animation-timing-function: cubic-bezier(0.4, 0, 0.2, 1);
+            animation-timing-function: cubic-bezier(0.4, 0, 0.2, 1); }
+  to {
+    -webkit-transform: translate(var(--mdc-ripple-fg-translate-end, 0)) scale(var(--mdc-ripple-fg-scale, 1));
+            transform: translate(var(--mdc-ripple-fg-translate-end, 0)) scale(var(--mdc-ripple-fg-scale, 1)); } }
+
+@-webkit-keyframes mdc-ripple-fg-opacity-in {
+  from {
+    opacity: 0;
+    -webkit-animation-timing-function: linear;
+            animation-timing-function: linear; }
+  to {
+    opacity: 1; } }
+
+@keyframes mdc-ripple-fg-opacity-in {
+  from {
+    opacity: 0;
+    -webkit-animation-timing-function: linear;
+            animation-timing-function: linear; }
+  to {
+    opacity: 1; } }
+
+@-webkit-keyframes mdc-ripple-fg-opacity-out {
+  from {
+    opacity: 1;
+    -webkit-animation-timing-function: linear;
+            animation-timing-function: linear; }
+  to {
+    opacity: 0; } }
+
+@keyframes mdc-ripple-fg-opacity-out {
+  from {
+    opacity: 1;
+    -webkit-animation-timing-function: linear;
+            animation-timing-function: linear; }
+  to {
+    opacity: 0; } }
+
+/*
+  Precomputed linear color channel values, for use in contrast calculations.
+  See https://www.w3.org/TR/WCAG20-TECHS/G17.html#G17-tests
+
+  Algorithm, for c in 0 to 255:
+  f(c) {
+    c = c / 255;
+    return c < 0.03928 ? c / 12.92 : Math.pow((c + 0.055) / 1.055, 2.4);
+  }
+
+  This lookup table is needed since there is no `pow` in SASS.
+*/
+/**
+ * Calculate the luminance for a color.
+ * See https://www.w3.org/TR/WCAG20-TECHS/G17.html#G17-tests
+ */
+/**
+ * Calculate the contrast ratio between two colors.
+ * See https://www.w3.org/TR/WCAG20-TECHS/G17.html#G17-tests
+ */
+/**
+ * Determine whether to use dark or light text on top of given color.
+ * Returns "dark" for dark text and "light" for light text.
+ */
+/*
+  Main theme colors.
+  If you're a user customizing your color scheme in SASS, these are probably the only variables you need to change.
+*/
+/* Indigo 500 */
+/* Pink A200 */
+/* White */
+/* Which set of text colors to use for each main theme color (light or dark) */
+/* Text colors according to light vs dark and text type */
+/* Primary text colors for each of the theme colors */
+/**
+ * Applies the correct theme color style to the specified property.
+ * $property is typically color or background-color, but can be any CSS property that accepts color values.
+ * $style should be one of the map keys in $mdc-theme-property-values (_variables.scss).
+ */
+/**
+ * Creates a rule to be used in MDC-Web components for dark theming, and applies the provided contents.
+ * Should provide the $root-selector option if applied to anything other than the root selector.
+ * When used with a modifier class, provide a second argument of `true` for the $compound parameter
+ * to specify that this should be attached as a compound class.
+ *
+ * Usage example:
+ *
+ * ```scss
+ * .mdc-foo {
+ *   color: black;
+ *
+ *   @include mdc-theme-dark {
+ *     color: white;
+ *   }
+ *
+ *   &__bar {
+ *     background: black;
+ *
+ *     @include mdc-theme-dark(".mdc-foo") {
+ *       background: white;
+ *     }
+ *   }
+ * }
+ *
+ * .mdc-foo--disabled {
+ *   opacity: .38;
+ *
+ *   @include mdc-theme-dark(".mdc-foo", true) {
+ *     opacity: .5;
+ *   }
+ * }
+ * ```
+ */
+/* TODO(sgomes): Figure out what to do about desktop font sizes. */
+/* TODO(sgomes): Figure out what to do about i18n and i18n font sizes. */
+.mdc-button {
+  --mdc-ripple-surface-width: 0;
+  --mdc-ripple-surface-height: 0;
+  --mdc-ripple-fg-size: 0;
+  --mdc-ripple-left: 0;
+  --mdc-ripple-top: 0;
+  --mdc-ripple-fg-scale: 1;
+  --mdc-ripple-fg-translate-end: 0;
+  --mdc-ripple-fg-translate-start: 0;
+  will-change: transform, opacity;
+  -webkit-tap-highlight-color: transparent;
+  /* @alternate */
+  color: rgba(0, 0, 0, 0.87);
+  color: var(--mdc-theme-text-primary-on-light, rgba(0, 0, 0, 0.87));
+  font-family: Roboto, sans-serif;
+  -moz-osx-font-smoothing: grayscale;
+  -webkit-font-smoothing: antialiased;
+  display: inline-block;
+  position: relative;
+  min-width: 64px;
+  height: 36px;
+  padding: 0 16px;
+  border: none;
+  border-radius: 2px;
+  outline: none;
+  background: transparent;
+  font-size: 14px;
+  font-weight: 500;
+  letter-spacing: .04em;
+  line-height: 36px;
+  text-align: center;
+  text-decoration: none;
+  text-transform: uppercase;
+  overflow: hidden;
+  vertical-align: middle;
+  -webkit-user-select: none;
+     -moz-user-select: none;
+      -ms-user-select: none;
+          user-select: none;
+  -webkit-box-sizing: border-box;
+          box-sizing: border-box;
+  -webkit-appearance: none; }
+  .mdc-button:not(.mdc-ripple-upgraded):hover::before, .mdc-button:not(.mdc-ripple-upgraded):focus::before, .mdc-button:not(.mdc-ripple-upgraded):active::after {
+    -webkit-transition-duration: 85ms;
+            transition-duration: 85ms;
+    opacity: .6; }
+  .mdc-button::before {
+    background-color: rgba(0, 0, 0, 0.06);
+    position: absolute;
+    top: calc(50% - 100%);
+    left: calc(50% - 100%);
+    width: 200%;
+    height: 200%;
+    -webkit-transition: opacity 250ms linear;
+    transition: opacity 250ms linear;
+    border-radius: 50%;
+    opacity: 0;
+    pointer-events: none;
+    content: ""; }
+  .mdc-button.mdc-ripple-upgraded::before {
+    top: calc(50% - 100%);
+    left: calc(50% - 100%);
+    width: 200%;
+    height: 200%;
+    /* @alternate */
+    -webkit-transform: scale(0);
+            transform: scale(0);
+    -webkit-transform: scale(var(--mdc-ripple-fg-scale, 0));
+            transform: scale(var(--mdc-ripple-fg-scale, 0)); }
+  .mdc-button.mdc-ripple-upgraded--background-focused::before {
+    opacity: .99999; }
+  .mdc-button.mdc-ripple-upgraded--background-active-fill::before {
+    -webkit-transition-duration: 120ms;
+            transition-duration: 120ms;
+    opacity: 1; }
+  .mdc-button.mdc-ripple-upgraded--unbounded::before {
+    /* @alternate */
+    top: calc(50% - 50%);
+    top: var(--mdc-ripple-top, calc(50% - 50%));
+    /* @alternate */
+    left: calc(50% - 50%);
+    left: var(--mdc-ripple-left, calc(50% - 50%));
+    /* @alternate */
+    width: 100%;
+    width: var(--mdc-ripple-fg-size, 100%);
+    /* @alternate */
+    height: 100%;
+    height: var(--mdc-ripple-fg-size, 100%);
+    /* @alternate */
+    -webkit-transform: scale(0);
+            transform: scale(0);
+    -webkit-transform: scale(var(--mdc-ripple-fg-scale, 0));
+            transform: scale(var(--mdc-ripple-fg-scale, 0)); }
+  .mdc-button::after {
+    background-color: rgba(0, 0, 0, 0.06);
+    position: absolute;
+    top: calc(50% - 100%);
+    left: calc(50% - 100%);
+    width: 200%;
+    height: 200%;
+    -webkit-transition: opacity 250ms linear;
+    transition: opacity 250ms linear;
+    border-radius: 50%;
+    opacity: 0;
+    pointer-events: none;
+    content: ""; }
+  .mdc-button.mdc-ripple-upgraded::after {
+    top: 0;
+    left: 0;
+    /* @alternate */
+    width: 100%;
+    width: var(--mdc-ripple-fg-size, 100%);
+    /* @alternate */
+    height: 100%;
+    height: var(--mdc-ripple-fg-size, 100%);
+    -webkit-transform: scale(0);
+            transform: scale(0);
+    -webkit-transform-origin: center center;
+            transform-origin: center center;
+    opacity: 0; }
+  .mdc-button:not(.mdc-ripple-upgraded--unbounded)::after {
+    -webkit-transform-origin: center center;
+            transform-origin: center center; }
+  .mdc-button.mdc-ripple-upgraded--unbounded::after {
+    /* @alternate */
+    top: 0;
+    top: var(--mdc-ripple-top, 0);
+    /* @alternate */
+    left: 0;
+    left: var(--mdc-ripple-left, 0);
+    /* @alternate */
+    width: 100%;
+    width: var(--mdc-ripple-fg-size, 100%);
+    /* @alternate */
+    height: 100%;
+    height: var(--mdc-ripple-fg-size, 100%);
+    -webkit-transform: scale(0);
+            transform: scale(0);
+    -webkit-transform-origin: center center;
+            transform-origin: center center; }
+  .mdc-button.mdc-ripple-upgraded--foreground-activation::after {
+    -webkit-animation: 300ms mdc-ripple-fg-radius-in forwards, 83ms mdc-ripple-fg-opacity-in forwards;
+            animation: 300ms mdc-ripple-fg-radius-in forwards, 83ms mdc-ripple-fg-opacity-in forwards; }
+  .mdc-button.mdc-ripple-upgraded--foreground-deactivation::after {
+    -webkit-transform: translate(var(--mdc-ripple-fg-translate-end, 0)) scale(var(--mdc-ripple-fg-scale, 1));
+            transform: translate(var(--mdc-ripple-fg-translate-end, 0)) scale(var(--mdc-ripple-fg-scale, 1));
+    -webkit-animation: 83ms mdc-ripple-fg-opacity-out;
+            animation: 83ms mdc-ripple-fg-opacity-out; }
+  .mdc-button:not(.mdc-ripple-upgraded) {
+    -webkit-tap-highlight-color: rgba(0, 0, 0, 0.18); }
+  .mdc-button--theme-dark,
+  .mdc-theme--dark .mdc-button {
+    --mdc-ripple-surface-width: 0;
+    --mdc-ripple-surface-height: 0;
+    --mdc-ripple-fg-size: 0;
+    --mdc-ripple-left: 0;
+    --mdc-ripple-top: 0;
+    --mdc-ripple-fg-scale: 1;
+    --mdc-ripple-fg-translate-end: 0;
+    --mdc-ripple-fg-translate-start: 0;
+    will-change: transform, opacity;
+    -webkit-tap-highlight-color: transparent;
+    /* @alternate */
+    color: white;
+    color: var(--mdc-theme-text-primary-on-dark, white); }
+    .mdc-button--theme-dark:not(.mdc-ripple-upgraded):hover::before, .mdc-button--theme-dark:not(.mdc-ripple-upgraded):focus::before, .mdc-button--theme-dark:not(.mdc-ripple-upgraded):active::after,
+    .mdc-theme--dark .mdc-button:not(.mdc-ripple-upgraded):hover::before,
+    .mdc-theme--dark .mdc-button:not(.mdc-ripple-upgraded):focus::before,
+    .mdc-theme--dark .mdc-button:not(.mdc-ripple-upgraded):active::after {
+      -webkit-transition-duration: 85ms;
+              transition-duration: 85ms;
+      opacity: .6; }
+    .mdc-button--theme-dark::before,
+    .mdc-theme--dark .mdc-button::before {
+      background-color: rgba(255, 255, 255, 0.14);
+      position: absolute;
+      top: calc(50% - 100%);
+      left: calc(50% - 100%);
+      width: 200%;
+      height: 200%;
+      -webkit-transition: opacity 250ms linear;
+      transition: opacity 250ms linear;
+      border-radius: 50%;
+      opacity: 0;
+      pointer-events: none;
+      content: ""; }
+    .mdc-button--theme-dark.mdc-ripple-upgraded::before,
+    .mdc-theme--dark .mdc-button.mdc-ripple-upgraded::before {
+      top: calc(50% - 100%);
+      left: calc(50% - 100%);
+      width: 200%;
+      height: 200%;
+      /* @alternate */
+      -webkit-transform: scale(0);
+              transform: scale(0);
+      -webkit-transform: scale(var(--mdc-ripple-fg-scale, 0));
+              transform: scale(var(--mdc-ripple-fg-scale, 0)); }
+    .mdc-button--theme-dark.mdc-ripple-upgraded--background-focused::before,
+    .mdc-theme--dark .mdc-button.mdc-ripple-upgraded--background-focused::before {
+      opacity: .99999; }
+    .mdc-button--theme-dark.mdc-ripple-upgraded--background-active-fill::before,
+    .mdc-theme--dark .mdc-button.mdc-ripple-upgraded--background-active-fill::before {
+      -webkit-transition-duration: 120ms;
+              transition-duration: 120ms;
+      opacity: 1; }
+    .mdc-button--theme-dark.mdc-ripple-upgraded--unbounded::before,
+    .mdc-theme--dark .mdc-button.mdc-ripple-upgraded--unbounded::before {
+      /* @alternate */
+      top: calc(50% - 50%);
+      top: var(--mdc-ripple-top, calc(50% - 50%));
+      /* @alternate */
+      left: calc(50% - 50%);
+      left: var(--mdc-ripple-left, calc(50% - 50%));
+      /* @alternate */
+      width: 100%;
+      width: var(--mdc-ripple-fg-size, 100%);
+      /* @alternate */
+      height: 100%;
+      height: var(--mdc-ripple-fg-size, 100%);
+      /* @alternate */
+      -webkit-transform: scale(0);
+              transform: scale(0);
+      -webkit-transform: scale(var(--mdc-ripple-fg-scale, 0));
+              transform: scale(var(--mdc-ripple-fg-scale, 0)); }
+    .mdc-button--theme-dark::after,
+    .mdc-theme--dark .mdc-button::after {
+      background-color: rgba(255, 255, 255, 0.14);
+      position: absolute;
+      top: calc(50% - 100%);
+      left: calc(50% - 100%);
+      width: 200%;
+      height: 200%;
+      -webkit-transition: opacity 250ms linear;
+      transition: opacity 250ms linear;
+      border-radius: 50%;
+      opacity: 0;
+      pointer-events: none;
+      content: ""; }
+    .mdc-button--theme-dark.mdc-ripple-upgraded::after,
+    .mdc-theme--dark .mdc-button.mdc-ripple-upgraded::after {
+      top: 0;
+      left: 0;
+      /* @alternate */
+      width: 100%;
+      width: var(--mdc-ripple-fg-size, 100%);
+      /* @alternate */
+      height: 100%;
+      height: var(--mdc-ripple-fg-size, 100%);
+      -webkit-transform: scale(0);
+              transform: scale(0);
+      -webkit-transform-origin: center center;
+              transform-origin: center center;
+      opacity: 0; }
+    .mdc-button--theme-dark:not(.mdc-ripple-upgraded--unbounded)::after,
+    .mdc-theme--dark .mdc-button:not(.mdc-ripple-upgraded--unbounded)::after {
+      -webkit-transform-origin: center center;
+              transform-origin: center center; }
+    .mdc-button--theme-dark.mdc-ripple-upgraded--unbounded::after,
+    .mdc-theme--dark .mdc-button.mdc-ripple-upgraded--unbounded::after {
+      /* @alternate */
+      top: 0;
+      top: var(--mdc-ripple-top, 0);
+      /* @alternate */
+      left: 0;
+      left: var(--mdc-ripple-left, 0);
+      /* @alternate */
+      width: 100%;
+      width: var(--mdc-ripple-fg-size, 100%);
+      /* @alternate */
+      height: 100%;
+      height: var(--mdc-ripple-fg-size, 100%);
+      -webkit-transform: scale(0);
+              transform: scale(0);
+      -webkit-transform-origin: center center;
+              transform-origin: center center; }
+    .mdc-button--theme-dark.mdc-ripple-upgraded--foreground-activation::after,
+    .mdc-theme--dark .mdc-button.mdc-ripple-upgraded--foreground-activation::after {
+      -webkit-animation: 300ms mdc-ripple-fg-radius-in forwards, 83ms mdc-ripple-fg-opacity-in forwards;
+              animation: 300ms mdc-ripple-fg-radius-in forwards, 83ms mdc-ripple-fg-opacity-in forwards; }
+    .mdc-button--theme-dark.mdc-ripple-upgraded--foreground-deactivation::after,
+    .mdc-theme--dark .mdc-button.mdc-ripple-upgraded--foreground-deactivation::after {
+      -webkit-transform: translate(var(--mdc-ripple-fg-translate-end, 0)) scale(var(--mdc-ripple-fg-scale, 1));
+              transform: translate(var(--mdc-ripple-fg-translate-end, 0)) scale(var(--mdc-ripple-fg-scale, 1));
+      -webkit-animation: 83ms mdc-ripple-fg-opacity-out;
+              animation: 83ms mdc-ripple-fg-opacity-out; }
+    .mdc-button--theme-dark:not(.mdc-ripple-upgraded),
+    .mdc-theme--dark .mdc-button:not(.mdc-ripple-upgraded) {
+      -webkit-tap-highlight-color: rgba(255, 255, 255, 0.18); }
+  .mdc-button.mdc-button--primary {
+    --mdc-ripple-surface-width: 0;
+    --mdc-ripple-surface-height: 0;
+    --mdc-ripple-fg-size: 0;
+    --mdc-ripple-left: 0;
+    --mdc-ripple-top: 0;
+    --mdc-ripple-fg-scale: 1;
+    --mdc-ripple-fg-translate-end: 0;
+    --mdc-ripple-fg-translate-start: 0;
+    will-change: transform, opacity;
+    -webkit-tap-highlight-color: transparent; }
+    .mdc-button.mdc-button--primary:not(.mdc-ripple-upgraded):hover::before, .mdc-button.mdc-button--primary:not(.mdc-ripple-upgraded):focus::before, .mdc-button.mdc-button--primary:not(.mdc-ripple-upgraded):active::after {
+      -webkit-transition-duration: 85ms;
+              transition-duration: 85ms;
+      opacity: .6; }
+    .mdc-button.mdc-button--primary::before {
+      /* @alternate */
+      background-color: rgba(63, 81, 181, 0.12);
+      position: absolute;
+      top: calc(50% - 100%);
+      left: calc(50% - 100%);
+      width: 200%;
+      height: 200%;
+      -webkit-transition: opacity 250ms linear;
+      transition: opacity 250ms linear;
+      border-radius: 50%;
+      opacity: 0;
+      pointer-events: none;
+      content: ""; }
+      @supports (background-color: color(green a(10%))) {
+        .mdc-button.mdc-button--primary::before {
+          background-color: color(var(--mdc-theme-primary, #3f51b5) a(12%)); } }
+    .mdc-button.mdc-button--primary.mdc-ripple-upgraded::before {
+      top: calc(50% - 100%);
+      left: calc(50% - 100%);
+      width: 200%;
+      height: 200%;
+      /* @alternate */
+      -webkit-transform: scale(0);
+              transform: scale(0);
+      -webkit-transform: scale(var(--mdc-ripple-fg-scale, 0));
+              transform: scale(var(--mdc-ripple-fg-scale, 0)); }
+    .mdc-button.mdc-button--primary.mdc-ripple-upgraded--background-focused::before {
+      opacity: .99999; }
+    .mdc-button.mdc-button--primary.mdc-ripple-upgraded--background-active-fill::before {
+      -webkit-transition-duration: 120ms;
+              transition-duration: 120ms;
+      opacity: 1; }
+    .mdc-button.mdc-button--primary.mdc-ripple-upgraded--unbounded::before {
+      /* @alternate */
+      top: calc(50% - 50%);
+      top: var(--mdc-ripple-top, calc(50% - 50%));
+      /* @alternate */
+      left: calc(50% - 50%);
+      left: var(--mdc-ripple-left, calc(50% - 50%));
+      /* @alternate */
+      width: 100%;
+      width: var(--mdc-ripple-fg-size, 100%);
+      /* @alternate */
+      height: 100%;
+      height: var(--mdc-ripple-fg-size, 100%);
+      /* @alternate */
+      -webkit-transform: scale(0);
+              transform: scale(0);
+      -webkit-transform: scale(var(--mdc-ripple-fg-scale, 0));
+              transform: scale(var(--mdc-ripple-fg-scale, 0)); }
+    .mdc-button.mdc-button--primary::after {
+      /* @alternate */
+      background-color: rgba(63, 81, 181, 0.12);
+      position: absolute;
+      top: calc(50% - 100%);
+      left: calc(50% - 100%);
+      width: 200%;
+      height: 200%;
+      -webkit-transition: opacity 250ms linear;
+      transition: opacity 250ms linear;
+      border-radius: 50%;
+      opacity: 0;
+      pointer-events: none;
+      content: ""; }
+      @supports (background-color: color(green a(10%))) {
+        .mdc-button.mdc-button--primary::after {
+          background-color: color(var(--mdc-theme-primary, #3f51b5) a(12%)); } }
+    .mdc-button.mdc-button--primary.mdc-ripple-upgraded::after {
+      top: 0;
+      left: 0;
+      /* @alternate */
+      width: 100%;
+      width: var(--mdc-ripple-fg-size, 100%);
+      /* @alternate */
+      height: 100%;
+      height: var(--mdc-ripple-fg-size, 100%);
+      -webkit-transform: scale(0);
+              transform: scale(0);
+      -webkit-transform-origin: center center;
+              transform-origin: center center;
+      opacity: 0; }
+    .mdc-button.mdc-button--primary:not(.mdc-ripple-upgraded--unbounded)::after {
+      -webkit-transform-origin: center center;
+              transform-origin: center center; }
+    .mdc-button.mdc-button--primary.mdc-ripple-upgraded--unbounded::after {
+      /* @alternate */
+      top: 0;
+      top: var(--mdc-ripple-top, 0);
+      /* @alternate */
+      left: 0;
+      left: var(--mdc-ripple-left, 0);
+      /* @alternate */
+      width: 100%;
+      width: var(--mdc-ripple-fg-size, 100%);
+      /* @alternate */
+      height: 100%;
+      height: var(--mdc-ripple-fg-size, 100%);
+      -webkit-transform: scale(0);
+              transform: scale(0);
+      -webkit-transform-origin: center center;
+              transform-origin: center center; }
+    .mdc-button.mdc-button--primary.mdc-ripple-upgraded--foreground-activation::after {
+      -webkit-animation: 300ms mdc-ripple-fg-radius-in forwards, 83ms mdc-ripple-fg-opacity-in forwards;
+              animation: 300ms mdc-ripple-fg-radius-in forwards, 83ms mdc-ripple-fg-opacity-in forwards; }
+    .mdc-button.mdc-button--primary.mdc-ripple-upgraded--foreground-deactivation::after {
+      -webkit-transform: translate(var(--mdc-ripple-fg-translate-end, 0)) scale(var(--mdc-ripple-fg-scale, 1));
+              transform: translate(var(--mdc-ripple-fg-translate-end, 0)) scale(var(--mdc-ripple-fg-scale, 1));
+      -webkit-animation: 83ms mdc-ripple-fg-opacity-out;
+              animation: 83ms mdc-ripple-fg-opacity-out; }
+  .mdc-button.mdc-button--accent {
+    --mdc-ripple-surface-width: 0;
+    --mdc-ripple-surface-height: 0;
+    --mdc-ripple-fg-size: 0;
+    --mdc-ripple-left: 0;
+    --mdc-ripple-top: 0;
+    --mdc-ripple-fg-scale: 1;
+    --mdc-ripple-fg-translate-end: 0;
+    --mdc-ripple-fg-translate-start: 0;
+    will-change: transform, opacity;
+    -webkit-tap-highlight-color: transparent; }
+    .mdc-button.mdc-button--accent:not(.mdc-ripple-upgraded):hover::before, .mdc-button.mdc-button--accent:not(.mdc-ripple-upgraded):focus::before, .mdc-button.mdc-button--accent:not(.mdc-ripple-upgraded):active::after {
+      -webkit-transition-duration: 85ms;
+              transition-duration: 85ms;
+      opacity: .6; }
+    .mdc-button.mdc-button--accent::before {
+      /* @alternate */
+      background-color: rgba(255, 64, 129, 0.12);
+      position: absolute;
+      top: calc(50% - 100%);
+      left: calc(50% - 100%);
+      width: 200%;
+      height: 200%;
+      -webkit-transition: opacity 250ms linear;
+      transition: opacity 250ms linear;
+      border-radius: 50%;
+      opacity: 0;
+      pointer-events: none;
+      content: ""; }
+      @supports (background-color: color(green a(10%))) {
+        .mdc-button.mdc-button--accent::before {
+          background-color: color(var(--mdc-theme-accent, #ff4081) a(12%)); } }
+    .mdc-button.mdc-button--accent.mdc-ripple-upgraded::before {
+      top: calc(50% - 100%);
+      left: calc(50% - 100%);
+      width: 200%;
+      height: 200%;
+      /* @alternate */
+      -webkit-transform: scale(0);
+              transform: scale(0);
+      -webkit-transform: scale(var(--mdc-ripple-fg-scale, 0));
+              transform: scale(var(--mdc-ripple-fg-scale, 0)); }
+    .mdc-button.mdc-button--accent.mdc-ripple-upgraded--background-focused::before {
+      opacity: .99999; }
+    .mdc-button.mdc-button--accent.mdc-ripple-upgraded--background-active-fill::before {
+      -webkit-transition-duration: 120ms;
+              transition-duration: 120ms;
+      opacity: 1; }
+    .mdc-button.mdc-button--accent.mdc-ripple-upgraded--unbounded::before {
+      /* @alternate */
+      top: calc(50% - 50%);
+      top: var(--mdc-ripple-top, calc(50% - 50%));
+      /* @alternate */
+      left: calc(50% - 50%);
+      left: var(--mdc-ripple-left, calc(50% - 50%));
+      /* @alternate */
+      width: 100%;
+      width: var(--mdc-ripple-fg-size, 100%);
+      /* @alternate */
+      height: 100%;
+      height: var(--mdc-ripple-fg-size, 100%);
+      /* @alternate */
+      -webkit-transform: scale(0);
+              transform: scale(0);
+      -webkit-transform: scale(var(--mdc-ripple-fg-scale, 0));
+              transform: scale(var(--mdc-ripple-fg-scale, 0)); }
+    .mdc-button.mdc-button--accent::after {
+      /* @alternate */
+      background-color: rgba(255, 64, 129, 0.12);
+      position: absolute;
+      top: calc(50% - 100%);
+      left: calc(50% - 100%);
+      width: 200%;
+      height: 200%;
+      -webkit-transition: opacity 250ms linear;
+      transition: opacity 250ms linear;
+      border-radius: 50%;
+      opacity: 0;
+      pointer-events: none;
+      content: ""; }
+      @supports (background-color: color(green a(10%))) {
+        .mdc-button.mdc-button--accent::after {
+          background-color: color(var(--mdc-theme-accent, #ff4081) a(12%)); } }
+    .mdc-button.mdc-button--accent.mdc-ripple-upgraded::after {
+      top: 0;
+      left: 0;
+      /* @alternate */
+      width: 100%;
+      width: var(--mdc-ripple-fg-size, 100%);
+      /* @alternate */
+      height: 100%;
+      height: var(--mdc-ripple-fg-size, 100%);
+      -webkit-transform: scale(0);
+              transform: scale(0);
+      -webkit-transform-origin: center center;
+              transform-origin: center center;
+      opacity: 0; }
+    .mdc-button.mdc-button--accent:not(.mdc-ripple-upgraded--unbounded)::after {
+      -webkit-transform-origin: center center;
+              transform-origin: center center; }
+    .mdc-button.mdc-button--accent.mdc-ripple-upgraded--unbounded::after {
+      /* @alternate */
+      top: 0;
+      top: var(--mdc-ripple-top, 0);
+      /* @alternate */
+      left: 0;
+      left: var(--mdc-ripple-left, 0);
+      /* @alternate */
+      width: 100%;
+      width: var(--mdc-ripple-fg-size, 100%);
+      /* @alternate */
+      height: 100%;
+      height: var(--mdc-ripple-fg-size, 100%);
+      -webkit-transform: scale(0);
+              transform: scale(0);
+      -webkit-transform-origin: center center;
+              transform-origin: center center; }
+    .mdc-button.mdc-button--accent.mdc-ripple-upgraded--foreground-activation::after {
+      -webkit-animation: 300ms mdc-ripple-fg-radius-in forwards, 83ms mdc-ripple-fg-opacity-in forwards;
+              animation: 300ms mdc-ripple-fg-radius-in forwards, 83ms mdc-ripple-fg-opacity-in forwards; }
+    .mdc-button.mdc-button--accent.mdc-ripple-upgraded--foreground-deactivation::after {
+      -webkit-transform: translate(var(--mdc-ripple-fg-translate-end, 0)) scale(var(--mdc-ripple-fg-scale, 1));
+              transform: translate(var(--mdc-ripple-fg-translate-end, 0)) scale(var(--mdc-ripple-fg-scale, 1));
+      -webkit-animation: 83ms mdc-ripple-fg-opacity-out;
+              animation: 83ms mdc-ripple-fg-opacity-out; }
+  .mdc-button:active {
+    outline: none; }
+  .mdc-button:hover {
+    cursor: pointer; }
+  .mdc-button::-moz-focus-inner {
+    padding: 0;
+    border: 0; }
+  .mdc-button--dense {
+    height: 32px;
+    font-size: .8125rem;
+    line-height: 32px; }
+  .mdc-button--raised {
+    -webkit-box-shadow: 0px 3px 1px -2px rgba(0, 0, 0, 0.2), 0px 2px 2px 0px rgba(0, 0, 0, 0.14), 0px 1px 5px 0px rgba(0, 0, 0, 0.12);
+            box-shadow: 0px 3px 1px -2px rgba(0, 0, 0, 0.2), 0px 2px 2px 0px rgba(0, 0, 0, 0.14), 0px 1px 5px 0px rgba(0, 0, 0, 0.12);
+    -webkit-transition: -webkit-box-shadow 280ms cubic-bezier(0.4, 0, 0.2, 1);
+    transition: -webkit-box-shadow 280ms cubic-bezier(0.4, 0, 0.2, 1);
+    transition: box-shadow 280ms cubic-bezier(0.4, 0, 0.2, 1);
+    transition: box-shadow 280ms cubic-bezier(0.4, 0, 0.2, 1), -webkit-box-shadow 280ms cubic-bezier(0.4, 0, 0.2, 1);
+    will-change: box-shadow;
+    min-width: 88px; }
+    .mdc-button--raised:active {
+      -webkit-box-shadow: 0px 5px 5px -3px rgba(0, 0, 0, 0.2), 0px 8px 10px 1px rgba(0, 0, 0, 0.14), 0px 3px 14px 2px rgba(0, 0, 0, 0.12);
+              box-shadow: 0px 5px 5px -3px rgba(0, 0, 0, 0.2), 0px 8px 10px 1px rgba(0, 0, 0, 0.14), 0px 3px 14px 2px rgba(0, 0, 0, 0.12); }
+    .mdc-button--raised.mdc-button--primary {
+      --mdc-ripple-surface-width: 0;
+      --mdc-ripple-surface-height: 0;
+      --mdc-ripple-fg-size: 0;
+      --mdc-ripple-left: 0;
+      --mdc-ripple-top: 0;
+      --mdc-ripple-fg-scale: 1;
+      --mdc-ripple-fg-translate-end: 0;
+      --mdc-ripple-fg-translate-start: 0;
+      will-change: transform, opacity;
+      -webkit-tap-highlight-color: transparent; }
+      .mdc-button--raised.mdc-button--primary:not(.mdc-ripple-upgraded):hover::before, .mdc-button--raised.mdc-button--primary:not(.mdc-ripple-upgraded):focus::before, .mdc-button--raised.mdc-button--primary:not(.mdc-ripple-upgraded):active::after {
+        -webkit-transition-duration: 85ms;
+                transition-duration: 85ms;
+        opacity: .6; }
+      .mdc-button--raised.mdc-button--primary::before {
+        background-color: rgba(255, 255, 255, 0.14);
+        position: absolute;
+        top: calc(50% - 100%);
+        left: calc(50% - 100%);
+        width: 200%;
+        height: 200%;
+        -webkit-transition: opacity 250ms linear;
+        transition: opacity 250ms linear;
+        border-radius: 50%;
+        opacity: 0;
+        pointer-events: none;
+        content: ""; }
+      .mdc-button--raised.mdc-button--primary.mdc-ripple-upgraded::before {
+        top: calc(50% - 100%);
+        left: calc(50% - 100%);
+        width: 200%;
+        height: 200%;
+        /* @alternate */
+        -webkit-transform: scale(0);
+                transform: scale(0);
+        -webkit-transform: scale(var(--mdc-ripple-fg-scale, 0));
+                transform: scale(var(--mdc-ripple-fg-scale, 0)); }
+      .mdc-button--raised.mdc-button--primary.mdc-ripple-upgraded--background-focused::before {
+        opacity: .99999; }
+      .mdc-button--raised.mdc-button--primary.mdc-ripple-upgraded--background-active-fill::before {
+        -webkit-transition-duration: 120ms;
+                transition-duration: 120ms;
+        opacity: 1; }
+      .mdc-button--raised.mdc-button--primary.mdc-ripple-upgraded--unbounded::before {
+        /* @alternate */
+        top: calc(50% - 50%);
+        top: var(--mdc-ripple-top, calc(50% - 50%));
+        /* @alternate */
+        left: calc(50% - 50%);
+        left: var(--mdc-ripple-left, calc(50% - 50%));
+        /* @alternate */
+        width: 100%;
+        width: var(--mdc-ripple-fg-size, 100%);
+        /* @alternate */
+        height: 100%;
+        height: var(--mdc-ripple-fg-size, 100%);
+        /* @alternate */
+        -webkit-transform: scale(0);
+                transform: scale(0);
+        -webkit-transform: scale(var(--mdc-ripple-fg-scale, 0));
+                transform: scale(var(--mdc-ripple-fg-scale, 0)); }
+      .mdc-button--raised.mdc-button--primary::after {
+        background-color: rgba(255, 255, 255, 0.14);
+        position: absolute;
+        top: calc(50% - 100%);
+        left: calc(50% - 100%);
+        width: 200%;
+        height: 200%;
+        -webkit-transition: opacity 250ms linear;
+        transition: opacity 250ms linear;
+        border-radius: 50%;
+        opacity: 0;
+        pointer-events: none;
+        content: ""; }
+      .mdc-button--raised.mdc-button--primary.mdc-ripple-upgraded::after {
+        top: 0;
+        left: 0;
+        /* @alternate */
+        width: 100%;
+        width: var(--mdc-ripple-fg-size, 100%);
+        /* @alternate */
+        height: 100%;
+        height: var(--mdc-ripple-fg-size, 100%);
+        -webkit-transform: scale(0);
+                transform: scale(0);
+        -webkit-transform-origin: center center;
+                transform-origin: center center;
+        opacity: 0; }
+      .mdc-button--raised.mdc-button--primary:not(.mdc-ripple-upgraded--unbounded)::after {
+        -webkit-transform-origin: center center;
+                transform-origin: center center; }
+      .mdc-button--raised.mdc-button--primary.mdc-ripple-upgraded--unbounded::after {
+        /* @alternate */
+        top: 0;
+        top: var(--mdc-ripple-top, 0);
+        /* @alternate */
+        left: 0;
+        left: var(--mdc-ripple-left, 0);
+        /* @alternate */
+        width: 100%;
+        width: var(--mdc-ripple-fg-size, 100%);
+        /* @alternate */
+        height: 100%;
+        height: var(--mdc-ripple-fg-size, 100%);
+        -webkit-transform: scale(0);
+                transform: scale(0);
+        -webkit-transform-origin: center center;
+                transform-origin: center center; }
+      .mdc-button--raised.mdc-button--primary.mdc-ripple-upgraded--foreground-activation::after {
+        -webkit-animation: 300ms mdc-ripple-fg-radius-in forwards, 83ms mdc-ripple-fg-opacity-in forwards;
+                animation: 300ms mdc-ripple-fg-radius-in forwards, 83ms mdc-ripple-fg-opacity-in forwards; }
+      .mdc-button--raised.mdc-button--primary.mdc-ripple-upgraded--foreground-deactivation::after {
+        -webkit-transform: translate(var(--mdc-ripple-fg-translate-end, 0)) scale(var(--mdc-ripple-fg-scale, 1));
+                transform: translate(var(--mdc-ripple-fg-translate-end, 0)) scale(var(--mdc-ripple-fg-scale, 1));
+        -webkit-animation: 83ms mdc-ripple-fg-opacity-out;
+                animation: 83ms mdc-ripple-fg-opacity-out; }
+    .mdc-button--raised.mdc-button--accent {
+      --mdc-ripple-surface-width: 0;
+      --mdc-ripple-surface-height: 0;
+      --mdc-ripple-fg-size: 0;
+      --mdc-ripple-left: 0;
+      --mdc-ripple-top: 0;
+      --mdc-ripple-fg-scale: 1;
+      --mdc-ripple-fg-translate-end: 0;
+      --mdc-ripple-fg-translate-start: 0;
+      will-change: transform, opacity;
+      -webkit-tap-highlight-color: transparent; }
+      .mdc-button--raised.mdc-button--accent:not(.mdc-ripple-upgraded):hover::before, .mdc-button--raised.mdc-button--accent:not(.mdc-ripple-upgraded):focus::before, .mdc-button--raised.mdc-button--accent:not(.mdc-ripple-upgraded):active::after {
+        -webkit-transition-duration: 85ms;
+                transition-duration: 85ms;
+        opacity: .6; }
+      .mdc-button--raised.mdc-button--accent::before {
+        background-color: rgba(255, 255, 255, 0.14);
+        position: absolute;
+        top: calc(50% - 100%);
+        left: calc(50% - 100%);
+        width: 200%;
+        height: 200%;
+        -webkit-transition: opacity 250ms linear;
+        transition: opacity 250ms linear;
+        border-radius: 50%;
+        opacity: 0;
+        pointer-events: none;
+        content: ""; }
+      .mdc-button--raised.mdc-button--accent.mdc-ripple-upgraded::before {
+        top: calc(50% - 100%);
+        left: calc(50% - 100%);
+        width: 200%;
+        height: 200%;
+        /* @alternate */
+        -webkit-transform: scale(0);
+                transform: scale(0);
+        -webkit-transform: scale(var(--mdc-ripple-fg-scale, 0));
+                transform: scale(var(--mdc-ripple-fg-scale, 0)); }
+      .mdc-button--raised.mdc-button--accent.mdc-ripple-upgraded--background-focused::before {
+        opacity: .99999; }
+      .mdc-button--raised.mdc-button--accent.mdc-ripple-upgraded--background-active-fill::before {
+        -webkit-transition-duration: 120ms;
+                transition-duration: 120ms;
+        opacity: 1; }
+      .mdc-button--raised.mdc-button--accent.mdc-ripple-upgraded--unbounded::before {
+        /* @alternate */
+        top: calc(50% - 50%);
+        top: var(--mdc-ripple-top, calc(50% - 50%));
+        /* @alternate */
+        left: calc(50% - 50%);
+        left: var(--mdc-ripple-left, calc(50% - 50%));
+        /* @alternate */
+        width: 100%;
+        width: var(--mdc-ripple-fg-size, 100%);
+        /* @alternate */
+        height: 100%;
+        height: var(--mdc-ripple-fg-size, 100%);
+        /* @alternate */
+        -webkit-transform: scale(0);
+                transform: scale(0);
+        -webkit-transform: scale(var(--mdc-ripple-fg-scale, 0));
+                transform: scale(var(--mdc-ripple-fg-scale, 0)); }
+      .mdc-button--raised.mdc-button--accent::after {
+        background-color: rgba(255, 255, 255, 0.14);
+        position: absolute;
+        top: calc(50% - 100%);
+        left: calc(50% - 100%);
+        width: 200%;
+        height: 200%;
+        -webkit-transition: opacity 250ms linear;
+        transition: opacity 250ms linear;
+        border-radius: 50%;
+        opacity: 0;
+        pointer-events: none;
+        content: ""; }
+      .mdc-button--raised.mdc-button--accent.mdc-ripple-upgraded::after {
+        top: 0;
+        left: 0;
+        /* @alternate */
+        width: 100%;
+        width: var(--mdc-ripple-fg-size, 100%);
+        /* @alternate */
+        height: 100%;
+        height: var(--mdc-ripple-fg-size, 100%);
+        -webkit-transform: scale(0);
+                transform: scale(0);
+        -webkit-transform-origin: center center;
+                transform-origin: center center;
+        opacity: 0; }
+      .mdc-button--raised.mdc-button--accent:not(.mdc-ripple-upgraded--unbounded)::after {
+        -webkit-transform-origin: center center;
+                transform-origin: center center; }
+      .mdc-button--raised.mdc-button--accent.mdc-ripple-upgraded--unbounded::after {
+        /* @alternate */
+        top: 0;
+        top: var(--mdc-ripple-top, 0);
+        /* @alternate */
+        left: 0;
+        left: var(--mdc-ripple-left, 0);
+        /* @alternate */
+        width: 100%;
+        width: var(--mdc-ripple-fg-size, 100%);
+        /* @alternate */
+        height: 100%;
+        height: var(--mdc-ripple-fg-size, 100%);
+        -webkit-transform: scale(0);
+                transform: scale(0);
+        -webkit-transform-origin: center center;
+                transform-origin: center center; }
+      .mdc-button--raised.mdc-button--accent.mdc-ripple-upgraded--foreground-activation::after {
+        -webkit-animation: 300ms mdc-ripple-fg-radius-in forwards, 83ms mdc-ripple-fg-opacity-in forwards;
+                animation: 300ms mdc-ripple-fg-radius-in forwards, 83ms mdc-ripple-fg-opacity-in forwards; }
+      .mdc-button--raised.mdc-button--accent.mdc-ripple-upgraded--foreground-deactivation::after {
+        -webkit-transform: translate(var(--mdc-ripple-fg-translate-end, 0)) scale(var(--mdc-ripple-fg-scale, 1));
+                transform: translate(var(--mdc-ripple-fg-translate-end, 0)) scale(var(--mdc-ripple-fg-scale, 1));
+        -webkit-animation: 83ms mdc-ripple-fg-opacity-out;
+                animation: 83ms mdc-ripple-fg-opacity-out; }
+    .mdc-button--theme-dark .mdc-button--raised,
+    .mdc-theme--dark .mdc-button--raised {
+      /* @alternate */
+      background-color: #3f51b5;
+      background-color: var(--mdc-theme-primary, #3f51b5);
+      /* @alternate */
+      color: white;
+      color: var(--mdc-theme-text-primary-on-primary, white); }
+      .mdc-button--theme-dark .mdc-button--raised::before,
+      .mdc-theme--dark .mdc-button--raised::before {
+        color: black; }
+  .mdc-button--primary {
+    /* @alternate */
+    color: #3f51b5;
+    color: var(--mdc-theme-primary, #3f51b5); }
+    .mdc-button--theme-dark .mdc-button--primary,
+    .mdc-theme--dark .mdc-button--primary {
+      /* @alternate */
+      color: #3f51b5;
+      color: var(--mdc-theme-primary, #3f51b5); }
+    .mdc-button--primary.mdc-button--raised {
+      /* @alternate */
+      background-color: #3f51b5;
+      background-color: var(--mdc-theme-primary, #3f51b5);
+      /* @alternate */
+      color: white;
+      color: var(--mdc-theme-text-primary-on-primary, white); }
+      .mdc-button--primary.mdc-button--raised::before {
+        color: black; }
+  .mdc-button--accent {
+    /* @alternate */
+    color: #ff4081;
+    color: var(--mdc-theme-accent, #ff4081); }
+    .mdc-button--theme-dark .mdc-button--accent,
+    .mdc-theme--dark .mdc-button--accent {
+      /* @alternate */
+      color: #ff4081;
+      color: var(--mdc-theme-accent, #ff4081); }
+    .mdc-button--accent.mdc-button--raised {
+      /* @alternate */
+      background-color: #ff4081;
+      background-color: var(--mdc-theme-accent, #ff4081);
+      /* @alternate */
+      color: white;
+      color: var(--mdc-theme-text-primary-on-accent, white); }
+      .mdc-button--accent.mdc-button--raised::before {
+        color: black; }
+  .mdc-button--compact {
+    padding: 0 8px; }
+  fieldset:disabled .mdc-button, .mdc-button:disabled {
+    color: rgba(0, 0, 0, 0.26);
+    cursor: default;
+    pointer-events: none; }
+    .mdc-button--theme-dark fieldset:disabled .mdc-button,
+    .mdc-theme--dark fieldset:disabled .mdc-button, .mdc-button--theme-dark .mdc-button:disabled,
+    .mdc-theme--dark .mdc-button:disabled {
+      color: rgba(255, 255, 255, 0.3); }
+  fieldset:disabled .mdc-button--raised, .mdc-button--raised:disabled {
+    -webkit-box-shadow: 0px 0px 0px 0px rgba(0, 0, 0, 0.2), 0px 0px 0px 0px rgba(0, 0, 0, 0.14), 0px 0px 0px 0px rgba(0, 0, 0, 0.12);
+            box-shadow: 0px 0px 0px 0px rgba(0, 0, 0, 0.2), 0px 0px 0px 0px rgba(0, 0, 0, 0.14), 0px 0px 0px 0px rgba(0, 0, 0, 0.12);
+    background-color: rgba(0, 0, 0, 0.12);
+    pointer-events: none; }
+    .mdc-button--theme-dark fieldset:disabled .mdc-button--raised,
+    .mdc-theme--dark fieldset:disabled .mdc-button--raised, .mdc-button--theme-dark .mdc-button--raised:disabled,
+    .mdc-theme--dark .mdc-button--raised:disabled {
+      background-color: rgba(255, 255, 255, 0.12); }
+
+/**
+ * The css property used for elevation. In most cases this should not be changed. It is exposed
+ * as a variable for abstraction / easy use when needing to reference the property directly, for
+ * example in a `will-change` rule.
+ */
+/**
+ * The default duration value for elevation transitions.
+ */
+/**
+ * The default easing value for elevation transitions.
+ */
+/**
+ * Applies the correct css rules to an element to give it the elevation specified by $z-value.
+ * The $z-value must be between 0 and 24.
+ */
+/**
+ * Returns a string that can be used as the value for a `transition` property for elevation.
+ * Calling this function directly is useful in situations where a component needs to transition
+ * more than one property.
+ *
+ * ```scss
+ * .foo {
+ *   transition: mdc-elevation-transition-rule(), opacity 100ms ease;
+ *   will-change: $mdc-elevation-property, opacity;
+ * }
+ * ```
+ */
+/**
+ * Applies the correct css rules needed to have an element transition between elevations.
+ * This mixin should be applied to elements whose elevation values will change depending on their
+ * context (e.g. when active or disabled).
+ */
+/*
+  Precomputed linear color channel values, for use in contrast calculations.
+  See https://www.w3.org/TR/WCAG20-TECHS/G17.html#G17-tests
+
+  Algorithm, for c in 0 to 255:
+  f(c) {
+    c = c / 255;
+    return c < 0.03928 ? c / 12.92 : Math.pow((c + 0.055) / 1.055, 2.4);
+  }
+
+  This lookup table is needed since there is no `pow` in SASS.
+*/
+/**
+ * Calculate the luminance for a color.
+ * See https://www.w3.org/TR/WCAG20-TECHS/G17.html#G17-tests
+ */
+/**
+ * Calculate the contrast ratio between two colors.
+ * See https://www.w3.org/TR/WCAG20-TECHS/G17.html#G17-tests
+ */
+/**
+ * Determine whether to use dark or light text on top of given color.
+ * Returns "dark" for dark text and "light" for light text.
+ */
+/*
+  Main theme colors.
+  If you're a user customizing your color scheme in SASS, these are probably the only variables you need to change.
+*/
+/* Indigo 500 */
+/* Pink A200 */
+/* White */
+/* Which set of text colors to use for each main theme color (light or dark) */
+/* Text colors according to light vs dark and text type */
+/* Primary text colors for each of the theme colors */
+/**
+ * Applies the correct theme color style to the specified property.
+ * $property is typically color or background-color, but can be any CSS property that accepts color values.
+ * $style should be one of the map keys in $mdc-theme-property-values (_variables.scss).
+ */
+/**
+ * Creates a rule to be used in MDC-Web components for dark theming, and applies the provided contents.
+ * Should provide the $root-selector option if applied to anything other than the root selector.
+ * When used with a modifier class, provide a second argument of `true` for the $compound parameter
+ * to specify that this should be attached as a compound class.
+ *
+ * Usage example:
+ *
+ * ```scss
+ * .mdc-foo {
+ *   color: black;
+ *
+ *   @include mdc-theme-dark {
+ *     color: white;
+ *   }
+ *
+ *   &__bar {
+ *     background: black;
+ *
+ *     @include mdc-theme-dark(".mdc-foo") {
+ *       background: white;
+ *     }
+ *   }
+ * }
+ *
+ * .mdc-foo--disabled {
+ *   opacity: .38;
+ *
+ *   @include mdc-theme-dark(".mdc-foo", true) {
+ *     opacity: .5;
+ *   }
+ * }
+ * ```
+ */
+/* TODO(sgomes): Figure out what to do about desktop font sizes. */
+/* TODO(sgomes): Figure out what to do about i18n and i18n font sizes. */
+/**
+ * Creates a rule that will be applied when an MDC-Web component is within the context of an RTL layout.
+ *
+ * Usage Example:
+ * ```scss
+ * .mdc-foo {
+ *   position: absolute;
+ *   left: 0;
+ *
+ *   @include mdc-rtl {
+ *     left: auto;
+ *     right: 0;
+ *   }
+ *
+ *   &__bar {
+ *     margin-left: 4px;
+ *     @include mdc-rtl(".mdc-foo") {
+ *       margin-left: auto;
+ *       margin-right: 4px;
+ *     }
+ *   }
+ * }
+ *
+ * .mdc-foo--mod {
+ *   padding-left: 4px;
+ *
+ *   @include mdc-rtl {
+ *     padding-left: auto;
+ *     padding-right: 4px;
+ *   }
+ * }
+ * ```
+ *
+ * Note that this works by checking for [dir="rtl"] on an ancestor element. While this will work
+ * in most cases, it will in some cases lead to false negatives, e.g.
+ *
+ * ```html
+ * <html dir="rtl">
+ *   <!-- ... -->
+ *   <div dir="ltr">
+ *     <div class="mdc-foo">Styled incorrectly as RTL!</div>
+ *   </div>
+ * </html>
+ * ```
+ *
+ * In the future, selectors such as :dir (http://mdn.io/:dir) will help us mitigate this.
+ */
+/**
+ * Takes a base box-model property - e.g. margin / border / padding - along with a default
+ * direction and value, and emits rules which apply the value to the
+ * "<base-property>-<default-direction>" property by default, but flips the direction
+ * when within an RTL context.
+ *
+ * For example:
+ *
+ * ```scss
+ * .mdc-foo {
+ *   @include mdc-rtl-reflexive-box(margin, left, 8px);
+ * }
+ * ```
+ * is equivalent to:
+ *
+ * ```scss
+ * .mdc-foo {
+ *   margin-left: 8px;
+ *
+ *   @include mdc-rtl {
+ *     margin-right: 8px;
+ *     margin-left: 0;
+ *   }
+ * }
+ * ```
+ * whereas:
+ *
+ * ```scss
+ * .mdc-foo {
+ *   @include mdc-rtl-reflexive-box(margin, right, 8px);
+ * }
+ * ```
+ * is equivalent to:
+ *
+ * ```scss
+ * .mdc-foo {
+ *   margin-right: 8px;
+ *
+ *   @include mdc-rtl {
+ *     margin-right: 0;
+ *     margin-left: 8px;
+ *   }
+ * }
+ * ```
+ *
+ * You can also pass a 4th optional $root-selector argument which will be forwarded to `mdc-rtl`,
+ * e.g. `@include mdc-rtl-reflexive-box(margin, left, 8px, ".mdc-component")`.
+ *
+ * Note that this function will always zero out the original value in an RTL context. If you're
+ * trying to flip the values, use mdc-rtl-reflexive-property().
+ */
+/**
+ * Takes a base property and emits rules that assign <base-property>-left to <left-value> and
+ * <base-property>-right to <right-value> in a LTR context, and vice versa in a RTL context.
+ * For example:
+ *
+ * ```scss
+ * .mdc-foo {
+ *   @include mdc-rtl-reflexive-property(margin, auto, 12px);
+ * }
+ * ```
+ * is equivalent to:
+ *
+ * ```scss
+ * .mdc-foo {
+ *   margin-left: auto;
+ *   margin-right: 12px;
+ *
+ *   @include mdc-rtl {
+ *     margin-left: 12px;
+ *     margin-right: auto;
+ *   }
+ * }
+ * ```
+ *
+ * A 4th optional $root-selector argument can be given, which will be passed to `mdc-rtl`.
+ */
+/**
+ * Takes an argument specifying a horizontal position property (either "left" or "right") as well
+ * as a value, and applies that value to the specified position in a LTR context, and flips it in a
+ * RTL context. For example:
+ *
+ * ```scss
+ * .mdc-foo {
+ *   @include mdc-rtl-reflexive-position(left, 0);
+ *   position: absolute;
+ * }
+ * ```
+ * is equivalent to:
+ *
+ * ```scss
+ *  .mdc-foo {
+ *    position: absolute;
+ *    left: 0;
+ *    right: initial;
+ *
+ *    @include mdc-rtl {
+ *      right: 0;
+ *      left: initial;
+ *    }
+ *  }
+ * ```
+ * An optional third $root-selector argument may also be given, which is passed to `mdc-rtl`.
+ */
+.mdc-card {
+  -webkit-box-shadow: 0px 3px 1px -2px rgba(0, 0, 0, 0.2), 0px 2px 2px 0px rgba(0, 0, 0, 0.14), 0px 1px 5px 0px rgba(0, 0, 0, 0.12);
+          box-shadow: 0px 3px 1px -2px rgba(0, 0, 0, 0.2), 0px 2px 2px 0px rgba(0, 0, 0, 0.14), 0px 1px 5px 0px rgba(0, 0, 0, 0.12);
+  display: -webkit-box;
+  display: -ms-flexbox;
+  display: flex;
+  -webkit-box-orient: vertical;
+  -webkit-box-direction: normal;
+      -ms-flex-direction: column;
+          flex-direction: column;
+  -webkit-box-pack: end;
+      -ms-flex-pack: end;
+          justify-content: flex-end;
+  padding: 0;
+  -webkit-box-sizing: border-box;
+          box-sizing: border-box;
+  border-radius: 2px;
+  overflow: hidden; }
+  .mdc-card__primary {
+    padding: 16px; }
+    .mdc-card__primary .mdc-card__title--large {
+      padding-top: 8px; }
+    .mdc-card__primary:last-child {
+      padding-bottom: 24px; }
+  .mdc-card__supporting-text {
+    padding: 8px 16px;
+    -webkit-box-sizing: border-box;
+            box-sizing: border-box;
+    font-family: Roboto, sans-serif;
+    -moz-osx-font-smoothing: grayscale;
+    -webkit-font-smoothing: antialiased;
+    font-size: 0.875rem;
+    font-weight: 400;
+    letter-spacing: 0.04em;
+    line-height: 1.25rem;
+    text-decoration: inherit;
+    text-transform: inherit;
+    /* @alternate */
+    color: rgba(0, 0, 0, 0.87);
+    color: var(--mdc-theme-text-primary-on-light, rgba(0, 0, 0, 0.87)); }
+    .mdc-card--theme-dark .mdc-card__supporting-text,
+    .mdc-theme--dark .mdc-card__supporting-text {
+      /* @alternate */
+      color: white;
+      color: var(--mdc-theme-text-primary-on-dark, white); }
+    .mdc-card__primary + .mdc-card__supporting-text {
+      margin-top: -8px;
+      padding-top: 0; }
+    .mdc-card__supporting-text:last-child {
+      padding-bottom: 24px; }
+  .mdc-card__actions {
+    display: -webkit-box;
+    display: -ms-flexbox;
+    display: flex;
+    padding: 8px;
+    -webkit-box-sizing: border-box;
+            box-sizing: border-box; }
+    .mdc-card--theme-dark .mdc-card__actions,
+    .mdc-theme--dark .mdc-card__actions {
+      /* @alternate */
+      color: white;
+      color: var(--mdc-theme-text-primary-on-dark, white); }
+    .mdc-card__actions .mdc-card__action {
+      margin: 0 8px 0 0; }
+      [dir="rtl"] .mdc-card__actions .mdc-card__action, .mdc-card__actions .mdc-card__action[dir="rtl"] {
+        margin: 0 0 0 8px; }
+    .mdc-card__actions .mdc-card__action:last-child {
+      margin-left: 0;
+      margin-right: 0; }
+      [dir="rtl"] .mdc-card__actions .mdc-card__action:last-child, .mdc-card__actions .mdc-card__action:last-child[dir="rtl"] {
+        margin-left: 0;
+        margin-right: 0; }
+    .mdc-card__actions--vertical {
+      -webkit-box-orient: vertical;
+      -webkit-box-direction: normal;
+          -ms-flex-flow: column;
+              flex-flow: column;
+      -webkit-box-align: start;
+          -ms-flex-align: start;
+              align-items: flex-start; }
+      .mdc-card__actions--vertical .mdc-card__action {
+        margin: 0 0 4px; }
+      .mdc-card__actions--vertical .mdc-card__action:last-child {
+        margin-bottom: 0; }
+  .mdc-card__media {
+    display: -webkit-box;
+    display: -ms-flexbox;
+    display: flex;
+    -webkit-box-orient: vertical;
+    -webkit-box-direction: normal;
+        -ms-flex-direction: column;
+            flex-direction: column;
+    -webkit-box-pack: end;
+        -ms-flex-pack: end;
+            justify-content: flex-end;
+    padding: 16px;
+    -webkit-box-sizing: border-box;
+            box-sizing: border-box; }
+  .mdc-card__media-item {
+    display: inline-block;
+    width: auto;
+    height: 80px;
+    margin: 16px 0 0;
+    padding: 0; }
+    .mdc-card__media-item--1dot5x {
+      width: auto;
+      height: 120px; }
+    .mdc-card__media-item--2x {
+      width: auto;
+      height: 160px; }
+    .mdc-card__media-item--3x {
+      width: auto;
+      height: 240px; }
+  .mdc-card__title {
+    font-family: Roboto, sans-serif;
+    -moz-osx-font-smoothing: grayscale;
+    -webkit-font-smoothing: antialiased;
+    font-size: 0.875rem;
+    font-weight: 500;
+    letter-spacing: 0.04em;
+    line-height: 1.5rem;
+    text-decoration: inherit;
+    text-transform: inherit;
+    /* @alternate */
+    color: rgba(0, 0, 0, 0.87);
+    color: var(--mdc-theme-text-primary-on-light, rgba(0, 0, 0, 0.87));
+    margin: -.063rem 0; }
+    .mdc-card--theme-dark .mdc-card__title,
+    .mdc-theme--dark .mdc-card__title {
+      /* @alternate */
+      color: white;
+      color: var(--mdc-theme-text-primary-on-dark, white); }
+  .mdc-card__title--large {
+    font-family: Roboto, sans-serif;
+    -moz-osx-font-smoothing: grayscale;
+    -webkit-font-smoothing: antialiased;
+    font-size: 1.5rem;
+    font-weight: 400;
+    letter-spacing: normal;
+    line-height: 2rem;
+    text-decoration: inherit;
+    text-transform: inherit;
+    margin: 0; }
+  .mdc-card__subtitle {
+    font-family: Roboto, sans-serif;
+    -moz-osx-font-smoothing: grayscale;
+    -webkit-font-smoothing: antialiased;
+    font-size: 0.875rem;
+    font-weight: 400;
+    letter-spacing: 0.04em;
+    line-height: 1.25rem;
+    text-decoration: inherit;
+    text-transform: inherit;
+    /* @alternate */
+    color: rgba(0, 0, 0, 0.87);
+    color: var(--mdc-theme-text-primary-on-light, rgba(0, 0, 0, 0.87));
+    margin: -.063rem 0; }
+    .mdc-card--theme-dark .mdc-card__subtitle,
+    .mdc-theme--dark .mdc-card__subtitle {
+      /* @alternate */
+      color: white;
+      color: var(--mdc-theme-text-primary-on-dark, white); }
+  .mdc-card__horizontal-block {
+    display: -webkit-box;
+    display: -ms-flexbox;
+    display: flex;
+    -webkit-box-orient: horizontal;
+    -webkit-box-direction: normal;
+        -ms-flex-direction: row;
+            flex-direction: row;
+    -webkit-box-align: start;
+        -ms-flex-align: start;
+            align-items: flex-start;
+    -webkit-box-pack: justify;
+        -ms-flex-pack: justify;
+            justify-content: space-between;
+    -webkit-box-sizing: border-box;
+            box-sizing: border-box;
+    padding: 0;
+    padding-left: 0;
+    padding-right: 16px; }
+    [dir="rtl"] .mdc-card__horizontal-block, .mdc-card__horizontal-block[dir="rtl"] {
+      padding-left: 16px;
+      padding-right: 0; }
+    .mdc-card__horizontal-block .mdc-card__actions--vertical {
+      margin: 16px; }
+    .mdc-card__horizontal-block .mdc-card__media-item {
+      margin-left: 16px;
+      margin-right: 0; }
+      [dir="rtl"] .mdc-card__horizontal-block .mdc-card__media-item, .mdc-card__horizontal-block .mdc-card__media-item[dir="rtl"] {
+        margin-left: 0;
+        margin-right: 16px; }
+    .mdc-card__horizontal-block .mdc-card__media-item--3x {
+      margin-bottom: 16px; }
+
+/*
+  Precomputed linear color channel values, for use in contrast calculations.
+  See https://www.w3.org/TR/WCAG20-TECHS/G17.html#G17-tests
+
+  Algorithm, for c in 0 to 255:
+  f(c) {
+    c = c / 255;
+    return c < 0.03928 ? c / 12.92 : Math.pow((c + 0.055) / 1.055, 2.4);
+  }
+
+  This lookup table is needed since there is no `pow` in SASS.
+*/
+/**
+ * Calculate the luminance for a color.
+ * See https://www.w3.org/TR/WCAG20-TECHS/G17.html#G17-tests
+ */
+/**
+ * Calculate the contrast ratio between two colors.
+ * See https://www.w3.org/TR/WCAG20-TECHS/G17.html#G17-tests
+ */
+/**
+ * Determine whether to use dark or light text on top of given color.
+ * Returns "dark" for dark text and "light" for light text.
+ */
+/*
+  Main theme colors.
+  If you're a user customizing your color scheme in SASS, these are probably the only variables you need to change.
+*/
+/* Indigo 500 */
+/* Pink A200 */
+/* White */
+/* Which set of text colors to use for each main theme color (light or dark) */
+/* Text colors according to light vs dark and text type */
+/* Primary text colors for each of the theme colors */
+/** MDC Ripple keyframes are split into their own file so that _mixins.scss can rely on them. */
+@keyframes mdc-ripple-fg-radius-in {
+  from {
+    -webkit-transform: translate(var(--mdc-ripple-fg-translate-start, 0)) scale(1);
+            transform: translate(var(--mdc-ripple-fg-translate-start, 0)) scale(1);
+    -webkit-animation-timing-function: cubic-bezier(0.4, 0, 0.2, 1);
+            animation-timing-function: cubic-bezier(0.4, 0, 0.2, 1); }
+  to {
+    -webkit-transform: translate(var(--mdc-ripple-fg-translate-end, 0)) scale(var(--mdc-ripple-fg-scale, 1));
+            transform: translate(var(--mdc-ripple-fg-translate-end, 0)) scale(var(--mdc-ripple-fg-scale, 1)); } }
+
+@keyframes mdc-ripple-fg-opacity-in {
+  from {
+    opacity: 0;
+    -webkit-animation-timing-function: linear;
+            animation-timing-function: linear; }
+  to {
+    opacity: 1; } }
+
+@keyframes mdc-ripple-fg-opacity-out {
+  from {
+    opacity: 1;
+    -webkit-animation-timing-function: linear;
+            animation-timing-function: linear; }
+  to {
+    opacity: 0; } }
+
+/**
+ * Creates a rule that will be applied when an MDC-Web component is within the context of an RTL layout.
+ *
+ * Usage Example:
+ * ```scss
+ * .mdc-foo {
+ *   position: absolute;
+ *   left: 0;
+ *
+ *   @include mdc-rtl {
+ *     left: auto;
+ *     right: 0;
+ *   }
+ *
+ *   &__bar {
+ *     margin-left: 4px;
+ *     @include mdc-rtl(".mdc-foo") {
+ *       margin-left: auto;
+ *       margin-right: 4px;
+ *     }
+ *   }
+ * }
+ *
+ * .mdc-foo--mod {
+ *   padding-left: 4px;
+ *
+ *   @include mdc-rtl {
+ *     padding-left: auto;
+ *     padding-right: 4px;
+ *   }
+ * }
+ * ```
+ *
+ * Note that this works by checking for [dir="rtl"] on an ancestor element. While this will work
+ * in most cases, it will in some cases lead to false negatives, e.g.
+ *
+ * ```html
+ * <html dir="rtl">
+ *   <!-- ... -->
+ *   <div dir="ltr">
+ *     <div class="mdc-foo">Styled incorrectly as RTL!</div>
+ *   </div>
+ * </html>
+ * ```
+ *
+ * In the future, selectors such as :dir (http://mdn.io/:dir) will help us mitigate this.
+ */
+/**
+ * Takes a base box-model property - e.g. margin / border / padding - along with a default
+ * direction and value, and emits rules which apply the value to the
+ * "<base-property>-<default-direction>" property by default, but flips the direction
+ * when within an RTL context.
+ *
+ * For example:
+ *
+ * ```scss
+ * .mdc-foo {
+ *   @include mdc-rtl-reflexive-box(margin, left, 8px);
+ * }
+ * ```
+ * is equivalent to:
+ *
+ * ```scss
+ * .mdc-foo {
+ *   margin-left: 8px;
+ *
+ *   @include mdc-rtl {
+ *     margin-right: 8px;
+ *     margin-left: 0;
+ *   }
+ * }
+ * ```
+ * whereas:
+ *
+ * ```scss
+ * .mdc-foo {
+ *   @include mdc-rtl-reflexive-box(margin, right, 8px);
+ * }
+ * ```
+ * is equivalent to:
+ *
+ * ```scss
+ * .mdc-foo {
+ *   margin-right: 8px;
+ *
+ *   @include mdc-rtl {
+ *     margin-right: 0;
+ *     margin-left: 8px;
+ *   }
+ * }
+ * ```
+ *
+ * You can also pass a 4th optional $root-selector argument which will be forwarded to `mdc-rtl`,
+ * e.g. `@include mdc-rtl-reflexive-box(margin, left, 8px, ".mdc-component")`.
+ *
+ * Note that this function will always zero out the original value in an RTL context. If you're
+ * trying to flip the values, use mdc-rtl-reflexive-property().
+ */
+/**
+ * Takes a base property and emits rules that assign <base-property>-left to <left-value> and
+ * <base-property>-right to <right-value> in a LTR context, and vice versa in a RTL context.
+ * For example:
+ *
+ * ```scss
+ * .mdc-foo {
+ *   @include mdc-rtl-reflexive-property(margin, auto, 12px);
+ * }
+ * ```
+ * is equivalent to:
+ *
+ * ```scss
+ * .mdc-foo {
+ *   margin-left: auto;
+ *   margin-right: 12px;
+ *
+ *   @include mdc-rtl {
+ *     margin-left: 12px;
+ *     margin-right: auto;
+ *   }
+ * }
+ * ```
+ *
+ * A 4th optional $root-selector argument can be given, which will be passed to `mdc-rtl`.
+ */
+/**
+ * Takes an argument specifying a horizontal position property (either "left" or "right") as well
+ * as a value, and applies that value to the specified position in a LTR context, and flips it in a
+ * RTL context. For example:
+ *
+ * ```scss
+ * .mdc-foo {
+ *   @include mdc-rtl-reflexive-position(left, 0);
+ *   position: absolute;
+ * }
+ * ```
+ * is equivalent to:
+ *
+ * ```scss
+ *  .mdc-foo {
+ *    position: absolute;
+ *    left: 0;
+ *    right: initial;
+ *
+ *    @include mdc-rtl {
+ *      right: 0;
+ *      left: initial;
+ *    }
+ *  }
+ * ```
+ * An optional third $root-selector argument may also be given, which is passed to `mdc-rtl`.
+ */
+/* Manual calculation done on SVG */
+/*
+  Precomputed linear color channel values, for use in contrast calculations.
+  See https://www.w3.org/TR/WCAG20-TECHS/G17.html#G17-tests
+
+  Algorithm, for c in 0 to 255:
+  f(c) {
+    c = c / 255;
+    return c < 0.03928 ? c / 12.92 : Math.pow((c + 0.055) / 1.055, 2.4);
+  }
+
+  This lookup table is needed since there is no `pow` in SASS.
+*/
+/**
+ * Calculate the luminance for a color.
+ * See https://www.w3.org/TR/WCAG20-TECHS/G17.html#G17-tests
+ */
+/**
+ * Calculate the contrast ratio between two colors.
+ * See https://www.w3.org/TR/WCAG20-TECHS/G17.html#G17-tests
+ */
+/**
+ * Determine whether to use dark or light text on top of given color.
+ * Returns "dark" for dark text and "light" for light text.
+ */
+/*
+  Main theme colors.
+  If you're a user customizing your color scheme in SASS, these are probably the only variables you need to change.
+*/
+/* Indigo 500 */
+/* Pink A200 */
+/* White */
+/* Which set of text colors to use for each main theme color (light or dark) */
+/* Text colors according to light vs dark and text type */
+/* Primary text colors for each of the theme colors */
+/**
+ * Applies the correct theme color style to the specified property.
+ * $property is typically color or background-color, but can be any CSS property that accepts color values.
+ * $style should be one of the map keys in $mdc-theme-property-values (_variables.scss).
+ */
+/**
+ * Creates a rule to be used in MDC-Web components for dark theming, and applies the provided contents.
+ * Should provide the $root-selector option if applied to anything other than the root selector.
+ * When used with a modifier class, provide a second argument of `true` for the $compound parameter
+ * to specify that this should be attached as a compound class.
+ *
+ * Usage example:
+ *
+ * ```scss
+ * .mdc-foo {
+ *   color: black;
+ *
+ *   @include mdc-theme-dark {
+ *     color: white;
+ *   }
+ *
+ *   &__bar {
+ *     background: black;
+ *
+ *     @include mdc-theme-dark(".mdc-foo") {
+ *       background: white;
+ *     }
+ *   }
+ * }
+ *
+ * .mdc-foo--disabled {
+ *   opacity: .38;
+ *
+ *   @include mdc-theme-dark(".mdc-foo", true) {
+ *     opacity: .5;
+ *   }
+ * }
+ * ```
+ */
+/* Manual calculation done on SVG */
+@-webkit-keyframes mdc-checkbox-fade-in-background {
+  0% {
+    border-color: rgba(0, 0, 0, 0.54);
+    background-color: transparent; }
+  50% {
+    /* @alternate */
+    border-color: #3f51b5;
+    border-color: var(--mdc-theme-primary, #3f51b5);
+    /* @alternate */
+    background-color: #3f51b5;
+    background-color: var(--mdc-theme-primary, #3f51b5); } }
+@keyframes mdc-checkbox-fade-in-background {
+  0% {
+    border-color: rgba(0, 0, 0, 0.54);
+    background-color: transparent; }
+  50% {
+    /* @alternate */
+    border-color: #3f51b5;
+    border-color: var(--mdc-theme-primary, #3f51b5);
+    /* @alternate */
+    background-color: #3f51b5;
+    background-color: var(--mdc-theme-primary, #3f51b5); } }
+
+@-webkit-keyframes mdc-checkbox-fade-out-background {
+  0%,
+  80% {
+    /* @alternate */
+    border-color: #3f51b5;
+    border-color: var(--mdc-theme-primary, #3f51b5);
+    /* @alternate */
+    background-color: #3f51b5;
+    background-color: var(--mdc-theme-primary, #3f51b5); }
+  100% {
+    border-color: rgba(0, 0, 0, 0.54);
+    background-color: transparent; } }
+
+@keyframes mdc-checkbox-fade-out-background {
+  0%,
+  80% {
+    /* @alternate */
+    border-color: #3f51b5;
+    border-color: var(--mdc-theme-primary, #3f51b5);
+    /* @alternate */
+    background-color: #3f51b5;
+    background-color: var(--mdc-theme-primary, #3f51b5); }
+  100% {
+    border-color: rgba(0, 0, 0, 0.54);
+    background-color: transparent; } }
+
+@-webkit-keyframes mdc-checkbox-fade-in-background-dark {
+  0% {
+    border-color: white;
+    background-color: transparent; }
+  50% {
+    /* @alternate */
+    border-color: #3f51b5;
+    border-color: var(--mdc-theme-primary, #3f51b5);
+    /* @alternate */
+    background-color: #3f51b5;
+    background-color: var(--mdc-theme-primary, #3f51b5); } }
+
+@keyframes mdc-checkbox-fade-in-background-dark {
+  0% {
+    border-color: white;
+    background-color: transparent; }
+  50% {
+    /* @alternate */
+    border-color: #3f51b5;
+    border-color: var(--mdc-theme-primary, #3f51b5);
+    /* @alternate */
+    background-color: #3f51b5;
+    background-color: var(--mdc-theme-primary, #3f51b5); } }
+
+@-webkit-keyframes mdc-checkbox-fade-out-background-dark {
+  0%,
+  80% {
+    /* @alternate */
+    border-color: #3f51b5;
+    border-color: var(--mdc-theme-primary, #3f51b5);
+    /* @alternate */
+    background-color: #3f51b5;
+    background-color: var(--mdc-theme-primary, #3f51b5); }
+  100% {
+    border-color: white;
+    background-color: transparent; } }
+
+@keyframes mdc-checkbox-fade-out-background-dark {
+  0%,
+  80% {
+    /* @alternate */
+    border-color: #3f51b5;
+    border-color: var(--mdc-theme-primary, #3f51b5);
+    /* @alternate */
+    background-color: #3f51b5;
+    background-color: var(--mdc-theme-primary, #3f51b5); }
+  100% {
+    border-color: white;
+    background-color: transparent; } }
+
+@-webkit-keyframes mdc-checkbox-unchecked-checked-checkmark-path {
+  0%,
+  50% {
+    stroke-dashoffset: 29.78334; }
+  50% {
+    -webkit-animation-timing-function: cubic-bezier(0, 0, 0.2, 1);
+            animation-timing-function: cubic-bezier(0, 0, 0.2, 1); }
+  100% {
+    stroke-dashoffset: 0; } }
+
+@keyframes mdc-checkbox-unchecked-checked-checkmark-path {
+  0%,
+  50% {
+    stroke-dashoffset: 29.78334; }
+  50% {
+    -webkit-animation-timing-function: cubic-bezier(0, 0, 0.2, 1);
+            animation-timing-function: cubic-bezier(0, 0, 0.2, 1); }
+  100% {
+    stroke-dashoffset: 0; } }
+
+@-webkit-keyframes mdc-checkbox-unchecked-indeterminate-mixedmark {
+  0%,
+  68.2% {
+    -webkit-transform: scaleX(0);
+            transform: scaleX(0); }
+  68.2% {
+    -webkit-animation-timing-function: cubic-bezier(0, 0, 0, 1);
+            animation-timing-function: cubic-bezier(0, 0, 0, 1); }
+  100% {
+    -webkit-transform: scaleX(1);
+            transform: scaleX(1); } }
+
+@keyframes mdc-checkbox-unchecked-indeterminate-mixedmark {
+  0%,
+  68.2% {
+    -webkit-transform: scaleX(0);
+            transform: scaleX(0); }
+  68.2% {
+    -webkit-animation-timing-function: cubic-bezier(0, 0, 0, 1);
+            animation-timing-function: cubic-bezier(0, 0, 0, 1); }
+  100% {
+    -webkit-transform: scaleX(1);
+            transform: scaleX(1); } }
+
+@-webkit-keyframes mdc-checkbox-checked-unchecked-checkmark-path {
+  from {
+    -webkit-animation-timing-function: cubic-bezier(0.4, 0, 1, 1);
+            animation-timing-function: cubic-bezier(0.4, 0, 1, 1);
+    opacity: 1;
+    stroke-dashoffset: 0; }
+  to {
+    opacity: 0;
+    stroke-dashoffset: -29.78334; } }
+
+@keyframes mdc-checkbox-checked-unchecked-checkmark-path {
+  from {
+    -webkit-animation-timing-function: cubic-bezier(0.4, 0, 1, 1);
+            animation-timing-function: cubic-bezier(0.4, 0, 1, 1);
+    opacity: 1;
+    stroke-dashoffset: 0; }
+  to {
+    opacity: 0;
+    stroke-dashoffset: -29.78334; } }
+
+@-webkit-keyframes mdc-checkbox-checked-indeterminate-checkmark {
+  from {
+    -webkit-transform: rotate(0deg);
+            transform: rotate(0deg);
+    opacity: 1;
+    -webkit-animation-timing-function: cubic-bezier(0, 0, 0.2, 1);
+            animation-timing-function: cubic-bezier(0, 0, 0.2, 1); }
+  to {
+    -webkit-transform: rotate(45deg);
+            transform: rotate(45deg);
+    opacity: 0; } }
+
+@keyframes mdc-checkbox-checked-indeterminate-checkmark {
+  from {
+    -webkit-transform: rotate(0deg);
+            transform: rotate(0deg);
+    opacity: 1;
+    -webkit-animation-timing-function: cubic-bezier(0, 0, 0.2, 1);
+            animation-timing-function: cubic-bezier(0, 0, 0.2, 1); }
+  to {
+    -webkit-transform: rotate(45deg);
+            transform: rotate(45deg);
+    opacity: 0; } }
+
+@-webkit-keyframes mdc-checkbox-indeterminate-checked-checkmark {
+  from {
+    -webkit-transform: rotate(45deg);
+            transform: rotate(45deg);
+    opacity: 0;
+    -webkit-animation-timing-function: cubic-bezier(0.14, 0, 0, 1);
+            animation-timing-function: cubic-bezier(0.14, 0, 0, 1); }
+  to {
+    -webkit-transform: rotate(360deg);
+            transform: rotate(360deg);
+    opacity: 1; } }
+
+@keyframes mdc-checkbox-indeterminate-checked-checkmark {
+  from {
+    -webkit-transform: rotate(45deg);
+            transform: rotate(45deg);
+    opacity: 0;
+    -webkit-animation-timing-function: cubic-bezier(0.14, 0, 0, 1);
+            animation-timing-function: cubic-bezier(0.14, 0, 0, 1); }
+  to {
+    -webkit-transform: rotate(360deg);
+            transform: rotate(360deg);
+    opacity: 1; } }
+
+@-webkit-keyframes mdc-checkbox-checked-indeterminate-mixedmark {
+  from {
+    -webkit-transform: rotate(-45deg);
+            transform: rotate(-45deg);
+    opacity: 0;
+    -webkit-animation-timing-function: cubic-bezier(0, 0, 0.2, 1);
+            animation-timing-function: cubic-bezier(0, 0, 0.2, 1); }
+  to {
+    -webkit-transform: rotate(0deg);
+            transform: rotate(0deg);
+    opacity: 1; } }
+
+@keyframes mdc-checkbox-checked-indeterminate-mixedmark {
+  from {
+    -webkit-transform: rotate(-45deg);
+            transform: rotate(-45deg);
+    opacity: 0;
+    -webkit-animation-timing-function: cubic-bezier(0, 0, 0.2, 1);
+            animation-timing-function: cubic-bezier(0, 0, 0.2, 1); }
+  to {
+    -webkit-transform: rotate(0deg);
+            transform: rotate(0deg);
+    opacity: 1; } }
+
+@-webkit-keyframes mdc-checkbox-indeterminate-checked-mixedmark {
+  from {
+    -webkit-transform: rotate(0deg);
+            transform: rotate(0deg);
+    opacity: 1;
+    -webkit-animation-timing-function: cubic-bezier(0.14, 0, 0, 1);
+            animation-timing-function: cubic-bezier(0.14, 0, 0, 1); }
+  to {
+    -webkit-transform: rotate(315deg);
+            transform: rotate(315deg);
+    opacity: 0; } }
+
+@keyframes mdc-checkbox-indeterminate-checked-mixedmark {
+  from {
+    -webkit-transform: rotate(0deg);
+            transform: rotate(0deg);
+    opacity: 1;
+    -webkit-animation-timing-function: cubic-bezier(0.14, 0, 0, 1);
+            animation-timing-function: cubic-bezier(0.14, 0, 0, 1); }
+  to {
+    -webkit-transform: rotate(315deg);
+            transform: rotate(315deg);
+    opacity: 0; } }
+
+@-webkit-keyframes mdc-checkbox-indeterminate-unchecked-mixedmark {
+  0% {
+    -webkit-transform: scaleX(1);
+            transform: scaleX(1);
+    opacity: 1;
+    -webkit-animation-timing-function: linear;
+            animation-timing-function: linear; }
+  32.8%,
+  100% {
+    -webkit-transform: scaleX(0);
+            transform: scaleX(0);
+    opacity: 0; } }
+
+@keyframes mdc-checkbox-indeterminate-unchecked-mixedmark {
+  0% {
+    -webkit-transform: scaleX(1);
+            transform: scaleX(1);
+    opacity: 1;
+    -webkit-animation-timing-function: linear;
+            animation-timing-function: linear; }
+  32.8%,
+  100% {
+    -webkit-transform: scaleX(0);
+            transform: scaleX(0);
+    opacity: 0; } }
+
+.mdc-checkbox {
+  --mdc-ripple-surface-width: 0;
+  --mdc-ripple-surface-height: 0;
+  --mdc-ripple-fg-size: 0;
+  --mdc-ripple-left: 0;
+  --mdc-ripple-top: 0;
+  --mdc-ripple-fg-scale: 1;
+  --mdc-ripple-fg-translate-end: 0;
+  --mdc-ripple-fg-translate-start: 0;
+  will-change: transform, opacity;
+  -webkit-tap-highlight-color: transparent;
+  display: inline-block;
+  position: relative;
+  -webkit-box-sizing: content-box;
+          box-sizing: content-box;
+  -webkit-box-flex: 0;
+      -ms-flex: 0 0 18px;
+          flex: 0 0 18px;
+  width: 18px;
+  height: 18px;
+  padding: 11px;
+  line-height: 0;
+  white-space: nowrap;
+  cursor: pointer;
+  vertical-align: bottom; }
+  .mdc-checkbox:not(.mdc-ripple-upgraded):hover::before, .mdc-checkbox:not(.mdc-ripple-upgraded):focus::before, .mdc-checkbox:not(.mdc-ripple-upgraded):active::after {
+    -webkit-transition-duration: 85ms;
+            transition-duration: 85ms;
+    opacity: .6; }
+  .mdc-checkbox::before {
+    /* @alternate */
+    background-color: rgba(63, 81, 181, 0.14);
+    position: absolute;
+    top: calc(50% - 100%);
+    left: calc(50% - 100%);
+    width: 200%;
+    height: 200%;
+    -webkit-transition: opacity 250ms linear;
+    transition: opacity 250ms linear;
+    border-radius: 50%;
+    opacity: 0;
+    pointer-events: none;
+    content: ""; }
+    @supports (background-color: color(green a(10%))) {
+      .mdc-checkbox::before {
+        background-color: color(var(--mdc-theme-primary, #3f51b5) a(14%)); } }
+  .mdc-checkbox.mdc-ripple-upgraded::before {
+    top: calc(50% - 100%);
+    left: calc(50% - 100%);
+    width: 200%;
+    height: 200%;
+    /* @alternate */
+    -webkit-transform: scale(0);
+            transform: scale(0);
+    -webkit-transform: scale(var(--mdc-ripple-fg-scale, 0));
+            transform: scale(var(--mdc-ripple-fg-scale, 0)); }
+  .mdc-checkbox.mdc-ripple-upgraded--background-focused::before {
+    opacity: .99999; }
+  .mdc-checkbox.mdc-ripple-upgraded--background-active-fill::before {
+    -webkit-transition-duration: 120ms;
+            transition-duration: 120ms;
+    opacity: 1; }
+  .mdc-checkbox.mdc-ripple-upgraded--unbounded::before {
+    /* @alternate */
+    top: calc(50% - 50%);
+    top: var(--mdc-ripple-top, calc(50% - 50%));
+    /* @alternate */
+    left: calc(50% - 50%);
+    left: var(--mdc-ripple-left, calc(50% - 50%));
+    /* @alternate */
+    width: 100%;
+    width: var(--mdc-ripple-fg-size, 100%);
+    /* @alternate */
+    height: 100%;
+    height: var(--mdc-ripple-fg-size, 100%);
+    /* @alternate */
+    -webkit-transform: scale(0);
+            transform: scale(0);
+    -webkit-transform: scale(var(--mdc-ripple-fg-scale, 0));
+            transform: scale(var(--mdc-ripple-fg-scale, 0)); }
+  .mdc-checkbox::after {
+    /* @alternate */
+    background-color: rgba(63, 81, 181, 0.14);
+    position: absolute;
+    top: calc(50% - 100%);
+    left: calc(50% - 100%);
+    width: 200%;
+    height: 200%;
+    -webkit-transition: opacity 250ms linear;
+    transition: opacity 250ms linear;
+    border-radius: 50%;
+    opacity: 0;
+    pointer-events: none;
+    content: ""; }
+    @supports (background-color: color(green a(10%))) {
+      .mdc-checkbox::after {
+        background-color: color(var(--mdc-theme-primary, #3f51b5) a(14%)); } }
+  .mdc-checkbox.mdc-ripple-upgraded::after {
+    top: 0;
+    left: 0;
+    /* @alternate */
+    width: 100%;
+    width: var(--mdc-ripple-fg-size, 100%);
+    /* @alternate */
+    height: 100%;
+    height: var(--mdc-ripple-fg-size, 100%);
+    -webkit-transform: scale(0);
+            transform: scale(0);
+    -webkit-transform-origin: center center;
+            transform-origin: center center;
+    opacity: 0; }
+  .mdc-checkbox:not(.mdc-ripple-upgraded--unbounded)::after {
+    -webkit-transform-origin: center center;
+            transform-origin: center center; }
+  .mdc-checkbox.mdc-ripple-upgraded--unbounded::after {
+    /* @alternate */
+    top: 0;
+    top: var(--mdc-ripple-top, 0);
+    /* @alternate */
+    left: 0;
+    left: var(--mdc-ripple-left, 0);
+    /* @alternate */
+    width: 100%;
+    width: var(--mdc-ripple-fg-size, 100%);
+    /* @alternate */
+    height: 100%;
+    height: var(--mdc-ripple-fg-size, 100%);
+    -webkit-transform: scale(0);
+            transform: scale(0);
+    -webkit-transform-origin: center center;
+            transform-origin: center center; }
+  .mdc-checkbox.mdc-ripple-upgraded--foreground-activation::after {
+    -webkit-animation: 300ms mdc-ripple-fg-radius-in forwards, 83ms mdc-ripple-fg-opacity-in forwards;
+            animation: 300ms mdc-ripple-fg-radius-in forwards, 83ms mdc-ripple-fg-opacity-in forwards; }
+  .mdc-checkbox.mdc-ripple-upgraded--foreground-deactivation::after {
+    -webkit-transform: translate(var(--mdc-ripple-fg-translate-end, 0)) scale(var(--mdc-ripple-fg-scale, 1));
+            transform: translate(var(--mdc-ripple-fg-translate-end, 0)) scale(var(--mdc-ripple-fg-scale, 1));
+    -webkit-animation: 83ms mdc-ripple-fg-opacity-out;
+            animation: 83ms mdc-ripple-fg-opacity-out; }
+  .mdc-checkbox::before, .mdc-checkbox::after {
+    top: 0;
+    left: 0;
+    width: 100%;
+    height: 100%; }
+  .mdc-checkbox.mdc-ripple-upgraded--unbounded .mdc-checkbox__background::before {
+    content: none; }
+  .mdc-checkbox__background {
+    position: absolute;
+    top: 0;
+    right: 0;
+    bottom: 0;
+    left: 0;
+    left: 11px;
+    right: initial;
+    display: -webkit-inline-box;
+    display: -ms-inline-flexbox;
+    display: inline-flex;
+    top: 11px;
+    -webkit-box-align: center;
+        -ms-flex-align: center;
+            align-items: center;
+    -webkit-box-pack: center;
+        -ms-flex-pack: center;
+            justify-content: center;
+    -webkit-box-sizing: border-box;
+            box-sizing: border-box;
+    pointer-events: none;
+    width: 45%;
+    height: 45%;
+    -webkit-transition: background-color 90ms 0ms cubic-bezier(0.4, 0, 0.6, 1), border-color 90ms 0ms cubic-bezier(0.4, 0, 0.6, 1);
+    transition: background-color 90ms 0ms cubic-bezier(0.4, 0, 0.6, 1), border-color 90ms 0ms cubic-bezier(0.4, 0, 0.6, 1);
+    border: 2px solid rgba(0, 0, 0, 0.54);
+    border-radius: 2px;
+    background-color: transparent;
+    will-change: background-color, border-color; }
+    [dir="rtl"] .mdc-checkbox .mdc-checkbox__background,
+    .mdc-checkbox[dir="rtl"] .mdc-checkbox__background {
+      left: initial;
+      right: 11px; }
+    .mdc-checkbox--theme-dark .mdc-checkbox__background,
+    .mdc-theme--dark .mdc-checkbox__background {
+      border-color: white; }
+    .mdc-checkbox__background::before {
+      position: absolute;
+      top: 0;
+      right: 0;
+      bottom: 0;
+      left: 0;
+      width: 100%;
+      height: 100%;
+      -webkit-transform: scale(0, 0);
+              transform: scale(0, 0);
+      -webkit-transition: opacity 90ms 0ms cubic-bezier(0.4, 0, 0.6, 1), -webkit-transform 90ms 0ms cubic-bezier(0.4, 0, 0.6, 1);
+      transition: opacity 90ms 0ms cubic-bezier(0.4, 0, 0.6, 1), -webkit-transform 90ms 0ms cubic-bezier(0.4, 0, 0.6, 1);
+      transition: opacity 90ms 0ms cubic-bezier(0.4, 0, 0.6, 1), transform 90ms 0ms cubic-bezier(0.4, 0, 0.6, 1);
+      transition: opacity 90ms 0ms cubic-bezier(0.4, 0, 0.6, 1), transform 90ms 0ms cubic-bezier(0.4, 0, 0.6, 1), -webkit-transform 90ms 0ms cubic-bezier(0.4, 0, 0.6, 1);
+      border-radius: 50%;
+      content: "";
+      opacity: 0;
+      pointer-events: none;
+      will-change: opacity, transform;
+      /* @alternate */
+      background: #3f51b5;
+      background: var(--mdc-theme-primary, #3f51b5); }
+  .mdc-checkbox__native-control {
+    position: absolute;
+    top: 0;
+    left: 0;
+    width: 100%;
+    height: 100%;
+    margin: 0;
+    padding: 0;
+    cursor: inherit;
+    opacity: 0; }
+  .mdc-checkbox__checkmark {
+    position: absolute;
+    top: 0;
+    right: 0;
+    bottom: 0;
+    left: 0;
+    width: 100%;
+    -webkit-transition: opacity 180ms 0ms cubic-bezier(0.4, 0, 0.6, 1);
+    transition: opacity 180ms 0ms cubic-bezier(0.4, 0, 0.6, 1);
+    opacity: 0;
+    fill: white; }
+    .mdc-checkbox__checkmark__path {
+      -webkit-transition: stroke-dashoffset 180ms 0ms cubic-bezier(0.4, 0, 0.6, 1);
+      transition: stroke-dashoffset 180ms 0ms cubic-bezier(0.4, 0, 0.6, 1);
+      stroke: white !important;
+      stroke-width: 3.12px;
+      stroke-dashoffset: 29.78334;
+      stroke-dasharray: 29.78334; }
+  .mdc-checkbox__mixedmark {
+    width: 100%;
+    height: 2px;
+    -webkit-transform: scaleX(0) rotate(0deg);
+            transform: scaleX(0) rotate(0deg);
+    -webkit-transition: opacity 90ms 0ms cubic-bezier(0.4, 0, 0.6, 1), -webkit-transform 90ms 0ms cubic-bezier(0.4, 0, 0.6, 1);
+    transition: opacity 90ms 0ms cubic-bezier(0.4, 0, 0.6, 1), -webkit-transform 90ms 0ms cubic-bezier(0.4, 0, 0.6, 1);
+    transition: opacity 90ms 0ms cubic-bezier(0.4, 0, 0.6, 1), transform 90ms 0ms cubic-bezier(0.4, 0, 0.6, 1);
+    transition: opacity 90ms 0ms cubic-bezier(0.4, 0, 0.6, 1), transform 90ms 0ms cubic-bezier(0.4, 0, 0.6, 1), -webkit-transform 90ms 0ms cubic-bezier(0.4, 0, 0.6, 1);
+    background-color: white;
+    opacity: 0; }
+
+.mdc-checkbox__native-control:focus ~ .mdc-checkbox__background::before {
+  -webkit-transform: scale(2.75, 2.75);
+          transform: scale(2.75, 2.75);
+  -webkit-transition: opacity 80ms 0ms cubic-bezier(0, 0, 0.2, 1), -webkit-transform 80ms 0ms cubic-bezier(0, 0, 0.2, 1);
+  transition: opacity 80ms 0ms cubic-bezier(0, 0, 0.2, 1), -webkit-transform 80ms 0ms cubic-bezier(0, 0, 0.2, 1);
+  transition: opacity 80ms 0ms cubic-bezier(0, 0, 0.2, 1), transform 80ms 0ms cubic-bezier(0, 0, 0.2, 1);
+  transition: opacity 80ms 0ms cubic-bezier(0, 0, 0.2, 1), transform 80ms 0ms cubic-bezier(0, 0, 0.2, 1), -webkit-transform 80ms 0ms cubic-bezier(0, 0, 0.2, 1);
+  opacity: .26; }
+
+.mdc-checkbox__native-control:checked ~ .mdc-checkbox__background {
+  -webkit-transition: border-color 90ms 0ms cubic-bezier(0, 0, 0.2, 1), background-color 90ms 0ms cubic-bezier(0, 0, 0.2, 1);
+  transition: border-color 90ms 0ms cubic-bezier(0, 0, 0.2, 1), background-color 90ms 0ms cubic-bezier(0, 0, 0.2, 1);
+  /* @alternate */
+  border-color: #3f51b5;
+  border-color: var(--mdc-theme-primary, #3f51b5);
+  /* @alternate */
+  background-color: #3f51b5;
+  background-color: var(--mdc-theme-primary, #3f51b5); }
+  .mdc-checkbox__native-control:checked ~ .mdc-checkbox__background .mdc-checkbox__checkmark {
+    -webkit-transition: opacity 180ms 0ms cubic-bezier(0, 0, 0.2, 1), -webkit-transform 180ms 0ms cubic-bezier(0, 0, 0.2, 1);
+    transition: opacity 180ms 0ms cubic-bezier(0, 0, 0.2, 1), -webkit-transform 180ms 0ms cubic-bezier(0, 0, 0.2, 1);
+    transition: opacity 180ms 0ms cubic-bezier(0, 0, 0.2, 1), transform 180ms 0ms cubic-bezier(0, 0, 0.2, 1);
+    transition: opacity 180ms 0ms cubic-bezier(0, 0, 0.2, 1), transform 180ms 0ms cubic-bezier(0, 0, 0.2, 1), -webkit-transform 180ms 0ms cubic-bezier(0, 0, 0.2, 1);
+    opacity: 1; }
+    .mdc-checkbox__native-control:checked ~ .mdc-checkbox__background .mdc-checkbox__checkmark__path {
+      stroke-dashoffset: 0; }
+  .mdc-checkbox__native-control:checked ~ .mdc-checkbox__background .mdc-checkbox__mixedmark {
+    -webkit-transform: scaleX(1) rotate(-45deg);
+            transform: scaleX(1) rotate(-45deg); }
+
+.mdc-checkbox__native-control:indeterminate ~ .mdc-checkbox__background {
+  /* @alternate */
+  border-color: #3f51b5;
+  border-color: var(--mdc-theme-primary, #3f51b5);
+  /* @alternate */
+  background-color: #3f51b5;
+  background-color: var(--mdc-theme-primary, #3f51b5); }
+  .mdc-checkbox__native-control:indeterminate ~ .mdc-checkbox__background .mdc-checkbox__checkmark {
+    -webkit-transform: rotate(45deg);
+            transform: rotate(45deg);
+    -webkit-transition: opacity 90ms 0ms cubic-bezier(0.4, 0, 0.6, 1), -webkit-transform 90ms 0ms cubic-bezier(0.4, 0, 0.6, 1);
+    transition: opacity 90ms 0ms cubic-bezier(0.4, 0, 0.6, 1), -webkit-transform 90ms 0ms cubic-bezier(0.4, 0, 0.6, 1);
+    transition: opacity 90ms 0ms cubic-bezier(0.4, 0, 0.6, 1), transform 90ms 0ms cubic-bezier(0.4, 0, 0.6, 1);
+    transition: opacity 90ms 0ms cubic-bezier(0.4, 0, 0.6, 1), transform 90ms 0ms cubic-bezier(0.4, 0, 0.6, 1), -webkit-transform 90ms 0ms cubic-bezier(0.4, 0, 0.6, 1);
+    opacity: 0; }
+    .mdc-checkbox__native-control:indeterminate ~ .mdc-checkbox__background .mdc-checkbox__checkmark__path {
+      stroke-dashoffset: 0; }
+  .mdc-checkbox__native-control:indeterminate ~ .mdc-checkbox__background .mdc-checkbox__mixedmark {
+    -webkit-transform: scaleX(1) rotate(0deg);
+            transform: scaleX(1) rotate(0deg);
+    opacity: 1; }
+
+.mdc-checkbox__native-control:disabled,
+fieldset:disabled .mdc-checkbox__native-control,
+[aria-disabled="true"] .mdc-checkbox__native-control {
+  cursor: default; }
+  .mdc-checkbox__native-control:disabled ~ .mdc-checkbox__background,
+  fieldset:disabled .mdc-checkbox__native-control ~ .mdc-checkbox__background,
+  [aria-disabled="true"] .mdc-checkbox__native-control ~ .mdc-checkbox__background {
+    border-color: rgba(0, 0, 0, 0.26); }
+    .mdc-checkbox--theme-dark .mdc-checkbox__native-control:disabled ~ .mdc-checkbox__background,
+    .mdc-theme--dark .mdc-checkbox__native-control:disabled ~ .mdc-checkbox__background, .mdc-checkbox--theme-dark
+    fieldset:disabled .mdc-checkbox__native-control ~ .mdc-checkbox__background,
+    .mdc-theme--dark
+    fieldset:disabled .mdc-checkbox__native-control ~ .mdc-checkbox__background, .mdc-checkbox--theme-dark
+    [aria-disabled="true"] .mdc-checkbox__native-control ~ .mdc-checkbox__background,
+    .mdc-theme--dark
+    [aria-disabled="true"] .mdc-checkbox__native-control ~ .mdc-checkbox__background {
+      border-color: rgba(255, 255, 255, 0.3); }
+  .mdc-checkbox__native-control:disabled:checked ~ .mdc-checkbox__background, .mdc-checkbox__native-control:disabled:indeterminate ~ .mdc-checkbox__background,
+  fieldset:disabled .mdc-checkbox__native-control:checked ~ .mdc-checkbox__background,
+  fieldset:disabled .mdc-checkbox__native-control:indeterminate ~ .mdc-checkbox__background,
+  [aria-disabled="true"] .mdc-checkbox__native-control:checked ~ .mdc-checkbox__background,
+  [aria-disabled="true"] .mdc-checkbox__native-control:indeterminate ~ .mdc-checkbox__background {
+    border-color: transparent;
+    background-color: rgba(0, 0, 0, 0.26); }
+    .mdc-checkbox--theme-dark .mdc-checkbox__native-control:disabled:checked ~ .mdc-checkbox__background,
+    .mdc-theme--dark .mdc-checkbox__native-control:disabled:checked ~ .mdc-checkbox__background, .mdc-checkbox--theme-dark .mdc-checkbox__native-control:disabled:indeterminate ~ .mdc-checkbox__background,
+    .mdc-theme--dark .mdc-checkbox__native-control:disabled:indeterminate ~ .mdc-checkbox__background, .mdc-checkbox--theme-dark
+    fieldset:disabled .mdc-checkbox__native-control:checked ~ .mdc-checkbox__background,
+    .mdc-theme--dark
+    fieldset:disabled .mdc-checkbox__native-control:checked ~ .mdc-checkbox__background, .mdc-checkbox--theme-dark
+    fieldset:disabled .mdc-checkbox__native-control:indeterminate ~ .mdc-checkbox__background,
+    .mdc-theme--dark
+    fieldset:disabled .mdc-checkbox__native-control:indeterminate ~ .mdc-checkbox__background, .mdc-checkbox--theme-dark
+    [aria-disabled="true"] .mdc-checkbox__native-control:checked ~ .mdc-checkbox__background,
+    .mdc-theme--dark
+    [aria-disabled="true"] .mdc-checkbox__native-control:checked ~ .mdc-checkbox__background, .mdc-checkbox--theme-dark
+    [aria-disabled="true"] .mdc-checkbox__native-control:indeterminate ~ .mdc-checkbox__background,
+    .mdc-theme--dark
+    [aria-disabled="true"] .mdc-checkbox__native-control:indeterminate ~ .mdc-checkbox__background {
+      background-color: rgba(255, 255, 255, 0.3); }
+
+.mdc-checkbox--disabled {
+  cursor: default;
+  pointer-events: none; }
+
+.mdc-checkbox--upgraded .mdc-checkbox__background,
+.mdc-checkbox--upgraded .mdc-checkbox__checkmark,
+.mdc-checkbox--upgraded .mdc-checkbox__checkmark__path,
+.mdc-checkbox--upgraded .mdc-checkbox__mixedmark {
+  -webkit-transition: none !important;
+  transition: none !important; }
+
+.mdc-checkbox--anim-unchecked-checked .mdc-checkbox__background, .mdc-checkbox--anim-unchecked-indeterminate .mdc-checkbox__background {
+  -webkit-animation: mdc-checkbox-fade-in-background 180ms linear;
+          animation: mdc-checkbox-fade-in-background 180ms linear; }
+  .mdc-checkbox--theme-dark .mdc-checkbox--anim-unchecked-checked .mdc-checkbox__background,
+  .mdc-theme--dark .mdc-checkbox--anim-unchecked-checked .mdc-checkbox__background, .mdc-checkbox--theme-dark .mdc-checkbox--anim-unchecked-indeterminate .mdc-checkbox__background,
+  .mdc-theme--dark .mdc-checkbox--anim-unchecked-indeterminate .mdc-checkbox__background {
+    -webkit-animation-name: mdc-checkbox-fade-in-background-dark;
+            animation-name: mdc-checkbox-fade-in-background-dark; }
+
+.mdc-checkbox--anim-checked-unchecked .mdc-checkbox__background, .mdc-checkbox--anim-indeterminate-unchecked .mdc-checkbox__background {
+  -webkit-animation: mdc-checkbox-fade-out-background 180ms linear;
+          animation: mdc-checkbox-fade-out-background 180ms linear; }
+  .mdc-checkbox--theme-dark .mdc-checkbox--anim-checked-unchecked .mdc-checkbox__background,
+  .mdc-theme--dark .mdc-checkbox--anim-checked-unchecked .mdc-checkbox__background, .mdc-checkbox--theme-dark .mdc-checkbox--anim-indeterminate-unchecked .mdc-checkbox__background,
+  .mdc-theme--dark .mdc-checkbox--anim-indeterminate-unchecked .mdc-checkbox__background {
+    -webkit-animation-name: mdc-checkbox-fade-out-background-dark;
+            animation-name: mdc-checkbox-fade-out-background-dark; }
+
+.mdc-checkbox--anim-unchecked-checked .mdc-checkbox__checkmark__path {
+  -webkit-animation: 180ms linear 0s mdc-checkbox-unchecked-checked-checkmark-path;
+          animation: 180ms linear 0s mdc-checkbox-unchecked-checked-checkmark-path;
+  -webkit-transition: none;
+  transition: none; }
+
+.mdc-checkbox--anim-unchecked-indeterminate .mdc-checkbox__mixedmark {
+  -webkit-animation: 90ms linear 0s mdc-checkbox-unchecked-indeterminate-mixedmark;
+          animation: 90ms linear 0s mdc-checkbox-unchecked-indeterminate-mixedmark;
+  -webkit-transition: none;
+  transition: none; }
+
+.mdc-checkbox--anim-checked-unchecked .mdc-checkbox__checkmark__path {
+  -webkit-animation: 90ms linear 0s mdc-checkbox-checked-unchecked-checkmark-path;
+          animation: 90ms linear 0s mdc-checkbox-checked-unchecked-checkmark-path;
+  -webkit-transition: none;
+  transition: none; }
+
+.mdc-checkbox--anim-checked-indeterminate .mdc-checkbox__checkmark {
+  -webkit-animation: 90ms linear 0s mdc-checkbox-checked-indeterminate-checkmark;
+          animation: 90ms linear 0s mdc-checkbox-checked-indeterminate-checkmark;
+  -webkit-transition: none;
+  transition: none; }
+
+.mdc-checkbox--anim-checked-indeterminate .mdc-checkbox__mixedmark {
+  -webkit-animation: 90ms linear 0s mdc-checkbox-checked-indeterminate-mixedmark;
+          animation: 90ms linear 0s mdc-checkbox-checked-indeterminate-mixedmark;
+  -webkit-transition: none;
+  transition: none; }
+
+.mdc-checkbox--anim-indeterminate-checked .mdc-checkbox__checkmark {
+  -webkit-animation: 500ms linear 0s mdc-checkbox-indeterminate-checked-checkmark;
+          animation: 500ms linear 0s mdc-checkbox-indeterminate-checked-checkmark;
+  -webkit-transition: none;
+  transition: none; }
+
+.mdc-checkbox--anim-indeterminate-checked .mdc-checkbox__mixedmark {
+  -webkit-animation: 500ms linear 0s mdc-checkbox-indeterminate-checked-mixedmark;
+          animation: 500ms linear 0s mdc-checkbox-indeterminate-checked-mixedmark;
+  -webkit-transition: none;
+  transition: none; }
+
+.mdc-checkbox--anim-indeterminate-unchecked .mdc-checkbox__mixedmark {
+  -webkit-animation: 300ms linear 0s mdc-checkbox-indeterminate-unchecked-mixedmark;
+          animation: 300ms linear 0s mdc-checkbox-indeterminate-unchecked-mixedmark;
+  -webkit-transition: none;
+  transition: none; }
+
+/**
+ * The css property used for elevation. In most cases this should not be changed. It is exposed
+ * as a variable for abstraction / easy use when needing to reference the property directly, for
+ * example in a `will-change` rule.
+ */
+/**
+ * The default duration value for elevation transitions.
+ */
+/**
+ * The default easing value for elevation transitions.
+ */
+/**
+ * Applies the correct css rules to an element to give it the elevation specified by $z-value.
+ * The $z-value must be between 0 and 24.
+ */
+/**
+ * Returns a string that can be used as the value for a `transition` property for elevation.
+ * Calling this function directly is useful in situations where a component needs to transition
+ * more than one property.
+ *
+ * ```scss
+ * .foo {
+ *   transition: mdc-elevation-transition-rule(), opacity 100ms ease;
+ *   will-change: $mdc-elevation-property, opacity;
+ * }
+ * ```
+ */
+/**
+ * Applies the correct css rules needed to have an element transition between elevations.
+ * This mixin should be applied to elements whose elevation values will change depending on their
+ * context (e.g. when active or disabled).
+ */
+/**
+ * Creates a rule that will be applied when an MDC-Web component is within the context of an RTL layout.
+ *
+ * Usage Example:
+ * ```scss
+ * .mdc-foo {
+ *   position: absolute;
+ *   left: 0;
+ *
+ *   @include mdc-rtl {
+ *     left: auto;
+ *     right: 0;
+ *   }
+ *
+ *   &__bar {
+ *     margin-left: 4px;
+ *     @include mdc-rtl(".mdc-foo") {
+ *       margin-left: auto;
+ *       margin-right: 4px;
+ *     }
+ *   }
+ * }
+ *
+ * .mdc-foo--mod {
+ *   padding-left: 4px;
+ *
+ *   @include mdc-rtl {
+ *     padding-left: auto;
+ *     padding-right: 4px;
+ *   }
+ * }
+ * ```
+ *
+ * Note that this works by checking for [dir="rtl"] on an ancestor element. While this will work
+ * in most cases, it will in some cases lead to false negatives, e.g.
+ *
+ * ```html
+ * <html dir="rtl">
+ *   <!-- ... -->
+ *   <div dir="ltr">
+ *     <div class="mdc-foo">Styled incorrectly as RTL!</div>
+ *   </div>
+ * </html>
+ * ```
+ *
+ * In the future, selectors such as :dir (http://mdn.io/:dir) will help us mitigate this.
+ */
+/**
+ * Takes a base box-model property - e.g. margin / border / padding - along with a default
+ * direction and value, and emits rules which apply the value to the
+ * "<base-property>-<default-direction>" property by default, but flips the direction
+ * when within an RTL context.
+ *
+ * For example:
+ *
+ * ```scss
+ * .mdc-foo {
+ *   @include mdc-rtl-reflexive-box(margin, left, 8px);
+ * }
+ * ```
+ * is equivalent to:
+ *
+ * ```scss
+ * .mdc-foo {
+ *   margin-left: 8px;
+ *
+ *   @include mdc-rtl {
+ *     margin-right: 8px;
+ *     margin-left: 0;
+ *   }
+ * }
+ * ```
+ * whereas:
+ *
+ * ```scss
+ * .mdc-foo {
+ *   @include mdc-rtl-reflexive-box(margin, right, 8px);
+ * }
+ * ```
+ * is equivalent to:
+ *
+ * ```scss
+ * .mdc-foo {
+ *   margin-right: 8px;
+ *
+ *   @include mdc-rtl {
+ *     margin-right: 0;
+ *     margin-left: 8px;
+ *   }
+ * }
+ * ```
+ *
+ * You can also pass a 4th optional $root-selector argument which will be forwarded to `mdc-rtl`,
+ * e.g. `@include mdc-rtl-reflexive-box(margin, left, 8px, ".mdc-component")`.
+ *
+ * Note that this function will always zero out the original value in an RTL context. If you're
+ * trying to flip the values, use mdc-rtl-reflexive-property().
+ */
+/**
+ * Takes a base property and emits rules that assign <base-property>-left to <left-value> and
+ * <base-property>-right to <right-value> in a LTR context, and vice versa in a RTL context.
+ * For example:
+ *
+ * ```scss
+ * .mdc-foo {
+ *   @include mdc-rtl-reflexive-property(margin, auto, 12px);
+ * }
+ * ```
+ * is equivalent to:
+ *
+ * ```scss
+ * .mdc-foo {
+ *   margin-left: auto;
+ *   margin-right: 12px;
+ *
+ *   @include mdc-rtl {
+ *     margin-left: 12px;
+ *     margin-right: auto;
+ *   }
+ * }
+ * ```
+ *
+ * A 4th optional $root-selector argument can be given, which will be passed to `mdc-rtl`.
+ */
+/**
+ * Takes an argument specifying a horizontal position property (either "left" or "right") as well
+ * as a value, and applies that value to the specified position in a LTR context, and flips it in a
+ * RTL context. For example:
+ *
+ * ```scss
+ * .mdc-foo {
+ *   @include mdc-rtl-reflexive-position(left, 0);
+ *   position: absolute;
+ * }
+ * ```
+ * is equivalent to:
+ *
+ * ```scss
+ *  .mdc-foo {
+ *    position: absolute;
+ *    left: 0;
+ *    right: initial;
+ *
+ *    @include mdc-rtl {
+ *      right: 0;
+ *      left: initial;
+ *    }
+ *  }
+ * ```
+ * An optional third $root-selector argument may also be given, which is passed to `mdc-rtl`.
+ */
+/*
+  Precomputed linear color channel values, for use in contrast calculations.
+  See https://www.w3.org/TR/WCAG20-TECHS/G17.html#G17-tests
+
+  Algorithm, for c in 0 to 255:
+  f(c) {
+    c = c / 255;
+    return c < 0.03928 ? c / 12.92 : Math.pow((c + 0.055) / 1.055, 2.4);
+  }
+
+  This lookup table is needed since there is no `pow` in SASS.
+*/
+/**
+ * Calculate the luminance for a color.
+ * See https://www.w3.org/TR/WCAG20-TECHS/G17.html#G17-tests
+ */
+/**
+ * Calculate the contrast ratio between two colors.
+ * See https://www.w3.org/TR/WCAG20-TECHS/G17.html#G17-tests
+ */
+/**
+ * Determine whether to use dark or light text on top of given color.
+ * Returns "dark" for dark text and "light" for light text.
+ */
+/*
+  Main theme colors.
+  If you're a user customizing your color scheme in SASS, these are probably the only variables you need to change.
+*/
+/* Indigo 500 */
+/* Pink A200 */
+/* White */
+/* Which set of text colors to use for each main theme color (light or dark) */
+/* Text colors according to light vs dark and text type */
+/* Primary text colors for each of the theme colors */
+/**
+ * Applies the correct theme color style to the specified property.
+ * $property is typically color or background-color, but can be any CSS property that accepts color values.
+ * $style should be one of the map keys in $mdc-theme-property-values (_variables.scss).
+ */
+/**
+ * Creates a rule to be used in MDC-Web components for dark theming, and applies the provided contents.
+ * Should provide the $root-selector option if applied to anything other than the root selector.
+ * When used with a modifier class, provide a second argument of `true` for the $compound parameter
+ * to specify that this should be attached as a compound class.
+ *
+ * Usage example:
+ *
+ * ```scss
+ * .mdc-foo {
+ *   color: black;
+ *
+ *   @include mdc-theme-dark {
+ *     color: white;
+ *   }
+ *
+ *   &__bar {
+ *     background: black;
+ *
+ *     @include mdc-theme-dark(".mdc-foo") {
+ *       background: white;
+ *     }
+ *   }
+ * }
+ *
+ * .mdc-foo--disabled {
+ *   opacity: .38;
+ *
+ *   @include mdc-theme-dark(".mdc-foo", true) {
+ *     opacity: .5;
+ *   }
+ * }
+ * ```
+ */
+/* TODO(sgomes): Figure out what to do about desktop font sizes. */
+/* TODO(sgomes): Figure out what to do about i18n and i18n font sizes. */
+/* TODO(sgomes): Figure out what to do about desktop font sizes. */
+/* TODO(sgomes): Figure out what to do about i18n and i18n font sizes. */
+:root {
+  --mdc-dialog-dark-theme-bg-color: #303030; }
+
+.mdc-dialog {
+  display: -webkit-box;
+  display: -ms-flexbox;
+  display: flex;
+  position: fixed;
+  top: 0;
+  left: 0;
+  -webkit-box-align: center;
+      -ms-flex-align: center;
+          align-items: center;
+  -webkit-box-pack: center;
+      -ms-flex-pack: center;
+          justify-content: center;
+  width: 100%;
+  height: 100%;
+  visibility: hidden;
+  z-index: 2; }
+  .mdc-dialog__backdrop {
+    position: fixed;
+    top: 0;
+    left: 0;
+    -webkit-box-align: center;
+        -ms-flex-align: center;
+            align-items: center;
+    -webkit-box-pack: center;
+        -ms-flex-pack: center;
+            justify-content: center;
+    width: 100%;
+    height: 100%;
+    /* @alternate */
+    background-color: rgba(0, 0, 0, 0.87);
+    background-color: var(--mdc-theme-text-primary-on-light, rgba(0, 0, 0, 0.87));
+    opacity: 0;
+    z-index: -1; }
+  .mdc-dialog__surface {
+    display: -webkit-inline-box;
+    display: -ms-inline-flexbox;
+    display: inline-flex;
+    -webkit-box-orient: vertical;
+    -webkit-box-direction: normal;
+        -ms-flex-direction: column;
+            flex-direction: column;
+    -webkit-box-shadow: 0px 11px 15px -7px rgba(0, 0, 0, 0.2), 0px 24px 38px 3px rgba(0, 0, 0, 0.14), 0px 9px 46px 8px rgba(0, 0, 0, 0.12);
+            box-shadow: 0px 11px 15px -7px rgba(0, 0, 0, 0.2), 0px 24px 38px 3px rgba(0, 0, 0, 0.14), 0px 9px 46px 8px rgba(0, 0, 0, 0.12);
+    width: calc(100% - 30px);
+    min-width: 640px;
+    max-width: 865px;
+    -webkit-transform: translateY(150px) scale(0.8);
+            transform: translateY(150px) scale(0.8);
+    border-radius: 2px;
+    /* @alternate */
+    background-color: #fff;
+    background-color: var(--mdc-theme-background, #fff);
+    opacity: 0; }
+    .mdc-dialog--theme-dark .mdc-dialog__surface,
+    .mdc-theme--dark .mdc-dialog__surface {
+      /* @alternate */
+      color: white;
+      color: var(--mdc-theme-text-primary-on-dark, white);
+      background-color: #303030;
+      background-color: var(--mdc-dialog-dark-theme-bg-color, #303030); }
+    [dir="rtl"] .mdc-dialog .mdc-dialog__surface,
+    .mdc-dialog[dir="rtl"] .mdc-dialog__surface {
+      text-align: right; }
+  .mdc-dialog__header {
+    display: -webkit-box;
+    display: -ms-flexbox;
+    display: flex;
+    -webkit-box-align: center;
+        -ms-flex-align: center;
+            align-items: center;
+    padding: 24px 24px 0; }
+    .mdc-dialog__header__empty {
+      padding: 0; }
+    [dir="rtl"] .mdc-dialog .mdc-dialog__header,
+    .mdc-dialog[dir="rtl"] .mdc-dialog__header {
+      text-align: right; }
+    .mdc-dialog__header__title {
+      -webkit-box-flex: 1;
+          -ms-flex: 1;
+              flex: 1;
+      margin: 0;
+      font-family: Roboto, sans-serif;
+      -moz-osx-font-smoothing: grayscale;
+      -webkit-font-smoothing: antialiased;
+      font-size: 1.25rem;
+      font-weight: 500;
+      letter-spacing: 0.02em;
+      line-height: 2rem;
+      text-decoration: inherit;
+      text-transform: inherit; }
+  .mdc-dialog__body {
+    margin-top: 20px;
+    padding: 0 24px 24px;
+    /* @alternate */
+    color: rgba(0, 0, 0, 0.54);
+    color: var(--mdc-theme-text-secondary-on-light, rgba(0, 0, 0, 0.54));
+    font-family: Roboto, sans-serif;
+    -moz-osx-font-smoothing: grayscale;
+    -webkit-font-smoothing: antialiased;
+    font-size: 0.875rem;
+    font-weight: 400;
+    letter-spacing: 0.04em;
+    line-height: 1.25rem;
+    text-decoration: inherit;
+    text-transform: inherit; }
+    .mdc-dialog--theme-dark.mdc-dialog__body,
+    .mdc-theme--dark .mdc-dialog__body {
+      /* @alternate */
+      color: rgba(255, 255, 255, 0.7);
+      color: var(--mdc-theme-text-secondary-on-dark, rgba(255, 255, 255, 0.7)); }
+    .mdc-dialog__body--scrollable {
+      max-height: 195px;
+      border-top: 1px solid rgba(0, 0, 0, 0.1);
+      border-bottom: 1px solid rgba(0, 0, 0, 0.1);
+      overflow-y: scroll;
+      overflow-x: auto;
+      -webkit-overflow-scrolling: touch; }
+  .mdc-dialog__footer {
+    display: -webkit-box;
+    display: -ms-flexbox;
+    display: flex;
+    -ms-flex-wrap: wrap;
+        flex-wrap: wrap;
+    -webkit-box-align: center;
+        -ms-flex-align: center;
+            align-items: center;
+    -webkit-box-pack: end;
+        -ms-flex-pack: end;
+            justify-content: flex-end;
+    padding: 8px; }
+    .mdc-dialog__footer__button {
+      margin-left: 0;
+      margin-right: 8px; }
+      [dir="rtl"] .mdc-dialog__footer__button, .mdc-dialog__footer__button[dir="rtl"] {
+        margin-left: 8px;
+        margin-right: 0; }
+      .mdc-dialog__footer__button:last-child {
+        margin-left: 0;
+        margin-right: 0; }
+        [dir="rtl"] .mdc-dialog__footer__button:last-child, .mdc-dialog__footer__button:last-child[dir="rtl"] {
+          margin-left: 0;
+          margin-right: 0; }
+    .mdc-dialog__footer__action {
+      /* @alternate */
+      color: #ff4081;
+      color: var(--mdc-theme-accent, #ff4081); }
+  @media (max-width: 640px) {
+    .mdc-dialog {
+      min-width: 280px; }
+      .mdc-dialog__surface {
+        min-width: 280px; }
+      .mdc-dialog__body {
+        line-height: 24px; } }
+  .mdc-dialog--animating {
+    visibility: visible; }
+    .mdc-dialog--animating .mdc-dialog__backdrop {
+      -webkit-transition: opacity 120ms 0ms cubic-bezier(0, 0, 0.2, 1);
+      transition: opacity 120ms 0ms cubic-bezier(0, 0, 0.2, 1); }
+    .mdc-dialog--animating .mdc-dialog--open .mdc-dialog__surface {
+      -webkit-transition: opacity 120ms 0ms cubic-bezier(0, 0, 0.2, 1), -webkit-transform 120ms 0ms cubic-bezier(0, 0, 0.2, 1);
+      transition: opacity 120ms 0ms cubic-bezier(0, 0, 0.2, 1), -webkit-transform 120ms 0ms cubic-bezier(0, 0, 0.2, 1);
+      transition: opacity 120ms 0ms cubic-bezier(0, 0, 0.2, 1), transform 120ms 0ms cubic-bezier(0, 0, 0.2, 1);
+      transition: opacity 120ms 0ms cubic-bezier(0, 0, 0.2, 1), transform 120ms 0ms cubic-bezier(0, 0, 0.2, 1), -webkit-transform 120ms 0ms cubic-bezier(0, 0, 0.2, 1); }
+    .mdc-dialog--animating .mdc-dialog__surface {
+      -webkit-transition: opacity 120ms 0ms cubic-bezier(0, 0, 0.2, 1), -webkit-transform 120ms 0ms cubic-bezier(0, 0, 0.2, 1);
+      transition: opacity 120ms 0ms cubic-bezier(0, 0, 0.2, 1), -webkit-transform 120ms 0ms cubic-bezier(0, 0, 0.2, 1);
+      transition: opacity 120ms 0ms cubic-bezier(0, 0, 0.2, 1), transform 120ms 0ms cubic-bezier(0, 0, 0.2, 1);
+      transition: opacity 120ms 0ms cubic-bezier(0, 0, 0.2, 1), transform 120ms 0ms cubic-bezier(0, 0, 0.2, 1), -webkit-transform 120ms 0ms cubic-bezier(0, 0, 0.2, 1); }
+  .mdc-dialog--open {
+    visibility: visible; }
+    .mdc-dialog--open .mdc-dialog__backdrop {
+      opacity: .3; }
+    .mdc-dialog--open .mdc-dialog__surface {
+      -webkit-transform: translateY(0) scale(1);
+              transform: translateY(0) scale(1);
+      opacity: 1; }
+
+.mdc-dialog-scroll-lock {
+  height: 100vh;
+  overflow: hidden; }
+
+/**
+ * Creates a rule that will be applied when an MDC-Web component is within the context of an RTL layout.
+ *
+ * Usage Example:
+ * ```scss
+ * .mdc-foo {
+ *   position: absolute;
+ *   left: 0;
+ *
+ *   @include mdc-rtl {
+ *     left: auto;
+ *     right: 0;
+ *   }
+ *
+ *   &__bar {
+ *     margin-left: 4px;
+ *     @include mdc-rtl(".mdc-foo") {
+ *       margin-left: auto;
+ *       margin-right: 4px;
+ *     }
+ *   }
+ * }
+ *
+ * .mdc-foo--mod {
+ *   padding-left: 4px;
+ *
+ *   @include mdc-rtl {
+ *     padding-left: auto;
+ *     padding-right: 4px;
+ *   }
+ * }
+ * ```
+ *
+ * Note that this works by checking for [dir="rtl"] on an ancestor element. While this will work
+ * in most cases, it will in some cases lead to false negatives, e.g.
+ *
+ * ```html
+ * <html dir="rtl">
+ *   <!-- ... -->
+ *   <div dir="ltr">
+ *     <div class="mdc-foo">Styled incorrectly as RTL!</div>
+ *   </div>
+ * </html>
+ * ```
+ *
+ * In the future, selectors such as :dir (http://mdn.io/:dir) will help us mitigate this.
+ */
+/**
+ * Takes a base box-model property - e.g. margin / border / padding - along with a default
+ * direction and value, and emits rules which apply the value to the
+ * "<base-property>-<default-direction>" property by default, but flips the direction
+ * when within an RTL context.
+ *
+ * For example:
+ *
+ * ```scss
+ * .mdc-foo {
+ *   @include mdc-rtl-reflexive-box(margin, left, 8px);
+ * }
+ * ```
+ * is equivalent to:
+ *
+ * ```scss
+ * .mdc-foo {
+ *   margin-left: 8px;
+ *
+ *   @include mdc-rtl {
+ *     margin-right: 8px;
+ *     margin-left: 0;
+ *   }
+ * }
+ * ```
+ * whereas:
+ *
+ * ```scss
+ * .mdc-foo {
+ *   @include mdc-rtl-reflexive-box(margin, right, 8px);
+ * }
+ * ```
+ * is equivalent to:
+ *
+ * ```scss
+ * .mdc-foo {
+ *   margin-right: 8px;
+ *
+ *   @include mdc-rtl {
+ *     margin-right: 0;
+ *     margin-left: 8px;
+ *   }
+ * }
+ * ```
+ *
+ * You can also pass a 4th optional $root-selector argument which will be forwarded to `mdc-rtl`,
+ * e.g. `@include mdc-rtl-reflexive-box(margin, left, 8px, ".mdc-component")`.
+ *
+ * Note that this function will always zero out the original value in an RTL context. If you're
+ * trying to flip the values, use mdc-rtl-reflexive-property().
+ */
+/**
+ * Takes a base property and emits rules that assign <base-property>-left to <left-value> and
+ * <base-property>-right to <right-value> in a LTR context, and vice versa in a RTL context.
+ * For example:
+ *
+ * ```scss
+ * .mdc-foo {
+ *   @include mdc-rtl-reflexive-property(margin, auto, 12px);
+ * }
+ * ```
+ * is equivalent to:
+ *
+ * ```scss
+ * .mdc-foo {
+ *   margin-left: auto;
+ *   margin-right: 12px;
+ *
+ *   @include mdc-rtl {
+ *     margin-left: 12px;
+ *     margin-right: auto;
+ *   }
+ * }
+ * ```
+ *
+ * A 4th optional $root-selector argument can be given, which will be passed to `mdc-rtl`.
+ */
+/**
+ * Takes an argument specifying a horizontal position property (either "left" or "right") as well
+ * as a value, and applies that value to the specified position in a LTR context, and flips it in a
+ * RTL context. For example:
+ *
+ * ```scss
+ * .mdc-foo {
+ *   @include mdc-rtl-reflexive-position(left, 0);
+ *   position: absolute;
+ * }
+ * ```
+ * is equivalent to:
+ *
+ * ```scss
+ *  .mdc-foo {
+ *    position: absolute;
+ *    left: 0;
+ *    right: initial;
+ *
+ *    @include mdc-rtl {
+ *      right: 0;
+ *      left: initial;
+ *    }
+ *  }
+ * ```
+ * An optional third $root-selector argument may also be given, which is passed to `mdc-rtl`.
+ */
+/*
+  Precomputed linear color channel values, for use in contrast calculations.
+  See https://www.w3.org/TR/WCAG20-TECHS/G17.html#G17-tests
+
+  Algorithm, for c in 0 to 255:
+  f(c) {
+    c = c / 255;
+    return c < 0.03928 ? c / 12.92 : Math.pow((c + 0.055) / 1.055, 2.4);
+  }
+
+  This lookup table is needed since there is no `pow` in SASS.
+*/
+/**
+ * Calculate the luminance for a color.
+ * See https://www.w3.org/TR/WCAG20-TECHS/G17.html#G17-tests
+ */
+/**
+ * Calculate the contrast ratio between two colors.
+ * See https://www.w3.org/TR/WCAG20-TECHS/G17.html#G17-tests
+ */
+/**
+ * Determine whether to use dark or light text on top of given color.
+ * Returns "dark" for dark text and "light" for light text.
+ */
+/*
+  Main theme colors.
+  If you're a user customizing your color scheme in SASS, these are probably the only variables you need to change.
+*/
+/* Indigo 500 */
+/* Pink A200 */
+/* White */
+/* Which set of text colors to use for each main theme color (light or dark) */
+/* Text colors according to light vs dark and text type */
+/* Primary text colors for each of the theme colors */
+/**
+ * Applies the correct theme color style to the specified property.
+ * $property is typically color or background-color, but can be any CSS property that accepts color values.
+ * $style should be one of the map keys in $mdc-theme-property-values (_variables.scss).
+ */
+/**
+ * Creates a rule to be used in MDC-Web components for dark theming, and applies the provided contents.
+ * Should provide the $root-selector option if applied to anything other than the root selector.
+ * When used with a modifier class, provide a second argument of `true` for the $compound parameter
+ * to specify that this should be attached as a compound class.
+ *
+ * Usage example:
+ *
+ * ```scss
+ * .mdc-foo {
+ *   color: black;
+ *
+ *   @include mdc-theme-dark {
+ *     color: white;
+ *   }
+ *
+ *   &__bar {
+ *     background: black;
+ *
+ *     @include mdc-theme-dark(".mdc-foo") {
+ *       background: white;
+ *     }
+ *   }
+ * }
+ *
+ * .mdc-foo--disabled {
+ *   opacity: .38;
+ *
+ *   @include mdc-theme-dark(".mdc-foo", true) {
+ *     opacity: .5;
+ *   }
+ * }
+ * ```
+ */
+/*
+  Precomputed linear color channel values, for use in contrast calculations.
+  See https://www.w3.org/TR/WCAG20-TECHS/G17.html#G17-tests
+
+  Algorithm, for c in 0 to 255:
+  f(c) {
+    c = c / 255;
+    return c < 0.03928 ? c / 12.92 : Math.pow((c + 0.055) / 1.055, 2.4);
+  }
+
+  This lookup table is needed since there is no `pow` in SASS.
+*/
+/**
+ * Calculate the luminance for a color.
+ * See https://www.w3.org/TR/WCAG20-TECHS/G17.html#G17-tests
+ */
+/**
+ * Calculate the contrast ratio between two colors.
+ * See https://www.w3.org/TR/WCAG20-TECHS/G17.html#G17-tests
+ */
+/**
+ * Determine whether to use dark or light text on top of given color.
+ * Returns "dark" for dark text and "light" for light text.
+ */
+/*
+  Main theme colors.
+  If you're a user customizing your color scheme in SASS, these are probably the only variables you need to change.
+*/
+/* Indigo 500 */
+/* Pink A200 */
+/* White */
+/* Which set of text colors to use for each main theme color (light or dark) */
+/* Text colors according to light vs dark and text type */
+/* Primary text colors for each of the theme colors */
+/**
+ * Applies the correct theme color style to the specified property.
+ * $property is typically color or background-color, but can be any CSS property that accepts color values.
+ * $style should be one of the map keys in $mdc-theme-property-values (_variables.scss).
+ */
+/**
+ * Creates a rule to be used in MDC-Web components for dark theming, and applies the provided contents.
+ * Should provide the $root-selector option if applied to anything other than the root selector.
+ * When used with a modifier class, provide a second argument of `true` for the $compound parameter
+ * to specify that this should be attached as a compound class.
+ *
+ * Usage example:
+ *
+ * ```scss
+ * .mdc-foo {
+ *   color: black;
+ *
+ *   @include mdc-theme-dark {
+ *     color: white;
+ *   }
+ *
+ *   &__bar {
+ *     background: black;
+ *
+ *     @include mdc-theme-dark(".mdc-foo") {
+ *       background: white;
+ *     }
+ *   }
+ * }
+ *
+ * .mdc-foo--disabled {
+ *   opacity: .38;
+ *
+ *   @include mdc-theme-dark(".mdc-foo", true) {
+ *     opacity: .5;
+ *   }
+ * }
+ * ```
+ */
+/* TODO(sgomes): Figure out what to do about desktop font sizes. */
+/* TODO(sgomes): Figure out what to do about i18n and i18n font sizes. */
+/**
+ * Copyright 2016 Google Inc. All Rights Reserved.
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *      http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+/**
+ * Creates a rule that will be applied when an MDC-Web component is within the context of an RTL layout.
+ *
+ * Usage Example:
+ * ```scss
+ * .mdc-foo {
+ *   position: absolute;
+ *   left: 0;
+ *
+ *   @include mdc-rtl {
+ *     left: auto;
+ *     right: 0;
+ *   }
+ *
+ *   &__bar {
+ *     margin-left: 4px;
+ *     @include mdc-rtl(".mdc-foo") {
+ *       margin-left: auto;
+ *       margin-right: 4px;
+ *     }
+ *   }
+ * }
+ *
+ * .mdc-foo--mod {
+ *   padding-left: 4px;
+ *
+ *   @include mdc-rtl {
+ *     padding-left: auto;
+ *     padding-right: 4px;
+ *   }
+ * }
+ * ```
+ *
+ * Note that this works by checking for [dir="rtl"] on an ancestor element. While this will work
+ * in most cases, it will in some cases lead to false negatives, e.g.
+ *
+ * ```html
+ * <html dir="rtl">
+ *   <!-- ... -->
+ *   <div dir="ltr">
+ *     <div class="mdc-foo">Styled incorrectly as RTL!</div>
+ *   </div>
+ * </html>
+ * ```
+ *
+ * In the future, selectors such as :dir (http://mdn.io/:dir) will help us mitigate this.
+ */
+/**
+ * Takes a base box-model property - e.g. margin / border / padding - along with a default
+ * direction and value, and emits rules which apply the value to the
+ * "<base-property>-<default-direction>" property by default, but flips the direction
+ * when within an RTL context.
+ *
+ * For example:
+ *
+ * ```scss
+ * .mdc-foo {
+ *   @include mdc-rtl-reflexive-box(margin, left, 8px);
+ * }
+ * ```
+ * is equivalent to:
+ *
+ * ```scss
+ * .mdc-foo {
+ *   margin-left: 8px;
+ *
+ *   @include mdc-rtl {
+ *     margin-right: 8px;
+ *     margin-left: 0;
+ *   }
+ * }
+ * ```
+ * whereas:
+ *
+ * ```scss
+ * .mdc-foo {
+ *   @include mdc-rtl-reflexive-box(margin, right, 8px);
+ * }
+ * ```
+ * is equivalent to:
+ *
+ * ```scss
+ * .mdc-foo {
+ *   margin-right: 8px;
+ *
+ *   @include mdc-rtl {
+ *     margin-right: 0;
+ *     margin-left: 8px;
+ *   }
+ * }
+ * ```
+ *
+ * You can also pass a 4th optional $root-selector argument which will be forwarded to `mdc-rtl`,
+ * e.g. `@include mdc-rtl-reflexive-box(margin, left, 8px, ".mdc-component")`.
+ *
+ * Note that this function will always zero out the original value in an RTL context. If you're
+ * trying to flip the values, use mdc-rtl-reflexive-property().
+ */
+/**
+ * Takes a base property and emits rules that assign <base-property>-left to <left-value> and
+ * <base-property>-right to <right-value> in a LTR context, and vice versa in a RTL context.
+ * For example:
+ *
+ * ```scss
+ * .mdc-foo {
+ *   @include mdc-rtl-reflexive-property(margin, auto, 12px);
+ * }
+ * ```
+ * is equivalent to:
+ *
+ * ```scss
+ * .mdc-foo {
+ *   margin-left: auto;
+ *   margin-right: 12px;
+ *
+ *   @include mdc-rtl {
+ *     margin-left: 12px;
+ *     margin-right: auto;
+ *   }
+ * }
+ * ```
+ *
+ * A 4th optional $root-selector argument can be given, which will be passed to `mdc-rtl`.
+ */
+/**
+ * Takes an argument specifying a horizontal position property (either "left" or "right") as well
+ * as a value, and applies that value to the specified position in a LTR context, and flips it in a
+ * RTL context. For example:
+ *
+ * ```scss
+ * .mdc-foo {
+ *   @include mdc-rtl-reflexive-position(left, 0);
+ *   position: absolute;
+ * }
+ * ```
+ * is equivalent to:
+ *
+ * ```scss
+ *  .mdc-foo {
+ *    position: absolute;
+ *    left: 0;
+ *    right: initial;
+ *
+ *    @include mdc-rtl {
+ *      right: 0;
+ *      left: initial;
+ *    }
+ *  }
+ * ```
+ * An optional third $root-selector argument may also be given, which is passed to `mdc-rtl`.
+ */
+/**
+ * Copyright 2016 Google Inc. All Rights Reserved.
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *      http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+:root {
+  --mdc-persistent-drawer-dark-theme-bg-color: #212121; }
+
+.mdc-persistent-drawer {
+  /* Use aspect ratio trick to maintain 16:9 aspect ratio on the header */
+  /* stylelint-disable selector-no-qualifying-type */
+  /* stylelint-enable selector-no-qualifying-type */
+  /* TODO(sgomes): Revisit when we have interactive lists. */
+  width: 0; }
+  .mdc-persistent-drawer__toolbar-spacer {
+    display: -webkit-box;
+    display: -ms-flexbox;
+    display: flex;
+    position: relative;
+    -webkit-box-orient: horizontal;
+    -webkit-box-direction: normal;
+        -ms-flex-direction: row;
+            flex-direction: row;
+    -ms-flex-negative: 0;
+        flex-shrink: 0;
+    -webkit-box-align: flex-center;
+        -ms-flex-align: flex-center;
+            align-items: flex-center;
+    height: 56px;
+    padding: 16px;
+    border-bottom: 1px solid rgba(0, 0, 0, 0.12);
+    -webkit-box-sizing: border-box;
+            box-sizing: border-box;
+    /* TODO(sgomes): replace with global breakpoints when we have them */ }
+    .mdc-persistent-drawer__toolbar-spacer--theme-dark .mdc-persistent-drawer__toolbar-spacer,
+    .mdc-theme--dark .mdc-persistent-drawer__toolbar-spacer {
+      border-bottom: 1px solid rgba(255, 255, 255, 0.12); }
+    @media (min-width: 600px) {
+      .mdc-persistent-drawer__toolbar-spacer {
+        height: 64px; } }
+  .mdc-persistent-drawer__header {
+    position: relative; }
+  .mdc-persistent-drawer__header::before {
+    display: block;
+    padding-top: 56.25%;
+    content: ""; }
+  .mdc-persistent-drawer__header-content {
+    display: -webkit-box;
+    display: -ms-flexbox;
+    display: flex;
+    position: absolute;
+    top: 0;
+    right: 0;
+    bottom: 0;
+    left: 0;
+    -webkit-box-align: end;
+        -ms-flex-align: end;
+            align-items: flex-end;
+    padding: 16px;
+    -webkit-box-sizing: border-box;
+            box-sizing: border-box; }
+  .mdc-persistent-drawer .mdc-list-group,
+  .mdc-persistent-drawer .mdc-list {
+    padding-right: 0;
+    padding-left: 0; }
+  .mdc-persistent-drawer .mdc-list-item {
+    position: relative;
+    padding: 0 16px;
+    outline: none;
+    color: inherit;
+    text-decoration: none;
+    font-family: Roboto, sans-serif;
+    -moz-osx-font-smoothing: grayscale;
+    -webkit-font-smoothing: antialiased;
+    font-size: 0.875rem;
+    font-weight: 500;
+    letter-spacing: 0.04em;
+    line-height: 1.5rem;
+    text-decoration: inherit;
+    text-transform: inherit; }
+    .mdc-persistent-drawer .mdc-list-item.mdc-ripple-upgraded {
+      left: 0; }
+  .mdc-persistent-drawer .mdc-list-item__start-detail {
+    color: rgba(0, 0, 0, 0.54); }
+    .mdc-persistent-drawer .mdc-list-item__start-detail--theme-dark .mdc-persistent-drawer .mdc-list-item__start-detail,
+    .mdc-theme--dark .mdc-persistent-drawer .mdc-list-item__start-detail {
+      color: rgba(255, 255, 255, 0.54); }
+  .mdc-persistent-drawer--selected.mdc-list-item,
+  .mdc-persistent-drawer--selected.mdc-list-item .mdc-list-item__start-detail {
+    /* @alternate */
+    color: #3f51b5;
+    color: var(--mdc-theme-primary, #3f51b5); }
+  .mdc-persistent-drawer .mdc-list-item::before {
+    position: absolute;
+    top: 0;
+    left: 0;
+    width: 100%;
+    height: 100%;
+    -webkit-transition: opacity 120ms 0ms cubic-bezier(0.4, 0, 0.6, 1);
+    transition: opacity 120ms 0ms cubic-bezier(0.4, 0, 0.6, 1);
+    border-radius: inherit;
+    background: currentColor;
+    content: "";
+    opacity: 0; }
+  .mdc-persistent-drawer .mdc-list-item:focus::before {
+    -webkit-transition: opacity 180ms 0ms cubic-bezier(0, 0, 0.2, 1);
+    transition: opacity 180ms 0ms cubic-bezier(0, 0, 0.2, 1);
+    opacity: .12; }
+  .mdc-persistent-drawer .mdc-list-item:active::before {
+    /*
+      Slightly darker value for visual distinction.
+      This allows a full base that has distinct modes.
+      Progressive enhancement with ripples will provide complete button spec alignment.
+    */
+    -webkit-transition: opacity 180ms 0ms cubic-bezier(0, 0, 0.2, 1);
+    transition: opacity 180ms 0ms cubic-bezier(0, 0, 0.2, 1);
+    opacity: .18; }
+  .mdc-persistent-drawer .mdc-list-item:active:focus::before {
+    -webkit-transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);
+            transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1); }
+  .mdc-persistent-drawer__drawer {
+    /* @alternate */
+    background: #fff;
+    background: var(--mdc-theme-background, #fff);
+    border-left: 0;
+    border-right: 1px solid #e4e4e4;
+    left: 0;
+    right: initial;
+    height: 100%;
+    -webkit-transform: translateX(-107%);
+            transform: translateX(-107%);
+    -webkit-transform: translateX(calc(-100% - 20px));
+            transform: translateX(calc(-100% - 20px));
+    will-change: transform;
+    display: -webkit-inline-box;
+    display: -ms-inline-flexbox;
+    display: inline-flex;
+    -webkit-box-orient: vertical;
+    -webkit-box-direction: normal;
+        -ms-flex-direction: column;
+            flex-direction: column;
+    -webkit-box-sizing: border-box;
+            box-sizing: border-box;
+    width: 240px;
+    overflow: hidden;
+    -ms-touch-action: none;
+        touch-action: none; }
+    [dir="rtl"] .mdc-persistent-drawer__drawer, .mdc-persistent-drawer__drawer[dir="rtl"] {
+      border-left: 1px solid #e4e4e4;
+      border-right: 0; }
+    [dir="rtl"] .mdc-persistent-drawer__drawer, .mdc-persistent-drawer__drawer[dir="rtl"] {
+      left: initial;
+      right: 0; }
+    .mdc-persistent-drawer__drawer--theme-dark,
+    .mdc-theme--dark .mdc-persistent-drawer__drawer {
+      background-color: #212121;
+      background-color: var(--mdc-persistent-drawer-dark-theme-bg-color, #212121);
+      /* @alternate */
+      color: white;
+      color: var(--mdc-theme-text-primary-on-dark, white);
+      border-left: 0;
+      border-right: 1px solid rgba(255, 255, 255, 0.12); }
+      [dir="rtl"] .mdc-persistent-drawer__drawer--theme-dark, .mdc-persistent-drawer__drawer--theme-dark[dir="rtl"], [dir="rtl"]
+      .mdc-theme--dark .mdc-persistent-drawer__drawer,
+      .mdc-theme--dark .mdc-persistent-drawer__drawer[dir="rtl"] {
+        border-left: 1px solid rgba(255, 255, 255, 0.12);
+        border-right: 0; }
+    [dir="rtl"] .mdc-persistent-drawer .mdc-persistent-drawer__drawer,
+    .mdc-persistent-drawer[dir="rtl"] .mdc-persistent-drawer__drawer {
+      -webkit-transform: translateX(107%);
+              transform: translateX(107%);
+      -webkit-transform: translateX(calc(100% + 20px));
+              transform: translateX(calc(100% + 20px)); }
+  .mdc-persistent-drawer--animating .mdc-persistent-drawer__drawer {
+    -webkit-transition: -webkit-transform 0.195s 0ms cubic-bezier(0.4, 0, 0.6, 1);
+    transition: -webkit-transform 0.195s 0ms cubic-bezier(0.4, 0, 0.6, 1);
+    transition: transform 0.195s 0ms cubic-bezier(0.4, 0, 0.6, 1);
+    transition: transform 0.195s 0ms cubic-bezier(0.4, 0, 0.6, 1), -webkit-transform 0.195s 0ms cubic-bezier(0.4, 0, 0.6, 1); }
+  .mdc-persistent-drawer--animating.mdc-persistent-drawer--open .mdc-persistent-drawer__drawer {
+    -webkit-transition: -webkit-transform 0.225s 0ms cubic-bezier(0, 0, 0.2, 1);
+    transition: -webkit-transform 0.225s 0ms cubic-bezier(0, 0, 0.2, 1);
+    transition: transform 0.225s 0ms cubic-bezier(0, 0, 0.2, 1);
+    transition: transform 0.225s 0ms cubic-bezier(0, 0, 0.2, 1), -webkit-transform 0.225s 0ms cubic-bezier(0, 0, 0.2, 1); }
+  .mdc-persistent-drawer--open {
+    width: 240px;
+    pointer-events: auto; }
+    .mdc-persistent-drawer--open .mdc-persistent-drawer__drawer {
+      -webkit-transform: none;
+              transform: none; }
+    [dir="rtl"] .mdc-persistent-drawer--open .mdc-persistent-drawer__drawer, .mdc-persistent-drawer--open[dir="rtl"] .mdc-persistent-drawer__drawer {
+      -webkit-transform: none;
+              transform: none; }
+
+/**
+ * Creates a rule that will be applied when an MDC-Web component is within the context of an RTL layout.
+ *
+ * Usage Example:
+ * ```scss
+ * .mdc-foo {
+ *   position: absolute;
+ *   left: 0;
+ *
+ *   @include mdc-rtl {
+ *     left: auto;
+ *     right: 0;
+ *   }
+ *
+ *   &__bar {
+ *     margin-left: 4px;
+ *     @include mdc-rtl(".mdc-foo") {
+ *       margin-left: auto;
+ *       margin-right: 4px;
+ *     }
+ *   }
+ * }
+ *
+ * .mdc-foo--mod {
+ *   padding-left: 4px;
+ *
+ *   @include mdc-rtl {
+ *     padding-left: auto;
+ *     padding-right: 4px;
+ *   }
+ * }
+ * ```
+ *
+ * Note that this works by checking for [dir="rtl"] on an ancestor element. While this will work
+ * in most cases, it will in some cases lead to false negatives, e.g.
+ *
+ * ```html
+ * <html dir="rtl">
+ *   <!-- ... -->
+ *   <div dir="ltr">
+ *     <div class="mdc-foo">Styled incorrectly as RTL!</div>
+ *   </div>
+ * </html>
+ * ```
+ *
+ * In the future, selectors such as :dir (http://mdn.io/:dir) will help us mitigate this.
+ */
+/**
+ * Takes a base box-model property - e.g. margin / border / padding - along with a default
+ * direction and value, and emits rules which apply the value to the
+ * "<base-property>-<default-direction>" property by default, but flips the direction
+ * when within an RTL context.
+ *
+ * For example:
+ *
+ * ```scss
+ * .mdc-foo {
+ *   @include mdc-rtl-reflexive-box(margin, left, 8px);
+ * }
+ * ```
+ * is equivalent to:
+ *
+ * ```scss
+ * .mdc-foo {
+ *   margin-left: 8px;
+ *
+ *   @include mdc-rtl {
+ *     margin-right: 8px;
+ *     margin-left: 0;
+ *   }
+ * }
+ * ```
+ * whereas:
+ *
+ * ```scss
+ * .mdc-foo {
+ *   @include mdc-rtl-reflexive-box(margin, right, 8px);
+ * }
+ * ```
+ * is equivalent to:
+ *
+ * ```scss
+ * .mdc-foo {
+ *   margin-right: 8px;
+ *
+ *   @include mdc-rtl {
+ *     margin-right: 0;
+ *     margin-left: 8px;
+ *   }
+ * }
+ * ```
+ *
+ * You can also pass a 4th optional $root-selector argument which will be forwarded to `mdc-rtl`,
+ * e.g. `@include mdc-rtl-reflexive-box(margin, left, 8px, ".mdc-component")`.
+ *
+ * Note that this function will always zero out the original value in an RTL context. If you're
+ * trying to flip the values, use mdc-rtl-reflexive-property().
+ */
+/**
+ * Takes a base property and emits rules that assign <base-property>-left to <left-value> and
+ * <base-property>-right to <right-value> in a LTR context, and vice versa in a RTL context.
+ * For example:
+ *
+ * ```scss
+ * .mdc-foo {
+ *   @include mdc-rtl-reflexive-property(margin, auto, 12px);
+ * }
+ * ```
+ * is equivalent to:
+ *
+ * ```scss
+ * .mdc-foo {
+ *   margin-left: auto;
+ *   margin-right: 12px;
+ *
+ *   @include mdc-rtl {
+ *     margin-left: 12px;
+ *     margin-right: auto;
+ *   }
+ * }
+ * ```
+ *
+ * A 4th optional $root-selector argument can be given, which will be passed to `mdc-rtl`.
+ */
+/**
+ * Takes an argument specifying a horizontal position property (either "left" or "right") as well
+ * as a value, and applies that value to the specified position in a LTR context, and flips it in a
+ * RTL context. For example:
+ *
+ * ```scss
+ * .mdc-foo {
+ *   @include mdc-rtl-reflexive-position(left, 0);
+ *   position: absolute;
+ * }
+ * ```
+ * is equivalent to:
+ *
+ * ```scss
+ *  .mdc-foo {
+ *    position: absolute;
+ *    left: 0;
+ *    right: initial;
+ *
+ *    @include mdc-rtl {
+ *      right: 0;
+ *      left: initial;
+ *    }
+ *  }
+ * ```
+ * An optional third $root-selector argument may also be given, which is passed to `mdc-rtl`.
+ */
+/*
+  Precomputed linear color channel values, for use in contrast calculations.
+  See https://www.w3.org/TR/WCAG20-TECHS/G17.html#G17-tests
+
+  Algorithm, for c in 0 to 255:
+  f(c) {
+    c = c / 255;
+    return c < 0.03928 ? c / 12.92 : Math.pow((c + 0.055) / 1.055, 2.4);
+  }
+
+  This lookup table is needed since there is no `pow` in SASS.
+*/
+/**
+ * Calculate the luminance for a color.
+ * See https://www.w3.org/TR/WCAG20-TECHS/G17.html#G17-tests
+ */
+/**
+ * Calculate the contrast ratio between two colors.
+ * See https://www.w3.org/TR/WCAG20-TECHS/G17.html#G17-tests
+ */
+/**
+ * Determine whether to use dark or light text on top of given color.
+ * Returns "dark" for dark text and "light" for light text.
+ */
+/*
+  Main theme colors.
+  If you're a user customizing your color scheme in SASS, these are probably the only variables you need to change.
+*/
+/* Indigo 500 */
+/* Pink A200 */
+/* White */
+/* Which set of text colors to use for each main theme color (light or dark) */
+/* Text colors according to light vs dark and text type */
+/* Primary text colors for each of the theme colors */
+/**
+ * Applies the correct theme color style to the specified property.
+ * $property is typically color or background-color, but can be any CSS property that accepts color values.
+ * $style should be one of the map keys in $mdc-theme-property-values (_variables.scss).
+ */
+/**
+ * Creates a rule to be used in MDC-Web components for dark theming, and applies the provided contents.
+ * Should provide the $root-selector option if applied to anything other than the root selector.
+ * When used with a modifier class, provide a second argument of `true` for the $compound parameter
+ * to specify that this should be attached as a compound class.
+ *
+ * Usage example:
+ *
+ * ```scss
+ * .mdc-foo {
+ *   color: black;
+ *
+ *   @include mdc-theme-dark {
+ *     color: white;
+ *   }
+ *
+ *   &__bar {
+ *     background: black;
+ *
+ *     @include mdc-theme-dark(".mdc-foo") {
+ *       background: white;
+ *     }
+ *   }
+ * }
+ *
+ * .mdc-foo--disabled {
+ *   opacity: .38;
+ *
+ *   @include mdc-theme-dark(".mdc-foo", true) {
+ *     opacity: .5;
+ *   }
+ * }
+ * ```
+ */
+/*
+  Precomputed linear color channel values, for use in contrast calculations.
+  See https://www.w3.org/TR/WCAG20-TECHS/G17.html#G17-tests
+
+  Algorithm, for c in 0 to 255:
+  f(c) {
+    c = c / 255;
+    return c < 0.03928 ? c / 12.92 : Math.pow((c + 0.055) / 1.055, 2.4);
+  }
+
+  This lookup table is needed since there is no `pow` in SASS.
+*/
+/**
+ * Calculate the luminance for a color.
+ * See https://www.w3.org/TR/WCAG20-TECHS/G17.html#G17-tests
+ */
+/**
+ * Calculate the contrast ratio between two colors.
+ * See https://www.w3.org/TR/WCAG20-TECHS/G17.html#G17-tests
+ */
+/**
+ * Determine whether to use dark or light text on top of given color.
+ * Returns "dark" for dark text and "light" for light text.
+ */
+/*
+  Main theme colors.
+  If you're a user customizing your color scheme in SASS, these are probably the only variables you need to change.
+*/
+/* Indigo 500 */
+/* Pink A200 */
+/* White */
+/* Which set of text colors to use for each main theme color (light or dark) */
+/* Text colors according to light vs dark and text type */
+/* Primary text colors for each of the theme colors */
+/**
+ * Applies the correct theme color style to the specified property.
+ * $property is typically color or background-color, but can be any CSS property that accepts color values.
+ * $style should be one of the map keys in $mdc-theme-property-values (_variables.scss).
+ */
+/**
+ * Creates a rule to be used in MDC-Web components for dark theming, and applies the provided contents.
+ * Should provide the $root-selector option if applied to anything other than the root selector.
+ * When used with a modifier class, provide a second argument of `true` for the $compound parameter
+ * to specify that this should be attached as a compound class.
+ *
+ * Usage example:
+ *
+ * ```scss
+ * .mdc-foo {
+ *   color: black;
+ *
+ *   @include mdc-theme-dark {
+ *     color: white;
+ *   }
+ *
+ *   &__bar {
+ *     background: black;
+ *
+ *     @include mdc-theme-dark(".mdc-foo") {
+ *       background: white;
+ *     }
+ *   }
+ * }
+ *
+ * .mdc-foo--disabled {
+ *   opacity: .38;
+ *
+ *   @include mdc-theme-dark(".mdc-foo", true) {
+ *     opacity: .5;
+ *   }
+ * }
+ * ```
+ */
+/* TODO(sgomes): Figure out what to do about desktop font sizes. */
+/* TODO(sgomes): Figure out what to do about i18n and i18n font sizes. */
+:root {
+  --mdc-permanent-drawer-dark-theme-bg-color: #212121; }
+
+.mdc-permanent-drawer {
+  /* Use aspect ratio trick to maintain 16:9 aspect ratio on the header */
+  /* stylelint-disable selector-no-qualifying-type */
+  /* stylelint-enable selector-no-qualifying-type */
+  /* TODO(sgomes): Revisit when we have interactive lists. */
+  /* @alternate */
+  background: #fff;
+  background: var(--mdc-theme-background, #fff);
+  border-left: 0;
+  border-right: 1px solid #e4e4e4;
+  left: 0;
+  right: initial;
+  display: -webkit-inline-box;
+  display: -ms-inline-flexbox;
+  display: inline-flex;
+  -webkit-box-orient: vertical;
+  -webkit-box-direction: normal;
+      -ms-flex-direction: column;
+          flex-direction: column;
+  -webkit-box-flex: 0;
+      -ms-flex: 0 0 auto;
+          flex: 0 0 auto;
+  width: 240px;
+  -webkit-box-sizing: border-box;
+          box-sizing: border-box;
+  overflow: hidden; }
+  .mdc-permanent-drawer__toolbar-spacer {
+    display: -webkit-box;
+    display: -ms-flexbox;
+    display: flex;
+    position: relative;
+    -webkit-box-orient: horizontal;
+    -webkit-box-direction: normal;
+        -ms-flex-direction: row;
+            flex-direction: row;
+    -ms-flex-negative: 0;
+        flex-shrink: 0;
+    -webkit-box-align: flex-center;
+        -ms-flex-align: flex-center;
+            align-items: flex-center;
+    height: 56px;
+    padding: 16px;
+    border-bottom: 1px solid rgba(0, 0, 0, 0.12);
+    -webkit-box-sizing: border-box;
+            box-sizing: border-box;
+    /* TODO(sgomes): replace with global breakpoints when we have them */ }
+    .mdc-permanent-drawer__toolbar-spacer--theme-dark .mdc-permanent-drawer__toolbar-spacer,
+    .mdc-theme--dark .mdc-permanent-drawer__toolbar-spacer {
+      border-bottom: 1px solid rgba(255, 255, 255, 0.12); }
+    @media (min-width: 600px) {
+      .mdc-permanent-drawer__toolbar-spacer {
+        height: 64px; } }
+  .mdc-permanent-drawer__header {
+    position: relative; }
+  .mdc-permanent-drawer__header::before {
+    display: block;
+    padding-top: 56.25%;
+    content: ""; }
+  .mdc-permanent-drawer__header-content {
+    display: -webkit-box;
+    display: -ms-flexbox;
+    display: flex;
+    position: absolute;
+    top: 0;
+    right: 0;
+    bottom: 0;
+    left: 0;
+    -webkit-box-align: end;
+        -ms-flex-align: end;
+            align-items: flex-end;
+    padding: 16px;
+    -webkit-box-sizing: border-box;
+            box-sizing: border-box; }
+  .mdc-permanent-drawer .mdc-list-group,
+  .mdc-permanent-drawer .mdc-list {
+    padding-right: 0;
+    padding-left: 0; }
+  .mdc-permanent-drawer .mdc-list-item {
+    position: relative;
+    padding: 0 16px;
+    outline: none;
+    color: inherit;
+    text-decoration: none;
+    font-family: Roboto, sans-serif;
+    -moz-osx-font-smoothing: grayscale;
+    -webkit-font-smoothing: antialiased;
+    font-size: 0.875rem;
+    font-weight: 500;
+    letter-spacing: 0.04em;
+    line-height: 1.5rem;
+    text-decoration: inherit;
+    text-transform: inherit; }
+    .mdc-permanent-drawer .mdc-list-item.mdc-ripple-upgraded {
+      left: 0; }
+  .mdc-permanent-drawer .mdc-list-item__start-detail {
+    color: rgba(0, 0, 0, 0.54); }
+    .mdc-permanent-drawer .mdc-list-item__start-detail--theme-dark .mdc-permanent-drawer .mdc-list-item__start-detail,
+    .mdc-theme--dark .mdc-permanent-drawer .mdc-list-item__start-detail {
+      color: rgba(255, 255, 255, 0.54); }
+  .mdc-permanent-drawer--selected.mdc-list-item,
+  .mdc-permanent-drawer--selected.mdc-list-item .mdc-list-item__start-detail {
+    /* @alternate */
+    color: #3f51b5;
+    color: var(--mdc-theme-primary, #3f51b5); }
+  .mdc-permanent-drawer .mdc-list-item::before {
+    position: absolute;
+    top: 0;
+    left: 0;
+    width: 100%;
+    height: 100%;
+    -webkit-transition: opacity 120ms 0ms cubic-bezier(0.4, 0, 0.6, 1);
+    transition: opacity 120ms 0ms cubic-bezier(0.4, 0, 0.6, 1);
+    border-radius: inherit;
+    background: currentColor;
+    content: "";
+    opacity: 0; }
+  .mdc-permanent-drawer .mdc-list-item:focus::before {
+    -webkit-transition: opacity 180ms 0ms cubic-bezier(0, 0, 0.2, 1);
+    transition: opacity 180ms 0ms cubic-bezier(0, 0, 0.2, 1);
+    opacity: .12; }
+  .mdc-permanent-drawer .mdc-list-item:active::before {
+    /*
+      Slightly darker value for visual distinction.
+      This allows a full base that has distinct modes.
+      Progressive enhancement with ripples will provide complete button spec alignment.
+    */
+    -webkit-transition: opacity 180ms 0ms cubic-bezier(0, 0, 0.2, 1);
+    transition: opacity 180ms 0ms cubic-bezier(0, 0, 0.2, 1);
+    opacity: .18; }
+  .mdc-permanent-drawer .mdc-list-item:active:focus::before {
+    -webkit-transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);
+            transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1); }
+  [dir="rtl"] .mdc-permanent-drawer, .mdc-permanent-drawer[dir="rtl"] {
+    border-left: 1px solid #e4e4e4;
+    border-right: 0; }
+  [dir="rtl"] .mdc-permanent-drawer, .mdc-permanent-drawer[dir="rtl"] {
+    left: initial;
+    right: 0; }
+  .mdc-permanent-drawer--theme-dark,
+  .mdc-theme--dark .mdc-permanent-drawer {
+    background-color: #212121;
+    background-color: var(--mdc-permanent-drawer-dark-theme-bg-color, #212121);
+    /* @alternate */
+    color: white;
+    color: var(--mdc-theme-text-primary-on-dark, white);
+    border-left: 0;
+    border-right: 1px solid rgba(255, 255, 255, 0.12); }
+    [dir="rtl"] .mdc-permanent-drawer--theme-dark, .mdc-permanent-drawer--theme-dark[dir="rtl"], [dir="rtl"]
+    .mdc-theme--dark .mdc-permanent-drawer,
+    .mdc-theme--dark .mdc-permanent-drawer[dir="rtl"] {
+      border-left: 1px solid rgba(255, 255, 255, 0.12);
+      border-right: 0; }
+  .mdc-permanent-drawer--floating {
+    background: none;
+    border-left: 0;
+    border-right: none; }
+    [dir="rtl"] .mdc-permanent-drawer--floating, .mdc-permanent-drawer--floating[dir="rtl"] {
+      border-left: none;
+      border-right: 0; }
+    .mdc-permanent-drawer--floating--theme-dark,
+    .mdc-theme--dark .mdc-permanent-drawer--floating {
+      background: none;
+      border-left: 0;
+      border-right: none; }
+      [dir="rtl"] .mdc-permanent-drawer--floating--theme-dark, .mdc-permanent-drawer--floating--theme-dark[dir="rtl"], [dir="rtl"]
+      .mdc-theme--dark .mdc-permanent-drawer--floating,
+      .mdc-theme--dark .mdc-permanent-drawer--floating[dir="rtl"] {
+        border-left: none;
+        border-right: 0; }
+
+/**
+ * The css property used for elevation. In most cases this should not be changed. It is exposed
+ * as a variable for abstraction / easy use when needing to reference the property directly, for
+ * example in a `will-change` rule.
+ */
+/**
+ * The default duration value for elevation transitions.
+ */
+/**
+ * The default easing value for elevation transitions.
+ */
+/**
+ * Applies the correct css rules to an element to give it the elevation specified by $z-value.
+ * The $z-value must be between 0 and 24.
+ */
+/**
+ * Returns a string that can be used as the value for a `transition` property for elevation.
+ * Calling this function directly is useful in situations where a component needs to transition
+ * more than one property.
+ *
+ * ```scss
+ * .foo {
+ *   transition: mdc-elevation-transition-rule(), opacity 100ms ease;
+ *   will-change: $mdc-elevation-property, opacity;
+ * }
+ * ```
+ */
+/**
+ * Applies the correct css rules needed to have an element transition between elevations.
+ * This mixin should be applied to elements whose elevation values will change depending on their
+ * context (e.g. when active or disabled).
+ */
+/**
+ * Creates a rule that will be applied when an MDC-Web component is within the context of an RTL layout.
+ *
+ * Usage Example:
+ * ```scss
+ * .mdc-foo {
+ *   position: absolute;
+ *   left: 0;
+ *
+ *   @include mdc-rtl {
+ *     left: auto;
+ *     right: 0;
+ *   }
+ *
+ *   &__bar {
+ *     margin-left: 4px;
+ *     @include mdc-rtl(".mdc-foo") {
+ *       margin-left: auto;
+ *       margin-right: 4px;
+ *     }
+ *   }
+ * }
+ *
+ * .mdc-foo--mod {
+ *   padding-left: 4px;
+ *
+ *   @include mdc-rtl {
+ *     padding-left: auto;
+ *     padding-right: 4px;
+ *   }
+ * }
+ * ```
+ *
+ * Note that this works by checking for [dir="rtl"] on an ancestor element. While this will work
+ * in most cases, it will in some cases lead to false negatives, e.g.
+ *
+ * ```html
+ * <html dir="rtl">
+ *   <!-- ... -->
+ *   <div dir="ltr">
+ *     <div class="mdc-foo">Styled incorrectly as RTL!</div>
+ *   </div>
+ * </html>
+ * ```
+ *
+ * In the future, selectors such as :dir (http://mdn.io/:dir) will help us mitigate this.
+ */
+/**
+ * Takes a base box-model property - e.g. margin / border / padding - along with a default
+ * direction and value, and emits rules which apply the value to the
+ * "<base-property>-<default-direction>" property by default, but flips the direction
+ * when within an RTL context.
+ *
+ * For example:
+ *
+ * ```scss
+ * .mdc-foo {
+ *   @include mdc-rtl-reflexive-box(margin, left, 8px);
+ * }
+ * ```
+ * is equivalent to:
+ *
+ * ```scss
+ * .mdc-foo {
+ *   margin-left: 8px;
+ *
+ *   @include mdc-rtl {
+ *     margin-right: 8px;
+ *     margin-left: 0;
+ *   }
+ * }
+ * ```
+ * whereas:
+ *
+ * ```scss
+ * .mdc-foo {
+ *   @include mdc-rtl-reflexive-box(margin, right, 8px);
+ * }
+ * ```
+ * is equivalent to:
+ *
+ * ```scss
+ * .mdc-foo {
+ *   margin-right: 8px;
+ *
+ *   @include mdc-rtl {
+ *     margin-right: 0;
+ *     margin-left: 8px;
+ *   }
+ * }
+ * ```
+ *
+ * You can also pass a 4th optional $root-selector argument which will be forwarded to `mdc-rtl`,
+ * e.g. `@include mdc-rtl-reflexive-box(margin, left, 8px, ".mdc-component")`.
+ *
+ * Note that this function will always zero out the original value in an RTL context. If you're
+ * trying to flip the values, use mdc-rtl-reflexive-property().
+ */
+/**
+ * Takes a base property and emits rules that assign <base-property>-left to <left-value> and
+ * <base-property>-right to <right-value> in a LTR context, and vice versa in a RTL context.
+ * For example:
+ *
+ * ```scss
+ * .mdc-foo {
+ *   @include mdc-rtl-reflexive-property(margin, auto, 12px);
+ * }
+ * ```
+ * is equivalent to:
+ *
+ * ```scss
+ * .mdc-foo {
+ *   margin-left: auto;
+ *   margin-right: 12px;
+ *
+ *   @include mdc-rtl {
+ *     margin-left: 12px;
+ *     margin-right: auto;
+ *   }
+ * }
+ * ```
+ *
+ * A 4th optional $root-selector argument can be given, which will be passed to `mdc-rtl`.
+ */
+/**
+ * Takes an argument specifying a horizontal position property (either "left" or "right") as well
+ * as a value, and applies that value to the specified position in a LTR context, and flips it in a
+ * RTL context. For example:
+ *
+ * ```scss
+ * .mdc-foo {
+ *   @include mdc-rtl-reflexive-position(left, 0);
+ *   position: absolute;
+ * }
+ * ```
+ * is equivalent to:
+ *
+ * ```scss
+ *  .mdc-foo {
+ *    position: absolute;
+ *    left: 0;
+ *    right: initial;
+ *
+ *    @include mdc-rtl {
+ *      right: 0;
+ *      left: initial;
+ *    }
+ *  }
+ * ```
+ * An optional third $root-selector argument may also be given, which is passed to `mdc-rtl`.
+ */
+/*
+  Precomputed linear color channel values, for use in contrast calculations.
+  See https://www.w3.org/TR/WCAG20-TECHS/G17.html#G17-tests
+
+  Algorithm, for c in 0 to 255:
+  f(c) {
+    c = c / 255;
+    return c < 0.03928 ? c / 12.92 : Math.pow((c + 0.055) / 1.055, 2.4);
+  }
+
+  This lookup table is needed since there is no `pow` in SASS.
+*/
+/**
+ * Calculate the luminance for a color.
+ * See https://www.w3.org/TR/WCAG20-TECHS/G17.html#G17-tests
+ */
+/**
+ * Calculate the contrast ratio between two colors.
+ * See https://www.w3.org/TR/WCAG20-TECHS/G17.html#G17-tests
+ */
+/**
+ * Determine whether to use dark or light text on top of given color.
+ * Returns "dark" for dark text and "light" for light text.
+ */
+/*
+  Main theme colors.
+  If you're a user customizing your color scheme in SASS, these are probably the only variables you need to change.
+*/
+/* Indigo 500 */
+/* Pink A200 */
+/* White */
+/* Which set of text colors to use for each main theme color (light or dark) */
+/* Text colors according to light vs dark and text type */
+/* Primary text colors for each of the theme colors */
+/**
+ * Applies the correct theme color style to the specified property.
+ * $property is typically color or background-color, but can be any CSS property that accepts color values.
+ * $style should be one of the map keys in $mdc-theme-property-values (_variables.scss).
+ */
+/**
+ * Creates a rule to be used in MDC-Web components for dark theming, and applies the provided contents.
+ * Should provide the $root-selector option if applied to anything other than the root selector.
+ * When used with a modifier class, provide a second argument of `true` for the $compound parameter
+ * to specify that this should be attached as a compound class.
+ *
+ * Usage example:
+ *
+ * ```scss
+ * .mdc-foo {
+ *   color: black;
+ *
+ *   @include mdc-theme-dark {
+ *     color: white;
+ *   }
+ *
+ *   &__bar {
+ *     background: black;
+ *
+ *     @include mdc-theme-dark(".mdc-foo") {
+ *       background: white;
+ *     }
+ *   }
+ * }
+ *
+ * .mdc-foo--disabled {
+ *   opacity: .38;
+ *
+ *   @include mdc-theme-dark(".mdc-foo", true) {
+ *     opacity: .5;
+ *   }
+ * }
+ * ```
+ */
+/*
+  Precomputed linear color channel values, for use in contrast calculations.
+  See https://www.w3.org/TR/WCAG20-TECHS/G17.html#G17-tests
+
+  Algorithm, for c in 0 to 255:
+  f(c) {
+    c = c / 255;
+    return c < 0.03928 ? c / 12.92 : Math.pow((c + 0.055) / 1.055, 2.4);
+  }
+
+  This lookup table is needed since there is no `pow` in SASS.
+*/
+/**
+ * Calculate the luminance for a color.
+ * See https://www.w3.org/TR/WCAG20-TECHS/G17.html#G17-tests
+ */
+/**
+ * Calculate the contrast ratio between two colors.
+ * See https://www.w3.org/TR/WCAG20-TECHS/G17.html#G17-tests
+ */
+/**
+ * Determine whether to use dark or light text on top of given color.
+ * Returns "dark" for dark text and "light" for light text.
+ */
+/*
+  Main theme colors.
+  If you're a user customizing your color scheme in SASS, these are probably the only variables you need to change.
+*/
+/* Indigo 500 */
+/* Pink A200 */
+/* White */
+/* Which set of text colors to use for each main theme color (light or dark) */
+/* Text colors according to light vs dark and text type */
+/* Primary text colors for each of the theme colors */
+/**
+ * Applies the correct theme color style to the specified property.
+ * $property is typically color or background-color, but can be any CSS property that accepts color values.
+ * $style should be one of the map keys in $mdc-theme-property-values (_variables.scss).
+ */
+/**
+ * Creates a rule to be used in MDC-Web components for dark theming, and applies the provided contents.
+ * Should provide the $root-selector option if applied to anything other than the root selector.
+ * When used with a modifier class, provide a second argument of `true` for the $compound parameter
+ * to specify that this should be attached as a compound class.
+ *
+ * Usage example:
+ *
+ * ```scss
+ * .mdc-foo {
+ *   color: black;
+ *
+ *   @include mdc-theme-dark {
+ *     color: white;
+ *   }
+ *
+ *   &__bar {
+ *     background: black;
+ *
+ *     @include mdc-theme-dark(".mdc-foo") {
+ *       background: white;
+ *     }
+ *   }
+ * }
+ *
+ * .mdc-foo--disabled {
+ *   opacity: .38;
+ *
+ *   @include mdc-theme-dark(".mdc-foo", true) {
+ *     opacity: .5;
+ *   }
+ * }
+ * ```
+ */
+/* TODO(sgomes): Figure out what to do about desktop font sizes. */
+/* TODO(sgomes): Figure out what to do about i18n and i18n font sizes. */
+/**
+ * Copyright 2016 Google Inc. All Rights Reserved.
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *      http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+/**
+ * Creates a rule that will be applied when an MDC-Web component is within the context of an RTL layout.
+ *
+ * Usage Example:
+ * ```scss
+ * .mdc-foo {
+ *   position: absolute;
+ *   left: 0;
+ *
+ *   @include mdc-rtl {
+ *     left: auto;
+ *     right: 0;
+ *   }
+ *
+ *   &__bar {
+ *     margin-left: 4px;
+ *     @include mdc-rtl(".mdc-foo") {
+ *       margin-left: auto;
+ *       margin-right: 4px;
+ *     }
+ *   }
+ * }
+ *
+ * .mdc-foo--mod {
+ *   padding-left: 4px;
+ *
+ *   @include mdc-rtl {
+ *     padding-left: auto;
+ *     padding-right: 4px;
+ *   }
+ * }
+ * ```
+ *
+ * Note that this works by checking for [dir="rtl"] on an ancestor element. While this will work
+ * in most cases, it will in some cases lead to false negatives, e.g.
+ *
+ * ```html
+ * <html dir="rtl">
+ *   <!-- ... -->
+ *   <div dir="ltr">
+ *     <div class="mdc-foo">Styled incorrectly as RTL!</div>
+ *   </div>
+ * </html>
+ * ```
+ *
+ * In the future, selectors such as :dir (http://mdn.io/:dir) will help us mitigate this.
+ */
+/**
+ * Takes a base box-model property - e.g. margin / border / padding - along with a default
+ * direction and value, and emits rules which apply the value to the
+ * "<base-property>-<default-direction>" property by default, but flips the direction
+ * when within an RTL context.
+ *
+ * For example:
+ *
+ * ```scss
+ * .mdc-foo {
+ *   @include mdc-rtl-reflexive-box(margin, left, 8px);
+ * }
+ * ```
+ * is equivalent to:
+ *
+ * ```scss
+ * .mdc-foo {
+ *   margin-left: 8px;
+ *
+ *   @include mdc-rtl {
+ *     margin-right: 8px;
+ *     margin-left: 0;
+ *   }
+ * }
+ * ```
+ * whereas:
+ *
+ * ```scss
+ * .mdc-foo {
+ *   @include mdc-rtl-reflexive-box(margin, right, 8px);
+ * }
+ * ```
+ * is equivalent to:
+ *
+ * ```scss
+ * .mdc-foo {
+ *   margin-right: 8px;
+ *
+ *   @include mdc-rtl {
+ *     margin-right: 0;
+ *     margin-left: 8px;
+ *   }
+ * }
+ * ```
+ *
+ * You can also pass a 4th optional $root-selector argument which will be forwarded to `mdc-rtl`,
+ * e.g. `@include mdc-rtl-reflexive-box(margin, left, 8px, ".mdc-component")`.
+ *
+ * Note that this function will always zero out the original value in an RTL context. If you're
+ * trying to flip the values, use mdc-rtl-reflexive-property().
+ */
+/**
+ * Takes a base property and emits rules that assign <base-property>-left to <left-value> and
+ * <base-property>-right to <right-value> in a LTR context, and vice versa in a RTL context.
+ * For example:
+ *
+ * ```scss
+ * .mdc-foo {
+ *   @include mdc-rtl-reflexive-property(margin, auto, 12px);
+ * }
+ * ```
+ * is equivalent to:
+ *
+ * ```scss
+ * .mdc-foo {
+ *   margin-left: auto;
+ *   margin-right: 12px;
+ *
+ *   @include mdc-rtl {
+ *     margin-left: 12px;
+ *     margin-right: auto;
+ *   }
+ * }
+ * ```
+ *
+ * A 4th optional $root-selector argument can be given, which will be passed to `mdc-rtl`.
+ */
+/**
+ * Takes an argument specifying a horizontal position property (either "left" or "right") as well
+ * as a value, and applies that value to the specified position in a LTR context, and flips it in a
+ * RTL context. For example:
+ *
+ * ```scss
+ * .mdc-foo {
+ *   @include mdc-rtl-reflexive-position(left, 0);
+ *   position: absolute;
+ * }
+ * ```
+ * is equivalent to:
+ *
+ * ```scss
+ *  .mdc-foo {
+ *    position: absolute;
+ *    left: 0;
+ *    right: initial;
+ *
+ *    @include mdc-rtl {
+ *      right: 0;
+ *      left: initial;
+ *    }
+ *  }
+ * ```
+ * An optional third $root-selector argument may also be given, which is passed to `mdc-rtl`.
+ */
+/**
+ * Copyright 2016 Google Inc. All Rights Reserved.
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *      http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+.mdc-temporary-drawer {
+  /* Use aspect ratio trick to maintain 16:9 aspect ratio on the header */
+  /* stylelint-disable selector-no-qualifying-type */
+  /* stylelint-enable selector-no-qualifying-type */
+  /* TODO(sgomes): Revisit when we have interactive lists. */
+  position: fixed;
+  top: 0;
+  left: 0;
+  width: 100%;
+  height: 100%;
+  overflow: hidden;
+  pointer-events: none;
+  -webkit-box-sizing: border-box;
+          box-sizing: border-box;
+  contain: strict;
+  z-index: 5;
+  /* Shaded background */ }
+  .mdc-temporary-drawer__toolbar-spacer {
+    display: -webkit-box;
+    display: -ms-flexbox;
+    display: flex;
+    position: relative;
+    -webkit-box-orient: horizontal;
+    -webkit-box-direction: normal;
+        -ms-flex-direction: row;
+            flex-direction: row;
+    -ms-flex-negative: 0;
+        flex-shrink: 0;
+    -webkit-box-align: flex-center;
+        -ms-flex-align: flex-center;
+            align-items: flex-center;
+    height: 56px;
+    padding: 16px;
+    border-bottom: 1px solid rgba(0, 0, 0, 0.12);
+    -webkit-box-sizing: border-box;
+            box-sizing: border-box;
+    /* TODO(sgomes): replace with global breakpoints when we have them */ }
+    .mdc-temporary-drawer__toolbar-spacer--theme-dark .mdc-temporary-drawer__toolbar-spacer,
+    .mdc-theme--dark .mdc-temporary-drawer__toolbar-spacer {
+      border-bottom: 1px solid rgba(255, 255, 255, 0.12); }
+    @media (min-width: 600px) {
+      .mdc-temporary-drawer__toolbar-spacer {
+        height: 64px; } }
+  .mdc-temporary-drawer__header {
+    position: relative; }
+  .mdc-temporary-drawer__header::before {
+    display: block;
+    padding-top: 56.25%;
+    content: ""; }
+  .mdc-temporary-drawer__header-content {
+    display: -webkit-box;
+    display: -ms-flexbox;
+    display: flex;
+    position: absolute;
+    top: 0;
+    right: 0;
+    bottom: 0;
+    left: 0;
+    -webkit-box-align: end;
+        -ms-flex-align: end;
+            align-items: flex-end;
+    padding: 16px;
+    -webkit-box-sizing: border-box;
+            box-sizing: border-box; }
+  .mdc-temporary-drawer .mdc-list-group,
+  .mdc-temporary-drawer .mdc-list {
+    padding-right: 0;
+    padding-left: 0; }
+  .mdc-temporary-drawer .mdc-list-item {
+    position: relative;
+    padding: 0 16px;
+    outline: none;
+    color: inherit;
+    text-decoration: none;
+    font-family: Roboto, sans-serif;
+    -moz-osx-font-smoothing: grayscale;
+    -webkit-font-smoothing: antialiased;
+    font-size: 0.875rem;
+    font-weight: 500;
+    letter-spacing: 0.04em;
+    line-height: 1.5rem;
+    text-decoration: inherit;
+    text-transform: inherit; }
+    .mdc-temporary-drawer .mdc-list-item.mdc-ripple-upgraded {
+      left: 0; }
+  .mdc-temporary-drawer .mdc-list-item__start-detail {
+    color: rgba(0, 0, 0, 0.54); }
+    .mdc-temporary-drawer .mdc-list-item__start-detail--theme-dark .mdc-temporary-drawer .mdc-list-item__start-detail,
+    .mdc-theme--dark .mdc-temporary-drawer .mdc-list-item__start-detail {
+      color: rgba(255, 255, 255, 0.54); }
+  .mdc-temporary-drawer--selected.mdc-list-item,
+  .mdc-temporary-drawer--selected.mdc-list-item .mdc-list-item__start-detail {
+    /* @alternate */
+    color: #3f51b5;
+    color: var(--mdc-theme-primary, #3f51b5); }
+  .mdc-temporary-drawer .mdc-list-item::before {
+    position: absolute;
+    top: 0;
+    left: 0;
+    width: 100%;
+    height: 100%;
+    -webkit-transition: opacity 120ms 0ms cubic-bezier(0.4, 0, 0.6, 1);
+    transition: opacity 120ms 0ms cubic-bezier(0.4, 0, 0.6, 1);
+    border-radius: inherit;
+    background: currentColor;
+    content: "";
+    opacity: 0; }
+  .mdc-temporary-drawer .mdc-list-item:focus::before {
+    -webkit-transition: opacity 180ms 0ms cubic-bezier(0, 0, 0.2, 1);
+    transition: opacity 180ms 0ms cubic-bezier(0, 0, 0.2, 1);
+    opacity: .12; }
+  .mdc-temporary-drawer .mdc-list-item:active::before {
+    /*
+      Slightly darker value for visual distinction.
+      This allows a full base that has distinct modes.
+      Progressive enhancement with ripples will provide complete button spec alignment.
+    */
+    -webkit-transition: opacity 180ms 0ms cubic-bezier(0, 0, 0.2, 1);
+    transition: opacity 180ms 0ms cubic-bezier(0, 0, 0.2, 1);
+    opacity: .18; }
+  .mdc-temporary-drawer .mdc-list-item:active:focus::before {
+    -webkit-transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);
+            transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1); }
+  .mdc-temporary-drawer::before {
+    display: block;
+    position: absolute;
+    top: 0;
+    left: 0;
+    width: 100%;
+    height: 100%;
+    background: rgba(0, 0, 0, 0.6);
+    content: "";
+    opacity: 0;
+    opacity: var(--mdc-temporary-drawer-opacity, 0);
+    will-change: opacity;
+    -webkit-box-sizing: border-box;
+            box-sizing: border-box; }
+  .mdc-temporary-drawer__drawer {
+    /* @alternate */
+    background: #fff;
+    background: var(--mdc-theme-background, #fff);
+    -webkit-box-shadow: 0px 8px 10px -5px rgba(0, 0, 0, 0.2), 0px 16px 24px 2px rgba(0, 0, 0, 0.14), 0px 6px 30px 5px rgba(0, 0, 0, 0.12);
+            box-shadow: 0px 8px 10px -5px rgba(0, 0, 0, 0.2), 0px 16px 24px 2px rgba(0, 0, 0, 0.14), 0px 6px 30px 5px rgba(0, 0, 0, 0.12);
+    left: 0;
+    right: initial;
+    height: 100%;
+    -webkit-transform: translateX(-107%);
+            transform: translateX(-107%);
+    -webkit-transform: translateX(calc(-100% - 20px));
+            transform: translateX(calc(-100% - 20px));
+    will-change: transform;
+    display: -webkit-box;
+    display: -ms-flexbox;
+    display: flex;
+    position: absolute;
+    -webkit-box-orient: vertical;
+    -webkit-box-direction: normal;
+        -ms-flex-direction: column;
+            flex-direction: column;
+    width: calc(100% - 56px);
+    max-width: 280px;
+    -webkit-box-sizing: border-box;
+            box-sizing: border-box;
+    overflow: hidden;
+    -ms-touch-action: none;
+        touch-action: none;
+    /* TODO(sgomes): replace with global breakpoints when we have them */ }
+    [dir="rtl"] .mdc-temporary-drawer__drawer, .mdc-temporary-drawer__drawer[dir="rtl"] {
+      left: initial;
+      right: 0; }
+    .mdc-temporary-drawer--theme-dark .mdc-temporary-drawer__drawer,
+    .mdc-theme--dark .mdc-temporary-drawer__drawer {
+      background: #303030;
+      /* @alternate */
+      color: white;
+      color: var(--mdc-theme-text-primary-on-dark, white); }
+    [dir="rtl"] .mdc-temporary-drawer .mdc-temporary-drawer__drawer,
+    .mdc-temporary-drawer[dir="rtl"] .mdc-temporary-drawer__drawer {
+      -webkit-transform: translateX(107%);
+              transform: translateX(107%);
+      -webkit-transform: translateX(calc(100% + 20px));
+              transform: translateX(calc(100% + 20px)); }
+    @media (min-width: 600px) {
+      .mdc-temporary-drawer__drawer {
+        width: calc(100% - 64px);
+        max-width: 320px; } }
+  .mdc-temporary-drawer__content {
+    -webkit-box-flex: 1;
+        -ms-flex-positive: 1;
+            flex-grow: 1;
+    margin: 0;
+    overflow-x: hidden;
+    overflow-y: auto;
+    -webkit-box-sizing: border-box;
+            box-sizing: border-box;
+    -webkit-overflow-scrolling: touch;
+    -ms-touch-action: pan-y;
+        touch-action: pan-y; }
+  .mdc-temporary-drawer__footer {
+    -webkit-box-shadow: 0px 3px 1px -2px rgba(0, 0, 0, 0.2), 0px 2px 2px 0px rgba(0, 0, 0, 0.14), 0px 1px 5px 0px rgba(0, 0, 0, 0.12);
+            box-shadow: 0px 3px 1px -2px rgba(0, 0, 0, 0.2), 0px 2px 2px 0px rgba(0, 0, 0, 0.14), 0px 1px 5px 0px rgba(0, 0, 0, 0.12);
+    -ms-flex-negative: 0;
+        flex-shrink: 0; }
+  .mdc-temporary-drawer--animating::before {
+    -webkit-transition: opacity 0.3s 0ms cubic-bezier(0, 0, 0.2, 1);
+    transition: opacity 0.3s 0ms cubic-bezier(0, 0, 0.2, 1); }
+  .mdc-temporary-drawer--animating.mdc-temporary-drawer--open .mdc-temporary-drawer__drawer {
+    -webkit-transition: -webkit-transform 0.225s 0ms cubic-bezier(0, 0, 0.2, 1);
+    transition: -webkit-transform 0.225s 0ms cubic-bezier(0, 0, 0.2, 1);
+    transition: transform 0.225s 0ms cubic-bezier(0, 0, 0.2, 1);
+    transition: transform 0.225s 0ms cubic-bezier(0, 0, 0.2, 1), -webkit-transform 0.225s 0ms cubic-bezier(0, 0, 0.2, 1); }
+  .mdc-temporary-drawer--animating .mdc-temporary-drawer__drawer {
+    -webkit-transition: -webkit-transform 0.195s 0ms cubic-bezier(0.4, 0, 0.6, 1);
+    transition: -webkit-transform 0.195s 0ms cubic-bezier(0.4, 0, 0.6, 1);
+    transition: transform 0.195s 0ms cubic-bezier(0.4, 0, 0.6, 1);
+    transition: transform 0.195s 0ms cubic-bezier(0.4, 0, 0.6, 1), -webkit-transform 0.195s 0ms cubic-bezier(0.4, 0, 0.6, 1); }
+  .mdc-temporary-drawer--open {
+    pointer-events: auto; }
+    .mdc-temporary-drawer--open::before {
+      opacity: 1;
+      opacity: var(--mdc-temporary-drawer-opacity, 1); }
+    .mdc-temporary-drawer--open .mdc-temporary-drawer__drawer {
+      -webkit-transform: none;
+              transform: none; }
+    [dir="rtl"] .mdc-temporary-drawer--open .mdc-temporary-drawer__drawer, .mdc-temporary-drawer--open[dir="rtl"] .mdc-temporary-drawer__drawer {
+      -webkit-transform: none;
+              transform: none; }
+
+.mdc-drawer-scroll-lock {
+  height: 100vh;
+  overflow: hidden; }
+
+/**
+ * The css property used for elevation. In most cases this should not be changed. It is exposed
+ * as a variable for abstraction / easy use when needing to reference the property directly, for
+ * example in a `will-change` rule.
+ */
+/**
+ * The default duration value for elevation transitions.
+ */
+/**
+ * The default easing value for elevation transitions.
+ */
+/**
+ * Applies the correct css rules to an element to give it the elevation specified by $z-value.
+ * The $z-value must be between 0 and 24.
+ */
+/**
+ * Returns a string that can be used as the value for a `transition` property for elevation.
+ * Calling this function directly is useful in situations where a component needs to transition
+ * more than one property.
+ *
+ * ```scss
+ * .foo {
+ *   transition: mdc-elevation-transition-rule(), opacity 100ms ease;
+ *   will-change: $mdc-elevation-property, opacity;
+ * }
+ * ```
+ */
+/**
+ * Applies the correct css rules needed to have an element transition between elevations.
+ * This mixin should be applied to elements whose elevation values will change depending on their
+ * context (e.g. when active or disabled).
+ */
+.mdc-elevation--z0 {
+  -webkit-box-shadow: 0px 0px 0px 0px rgba(0, 0, 0, 0.2), 0px 0px 0px 0px rgba(0, 0, 0, 0.14), 0px 0px 0px 0px rgba(0, 0, 0, 0.12);
+          box-shadow: 0px 0px 0px 0px rgba(0, 0, 0, 0.2), 0px 0px 0px 0px rgba(0, 0, 0, 0.14), 0px 0px 0px 0px rgba(0, 0, 0, 0.12); }
+
+.mdc-elevation--z1 {
+  -webkit-box-shadow: 0px 2px 1px -1px rgba(0, 0, 0, 0.2), 0px 1px 1px 0px rgba(0, 0, 0, 0.14), 0px 1px 3px 0px rgba(0, 0, 0, 0.12);
+          box-shadow: 0px 2px 1px -1px rgba(0, 0, 0, 0.2), 0px 1px 1px 0px rgba(0, 0, 0, 0.14), 0px 1px 3px 0px rgba(0, 0, 0, 0.12); }
+
+.mdc-elevation--z2 {
+  -webkit-box-shadow: 0px 3px 1px -2px rgba(0, 0, 0, 0.2), 0px 2px 2px 0px rgba(0, 0, 0, 0.14), 0px 1px 5px 0px rgba(0, 0, 0, 0.12);
+          box-shadow: 0px 3px 1px -2px rgba(0, 0, 0, 0.2), 0px 2px 2px 0px rgba(0, 0, 0, 0.14), 0px 1px 5px 0px rgba(0, 0, 0, 0.12); }
+
+.mdc-elevation--z3 {
+  -webkit-box-shadow: 0px 3px 3px -2px rgba(0, 0, 0, 0.2), 0px 3px 4px 0px rgba(0, 0, 0, 0.14), 0px 1px 8px 0px rgba(0, 0, 0, 0.12);
+          box-shadow: 0px 3px 3px -2px rgba(0, 0, 0, 0.2), 0px 3px 4px 0px rgba(0, 0, 0, 0.14), 0px 1px 8px 0px rgba(0, 0, 0, 0.12); }
+
+.mdc-elevation--z4 {
+  -webkit-box-shadow: 0px 2px 4px -1px rgba(0, 0, 0, 0.2), 0px 4px 5px 0px rgba(0, 0, 0, 0.14), 0px 1px 10px 0px rgba(0, 0, 0, 0.12);
+          box-shadow: 0px 2px 4px -1px rgba(0, 0, 0, 0.2), 0px 4px 5px 0px rgba(0, 0, 0, 0.14), 0px 1px 10px 0px rgba(0, 0, 0, 0.12); }
+
+.mdc-elevation--z5 {
+  -webkit-box-shadow: 0px 3px 5px -1px rgba(0, 0, 0, 0.2), 0px 5px 8px 0px rgba(0, 0, 0, 0.14), 0px 1px 14px 0px rgba(0, 0, 0, 0.12);
+          box-shadow: 0px 3px 5px -1px rgba(0, 0, 0, 0.2), 0px 5px 8px 0px rgba(0, 0, 0, 0.14), 0px 1px 14px 0px rgba(0, 0, 0, 0.12); }
+
+.mdc-elevation--z6 {
+  -webkit-box-shadow: 0px 3px 5px -1px rgba(0, 0, 0, 0.2), 0px 6px 10px 0px rgba(0, 0, 0, 0.14), 0px 1px 18px 0px rgba(0, 0, 0, 0.12);
+          box-shadow: 0px 3px 5px -1px rgba(0, 0, 0, 0.2), 0px 6px 10px 0px rgba(0, 0, 0, 0.14), 0px 1px 18px 0px rgba(0, 0, 0, 0.12); }
+
+.mdc-elevation--z7 {
+  -webkit-box-shadow: 0px 4px 5px -2px rgba(0, 0, 0, 0.2), 0px 7px 10px 1px rgba(0, 0, 0, 0.14), 0px 2px 16px 1px rgba(0, 0, 0, 0.12);
+          box-shadow: 0px 4px 5px -2px rgba(0, 0, 0, 0.2), 0px 7px 10px 1px rgba(0, 0, 0, 0.14), 0px 2px 16px 1px rgba(0, 0, 0, 0.12); }
+
+.mdc-elevation--z8 {
+  -webkit-box-shadow: 0px 5px 5px -3px rgba(0, 0, 0, 0.2), 0px 8px 10px 1px rgba(0, 0, 0, 0.14), 0px 3px 14px 2px rgba(0, 0, 0, 0.12);
+          box-shadow: 0px 5px 5px -3px rgba(0, 0, 0, 0.2), 0px 8px 10px 1px rgba(0, 0, 0, 0.14), 0px 3px 14px 2px rgba(0, 0, 0, 0.12); }
+
+.mdc-elevation--z9 {
+  -webkit-box-shadow: 0px 5px 6px -3px rgba(0, 0, 0, 0.2), 0px 9px 12px 1px rgba(0, 0, 0, 0.14), 0px 3px 16px 2px rgba(0, 0, 0, 0.12);
+          box-shadow: 0px 5px 6px -3px rgba(0, 0, 0, 0.2), 0px 9px 12px 1px rgba(0, 0, 0, 0.14), 0px 3px 16px 2px rgba(0, 0, 0, 0.12); }
+
+.mdc-elevation--z10 {
+  -webkit-box-shadow: 0px 6px 6px -3px rgba(0, 0, 0, 0.2), 0px 10px 14px 1px rgba(0, 0, 0, 0.14), 0px 4px 18px 3px rgba(0, 0, 0, 0.12);
+          box-shadow: 0px 6px 6px -3px rgba(0, 0, 0, 0.2), 0px 10px 14px 1px rgba(0, 0, 0, 0.14), 0px 4px 18px 3px rgba(0, 0, 0, 0.12); }
+
+.mdc-elevation--z11 {
+  -webkit-box-shadow: 0px 6px 7px -4px rgba(0, 0, 0, 0.2), 0px 11px 15px 1px rgba(0, 0, 0, 0.14), 0px 4px 20px 3px rgba(0, 0, 0, 0.12);
+          box-shadow: 0px 6px 7px -4px rgba(0, 0, 0, 0.2), 0px 11px 15px 1px rgba(0, 0, 0, 0.14), 0px 4px 20px 3px rgba(0, 0, 0, 0.12); }
+
+.mdc-elevation--z12 {
+  -webkit-box-shadow: 0px 7px 8px -4px rgba(0, 0, 0, 0.2), 0px 12px 17px 2px rgba(0, 0, 0, 0.14), 0px 5px 22px 4px rgba(0, 0, 0, 0.12);
+          box-shadow: 0px 7px 8px -4px rgba(0, 0, 0, 0.2), 0px 12px 17px 2px rgba(0, 0, 0, 0.14), 0px 5px 22px 4px rgba(0, 0, 0, 0.12); }
+
+.mdc-elevation--z13 {
+  -webkit-box-shadow: 0px 7px 8px -4px rgba(0, 0, 0, 0.2), 0px 13px 19px 2px rgba(0, 0, 0, 0.14), 0px 5px 24px 4px rgba(0, 0, 0, 0.12);
+          box-shadow: 0px 7px 8px -4px rgba(0, 0, 0, 0.2), 0px 13px 19px 2px rgba(0, 0, 0, 0.14), 0px 5px 24px 4px rgba(0, 0, 0, 0.12); }
+
+.mdc-elevation--z14 {
+  -webkit-box-shadow: 0px 7px 9px -4px rgba(0, 0, 0, 0.2), 0px 14px 21px 2px rgba(0, 0, 0, 0.14), 0px 5px 26px 4px rgba(0, 0, 0, 0.12);
+          box-shadow: 0px 7px 9px -4px rgba(0, 0, 0, 0.2), 0px 14px 21px 2px rgba(0, 0, 0, 0.14), 0px 5px 26px 4px rgba(0, 0, 0, 0.12); }
+
+.mdc-elevation--z15 {
+  -webkit-box-shadow: 0px 8px 9px -5px rgba(0, 0, 0, 0.2), 0px 15px 22px 2px rgba(0, 0, 0, 0.14), 0px 6px 28px 5px rgba(0, 0, 0, 0.12);
+          box-shadow: 0px 8px 9px -5px rgba(0, 0, 0, 0.2), 0px 15px 22px 2px rgba(0, 0, 0, 0.14), 0px 6px 28px 5px rgba(0, 0, 0, 0.12); }
+
+.mdc-elevation--z16 {
+  -webkit-box-shadow: 0px 8px 10px -5px rgba(0, 0, 0, 0.2), 0px 16px 24px 2px rgba(0, 0, 0, 0.14), 0px 6px 30px 5px rgba(0, 0, 0, 0.12);
+          box-shadow: 0px 8px 10px -5px rgba(0, 0, 0, 0.2), 0px 16px 24px 2px rgba(0, 0, 0, 0.14), 0px 6px 30px 5px rgba(0, 0, 0, 0.12); }
+
+.mdc-elevation--z17 {
+  -webkit-box-shadow: 0px 8px 11px -5px rgba(0, 0, 0, 0.2), 0px 17px 26px 2px rgba(0, 0, 0, 0.14), 0px 6px 32px 5px rgba(0, 0, 0, 0.12);
+          box-shadow: 0px 8px 11px -5px rgba(0, 0, 0, 0.2), 0px 17px 26px 2px rgba(0, 0, 0, 0.14), 0px 6px 32px 5px rgba(0, 0, 0, 0.12); }
+
+.mdc-elevation--z18 {
+  -webkit-box-shadow: 0px 9px 11px -5px rgba(0, 0, 0, 0.2), 0px 18px 28px 2px rgba(0, 0, 0, 0.14), 0px 7px 34px 6px rgba(0, 0, 0, 0.12);
+          box-shadow: 0px 9px 11px -5px rgba(0, 0, 0, 0.2), 0px 18px 28px 2px rgba(0, 0, 0, 0.14), 0px 7px 34px 6px rgba(0, 0, 0, 0.12); }
+
+.mdc-elevation--z19 {
+  -webkit-box-shadow: 0px 9px 12px -6px rgba(0, 0, 0, 0.2), 0px 19px 29px 2px rgba(0, 0, 0, 0.14), 0px 7px 36px 6px rgba(0, 0, 0, 0.12);
+          box-shadow: 0px 9px 12px -6px rgba(0, 0, 0, 0.2), 0px 19px 29px 2px rgba(0, 0, 0, 0.14), 0px 7px 36px 6px rgba(0, 0, 0, 0.12); }
+
+.mdc-elevation--z20 {
+  -webkit-box-shadow: 0px 10px 13px -6px rgba(0, 0, 0, 0.2), 0px 20px 31px 3px rgba(0, 0, 0, 0.14), 0px 8px 38px 7px rgba(0, 0, 0, 0.12);
+          box-shadow: 0px 10px 13px -6px rgba(0, 0, 0, 0.2), 0px 20px 31px 3px rgba(0, 0, 0, 0.14), 0px 8px 38px 7px rgba(0, 0, 0, 0.12); }
+
+.mdc-elevation--z21 {
+  -webkit-box-shadow: 0px 10px 13px -6px rgba(0, 0, 0, 0.2), 0px 21px 33px 3px rgba(0, 0, 0, 0.14), 0px 8px 40px 7px rgba(0, 0, 0, 0.12);
+          box-shadow: 0px 10px 13px -6px rgba(0, 0, 0, 0.2), 0px 21px 33px 3px rgba(0, 0, 0, 0.14), 0px 8px 40px 7px rgba(0, 0, 0, 0.12); }
+
+.mdc-elevation--z22 {
+  -webkit-box-shadow: 0px 10px 14px -6px rgba(0, 0, 0, 0.2), 0px 22px 35px 3px rgba(0, 0, 0, 0.14), 0px 8px 42px 7px rgba(0, 0, 0, 0.12);
+          box-shadow: 0px 10px 14px -6px rgba(0, 0, 0, 0.2), 0px 22px 35px 3px rgba(0, 0, 0, 0.14), 0px 8px 42px 7px rgba(0, 0, 0, 0.12); }
+
+.mdc-elevation--z23 {
+  -webkit-box-shadow: 0px 11px 14px -7px rgba(0, 0, 0, 0.2), 0px 23px 36px 3px rgba(0, 0, 0, 0.14), 0px 9px 44px 8px rgba(0, 0, 0, 0.12);
+          box-shadow: 0px 11px 14px -7px rgba(0, 0, 0, 0.2), 0px 23px 36px 3px rgba(0, 0, 0, 0.14), 0px 9px 44px 8px rgba(0, 0, 0, 0.12); }
+
+.mdc-elevation--z24 {
+  -webkit-box-shadow: 0px 11px 15px -7px rgba(0, 0, 0, 0.2), 0px 24px 38px 3px rgba(0, 0, 0, 0.14), 0px 9px 46px 8px rgba(0, 0, 0, 0.12);
+          box-shadow: 0px 11px 15px -7px rgba(0, 0, 0, 0.2), 0px 24px 38px 3px rgba(0, 0, 0, 0.14), 0px 9px 46px 8px rgba(0, 0, 0, 0.12); }
+
+.mdc-elevation-transition {
+  -webkit-transition: -webkit-box-shadow 280ms cubic-bezier(0.4, 0, 0.2, 1);
+  transition: -webkit-box-shadow 280ms cubic-bezier(0.4, 0, 0.2, 1);
+  transition: box-shadow 280ms cubic-bezier(0.4, 0, 0.2, 1);
+  transition: box-shadow 280ms cubic-bezier(0.4, 0, 0.2, 1), -webkit-box-shadow 280ms cubic-bezier(0.4, 0, 0.2, 1);
+  will-change: box-shadow; }
+
+/**
+ * The css property used for elevation. In most cases this should not be changed. It is exposed
+ * as a variable for abstraction / easy use when needing to reference the property directly, for
+ * example in a `will-change` rule.
+ */
+/**
+ * The default duration value for elevation transitions.
+ */
+/**
+ * The default easing value for elevation transitions.
+ */
+/**
+ * Applies the correct css rules to an element to give it the elevation specified by $z-value.
+ * The $z-value must be between 0 and 24.
+ */
+/**
+ * Returns a string that can be used as the value for a `transition` property for elevation.
+ * Calling this function directly is useful in situations where a component needs to transition
+ * more than one property.
+ *
+ * ```scss
+ * .foo {
+ *   transition: mdc-elevation-transition-rule(), opacity 100ms ease;
+ *   will-change: $mdc-elevation-property, opacity;
+ * }
+ * ```
+ */
+/**
+ * Applies the correct css rules needed to have an element transition between elevations.
+ * This mixin should be applied to elements whose elevation values will change depending on their
+ * context (e.g. when active or disabled).
+ */
+/*
+  Precomputed linear color channel values, for use in contrast calculations.
+  See https://www.w3.org/TR/WCAG20-TECHS/G17.html#G17-tests
+
+  Algorithm, for c in 0 to 255:
+  f(c) {
+    c = c / 255;
+    return c < 0.03928 ? c / 12.92 : Math.pow((c + 0.055) / 1.055, 2.4);
+  }
+
+  This lookup table is needed since there is no `pow` in SASS.
+*/
+/**
+ * Calculate the luminance for a color.
+ * See https://www.w3.org/TR/WCAG20-TECHS/G17.html#G17-tests
+ */
+/**
+ * Calculate the contrast ratio between two colors.
+ * See https://www.w3.org/TR/WCAG20-TECHS/G17.html#G17-tests
+ */
+/**
+ * Determine whether to use dark or light text on top of given color.
+ * Returns "dark" for dark text and "light" for light text.
+ */
+/*
+  Main theme colors.
+  If you're a user customizing your color scheme in SASS, these are probably the only variables you need to change.
+*/
+/* Indigo 500 */
+/* Pink A200 */
+/* White */
+/* Which set of text colors to use for each main theme color (light or dark) */
+/* Text colors according to light vs dark and text type */
+/* Primary text colors for each of the theme colors */
+/** MDC Ripple keyframes are split into their own file so that _mixins.scss can rely on them. */
+@keyframes mdc-ripple-fg-radius-in {
+  from {
+    -webkit-transform: translate(var(--mdc-ripple-fg-translate-start, 0)) scale(1);
+            transform: translate(var(--mdc-ripple-fg-translate-start, 0)) scale(1);
+    -webkit-animation-timing-function: cubic-bezier(0.4, 0, 0.2, 1);
+            animation-timing-function: cubic-bezier(0.4, 0, 0.2, 1); }
+  to {
+    -webkit-transform: translate(var(--mdc-ripple-fg-translate-end, 0)) scale(var(--mdc-ripple-fg-scale, 1));
+            transform: translate(var(--mdc-ripple-fg-translate-end, 0)) scale(var(--mdc-ripple-fg-scale, 1)); } }
+
+@keyframes mdc-ripple-fg-opacity-in {
+  from {
+    opacity: 0;
+    -webkit-animation-timing-function: linear;
+            animation-timing-function: linear; }
+  to {
+    opacity: 1; } }
+
+@keyframes mdc-ripple-fg-opacity-out {
+  from {
+    opacity: 1;
+    -webkit-animation-timing-function: linear;
+            animation-timing-function: linear; }
+  to {
+    opacity: 0; } }
+
+/*
+  Precomputed linear color channel values, for use in contrast calculations.
+  See https://www.w3.org/TR/WCAG20-TECHS/G17.html#G17-tests
+
+  Algorithm, for c in 0 to 255:
+  f(c) {
+    c = c / 255;
+    return c < 0.03928 ? c / 12.92 : Math.pow((c + 0.055) / 1.055, 2.4);
+  }
+
+  This lookup table is needed since there is no `pow` in SASS.
+*/
+/**
+ * Calculate the luminance for a color.
+ * See https://www.w3.org/TR/WCAG20-TECHS/G17.html#G17-tests
+ */
+/**
+ * Calculate the contrast ratio between two colors.
+ * See https://www.w3.org/TR/WCAG20-TECHS/G17.html#G17-tests
+ */
+/**
+ * Determine whether to use dark or light text on top of given color.
+ * Returns "dark" for dark text and "light" for light text.
+ */
+/*
+  Main theme colors.
+  If you're a user customizing your color scheme in SASS, these are probably the only variables you need to change.
+*/
+/* Indigo 500 */
+/* Pink A200 */
+/* White */
+/* Which set of text colors to use for each main theme color (light or dark) */
+/* Text colors according to light vs dark and text type */
+/* Primary text colors for each of the theme colors */
+/**
+ * Applies the correct theme color style to the specified property.
+ * $property is typically color or background-color, but can be any CSS property that accepts color values.
+ * $style should be one of the map keys in $mdc-theme-property-values (_variables.scss).
+ */
+/**
+ * Creates a rule to be used in MDC-Web components for dark theming, and applies the provided contents.
+ * Should provide the $root-selector option if applied to anything other than the root selector.
+ * When used with a modifier class, provide a second argument of `true` for the $compound parameter
+ * to specify that this should be attached as a compound class.
+ *
+ * Usage example:
+ *
+ * ```scss
+ * .mdc-foo {
+ *   color: black;
+ *
+ *   @include mdc-theme-dark {
+ *     color: white;
+ *   }
+ *
+ *   &__bar {
+ *     background: black;
+ *
+ *     @include mdc-theme-dark(".mdc-foo") {
+ *       background: white;
+ *     }
+ *   }
+ * }
+ *
+ * .mdc-foo--disabled {
+ *   opacity: .38;
+ *
+ *   @include mdc-theme-dark(".mdc-foo", true) {
+ *     opacity: .5;
+ *   }
+ * }
+ * ```
+ */
+.mdc-fab {
+  --mdc-ripple-surface-width: 0;
+  --mdc-ripple-surface-height: 0;
+  --mdc-ripple-fg-size: 0;
+  --mdc-ripple-left: 0;
+  --mdc-ripple-top: 0;
+  --mdc-ripple-fg-scale: 1;
+  --mdc-ripple-fg-translate-end: 0;
+  --mdc-ripple-fg-translate-start: 0;
+  will-change: transform, opacity;
+  -webkit-tap-highlight-color: transparent;
+  display: -webkit-inline-box;
+  display: -ms-inline-flexbox;
+  display: inline-flex;
+  position: relative;
+  -webkit-box-pack: center;
+      -ms-flex-pack: center;
+          justify-content: center;
+  width: 56px;
+  height: 56px;
+  padding: 0;
+  -webkit-transition: -webkit-box-shadow 280ms cubic-bezier(0.4, 0, 0.2, 1);
+  transition: -webkit-box-shadow 280ms cubic-bezier(0.4, 0, 0.2, 1);
+  transition: box-shadow 280ms cubic-bezier(0.4, 0, 0.2, 1);
+  transition: box-shadow 280ms cubic-bezier(0.4, 0, 0.2, 1), -webkit-box-shadow 280ms cubic-bezier(0.4, 0, 0.2, 1);
+  border: none;
+  border-radius: 50%;
+  cursor: pointer;
+  -webkit-user-select: none;
+     -moz-user-select: none;
+      -ms-user-select: none;
+          user-select: none;
+  -webkit-box-sizing: border-box;
+          box-sizing: border-box;
+  fill: currentColor;
+  -moz-appearance: none;
+  -webkit-appearance: none;
+  overflow: hidden;
+  /* @alternate */
+  background-color: #ff4081;
+  background-color: var(--mdc-theme-accent, #ff4081);
+  /* @alternate */
+  color: white;
+  color: var(--mdc-theme-text-primary-on-accent, white);
+  -webkit-box-shadow: 0px 3px 5px -1px rgba(0, 0, 0, 0.2), 0px 6px 10px 0px rgba(0, 0, 0, 0.14), 0px 1px 18px 0px rgba(0, 0, 0, 0.12);
+          box-shadow: 0px 3px 5px -1px rgba(0, 0, 0, 0.2), 0px 6px 10px 0px rgba(0, 0, 0, 0.14), 0px 1px 18px 0px rgba(0, 0, 0, 0.12); }
+  .mdc-fab:not(.mdc-ripple-upgraded):hover::before, .mdc-fab:not(.mdc-ripple-upgraded):focus::before, .mdc-fab:not(.mdc-ripple-upgraded):active::after {
+    -webkit-transition-duration: 85ms;
+            transition-duration: 85ms;
+    opacity: .6; }
+  .mdc-fab::before {
+    background-color: rgba(255, 255, 255, 0.16);
+    position: absolute;
+    top: calc(50% - 100%);
+    left: calc(50% - 100%);
+    width: 200%;
+    height: 200%;
+    -webkit-transition: opacity 250ms linear;
+    transition: opacity 250ms linear;
+    border-radius: 50%;
+    opacity: 0;
+    pointer-events: none;
+    content: ""; }
+  .mdc-fab.mdc-ripple-upgraded::before {
+    top: calc(50% - 100%);
+    left: calc(50% - 100%);
+    width: 200%;
+    height: 200%;
+    /* @alternate */
+    -webkit-transform: scale(0);
+            transform: scale(0);
+    -webkit-transform: scale(var(--mdc-ripple-fg-scale, 0));
+            transform: scale(var(--mdc-ripple-fg-scale, 0)); }
+  .mdc-fab.mdc-ripple-upgraded--background-focused::before {
+    opacity: .99999; }
+  .mdc-fab.mdc-ripple-upgraded--background-active-fill::before {
+    -webkit-transition-duration: 120ms;
+            transition-duration: 120ms;
+    opacity: 1; }
+  .mdc-fab.mdc-ripple-upgraded--unbounded::before {
+    /* @alternate */
+    top: calc(50% - 50%);
+    top: var(--mdc-ripple-top, calc(50% - 50%));
+    /* @alternate */
+    left: calc(50% - 50%);
+    left: var(--mdc-ripple-left, calc(50% - 50%));
+    /* @alternate */
+    width: 100%;
+    width: var(--mdc-ripple-fg-size, 100%);
+    /* @alternate */
+    height: 100%;
+    height: var(--mdc-ripple-fg-size, 100%);
+    /* @alternate */
+    -webkit-transform: scale(0);
+            transform: scale(0);
+    -webkit-transform: scale(var(--mdc-ripple-fg-scale, 0));
+            transform: scale(var(--mdc-ripple-fg-scale, 0)); }
+  .mdc-fab::after {
+    background-color: rgba(255, 255, 255, 0.16);
+    position: absolute;
+    top: calc(50% - 100%);
+    left: calc(50% - 100%);
+    width: 200%;
+    height: 200%;
+    -webkit-transition: opacity 250ms linear;
+    transition: opacity 250ms linear;
+    border-radius: 50%;
+    opacity: 0;
+    pointer-events: none;
+    content: ""; }
+  .mdc-fab.mdc-ripple-upgraded::after {
+    top: 0;
+    left: 0;
+    /* @alternate */
+    width: 100%;
+    width: var(--mdc-ripple-fg-size, 100%);
+    /* @alternate */
+    height: 100%;
+    height: var(--mdc-ripple-fg-size, 100%);
+    -webkit-transform: scale(0);
+            transform: scale(0);
+    -webkit-transform-origin: center center;
+            transform-origin: center center;
+    opacity: 0; }
+  .mdc-fab:not(.mdc-ripple-upgraded--unbounded)::after {
+    -webkit-transform-origin: center center;
+            transform-origin: center center; }
+  .mdc-fab.mdc-ripple-upgraded--unbounded::after {
+    /* @alternate */
+    top: 0;
+    top: var(--mdc-ripple-top, 0);
+    /* @alternate */
+    left: 0;
+    left: var(--mdc-ripple-left, 0);
+    /* @alternate */
+    width: 100%;
+    width: var(--mdc-ripple-fg-size, 100%);
+    /* @alternate */
+    height: 100%;
+    height: var(--mdc-ripple-fg-size, 100%);
+    -webkit-transform: scale(0);
+            transform: scale(0);
+    -webkit-transform-origin: center center;
+            transform-origin: center center; }
+  .mdc-fab.mdc-ripple-upgraded--foreground-activation::after {
+    -webkit-animation: 300ms mdc-ripple-fg-radius-in forwards, 83ms mdc-ripple-fg-opacity-in forwards;
+            animation: 300ms mdc-ripple-fg-radius-in forwards, 83ms mdc-ripple-fg-opacity-in forwards; }
+  .mdc-fab.mdc-ripple-upgraded--foreground-deactivation::after {
+    -webkit-transform: translate(var(--mdc-ripple-fg-translate-end, 0)) scale(var(--mdc-ripple-fg-scale, 1));
+            transform: translate(var(--mdc-ripple-fg-translate-end, 0)) scale(var(--mdc-ripple-fg-scale, 1));
+    -webkit-animation: 83ms mdc-ripple-fg-opacity-out;
+            animation: 83ms mdc-ripple-fg-opacity-out; }
+  .mdc-fab:not(.mdc-ripple-upgraded) {
+    -webkit-tap-highlight-color: rgba(0, 0, 0, 0.18); }
+  .mdc-fab--mini {
+    width: 40px;
+    height: 40px; }
+  .mdc-fab--plain {
+    background-color: white;
+    /* @alternate */
+    color: rgba(0, 0, 0, 0.87);
+    color: var(--mdc-theme-text-primary-on-light, rgba(0, 0, 0, 0.87)); }
+    .mdc-fab--plain::before {
+      background-color: rgba(0, 0, 0, 0.06);
+      position: absolute;
+      top: calc(50% - 100%);
+      left: calc(50% - 100%);
+      width: 200%;
+      height: 200%;
+      -webkit-transition: opacity 250ms linear;
+      transition: opacity 250ms linear;
+      border-radius: 50%;
+      opacity: 0;
+      pointer-events: none;
+      content: ""; }
+    .mdc-fab--plain.mdc-ripple-upgraded::before {
+      top: calc(50% - 100%);
+      left: calc(50% - 100%);
+      width: 200%;
+      height: 200%;
+      /* @alternate */
+      -webkit-transform: scale(0);
+              transform: scale(0);
+      -webkit-transform: scale(var(--mdc-ripple-fg-scale, 0));
+              transform: scale(var(--mdc-ripple-fg-scale, 0)); }
+    .mdc-fab--plain.mdc-ripple-upgraded--background-focused::before {
+      opacity: .99999; }
+    .mdc-fab--plain.mdc-ripple-upgraded--background-active-fill::before {
+      -webkit-transition-duration: 120ms;
+              transition-duration: 120ms;
+      opacity: 1; }
+    .mdc-fab--plain.mdc-ripple-upgraded--unbounded::before {
+      /* @alternate */
+      top: calc(50% - 50%);
+      top: var(--mdc-ripple-top, calc(50% - 50%));
+      /* @alternate */
+      left: calc(50% - 50%);
+      left: var(--mdc-ripple-left, calc(50% - 50%));
+      /* @alternate */
+      width: 100%;
+      width: var(--mdc-ripple-fg-size, 100%);
+      /* @alternate */
+      height: 100%;
+      height: var(--mdc-ripple-fg-size, 100%);
+      /* @alternate */
+      -webkit-transform: scale(0);
+              transform: scale(0);
+      -webkit-transform: scale(var(--mdc-ripple-fg-scale, 0));
+              transform: scale(var(--mdc-ripple-fg-scale, 0)); }
+    .mdc-fab--plain::after {
+      background-color: rgba(0, 0, 0, 0.06);
+      position: absolute;
+      top: calc(50% - 100%);
+      left: calc(50% - 100%);
+      width: 200%;
+      height: 200%;
+      -webkit-transition: opacity 250ms linear;
+      transition: opacity 250ms linear;
+      border-radius: 50%;
+      opacity: 0;
+      pointer-events: none;
+      content: ""; }
+    .mdc-fab--plain.mdc-ripple-upgraded::after {
+      top: 0;
+      left: 0;
+      /* @alternate */
+      width: 100%;
+      width: var(--mdc-ripple-fg-size, 100%);
+      /* @alternate */
+      height: 100%;
+      height: var(--mdc-ripple-fg-size, 100%);
+      -webkit-transform: scale(0);
+              transform: scale(0);
+      -webkit-transform-origin: center center;
+              transform-origin: center center;
+      opacity: 0; }
+    .mdc-fab--plain:not(.mdc-ripple-upgraded--unbounded)::after {
+      -webkit-transform-origin: center center;
+              transform-origin: center center; }
+    .mdc-fab--plain.mdc-ripple-upgraded--unbounded::after {
+      /* @alternate */
+      top: 0;
+      top: var(--mdc-ripple-top, 0);
+      /* @alternate */
+      left: 0;
+      left: var(--mdc-ripple-left, 0);
+      /* @alternate */
+      width: 100%;
+      width: var(--mdc-ripple-fg-size, 100%);
+      /* @alternate */
+      height: 100%;
+      height: var(--mdc-ripple-fg-size, 100%);
+      -webkit-transform: scale(0);
+              transform: scale(0);
+      -webkit-transform-origin: center center;
+              transform-origin: center center; }
+    .mdc-fab--plain.mdc-ripple-upgraded--foreground-activation::after {
+      -webkit-animation: 300ms mdc-ripple-fg-radius-in forwards, 83ms mdc-ripple-fg-opacity-in forwards;
+              animation: 300ms mdc-ripple-fg-radius-in forwards, 83ms mdc-ripple-fg-opacity-in forwards; }
+    .mdc-fab--plain.mdc-ripple-upgraded--foreground-deactivation::after {
+      -webkit-transform: translate(var(--mdc-ripple-fg-translate-end, 0)) scale(var(--mdc-ripple-fg-scale, 1));
+              transform: translate(var(--mdc-ripple-fg-translate-end, 0)) scale(var(--mdc-ripple-fg-scale, 1));
+      -webkit-animation: 83ms mdc-ripple-fg-opacity-out;
+              animation: 83ms mdc-ripple-fg-opacity-out; }
+  .mdc-fab:active, .mdc-fab:focus {
+    outline: none; }
+  .mdc-fab:active {
+    -webkit-box-shadow: 0px 7px 8px -4px rgba(0, 0, 0, 0.2), 0px 12px 17px 2px rgba(0, 0, 0, 0.14), 0px 5px 22px 4px rgba(0, 0, 0, 0.12);
+            box-shadow: 0px 7px 8px -4px rgba(0, 0, 0, 0.2), 0px 12px 17px 2px rgba(0, 0, 0, 0.14), 0px 5px 22px 4px rgba(0, 0, 0, 0.12); }
+  .mdc-fab:hover {
+    cursor: pointer; }
+  .mdc-fab::-moz-focus-inner {
+    padding: 0;
+    border: 0; }
+  .mdc-fab > svg {
+    width: 100%; }
+  fieldset:disabled .mdc-fab, .mdc-fab:disabled {
+    background-color: rgba(0, 0, 0, 0.12);
+    color: rgba(0, 0, 0, 0.26);
+    cursor: default;
+    pointer-events: none; }
+
+.mdc-fab__icon {
+  display: -webkit-box;
+  display: -ms-flexbox;
+  display: flex;
+  -webkit-box-align: center;
+      -ms-flex-align: center;
+          align-items: center;
+  -webkit-box-pack: center;
+      -ms-flex-pack: center;
+          justify-content: center;
+  width: 100%; }
+
+/**
+ * Creates a rule that will be applied when an MDC-Web component is within the context of an RTL layout.
+ *
+ * Usage Example:
+ * ```scss
+ * .mdc-foo {
+ *   position: absolute;
+ *   left: 0;
+ *
+ *   @include mdc-rtl {
+ *     left: auto;
+ *     right: 0;
+ *   }
+ *
+ *   &__bar {
+ *     margin-left: 4px;
+ *     @include mdc-rtl(".mdc-foo") {
+ *       margin-left: auto;
+ *       margin-right: 4px;
+ *     }
+ *   }
+ * }
+ *
+ * .mdc-foo--mod {
+ *   padding-left: 4px;
+ *
+ *   @include mdc-rtl {
+ *     padding-left: auto;
+ *     padding-right: 4px;
+ *   }
+ * }
+ * ```
+ *
+ * Note that this works by checking for [dir="rtl"] on an ancestor element. While this will work
+ * in most cases, it will in some cases lead to false negatives, e.g.
+ *
+ * ```html
+ * <html dir="rtl">
+ *   <!-- ... -->
+ *   <div dir="ltr">
+ *     <div class="mdc-foo">Styled incorrectly as RTL!</div>
+ *   </div>
+ * </html>
+ * ```
+ *
+ * In the future, selectors such as :dir (http://mdn.io/:dir) will help us mitigate this.
+ */
+/**
+ * Takes a base box-model property - e.g. margin / border / padding - along with a default
+ * direction and value, and emits rules which apply the value to the
+ * "<base-property>-<default-direction>" property by default, but flips the direction
+ * when within an RTL context.
+ *
+ * For example:
+ *
+ * ```scss
+ * .mdc-foo {
+ *   @include mdc-rtl-reflexive-box(margin, left, 8px);
+ * }
+ * ```
+ * is equivalent to:
+ *
+ * ```scss
+ * .mdc-foo {
+ *   margin-left: 8px;
+ *
+ *   @include mdc-rtl {
+ *     margin-right: 8px;
+ *     margin-left: 0;
+ *   }
+ * }
+ * ```
+ * whereas:
+ *
+ * ```scss
+ * .mdc-foo {
+ *   @include mdc-rtl-reflexive-box(margin, right, 8px);
+ * }
+ * ```
+ * is equivalent to:
+ *
+ * ```scss
+ * .mdc-foo {
+ *   margin-right: 8px;
+ *
+ *   @include mdc-rtl {
+ *     margin-right: 0;
+ *     margin-left: 8px;
+ *   }
+ * }
+ * ```
+ *
+ * You can also pass a 4th optional $root-selector argument which will be forwarded to `mdc-rtl`,
+ * e.g. `@include mdc-rtl-reflexive-box(margin, left, 8px, ".mdc-component")`.
+ *
+ * Note that this function will always zero out the original value in an RTL context. If you're
+ * trying to flip the values, use mdc-rtl-reflexive-property().
+ */
+/**
+ * Takes a base property and emits rules that assign <base-property>-left to <left-value> and
+ * <base-property>-right to <right-value> in a LTR context, and vice versa in a RTL context.
+ * For example:
+ *
+ * ```scss
+ * .mdc-foo {
+ *   @include mdc-rtl-reflexive-property(margin, auto, 12px);
+ * }
+ * ```
+ * is equivalent to:
+ *
+ * ```scss
+ * .mdc-foo {
+ *   margin-left: auto;
+ *   margin-right: 12px;
+ *
+ *   @include mdc-rtl {
+ *     margin-left: 12px;
+ *     margin-right: auto;
+ *   }
+ * }
+ * ```
+ *
+ * A 4th optional $root-selector argument can be given, which will be passed to `mdc-rtl`.
+ */
+/**
+ * Takes an argument specifying a horizontal position property (either "left" or "right") as well
+ * as a value, and applies that value to the specified position in a LTR context, and flips it in a
+ * RTL context. For example:
+ *
+ * ```scss
+ * .mdc-foo {
+ *   @include mdc-rtl-reflexive-position(left, 0);
+ *   position: absolute;
+ * }
+ * ```
+ * is equivalent to:
+ *
+ * ```scss
+ *  .mdc-foo {
+ *    position: absolute;
+ *    left: 0;
+ *    right: initial;
+ *
+ *    @include mdc-rtl {
+ *      right: 0;
+ *      left: initial;
+ *    }
+ *  }
+ * ```
+ * An optional third $root-selector argument may also be given, which is passed to `mdc-rtl`.
+ */
+/*
+  Precomputed linear color channel values, for use in contrast calculations.
+  See https://www.w3.org/TR/WCAG20-TECHS/G17.html#G17-tests
+
+  Algorithm, for c in 0 to 255:
+  f(c) {
+    c = c / 255;
+    return c < 0.03928 ? c / 12.92 : Math.pow((c + 0.055) / 1.055, 2.4);
+  }
+
+  This lookup table is needed since there is no `pow` in SASS.
+*/
+/**
+ * Calculate the luminance for a color.
+ * See https://www.w3.org/TR/WCAG20-TECHS/G17.html#G17-tests
+ */
+/**
+ * Calculate the contrast ratio between two colors.
+ * See https://www.w3.org/TR/WCAG20-TECHS/G17.html#G17-tests
+ */
+/**
+ * Determine whether to use dark or light text on top of given color.
+ * Returns "dark" for dark text and "light" for light text.
+ */
+/*
+  Main theme colors.
+  If you're a user customizing your color scheme in SASS, these are probably the only variables you need to change.
+*/
+/* Indigo 500 */
+/* Pink A200 */
+/* White */
+/* Which set of text colors to use for each main theme color (light or dark) */
+/* Text colors according to light vs dark and text type */
+/* Primary text colors for each of the theme colors */
+/**
+ * Applies the correct theme color style to the specified property.
+ * $property is typically color or background-color, but can be any CSS property that accepts color values.
+ * $style should be one of the map keys in $mdc-theme-property-values (_variables.scss).
+ */
+/**
+ * Creates a rule to be used in MDC-Web components for dark theming, and applies the provided contents.
+ * Should provide the $root-selector option if applied to anything other than the root selector.
+ * When used with a modifier class, provide a second argument of `true` for the $compound parameter
+ * to specify that this should be attached as a compound class.
+ *
+ * Usage example:
+ *
+ * ```scss
+ * .mdc-foo {
+ *   color: black;
+ *
+ *   @include mdc-theme-dark {
+ *     color: white;
+ *   }
+ *
+ *   &__bar {
+ *     background: black;
+ *
+ *     @include mdc-theme-dark(".mdc-foo") {
+ *       background: white;
+ *     }
+ *   }
+ * }
+ *
+ * .mdc-foo--disabled {
+ *   opacity: .38;
+ *
+ *   @include mdc-theme-dark(".mdc-foo", true) {
+ *     opacity: .5;
+ *   }
+ * }
+ * ```
+ */
+/* TODO(sgomes): Figure out what to do about desktop font sizes. */
+/* TODO(sgomes): Figure out what to do about i18n and i18n font sizes. */
+/* stylelint-disable selector-max-type */
+.mdc-form-field {
+  font-family: Roboto, sans-serif;
+  -moz-osx-font-smoothing: grayscale;
+  -webkit-font-smoothing: antialiased;
+  font-size: 0.875rem;
+  font-weight: 400;
+  letter-spacing: 0.04em;
+  line-height: 1.25rem;
+  text-decoration: inherit;
+  text-transform: inherit;
+  /* @alternate */
+  color: rgba(0, 0, 0, 0.87);
+  color: var(--mdc-theme-text-primary-on-light, rgba(0, 0, 0, 0.87));
+  display: -webkit-inline-box;
+  display: -ms-inline-flexbox;
+  display: inline-flex;
+  -webkit-box-align: center;
+      -ms-flex-align: center;
+          align-items: center;
+  vertical-align: middle; }
+  .mdc-form-field--theme-dark,
+  .mdc-theme--dark .mdc-form-field {
+    /* @alternate */
+    color: white;
+    color: var(--mdc-theme-text-primary-on-dark, white); }
+  .mdc-form-field > label {
+    -webkit-box-ordinal-group: 1;
+        -ms-flex-order: 0;
+            order: 0;
+    margin-right: auto;
+    padding-left: 4px; }
+  [dir="rtl"] .mdc-form-field > label, .mdc-form-field[dir="rtl"] > label {
+    margin-left: auto;
+    padding-right: 4px; }
+
+.mdc-form-field--align-end > label {
+  -webkit-box-ordinal-group: 0;
+      -ms-flex-order: -1;
+          order: -1;
+  margin-left: auto;
+  padding-right: 4px; }
+
+[dir="rtl"] .mdc-form-field--align-end > label, .mdc-form-field--align-end[dir="rtl"] > label {
+  margin-right: auto;
+  padding-left: 4px; }
+
+/* stylelint-enable selector-max-type */
+/**
+ * Creates a rule that will be applied when an MDC-Web component is within the context of an RTL layout.
+ *
+ * Usage Example:
+ * ```scss
+ * .mdc-foo {
+ *   position: absolute;
+ *   left: 0;
+ *
+ *   @include mdc-rtl {
+ *     left: auto;
+ *     right: 0;
+ *   }
+ *
+ *   &__bar {
+ *     margin-left: 4px;
+ *     @include mdc-rtl(".mdc-foo") {
+ *       margin-left: auto;
+ *       margin-right: 4px;
+ *     }
+ *   }
+ * }
+ *
+ * .mdc-foo--mod {
+ *   padding-left: 4px;
+ *
+ *   @include mdc-rtl {
+ *     padding-left: auto;
+ *     padding-right: 4px;
+ *   }
+ * }
+ * ```
+ *
+ * Note that this works by checking for [dir="rtl"] on an ancestor element. While this will work
+ * in most cases, it will in some cases lead to false negatives, e.g.
+ *
+ * ```html
+ * <html dir="rtl">
+ *   <!-- ... -->
+ *   <div dir="ltr">
+ *     <div class="mdc-foo">Styled incorrectly as RTL!</div>
+ *   </div>
+ * </html>
+ * ```
+ *
+ * In the future, selectors such as :dir (http://mdn.io/:dir) will help us mitigate this.
+ */
+/**
+ * Takes a base box-model property - e.g. margin / border / padding - along with a default
+ * direction and value, and emits rules which apply the value to the
+ * "<base-property>-<default-direction>" property by default, but flips the direction
+ * when within an RTL context.
+ *
+ * For example:
+ *
+ * ```scss
+ * .mdc-foo {
+ *   @include mdc-rtl-reflexive-box(margin, left, 8px);
+ * }
+ * ```
+ * is equivalent to:
+ *
+ * ```scss
+ * .mdc-foo {
+ *   margin-left: 8px;
+ *
+ *   @include mdc-rtl {
+ *     margin-right: 8px;
+ *     margin-left: 0;
+ *   }
+ * }
+ * ```
+ * whereas:
+ *
+ * ```scss
+ * .mdc-foo {
+ *   @include mdc-rtl-reflexive-box(margin, right, 8px);
+ * }
+ * ```
+ * is equivalent to:
+ *
+ * ```scss
+ * .mdc-foo {
+ *   margin-right: 8px;
+ *
+ *   @include mdc-rtl {
+ *     margin-right: 0;
+ *     margin-left: 8px;
+ *   }
+ * }
+ * ```
+ *
+ * You can also pass a 4th optional $root-selector argument which will be forwarded to `mdc-rtl`,
+ * e.g. `@include mdc-rtl-reflexive-box(margin, left, 8px, ".mdc-component")`.
+ *
+ * Note that this function will always zero out the original value in an RTL context. If you're
+ * trying to flip the values, use mdc-rtl-reflexive-property().
+ */
+/**
+ * Takes a base property and emits rules that assign <base-property>-left to <left-value> and
+ * <base-property>-right to <right-value> in a LTR context, and vice versa in a RTL context.
+ * For example:
+ *
+ * ```scss
+ * .mdc-foo {
+ *   @include mdc-rtl-reflexive-property(margin, auto, 12px);
+ * }
+ * ```
+ * is equivalent to:
+ *
+ * ```scss
+ * .mdc-foo {
+ *   margin-left: auto;
+ *   margin-right: 12px;
+ *
+ *   @include mdc-rtl {
+ *     margin-left: 12px;
+ *     margin-right: auto;
+ *   }
+ * }
+ * ```
+ *
+ * A 4th optional $root-selector argument can be given, which will be passed to `mdc-rtl`.
+ */
+/**
+ * Takes an argument specifying a horizontal position property (either "left" or "right") as well
+ * as a value, and applies that value to the specified position in a LTR context, and flips it in a
+ * RTL context. For example:
+ *
+ * ```scss
+ * .mdc-foo {
+ *   @include mdc-rtl-reflexive-position(left, 0);
+ *   position: absolute;
+ * }
+ * ```
+ * is equivalent to:
+ *
+ * ```scss
+ *  .mdc-foo {
+ *    position: absolute;
+ *    left: 0;
+ *    right: initial;
+ *
+ *    @include mdc-rtl {
+ *      right: 0;
+ *      left: initial;
+ *    }
+ *  }
+ * ```
+ * An optional third $root-selector argument may also be given, which is passed to `mdc-rtl`.
+ */
+/*
+  Precomputed linear color channel values, for use in contrast calculations.
+  See https://www.w3.org/TR/WCAG20-TECHS/G17.html#G17-tests
+
+  Algorithm, for c in 0 to 255:
+  f(c) {
+    c = c / 255;
+    return c < 0.03928 ? c / 12.92 : Math.pow((c + 0.055) / 1.055, 2.4);
+  }
+
+  This lookup table is needed since there is no `pow` in SASS.
+*/
+/**
+ * Calculate the luminance for a color.
+ * See https://www.w3.org/TR/WCAG20-TECHS/G17.html#G17-tests
+ */
+/**
+ * Calculate the contrast ratio between two colors.
+ * See https://www.w3.org/TR/WCAG20-TECHS/G17.html#G17-tests
+ */
+/**
+ * Determine whether to use dark or light text on top of given color.
+ * Returns "dark" for dark text and "light" for light text.
+ */
+/*
+  Main theme colors.
+  If you're a user customizing your color scheme in SASS, these are probably the only variables you need to change.
+*/
+/* Indigo 500 */
+/* Pink A200 */
+/* White */
+/* Which set of text colors to use for each main theme color (light or dark) */
+/* Text colors according to light vs dark and text type */
+/* Primary text colors for each of the theme colors */
+/**
+ * Applies the correct theme color style to the specified property.
+ * $property is typically color or background-color, but can be any CSS property that accepts color values.
+ * $style should be one of the map keys in $mdc-theme-property-values (_variables.scss).
+ */
+/**
+ * Creates a rule to be used in MDC-Web components for dark theming, and applies the provided contents.
+ * Should provide the $root-selector option if applied to anything other than the root selector.
+ * When used with a modifier class, provide a second argument of `true` for the $compound parameter
+ * to specify that this should be attached as a compound class.
+ *
+ * Usage example:
+ *
+ * ```scss
+ * .mdc-foo {
+ *   color: black;
+ *
+ *   @include mdc-theme-dark {
+ *     color: white;
+ *   }
+ *
+ *   &__bar {
+ *     background: black;
+ *
+ *     @include mdc-theme-dark(".mdc-foo") {
+ *       background: white;
+ *     }
+ *   }
+ * }
+ *
+ * .mdc-foo--disabled {
+ *   opacity: .38;
+ *
+ *   @include mdc-theme-dark(".mdc-foo", true) {
+ *     opacity: .5;
+ *   }
+ * }
+ * ```
+ */
+/* TODO(sgomes): Figure out what to do about desktop font sizes. */
+/* TODO(sgomes): Figure out what to do about i18n and i18n font sizes. */
+.mdc-grid-list .mdc-grid-tile__primary {
+  padding-bottom: calc(100% / 1); }
+
+.mdc-grid-list .mdc-grid-tile {
+  margin: 2px 0;
+  padding: 0 2px; }
+  .mdc-grid-list .mdc-grid-tile__secondary {
+    left: 2px;
+    width: calc(100% - 4px); }
+
+.mdc-grid-list .mdc-grid-list__tiles {
+  margin: 2px auto; }
+
+.mdc-grid-list__tiles {
+  display: -webkit-box;
+  display: -ms-flexbox;
+  display: flex;
+  -webkit-box-orient: horizontal;
+  -webkit-box-direction: normal;
+      -ms-flex-flow: row wrap;
+          flex-flow: row wrap;
+  margin: 0;
+  padding: 0; }
+
+.mdc-grid-list--tile-gutter-1 .mdc-grid-tile {
+  margin: 0.5px 0;
+  padding: 0 0.5px; }
+  .mdc-grid-list--tile-gutter-1 .mdc-grid-tile__secondary {
+    left: 0.5px;
+    width: calc(100% - 1px); }
+
+.mdc-grid-list--tile-gutter-1 .mdc-grid-list__tiles {
+  margin: 0.5px auto; }
+
+.mdc-grid-list--tile-aspect-16x9 .mdc-grid-tile__primary {
+  padding-bottom: calc(100% / 1.77778); }
+
+.mdc-grid-list--tile-aspect-3x2 .mdc-grid-tile__primary {
+  padding-bottom: calc(100% / 1.5); }
+
+.mdc-grid-list--tile-aspect-2x3 .mdc-grid-tile__primary {
+  padding-bottom: calc(100% / 0.66667); }
+
+.mdc-grid-list--tile-aspect-4x3 .mdc-grid-tile__primary {
+  padding-bottom: calc(100% / 1.33333); }
+
+.mdc-grid-list--tile-aspect-3x4 .mdc-grid-tile__primary {
+  padding-bottom: calc(100% / 0.75); }
+
+.mdc-grid-list--twoline-caption .mdc-grid-tile__secondary {
+  height: 68px; }
+
+.mdc-grid-list--header-caption .mdc-grid-tile__secondary {
+  top: 0;
+  bottom: auto; }
+
+.mdc-grid-list--with-icon-align-start .mdc-grid-tile__secondary {
+  padding-left: 56px;
+  padding-right: 8px; }
+  [dir="rtl"] .mdc-grid-list .mdc-grid-list--with-icon-align-start .mdc-grid-tile__secondary,
+  .mdc-grid-list[dir="rtl"] .mdc-grid-list--with-icon-align-start .mdc-grid-tile__secondary {
+    padding-left: 8px;
+    padding-right: 56px; }
+
+.mdc-grid-list--with-icon-align-start .mdc-grid-tile__icon {
+  left: 16px;
+  right: initial;
+  font-size: 24px; }
+  [dir="rtl"] .mdc-grid-list .mdc-grid-list--with-icon-align-start .mdc-grid-tile__icon,
+  .mdc-grid-list[dir="rtl"] .mdc-grid-list--with-icon-align-start .mdc-grid-tile__icon {
+    left: initial;
+    right: 16px; }
+
+.mdc-grid-list--with-icon-align-end .mdc-grid-tile__secondary {
+  padding-left: 16px;
+  padding-right: 56px; }
+  [dir="rtl"] .mdc-grid-list .mdc-grid-list--with-icon-align-end .mdc-grid-tile__secondary,
+  .mdc-grid-list[dir="rtl"] .mdc-grid-list--with-icon-align-end .mdc-grid-tile__secondary {
+    padding-left: 56px;
+    padding-right: 16px; }
+
+.mdc-grid-list--with-icon-align-end .mdc-grid-tile__icon {
+  left: initial;
+  right: 16px;
+  font-size: 24px; }
+  [dir="rtl"] .mdc-grid-list .mdc-grid-list--with-icon-align-end .mdc-grid-tile__icon,
+  .mdc-grid-list[dir="rtl"] .mdc-grid-list--with-icon-align-end .mdc-grid-tile__icon {
+    left: 16px;
+    right: initial; }
+
+.mdc-grid-tile {
+  display: block;
+  position: relative;
+  width: var(--mdc-grid-list-tile-width, 200px); }
+  .mdc-grid-tile__primary {
+    position: relative;
+    height: 0;
+    /* @alternate */
+    background-color: #fff;
+    background-color: var(--mdc-theme-background, #fff);
+    /* @alternate */
+    color: rgba(0, 0, 0, 0.87);
+    color: var(--mdc-theme-text-primary-on-background, rgba(0, 0, 0, 0.87)); }
+    .mdc-grid-tile__primary-content {
+      position: absolute;
+      top: 0;
+      right: 0;
+      bottom: 0;
+      left: 0;
+      width: 100%;
+      height: 100%;
+      background-repeat: no-repeat;
+      background-position: center;
+      background-size: cover; }
+  .mdc-grid-tile__secondary {
+    position: absolute;
+    -webkit-box-sizing: border-box;
+            box-sizing: border-box;
+    bottom: 0;
+    height: 48px;
+    padding: 16px;
+    /* @alternate */
+    background-color: #3f51b5;
+    background-color: var(--mdc-theme-primary, #3f51b5);
+    /* @alternate */
+    color: white;
+    color: var(--mdc-theme-text-primary-on-primary, white); }
+  .mdc-grid-tile__title {
+    display: block;
+    margin: 0;
+    padding: 0;
+    font-size: 1rem;
+    font-weight: 500;
+    line-height: 1rem;
+    text-overflow: ellipsis;
+    white-space: nowrap;
+    overflow: hidden; }
+  .mdc-grid-tile__support-text {
+    font-family: Roboto, sans-serif;
+    -moz-osx-font-smoothing: grayscale;
+    -webkit-font-smoothing: antialiased;
+    font-size: 0.875rem;
+    font-weight: 400;
+    letter-spacing: 0.04em;
+    line-height: 1.25rem;
+    text-decoration: inherit;
+    text-transform: inherit;
+    text-overflow: ellipsis;
+    white-space: nowrap;
+    overflow: hidden;
+    display: block;
+    margin: 0;
+    margin-top: 4px;
+    padding: 0; }
+  .mdc-grid-tile__icon {
+    position: absolute;
+    top: calc(50% - 24px / 2);
+    font-size: 0; }
+
+/** postcss-bem-linter: define icon-toggle */
+/*
+  Precomputed linear color channel values, for use in contrast calculations.
+  See https://www.w3.org/TR/WCAG20-TECHS/G17.html#G17-tests
+
+  Algorithm, for c in 0 to 255:
+  f(c) {
+    c = c / 255;
+    return c < 0.03928 ? c / 12.92 : Math.pow((c + 0.055) / 1.055, 2.4);
+  }
+
+  This lookup table is needed since there is no `pow` in SASS.
+*/
+/**
+ * Calculate the luminance for a color.
+ * See https://www.w3.org/TR/WCAG20-TECHS/G17.html#G17-tests
+ */
+/**
+ * Calculate the contrast ratio between two colors.
+ * See https://www.w3.org/TR/WCAG20-TECHS/G17.html#G17-tests
+ */
+/**
+ * Determine whether to use dark or light text on top of given color.
+ * Returns "dark" for dark text and "light" for light text.
+ */
+/*
+  Main theme colors.
+  If you're a user customizing your color scheme in SASS, these are probably the only variables you need to change.
+*/
+/* Indigo 500 */
+/* Pink A200 */
+/* White */
+/* Which set of text colors to use for each main theme color (light or dark) */
+/* Text colors according to light vs dark and text type */
+/* Primary text colors for each of the theme colors */
+/** MDC Ripple keyframes are split into their own file so that _mixins.scss can rely on them. */
+@keyframes mdc-ripple-fg-radius-in {
+  from {
+    -webkit-transform: translate(var(--mdc-ripple-fg-translate-start, 0)) scale(1);
+            transform: translate(var(--mdc-ripple-fg-translate-start, 0)) scale(1);
+    -webkit-animation-timing-function: cubic-bezier(0.4, 0, 0.2, 1);
+            animation-timing-function: cubic-bezier(0.4, 0, 0.2, 1); }
+  to {
+    -webkit-transform: translate(var(--mdc-ripple-fg-translate-end, 0)) scale(var(--mdc-ripple-fg-scale, 1));
+            transform: translate(var(--mdc-ripple-fg-translate-end, 0)) scale(var(--mdc-ripple-fg-scale, 1)); } }
+
+@keyframes mdc-ripple-fg-opacity-in {
+  from {
+    opacity: 0;
+    -webkit-animation-timing-function: linear;
+            animation-timing-function: linear; }
+  to {
+    opacity: 1; } }
+
+@keyframes mdc-ripple-fg-opacity-out {
+  from {
+    opacity: 1;
+    -webkit-animation-timing-function: linear;
+            animation-timing-function: linear; }
+  to {
+    opacity: 0; } }
+
+/*
+  Precomputed linear color channel values, for use in contrast calculations.
+  See https://www.w3.org/TR/WCAG20-TECHS/G17.html#G17-tests
+
+  Algorithm, for c in 0 to 255:
+  f(c) {
+    c = c / 255;
+    return c < 0.03928 ? c / 12.92 : Math.pow((c + 0.055) / 1.055, 2.4);
+  }
+
+  This lookup table is needed since there is no `pow` in SASS.
+*/
+/**
+ * Calculate the luminance for a color.
+ * See https://www.w3.org/TR/WCAG20-TECHS/G17.html#G17-tests
+ */
+/**
+ * Calculate the contrast ratio between two colors.
+ * See https://www.w3.org/TR/WCAG20-TECHS/G17.html#G17-tests
+ */
+/**
+ * Determine whether to use dark or light text on top of given color.
+ * Returns "dark" for dark text and "light" for light text.
+ */
+/*
+  Main theme colors.
+  If you're a user customizing your color scheme in SASS, these are probably the only variables you need to change.
+*/
+/* Indigo 500 */
+/* Pink A200 */
+/* White */
+/* Which set of text colors to use for each main theme color (light or dark) */
+/* Text colors according to light vs dark and text type */
+/* Primary text colors for each of the theme colors */
+/**
+ * Applies the correct theme color style to the specified property.
+ * $property is typically color or background-color, but can be any CSS property that accepts color values.
+ * $style should be one of the map keys in $mdc-theme-property-values (_variables.scss).
+ */
+/**
+ * Creates a rule to be used in MDC-Web components for dark theming, and applies the provided contents.
+ * Should provide the $root-selector option if applied to anything other than the root selector.
+ * When used with a modifier class, provide a second argument of `true` for the $compound parameter
+ * to specify that this should be attached as a compound class.
+ *
+ * Usage example:
+ *
+ * ```scss
+ * .mdc-foo {
+ *   color: black;
+ *
+ *   @include mdc-theme-dark {
+ *     color: white;
+ *   }
+ *
+ *   &__bar {
+ *     background: black;
+ *
+ *     @include mdc-theme-dark(".mdc-foo") {
+ *       background: white;
+ *     }
+ *   }
+ * }
+ *
+ * .mdc-foo--disabled {
+ *   opacity: .38;
+ *
+ *   @include mdc-theme-dark(".mdc-foo", true) {
+ *     opacity: .5;
+ *   }
+ * }
+ * ```
+ */
+.mdc-icon-toggle {
+  /* @alternate */
+  color: rgba(0, 0, 0, 0.54);
+  color: var(--mdc-theme-text-secondary-on-light, rgba(0, 0, 0, 0.54));
+  --mdc-ripple-surface-width: 0;
+  --mdc-ripple-surface-height: 0;
+  --mdc-ripple-fg-size: 0;
+  --mdc-ripple-left: 0;
+  --mdc-ripple-top: 0;
+  --mdc-ripple-fg-scale: 1;
+  --mdc-ripple-fg-translate-end: 0;
+  --mdc-ripple-fg-translate-start: 0;
+  will-change: transform, opacity;
+  -webkit-tap-highlight-color: transparent;
+  will-change: initial;
+  display: -webkit-box;
+  display: -ms-flexbox;
+  display: flex;
+  position: relative;
+  -webkit-box-sizing: border-box;
+          box-sizing: border-box;
+  -webkit-box-align: center;
+      -ms-flex-align: center;
+          align-items: center;
+  -webkit-box-pack: center;
+      -ms-flex-pack: center;
+          justify-content: center;
+  width: 48px;
+  height: 48px;
+  padding: 12px;
+  outline: none;
+  font-size: 1.5rem;
+  cursor: pointer;
+  -webkit-user-select: none;
+     -moz-user-select: none;
+      -ms-user-select: none;
+          user-select: none; }
+  .mdc-icon-toggle:not(.mdc-ripple-upgraded):hover::before, .mdc-icon-toggle:not(.mdc-ripple-upgraded):focus::before, .mdc-icon-toggle:not(.mdc-ripple-upgraded):active::after {
+    -webkit-transition-duration: 85ms;
+            transition-duration: 85ms;
+    opacity: .6; }
+  .mdc-icon-toggle::before {
+    background-color: rgba(0, 0, 0, 0.062);
+    position: absolute;
+    top: calc(50% - 100%);
+    left: calc(50% - 100%);
+    width: 200%;
+    height: 200%;
+    -webkit-transition: opacity 250ms linear;
+    transition: opacity 250ms linear;
+    border-radius: 50%;
+    opacity: 0;
+    pointer-events: none;
+    content: ""; }
+  .mdc-icon-toggle.mdc-ripple-upgraded::before {
+    top: calc(50% - 100%);
+    left: calc(50% - 100%);
+    width: 200%;
+    height: 200%;
+    /* @alternate */
+    -webkit-transform: scale(0);
+            transform: scale(0);
+    -webkit-transform: scale(var(--mdc-ripple-fg-scale, 0));
+            transform: scale(var(--mdc-ripple-fg-scale, 0)); }
+  .mdc-icon-toggle.mdc-ripple-upgraded--background-focused::before {
+    opacity: .99999; }
+  .mdc-icon-toggle.mdc-ripple-upgraded--background-active-fill::before {
+    -webkit-transition-duration: 120ms;
+            transition-duration: 120ms;
+    opacity: 1; }
+  .mdc-icon-toggle.mdc-ripple-upgraded--unbounded::before {
+    /* @alternate */
+    top: calc(50% - 50%);
+    top: var(--mdc-ripple-top, calc(50% - 50%));
+    /* @alternate */
+    left: calc(50% - 50%);
+    left: var(--mdc-ripple-left, calc(50% - 50%));
+    /* @alternate */
+    width: 100%;
+    width: var(--mdc-ripple-fg-size, 100%);
+    /* @alternate */
+    height: 100%;
+    height: var(--mdc-ripple-fg-size, 100%);
+    /* @alternate */
+    -webkit-transform: scale(0);
+            transform: scale(0);
+    -webkit-transform: scale(var(--mdc-ripple-fg-scale, 0));
+            transform: scale(var(--mdc-ripple-fg-scale, 0)); }
+  .mdc-icon-toggle::after {
+    background-color: rgba(0, 0, 0, 0.062);
+    position: absolute;
+    top: calc(50% - 100%);
+    left: calc(50% - 100%);
+    width: 200%;
+    height: 200%;
+    -webkit-transition: opacity 250ms linear;
+    transition: opacity 250ms linear;
+    border-radius: 50%;
+    opacity: 0;
+    pointer-events: none;
+    content: ""; }
+  .mdc-icon-toggle.mdc-ripple-upgraded::after {
+    top: 0;
+    left: 0;
+    /* @alternate */
+    width: 100%;
+    width: var(--mdc-ripple-fg-size, 100%);
+    /* @alternate */
+    height: 100%;
+    height: var(--mdc-ripple-fg-size, 100%);
+    -webkit-transform: scale(0);
+            transform: scale(0);
+    -webkit-transform-origin: center center;
+            transform-origin: center center;
+    opacity: 0; }
+  .mdc-icon-toggle:not(.mdc-ripple-upgraded--unbounded)::after {
+    -webkit-transform-origin: center center;
+            transform-origin: center center; }
+  .mdc-icon-toggle.mdc-ripple-upgraded--unbounded::after {
+    /* @alternate */
+    top: 0;
+    top: var(--mdc-ripple-top, 0);
+    /* @alternate */
+    left: 0;
+    left: var(--mdc-ripple-left, 0);
+    /* @alternate */
+    width: 100%;
+    width: var(--mdc-ripple-fg-size, 100%);
+    /* @alternate */
+    height: 100%;
+    height: var(--mdc-ripple-fg-size, 100%);
+    -webkit-transform: scale(0);
+            transform: scale(0);
+    -webkit-transform-origin: center center;
+            transform-origin: center center; }
+  .mdc-icon-toggle.mdc-ripple-upgraded--foreground-activation::after {
+    -webkit-animation: 300ms mdc-ripple-fg-radius-in forwards, 83ms mdc-ripple-fg-opacity-in forwards;
+            animation: 300ms mdc-ripple-fg-radius-in forwards, 83ms mdc-ripple-fg-opacity-in forwards; }
+  .mdc-icon-toggle.mdc-ripple-upgraded--foreground-deactivation::after {
+    -webkit-transform: translate(var(--mdc-ripple-fg-translate-end, 0)) scale(var(--mdc-ripple-fg-scale, 1));
+            transform: translate(var(--mdc-ripple-fg-translate-end, 0)) scale(var(--mdc-ripple-fg-scale, 1));
+    -webkit-animation: 83ms mdc-ripple-fg-opacity-out;
+            animation: 83ms mdc-ripple-fg-opacity-out; }
+  .mdc-icon-toggle--theme-dark.mdc-icon-toggle::before,
+  .mdc-theme--dark .mdc-icon-toggle::before {
+    background-color: rgba(255, 255, 255, 0.16);
+    position: absolute;
+    top: calc(50% - 100%);
+    left: calc(50% - 100%);
+    width: 200%;
+    height: 200%;
+    -webkit-transition: opacity 250ms linear;
+    transition: opacity 250ms linear;
+    border-radius: 50%;
+    opacity: 0;
+    pointer-events: none;
+    content: ""; }
+  .mdc-icon-toggle--theme-dark.mdc-icon-toggle.mdc-ripple-upgraded::before,
+  .mdc-theme--dark .mdc-icon-toggle.mdc-ripple-upgraded::before {
+    top: calc(50% - 100%);
+    left: calc(50% - 100%);
+    width: 200%;
+    height: 200%;
+    /* @alternate */
+    -webkit-transform: scale(0);
+            transform: scale(0);
+    -webkit-transform: scale(var(--mdc-ripple-fg-scale, 0));
+            transform: scale(var(--mdc-ripple-fg-scale, 0)); }
+  .mdc-icon-toggle--theme-dark.mdc-icon-toggle.mdc-ripple-upgraded--background-focused::before,
+  .mdc-theme--dark .mdc-icon-toggle.mdc-ripple-upgraded--background-focused::before {
+    opacity: .99999; }
+  .mdc-icon-toggle--theme-dark.mdc-icon-toggle.mdc-ripple-upgraded--background-active-fill::before,
+  .mdc-theme--dark .mdc-icon-toggle.mdc-ripple-upgraded--background-active-fill::before {
+    -webkit-transition-duration: 120ms;
+            transition-duration: 120ms;
+    opacity: 1; }
+  .mdc-icon-toggle--theme-dark.mdc-icon-toggle.mdc-ripple-upgraded--unbounded::before,
+  .mdc-theme--dark .mdc-icon-toggle.mdc-ripple-upgraded--unbounded::before {
+    /* @alternate */
+    top: calc(50% - 50%);
+    top: var(--mdc-ripple-top, calc(50% - 50%));
+    /* @alternate */
+    left: calc(50% - 50%);
+    left: var(--mdc-ripple-left, calc(50% - 50%));
+    /* @alternate */
+    width: 100%;
+    width: var(--mdc-ripple-fg-size, 100%);
+    /* @alternate */
+    height: 100%;
+    height: var(--mdc-ripple-fg-size, 100%);
+    /* @alternate */
+    -webkit-transform: scale(0);
+            transform: scale(0);
+    -webkit-transform: scale(var(--mdc-ripple-fg-scale, 0));
+            transform: scale(var(--mdc-ripple-fg-scale, 0)); }
+  .mdc-icon-toggle--theme-dark.mdc-icon-toggle::after,
+  .mdc-theme--dark .mdc-icon-toggle::after {
+    background-color: rgba(255, 255, 255, 0.16);
+    position: absolute;
+    top: calc(50% - 100%);
+    left: calc(50% - 100%);
+    width: 200%;
+    height: 200%;
+    -webkit-transition: opacity 250ms linear;
+    transition: opacity 250ms linear;
+    border-radius: 50%;
+    opacity: 0;
+    pointer-events: none;
+    content: ""; }
+  .mdc-icon-toggle--theme-dark.mdc-icon-toggle.mdc-ripple-upgraded::after,
+  .mdc-theme--dark .mdc-icon-toggle.mdc-ripple-upgraded::after {
+    top: 0;
+    left: 0;
+    /* @alternate */
+    width: 100%;
+    width: var(--mdc-ripple-fg-size, 100%);
+    /* @alternate */
+    height: 100%;
+    height: var(--mdc-ripple-fg-size, 100%);
+    -webkit-transform: scale(0);
+            transform: scale(0);
+    -webkit-transform-origin: center center;
+            transform-origin: center center;
+    opacity: 0; }
+  .mdc-icon-toggle--theme-dark.mdc-icon-toggle:not(.mdc-ripple-upgraded--unbounded)::after,
+  .mdc-theme--dark .mdc-icon-toggle:not(.mdc-ripple-upgraded--unbounded)::after {
+    -webkit-transform-origin: center center;
+            transform-origin: center center; }
+  .mdc-icon-toggle--theme-dark.mdc-icon-toggle.mdc-ripple-upgraded--unbounded::after,
+  .mdc-theme--dark .mdc-icon-toggle.mdc-ripple-upgraded--unbounded::after {
+    /* @alternate */
+    top: 0;
+    top: var(--mdc-ripple-top, 0);
+    /* @alternate */
+    left: 0;
+    left: var(--mdc-ripple-left, 0);
+    /* @alternate */
+    width: 100%;
+    width: var(--mdc-ripple-fg-size, 100%);
+    /* @alternate */
+    height: 100%;
+    height: var(--mdc-ripple-fg-size, 100%);
+    -webkit-transform: scale(0);
+            transform: scale(0);
+    -webkit-transform-origin: center center;
+            transform-origin: center center; }
+  .mdc-icon-toggle--theme-dark.mdc-icon-toggle.mdc-ripple-upgraded--foreground-activation::after,
+  .mdc-theme--dark .mdc-icon-toggle.mdc-ripple-upgraded--foreground-activation::after {
+    -webkit-animation: 300ms mdc-ripple-fg-radius-in forwards, 83ms mdc-ripple-fg-opacity-in forwards;
+            animation: 300ms mdc-ripple-fg-radius-in forwards, 83ms mdc-ripple-fg-opacity-in forwards; }
+  .mdc-icon-toggle--theme-dark.mdc-icon-toggle.mdc-ripple-upgraded--foreground-deactivation::after,
+  .mdc-theme--dark .mdc-icon-toggle.mdc-ripple-upgraded--foreground-deactivation::after {
+    -webkit-transform: translate(var(--mdc-ripple-fg-translate-end, 0)) scale(var(--mdc-ripple-fg-scale, 1));
+            transform: translate(var(--mdc-ripple-fg-translate-end, 0)) scale(var(--mdc-ripple-fg-scale, 1));
+    -webkit-animation: 83ms mdc-ripple-fg-opacity-out;
+            animation: 83ms mdc-ripple-fg-opacity-out; }
+  .mdc-icon-toggle::after {
+    position: absolute;
+    border-radius: 50%;
+    content: "";
+    opacity: 0;
+    pointer-events: none; }
+  .mdc-icon-toggle--theme-dark,
+  .mdc-theme--dark .mdc-icon-toggle {
+    /* @alternate */
+    color: white;
+    color: var(--mdc-theme-text-primary-on-dark, white); }
+
+.mdc-icon-toggle--primary {
+  /* @alternate */
+  color: #3f51b5;
+  color: var(--mdc-theme-primary, #3f51b5); }
+  .mdc-icon-toggle--primary::before {
+    /* @alternate */
+    background-color: rgba(63, 81, 181, 0.14);
+    position: absolute;
+    top: calc(50% - 100%);
+    left: calc(50% - 100%);
+    width: 200%;
+    height: 200%;
+    -webkit-transition: opacity 250ms linear;
+    transition: opacity 250ms linear;
+    border-radius: 50%;
+    opacity: 0;
+    pointer-events: none;
+    content: ""; }
+    @supports (background-color: color(green a(10%))) {
+      .mdc-icon-toggle--primary::before {
+        background-color: color(var(--mdc-theme-primary, #3f51b5) a(14%)); } }
+  .mdc-icon-toggle--primary.mdc-ripple-upgraded::before {
+    top: calc(50% - 100%);
+    left: calc(50% - 100%);
+    width: 200%;
+    height: 200%;
+    /* @alternate */
+    -webkit-transform: scale(0);
+            transform: scale(0);
+    -webkit-transform: scale(var(--mdc-ripple-fg-scale, 0));
+            transform: scale(var(--mdc-ripple-fg-scale, 0)); }
+  .mdc-icon-toggle--primary.mdc-ripple-upgraded--background-focused::before {
+    opacity: .99999; }
+  .mdc-icon-toggle--primary.mdc-ripple-upgraded--background-active-fill::before {
+    -webkit-transition-duration: 120ms;
+            transition-duration: 120ms;
+    opacity: 1; }
+  .mdc-icon-toggle--primary.mdc-ripple-upgraded--unbounded::before {
+    /* @alternate */
+    top: calc(50% - 50%);
+    top: var(--mdc-ripple-top, calc(50% - 50%));
+    /* @alternate */
+    left: calc(50% - 50%);
+    left: var(--mdc-ripple-left, calc(50% - 50%));
+    /* @alternate */
+    width: 100%;
+    width: var(--mdc-ripple-fg-size, 100%);
+    /* @alternate */
+    height: 100%;
+    height: var(--mdc-ripple-fg-size, 100%);
+    /* @alternate */
+    -webkit-transform: scale(0);
+            transform: scale(0);
+    -webkit-transform: scale(var(--mdc-ripple-fg-scale, 0));
+            transform: scale(var(--mdc-ripple-fg-scale, 0)); }
+  .mdc-icon-toggle--primary::after {
+    /* @alternate */
+    background-color: rgba(63, 81, 181, 0.14);
+    position: absolute;
+    top: calc(50% - 100%);
+    left: calc(50% - 100%);
+    width: 200%;
+    height: 200%;
+    -webkit-transition: opacity 250ms linear;
+    transition: opacity 250ms linear;
+    border-radius: 50%;
+    opacity: 0;
+    pointer-events: none;
+    content: ""; }
+    @supports (background-color: color(green a(10%))) {
+      .mdc-icon-toggle--primary::after {
+        background-color: color(var(--mdc-theme-primary, #3f51b5) a(14%)); } }
+  .mdc-icon-toggle--primary.mdc-ripple-upgraded::after {
+    top: 0;
+    left: 0;
+    /* @alternate */
+    width: 100%;
+    width: var(--mdc-ripple-fg-size, 100%);
+    /* @alternate */
+    height: 100%;
+    height: var(--mdc-ripple-fg-size, 100%);
+    -webkit-transform: scale(0);
+            transform: scale(0);
+    -webkit-transform-origin: center center;
+            transform-origin: center center;
+    opacity: 0; }
+  .mdc-icon-toggle--primary:not(.mdc-ripple-upgraded--unbounded)::after {
+    -webkit-transform-origin: center center;
+            transform-origin: center center; }
+  .mdc-icon-toggle--primary.mdc-ripple-upgraded--unbounded::after {
+    /* @alternate */
+    top: 0;
+    top: var(--mdc-ripple-top, 0);
+    /* @alternate */
+    left: 0;
+    left: var(--mdc-ripple-left, 0);
+    /* @alternate */
+    width: 100%;
+    width: var(--mdc-ripple-fg-size, 100%);
+    /* @alternate */
+    height: 100%;
+    height: var(--mdc-ripple-fg-size, 100%);
+    -webkit-transform: scale(0);
+            transform: scale(0);
+    -webkit-transform-origin: center center;
+            transform-origin: center center; }
+  .mdc-icon-toggle--primary.mdc-ripple-upgraded--foreground-activation::after {
+    -webkit-animation: 300ms mdc-ripple-fg-radius-in forwards, 83ms mdc-ripple-fg-opacity-in forwards;
+            animation: 300ms mdc-ripple-fg-radius-in forwards, 83ms mdc-ripple-fg-opacity-in forwards; }
+  .mdc-icon-toggle--primary.mdc-ripple-upgraded--foreground-deactivation::after {
+    -webkit-transform: translate(var(--mdc-ripple-fg-translate-end, 0)) scale(var(--mdc-ripple-fg-scale, 1));
+            transform: translate(var(--mdc-ripple-fg-translate-end, 0)) scale(var(--mdc-ripple-fg-scale, 1));
+    -webkit-animation: 83ms mdc-ripple-fg-opacity-out;
+            animation: 83ms mdc-ripple-fg-opacity-out; }
+
+.mdc-icon-toggle--accent {
+  /* @alternate */
+  color: #ff4081;
+  color: var(--mdc-theme-accent, #ff4081); }
+  .mdc-icon-toggle--accent::before {
+    /* @alternate */
+    background-color: rgba(255, 64, 129, 0.14);
+    position: absolute;
+    top: calc(50% - 100%);
+    left: calc(50% - 100%);
+    width: 200%;
+    height: 200%;
+    -webkit-transition: opacity 250ms linear;
+    transition: opacity 250ms linear;
+    border-radius: 50%;
+    opacity: 0;
+    pointer-events: none;
+    content: ""; }
+    @supports (background-color: color(green a(10%))) {
+      .mdc-icon-toggle--accent::before {
+        background-color: color(var(--mdc-theme-accent, #ff4081) a(14%)); } }
+  .mdc-icon-toggle--accent.mdc-ripple-upgraded::before {
+    top: calc(50% - 100%);
+    left: calc(50% - 100%);
+    width: 200%;
+    height: 200%;
+    /* @alternate */
+    -webkit-transform: scale(0);
+            transform: scale(0);
+    -webkit-transform: scale(var(--mdc-ripple-fg-scale, 0));
+            transform: scale(var(--mdc-ripple-fg-scale, 0)); }
+  .mdc-icon-toggle--accent.mdc-ripple-upgraded--background-focused::before {
+    opacity: .99999; }
+  .mdc-icon-toggle--accent.mdc-ripple-upgraded--background-active-fill::before {
+    -webkit-transition-duration: 120ms;
+            transition-duration: 120ms;
+    opacity: 1; }
+  .mdc-icon-toggle--accent.mdc-ripple-upgraded--unbounded::before {
+    /* @alternate */
+    top: calc(50% - 50%);
+    top: var(--mdc-ripple-top, calc(50% - 50%));
+    /* @alternate */
+    left: calc(50% - 50%);
+    left: var(--mdc-ripple-left, calc(50% - 50%));
+    /* @alternate */
+    width: 100%;
+    width: var(--mdc-ripple-fg-size, 100%);
+    /* @alternate */
+    height: 100%;
+    height: var(--mdc-ripple-fg-size, 100%);
+    /* @alternate */
+    -webkit-transform: scale(0);
+            transform: scale(0);
+    -webkit-transform: scale(var(--mdc-ripple-fg-scale, 0));
+            transform: scale(var(--mdc-ripple-fg-scale, 0)); }
+  .mdc-icon-toggle--accent::after {
+    /* @alternate */
+    background-color: rgba(255, 64, 129, 0.14);
+    position: absolute;
+    top: calc(50% - 100%);
+    left: calc(50% - 100%);
+    width: 200%;
+    height: 200%;
+    -webkit-transition: opacity 250ms linear;
+    transition: opacity 250ms linear;
+    border-radius: 50%;
+    opacity: 0;
+    pointer-events: none;
+    content: ""; }
+    @supports (background-color: color(green a(10%))) {
+      .mdc-icon-toggle--accent::after {
+        background-color: color(var(--mdc-theme-accent, #ff4081) a(14%)); } }
+  .mdc-icon-toggle--accent.mdc-ripple-upgraded::after {
+    top: 0;
+    left: 0;
+    /* @alternate */
+    width: 100%;
+    width: var(--mdc-ripple-fg-size, 100%);
+    /* @alternate */
+    height: 100%;
+    height: var(--mdc-ripple-fg-size, 100%);
+    -webkit-transform: scale(0);
+            transform: scale(0);
+    -webkit-transform-origin: center center;
+            transform-origin: center center;
+    opacity: 0; }
+  .mdc-icon-toggle--accent:not(.mdc-ripple-upgraded--unbounded)::after {
+    -webkit-transform-origin: center center;
+            transform-origin: center center; }
+  .mdc-icon-toggle--accent.mdc-ripple-upgraded--unbounded::after {
+    /* @alternate */
+    top: 0;
+    top: var(--mdc-ripple-top, 0);
+    /* @alternate */
+    left: 0;
+    left: var(--mdc-ripple-left, 0);
+    /* @alternate */
+    width: 100%;
+    width: var(--mdc-ripple-fg-size, 100%);
+    /* @alternate */
+    height: 100%;
+    height: var(--mdc-ripple-fg-size, 100%);
+    -webkit-transform: scale(0);
+            transform: scale(0);
+    -webkit-transform-origin: center center;
+            transform-origin: center center; }
+  .mdc-icon-toggle--accent.mdc-ripple-upgraded--foreground-activation::after {
+    -webkit-animation: 300ms mdc-ripple-fg-radius-in forwards, 83ms mdc-ripple-fg-opacity-in forwards;
+            animation: 300ms mdc-ripple-fg-radius-in forwards, 83ms mdc-ripple-fg-opacity-in forwards; }
+  .mdc-icon-toggle--accent.mdc-ripple-upgraded--foreground-deactivation::after {
+    -webkit-transform: translate(var(--mdc-ripple-fg-translate-end, 0)) scale(var(--mdc-ripple-fg-scale, 1));
+            transform: translate(var(--mdc-ripple-fg-translate-end, 0)) scale(var(--mdc-ripple-fg-scale, 1));
+    -webkit-animation: 83ms mdc-ripple-fg-opacity-out;
+            animation: 83ms mdc-ripple-fg-opacity-out; }
+
+.mdc-icon-toggle--disabled {
+  /* @alternate */
+  color: rgba(0, 0, 0, 0.38);
+  color: var(--mdc-theme-text-disabled-on-light, rgba(0, 0, 0, 0.38));
+  pointer-events: none; }
+  .mdc-icon-toggle--theme-dark.mdc-icon-toggle--disabled,
+  .mdc-theme--dark .mdc-icon-toggle--disabled {
+    /* @alternate */
+    color: rgba(255, 255, 255, 0.5);
+    color: var(--mdc-theme-text-disabled-on-dark, rgba(255, 255, 255, 0.5)); }
+
+/** postcss-bem-linter: end */
+:root {
+  --mdc-layout-grid-margin-desktop: 24px;
+  --mdc-layout-grid-gutter-desktop: 24px;
+  --mdc-layout-grid-column-width-desktop: 72px;
+  --mdc-layout-grid-margin-tablet: 16px;
+  --mdc-layout-grid-gutter-tablet: 16px;
+  --mdc-layout-grid-column-width-tablet: 72px;
+  --mdc-layout-grid-margin-phone: 16px;
+  --mdc-layout-grid-gutter-phone: 16px;
+  --mdc-layout-grid-column-width-phone: 72px; }
+
+@media (min-width: 840px) {
+  .mdc-layout-grid {
+    -webkit-box-sizing: border-box;
+            box-sizing: border-box;
+    margin: 0 auto;
+    padding: 24px;
+    padding: var(--mdc-layout-grid-margin-desktop, 24px); } }
+
+@media (min-width: 480px) and (max-width: 839px) {
+  .mdc-layout-grid {
+    -webkit-box-sizing: border-box;
+            box-sizing: border-box;
+    margin: 0 auto;
+    padding: 16px;
+    padding: var(--mdc-layout-grid-margin-tablet, 16px); } }
+
+@media (max-width: 479px) {
+  .mdc-layout-grid {
+    -webkit-box-sizing: border-box;
+            box-sizing: border-box;
+    margin: 0 auto;
+    padding: 16px;
+    padding: var(--mdc-layout-grid-margin-phone, 16px); } }
+
+@media (min-width: 840px) {
+  .mdc-layout-grid__inner {
+    display: -webkit-box;
+    display: -ms-flexbox;
+    display: flex;
+    -webkit-box-orient: horizontal;
+    -webkit-box-direction: normal;
+        -ms-flex-flow: row wrap;
+            flex-flow: row wrap;
+    -webkit-box-align: stretch;
+        -ms-flex-align: stretch;
+            align-items: stretch;
+    margin: -12px;
+    margin: calc(var(--mdc-layout-grid-gutter-desktop, 24px) / 2 * -1); }
+    @supports (display: grid) {
+      .mdc-layout-grid__inner {
+        display: grid;
+        grid-gap: 24px;
+        grid-gap: var(--mdc-layout-grid-gutter-desktop, 24px);
+        margin: 0;
+        grid-template-columns: repeat(12, minmax(0, 1fr)); } } }
+
+@media (min-width: 480px) and (max-width: 839px) {
+  .mdc-layout-grid__inner {
+    display: -webkit-box;
+    display: -ms-flexbox;
+    display: flex;
+    -webkit-box-orient: horizontal;
+    -webkit-box-direction: normal;
+        -ms-flex-flow: row wrap;
+            flex-flow: row wrap;
+    -webkit-box-align: stretch;
+        -ms-flex-align: stretch;
+            align-items: stretch;
+    margin: -8px;
+    margin: calc(var(--mdc-layout-grid-gutter-tablet, 16px) / 2 * -1); }
+    @supports (display: grid) {
+      .mdc-layout-grid__inner {
+        display: grid;
+        grid-gap: 16px;
+        grid-gap: var(--mdc-layout-grid-gutter-tablet, 16px);
+        margin: 0;
+        grid-template-columns: repeat(8, minmax(0, 1fr)); } } }
+
+@media (max-width: 479px) {
+  .mdc-layout-grid__inner {
+    display: -webkit-box;
+    display: -ms-flexbox;
+    display: flex;
+    -webkit-box-orient: horizontal;
+    -webkit-box-direction: normal;
+        -ms-flex-flow: row wrap;
+            flex-flow: row wrap;
+    -webkit-box-align: stretch;
+        -ms-flex-align: stretch;
+            align-items: stretch;
+    margin: -8px;
+    margin: calc(var(--mdc-layout-grid-gutter-phone, 16px) / 2 * -1); }
+    @supports (display: grid) {
+      .mdc-layout-grid__inner {
+        display: grid;
+        grid-gap: 16px;
+        grid-gap: var(--mdc-layout-grid-gutter-phone, 16px);
+        margin: 0;
+        grid-template-columns: repeat(4, minmax(0, 1fr)); } } }
+
+@media (min-width: 840px) {
+  .mdc-layout-grid__cell {
+    -webkit-box-sizing: border-box;
+            box-sizing: border-box;
+    margin: 12px;
+    margin: calc(var(--mdc-layout-grid-gutter-desktop, 24px) / 2);
+    width: calc(33.33333% - 24px);
+    width: calc(33.33333% - var(--mdc-layout-grid-gutter-desktop, 24px)); }
+    @supports (display: grid) {
+      .mdc-layout-grid__cell {
+        margin: 0; } }
+    @supports (display: grid) {
+      .mdc-layout-grid__cell {
+        width: auto;
+        grid-column-end: span 4; } }
+    .mdc-layout-grid__cell--span-1, .mdc-layout-grid__cell--span-1-desktop {
+      width: calc(8.33333% - 24px);
+      width: calc(8.33333% - var(--mdc-layout-grid-gutter-desktop, 24px)); }
+      @supports (display: grid) {
+        .mdc-layout-grid__cell--span-1, .mdc-layout-grid__cell--span-1-desktop {
+          width: auto;
+          grid-column-end: span 1; } }
+    .mdc-layout-grid__cell--span-2, .mdc-layout-grid__cell--span-2-desktop {
+      width: calc(16.66667% - 24px);
+      width: calc(16.66667% - var(--mdc-layout-grid-gutter-desktop, 24px)); }
+      @supports (display: grid) {
+        .mdc-layout-grid__cell--span-2, .mdc-layout-grid__cell--span-2-desktop {
+          width: auto;
+          grid-column-end: span 2; } }
+    .mdc-layout-grid__cell--span-3, .mdc-layout-grid__cell--span-3-desktop {
+      width: calc(25% - 24px);
+      width: calc(25% - var(--mdc-layout-grid-gutter-desktop, 24px)); }
+      @supports (display: grid) {
+        .mdc-layout-grid__cell--span-3, .mdc-layout-grid__cell--span-3-desktop {
+          width: auto;
+          grid-column-end: span 3; } }
+    .mdc-layout-grid__cell--span-4, .mdc-layout-grid__cell--span-4-desktop {
+      width: calc(33.33333% - 24px);
+      width: calc(33.33333% - var(--mdc-layout-grid-gutter-desktop, 24px)); }
+      @supports (display: grid) {
+        .mdc-layout-grid__cell--span-4, .mdc-layout-grid__cell--span-4-desktop {
+          width: auto;
+          grid-column-end: span 4; } }
+    .mdc-layout-grid__cell--span-5, .mdc-layout-grid__cell--span-5-desktop {
+      width: calc(41.66667% - 24px);
+      width: calc(41.66667% - var(--mdc-layout-grid-gutter-desktop, 24px)); }
+      @supports (display: grid) {
+        .mdc-layout-grid__cell--span-5, .mdc-layout-grid__cell--span-5-desktop {
+          width: auto;
+          grid-column-end: span 5; } }
+    .mdc-layout-grid__cell--span-6, .mdc-layout-grid__cell--span-6-desktop {
+      width: calc(50% - 24px);
+      width: calc(50% - var(--mdc-layout-grid-gutter-desktop, 24px)); }
+      @supports (display: grid) {
+        .mdc-layout-grid__cell--span-6, .mdc-layout-grid__cell--span-6-desktop {
+          width: auto;
+          grid-column-end: span 6; } }
+    .mdc-layout-grid__cell--span-7, .mdc-layout-grid__cell--span-7-desktop {
+      width: calc(58.33333% - 24px);
+      width: calc(58.33333% - var(--mdc-layout-grid-gutter-desktop, 24px)); }
+      @supports (display: grid) {
+        .mdc-layout-grid__cell--span-7, .mdc-layout-grid__cell--span-7-desktop {
+          width: auto;
+          grid-column-end: span 7; } }
+    .mdc-layout-grid__cell--span-8, .mdc-layout-grid__cell--span-8-desktop {
+      width: calc(66.66667% - 24px);
+      width: calc(66.66667% - var(--mdc-layout-grid-gutter-desktop, 24px)); }
+      @supports (display: grid) {
+        .mdc-layout-grid__cell--span-8, .mdc-layout-grid__cell--span-8-desktop {
+          width: auto;
+          grid-column-end: span 8; } }
+    .mdc-layout-grid__cell--span-9, .mdc-layout-grid__cell--span-9-desktop {
+      width: calc(75% - 24px);
+      width: calc(75% - var(--mdc-layout-grid-gutter-desktop, 24px)); }
+      @supports (display: grid) {
+        .mdc-layout-grid__cell--span-9, .mdc-layout-grid__cell--span-9-desktop {
+          width: auto;
+          grid-column-end: span 9; } }
+    .mdc-layout-grid__cell--span-10, .mdc-layout-grid__cell--span-10-desktop {
+      width: calc(83.33333% - 24px);
+      width: calc(83.33333% - var(--mdc-layout-grid-gutter-desktop, 24px)); }
+      @supports (display: grid) {
+        .mdc-layout-grid__cell--span-10, .mdc-layout-grid__cell--span-10-desktop {
+          width: auto;
+          grid-column-end: span 10; } }
+    .mdc-layout-grid__cell--span-11, .mdc-layout-grid__cell--span-11-desktop {
+      width: calc(91.66667% - 24px);
+      width: calc(91.66667% - var(--mdc-layout-grid-gutter-desktop, 24px)); }
+      @supports (display: grid) {
+        .mdc-layout-grid__cell--span-11, .mdc-layout-grid__cell--span-11-desktop {
+          width: auto;
+          grid-column-end: span 11; } }
+    .mdc-layout-grid__cell--span-12, .mdc-layout-grid__cell--span-12-desktop {
+      width: calc(100% - 24px);
+      width: calc(100% - var(--mdc-layout-grid-gutter-desktop, 24px)); }
+      @supports (display: grid) {
+        .mdc-layout-grid__cell--span-12, .mdc-layout-grid__cell--span-12-desktop {
+          width: auto;
+          grid-column-end: span 12; } } }
+
+@media (min-width: 480px) and (max-width: 839px) {
+  .mdc-layout-grid__cell {
+    -webkit-box-sizing: border-box;
+            box-sizing: border-box;
+    margin: 8px;
+    margin: calc(var(--mdc-layout-grid-gutter-tablet, 16px) / 2);
+    width: calc(50% - 16px);
+    width: calc(50% - var(--mdc-layout-grid-gutter-tablet, 16px)); }
+    @supports (display: grid) {
+      .mdc-layout-grid__cell {
+        margin: 0; } }
+    @supports (display: grid) {
+      .mdc-layout-grid__cell {
+        width: auto;
+        grid-column-end: span 4; } }
+    .mdc-layout-grid__cell--span-1, .mdc-layout-grid__cell--span-1-tablet {
+      width: calc(12.5% - 16px);
+      width: calc(12.5% - var(--mdc-layout-grid-gutter-tablet, 16px)); }
+      @supports (display: grid) {
+        .mdc-layout-grid__cell--span-1, .mdc-layout-grid__cell--span-1-tablet {
+          width: auto;
+          grid-column-end: span 1; } }
+    .mdc-layout-grid__cell--span-2, .mdc-layout-grid__cell--span-2-tablet {
+      width: calc(25% - 16px);
+      width: calc(25% - var(--mdc-layout-grid-gutter-tablet, 16px)); }
+      @supports (display: grid) {
+        .mdc-layout-grid__cell--span-2, .mdc-layout-grid__cell--span-2-tablet {
+          width: auto;
+          grid-column-end: span 2; } }
+    .mdc-layout-grid__cell--span-3, .mdc-layout-grid__cell--span-3-tablet {
+      width: calc(37.5% - 16px);
+      width: calc(37.5% - var(--mdc-layout-grid-gutter-tablet, 16px)); }
+      @supports (display: grid) {
+        .mdc-layout-grid__cell--span-3, .mdc-layout-grid__cell--span-3-tablet {
+          width: auto;
+          grid-column-end: span 3; } }
+    .mdc-layout-grid__cell--span-4, .mdc-layout-grid__cell--span-4-tablet {
+      width: calc(50% - 16px);
+      width: calc(50% - var(--mdc-layout-grid-gutter-tablet, 16px)); }
+      @supports (display: grid) {
+        .mdc-layout-grid__cell--span-4, .mdc-layout-grid__cell--span-4-tablet {
+          width: auto;
+          grid-column-end: span 4; } }
+    .mdc-layout-grid__cell--span-5, .mdc-layout-grid__cell--span-5-tablet {
+      width: calc(62.5% - 16px);
+      width: calc(62.5% - var(--mdc-layout-grid-gutter-tablet, 16px)); }
+      @supports (display: grid) {
+        .mdc-layout-grid__cell--span-5, .mdc-layout-grid__cell--span-5-tablet {
+          width: auto;
+          grid-column-end: span 5; } }
+    .mdc-layout-grid__cell--span-6, .mdc-layout-grid__cell--span-6-tablet {
+      width: calc(75% - 16px);
+      width: calc(75% - var(--mdc-layout-grid-gutter-tablet, 16px)); }
+      @supports (display: grid) {
+        .mdc-layout-grid__cell--span-6, .mdc-layout-grid__cell--span-6-tablet {
+          width: auto;
+          grid-column-end: span 6; } }
+    .mdc-layout-grid__cell--span-7, .mdc-layout-grid__cell--span-7-tablet {
+      width: calc(87.5% - 16px);
+      width: calc(87.5% - var(--mdc-layout-grid-gutter-tablet, 16px)); }
+      @supports (display: grid) {
+        .mdc-layout-grid__cell--span-7, .mdc-layout-grid__cell--span-7-tablet {
+          width: auto;
+          grid-column-end: span 7; } }
+    .mdc-layout-grid__cell--span-8, .mdc-layout-grid__cell--span-8-tablet {
+      width: calc(100% - 16px);
+      width: calc(100% - var(--mdc-layout-grid-gutter-tablet, 16px)); }
+      @supports (display: grid) {
+        .mdc-layout-grid__cell--span-8, .mdc-layout-grid__cell--span-8-tablet {
+          width: auto;
+          grid-column-end: span 8; } }
+    .mdc-layout-grid__cell--span-9, .mdc-layout-grid__cell--span-9-tablet {
+      width: calc(100% - 16px);
+      width: calc(100% - var(--mdc-layout-grid-gutter-tablet, 16px)); }
+      @supports (display: grid) {
+        .mdc-layout-grid__cell--span-9, .mdc-layout-grid__cell--span-9-tablet {
+          width: auto;
+          grid-column-end: span 8; } }
+    .mdc-layout-grid__cell--span-10, .mdc-layout-grid__cell--span-10-tablet {
+      width: calc(100% - 16px);
+      width: calc(100% - var(--mdc-layout-grid-gutter-tablet, 16px)); }
+      @supports (display: grid) {
+        .mdc-layout-grid__cell--span-10, .mdc-layout-grid__cell--span-10-tablet {
+          width: auto;
+          grid-column-end: span 8; } }
+    .mdc-layout-grid__cell--span-11, .mdc-layout-grid__cell--span-11-tablet {
+      width: calc(100% - 16px);
+      width: calc(100% - var(--mdc-layout-grid-gutter-tablet, 16px)); }
+      @supports (display: grid) {
+        .mdc-layout-grid__cell--span-11, .mdc-layout-grid__cell--span-11-tablet {
+          width: auto;
+          grid-column-end: span 8; } }
+    .mdc-layout-grid__cell--span-12, .mdc-layout-grid__cell--span-12-tablet {
+      width: calc(100% - 16px);
+      width: calc(100% - var(--mdc-layout-grid-gutter-tablet, 16px)); }
+      @supports (display: grid) {
+        .mdc-layout-grid__cell--span-12, .mdc-layout-grid__cell--span-12-tablet {
+          width: auto;
+          grid-column-end: span 8; } } }
+
+@media (max-width: 479px) {
+  .mdc-layout-grid__cell {
+    -webkit-box-sizing: border-box;
+            box-sizing: border-box;
+    margin: 8px;
+    margin: calc(var(--mdc-layout-grid-gutter-phone, 16px) / 2);
+    width: calc(100% - 16px);
+    width: calc(100% - var(--mdc-layout-grid-gutter-phone, 16px)); }
+    @supports (display: grid) {
+      .mdc-layout-grid__cell {
+        margin: 0; } }
+    @supports (display: grid) {
+      .mdc-layout-grid__cell {
+        width: auto;
+        grid-column-end: span 4; } }
+    .mdc-layout-grid__cell--span-1, .mdc-layout-grid__cell--span-1-phone {
+      width: calc(25% - 16px);
+      width: calc(25% - var(--mdc-layout-grid-gutter-phone, 16px)); }
+      @supports (display: grid) {
+        .mdc-layout-grid__cell--span-1, .mdc-layout-grid__cell--span-1-phone {
+          width: auto;
+          grid-column-end: span 1; } }
+    .mdc-layout-grid__cell--span-2, .mdc-layout-grid__cell--span-2-phone {
+      width: calc(50% - 16px);
+      width: calc(50% - var(--mdc-layout-grid-gutter-phone, 16px)); }
+      @supports (display: grid) {
+        .mdc-layout-grid__cell--span-2, .mdc-layout-grid__cell--span-2-phone {
+          width: auto;
+          grid-column-end: span 2; } }
+    .mdc-layout-grid__cell--span-3, .mdc-layout-grid__cell--span-3-phone {
+      width: calc(75% - 16px);
+      width: calc(75% - var(--mdc-layout-grid-gutter-phone, 16px)); }
+      @supports (display: grid) {
+        .mdc-layout-grid__cell--span-3, .mdc-layout-grid__cell--span-3-phone {
+          width: auto;
+          grid-column-end: span 3; } }
+    .mdc-layout-grid__cell--span-4, .mdc-layout-grid__cell--span-4-phone {
+      width: calc(100% - 16px);
+      width: calc(100% - var(--mdc-layout-grid-gutter-phone, 16px)); }
+      @supports (display: grid) {
+        .mdc-layout-grid__cell--span-4, .mdc-layout-grid__cell--span-4-phone {
+          width: auto;
+          grid-column-end: span 4; } }
+    .mdc-layout-grid__cell--span-5, .mdc-layout-grid__cell--span-5-phone {
+      width: calc(100% - 16px);
+      width: calc(100% - var(--mdc-layout-grid-gutter-phone, 16px)); }
+      @supports (display: grid) {
+        .mdc-layout-grid__cell--span-5, .mdc-layout-grid__cell--span-5-phone {
+          width: auto;
+          grid-column-end: span 4; } }
+    .mdc-layout-grid__cell--span-6, .mdc-layout-grid__cell--span-6-phone {
+      width: calc(100% - 16px);
+      width: calc(100% - var(--mdc-layout-grid-gutter-phone, 16px)); }
+      @supports (display: grid) {
+        .mdc-layout-grid__cell--span-6, .mdc-layout-grid__cell--span-6-phone {
+          width: auto;
+          grid-column-end: span 4; } }
+    .mdc-layout-grid__cell--span-7, .mdc-layout-grid__cell--span-7-phone {
+      width: calc(100% - 16px);
+      width: calc(100% - var(--mdc-layout-grid-gutter-phone, 16px)); }
+      @supports (display: grid) {
+        .mdc-layout-grid__cell--span-7, .mdc-layout-grid__cell--span-7-phone {
+          width: auto;
+          grid-column-end: span 4; } }
+    .mdc-layout-grid__cell--span-8, .mdc-layout-grid__cell--span-8-phone {
+      width: calc(100% - 16px);
+      width: calc(100% - var(--mdc-layout-grid-gutter-phone, 16px)); }
+      @supports (display: grid) {
+        .mdc-layout-grid__cell--span-8, .mdc-layout-grid__cell--span-8-phone {
+          width: auto;
+          grid-column-end: span 4; } }
+    .mdc-layout-grid__cell--span-9, .mdc-layout-grid__cell--span-9-phone {
+      width: calc(100% - 16px);
+      width: calc(100% - var(--mdc-layout-grid-gutter-phone, 16px)); }
+      @supports (display: grid) {
+        .mdc-layout-grid__cell--span-9, .mdc-layout-grid__cell--span-9-phone {
+          width: auto;
+          grid-column-end: span 4; } }
+    .mdc-layout-grid__cell--span-10, .mdc-layout-grid__cell--span-10-phone {
+      width: calc(100% - 16px);
+      width: calc(100% - var(--mdc-layout-grid-gutter-phone, 16px)); }
+      @supports (display: grid) {
+        .mdc-layout-grid__cell--span-10, .mdc-layout-grid__cell--span-10-phone {
+          width: auto;
+          grid-column-end: span 4; } }
+    .mdc-layout-grid__cell--span-11, .mdc-layout-grid__cell--span-11-phone {
+      width: calc(100% - 16px);
+      width: calc(100% - var(--mdc-layout-grid-gutter-phone, 16px)); }
+      @supports (display: grid) {
+        .mdc-layout-grid__cell--span-11, .mdc-layout-grid__cell--span-11-phone {
+          width: auto;
+          grid-column-end: span 4; } }
+    .mdc-layout-grid__cell--span-12, .mdc-layout-grid__cell--span-12-phone {
+      width: calc(100% - 16px);
+      width: calc(100% - var(--mdc-layout-grid-gutter-phone, 16px)); }
+      @supports (display: grid) {
+        .mdc-layout-grid__cell--span-12, .mdc-layout-grid__cell--span-12-phone {
+          width: auto;
+          grid-column-end: span 4; } } }
+
+.mdc-layout-grid__cell--order-1 {
+  -webkit-box-ordinal-group: 2;
+      -ms-flex-order: 1;
+          order: 1; }
+
+.mdc-layout-grid__cell--order-2 {
+  -webkit-box-ordinal-group: 3;
+      -ms-flex-order: 2;
+          order: 2; }
+
+.mdc-layout-grid__cell--order-3 {
+  -webkit-box-ordinal-group: 4;
+      -ms-flex-order: 3;
+          order: 3; }
+
+.mdc-layout-grid__cell--order-4 {
+  -webkit-box-ordinal-group: 5;
+      -ms-flex-order: 4;
+          order: 4; }
+
+.mdc-layout-grid__cell--order-5 {
+  -webkit-box-ordinal-group: 6;
+      -ms-flex-order: 5;
+          order: 5; }
+
+.mdc-layout-grid__cell--order-6 {
+  -webkit-box-ordinal-group: 7;
+      -ms-flex-order: 6;
+          order: 6; }
+
+.mdc-layout-grid__cell--order-7 {
+  -webkit-box-ordinal-group: 8;
+      -ms-flex-order: 7;
+          order: 7; }
+
+.mdc-layout-grid__cell--order-8 {
+  -webkit-box-ordinal-group: 9;
+      -ms-flex-order: 8;
+          order: 8; }
+
+.mdc-layout-grid__cell--order-9 {
+  -webkit-box-ordinal-group: 10;
+      -ms-flex-order: 9;
+          order: 9; }
+
+.mdc-layout-grid__cell--order-10 {
+  -webkit-box-ordinal-group: 11;
+      -ms-flex-order: 10;
+          order: 10; }
+
+.mdc-layout-grid__cell--order-11 {
+  -webkit-box-ordinal-group: 12;
+      -ms-flex-order: 11;
+          order: 11; }
+
+.mdc-layout-grid__cell--order-12 {
+  -webkit-box-ordinal-group: 13;
+      -ms-flex-order: 12;
+          order: 12; }
+
+.mdc-layout-grid__cell--align-top {
+  -ms-flex-item-align: start;
+      align-self: flex-start; }
+  @supports (display: grid) {
+    .mdc-layout-grid__cell--align-top {
+      -ms-flex-item-align: start;
+          align-self: start; } }
+
+.mdc-layout-grid__cell--align-middle {
+  -ms-flex-item-align: center;
+      align-self: center; }
+
+.mdc-layout-grid__cell--align-bottom {
+  -ms-flex-item-align: end;
+      align-self: flex-end; }
+  @supports (display: grid) {
+    .mdc-layout-grid__cell--align-bottom {
+      -ms-flex-item-align: end;
+          align-self: end; } }
+
+@media (min-width: 840px) {
+  .mdc-layout-grid--fixed-column-width {
+    width: 1176px;
+    width: calc( var(--mdc-layout-grid-column-width-desktop, 72px) * 12 + var(--mdc-layout-grid-gutter-desktop, 24px) * 11 + var(--mdc-layout-grid-margin-desktop, 24px) * 2); } }
+
+@media (min-width: 480px) and (max-width: 839px) {
+  .mdc-layout-grid--fixed-column-width {
+    width: 720px;
+    width: calc( var(--mdc-layout-grid-column-width-tablet, 72px) * 8 + var(--mdc-layout-grid-gutter-tablet, 16px) * 7 + var(--mdc-layout-grid-margin-tablet, 16px) * 2); } }
+
+@media (max-width: 479px) {
+  .mdc-layout-grid--fixed-column-width {
+    width: 368px;
+    width: calc( var(--mdc-layout-grid-column-width-phone, 72px) * 4 + var(--mdc-layout-grid-gutter-phone, 16px) * 3 + var(--mdc-layout-grid-margin-phone, 16px) * 2); } }
+
+.mdc-layout-grid--align-left {
+  margin-right: auto;
+  margin-left: 0; }
+
+.mdc-layout-grid--align-right {
+  margin-right: 0;
+  margin-left: auto; }
+
+/*
+  Precomputed linear color channel values, for use in contrast calculations.
+  See https://www.w3.org/TR/WCAG20-TECHS/G17.html#G17-tests
+
+  Algorithm, for c in 0 to 255:
+  f(c) {
+    c = c / 255;
+    return c < 0.03928 ? c / 12.92 : Math.pow((c + 0.055) / 1.055, 2.4);
+  }
+
+  This lookup table is needed since there is no `pow` in SASS.
+*/
+/**
+ * Calculate the luminance for a color.
+ * See https://www.w3.org/TR/WCAG20-TECHS/G17.html#G17-tests
+ */
+/**
+ * Calculate the contrast ratio between two colors.
+ * See https://www.w3.org/TR/WCAG20-TECHS/G17.html#G17-tests
+ */
+/**
+ * Determine whether to use dark or light text on top of given color.
+ * Returns "dark" for dark text and "light" for light text.
+ */
+/*
+  Main theme colors.
+  If you're a user customizing your color scheme in SASS, these are probably the only variables you need to change.
+*/
+/* Indigo 500 */
+/* Pink A200 */
+/* White */
+/* Which set of text colors to use for each main theme color (light or dark) */
+/* Text colors according to light vs dark and text type */
+/* Primary text colors for each of the theme colors */
+/**
+ * Applies the correct theme color style to the specified property.
+ * $property is typically color or background-color, but can be any CSS property that accepts color values.
+ * $style should be one of the map keys in $mdc-theme-property-values (_variables.scss).
+ */
+/**
+ * Creates a rule to be used in MDC-Web components for dark theming, and applies the provided contents.
+ * Should provide the $root-selector option if applied to anything other than the root selector.
+ * When used with a modifier class, provide a second argument of `true` for the $compound parameter
+ * to specify that this should be attached as a compound class.
+ *
+ * Usage example:
+ *
+ * ```scss
+ * .mdc-foo {
+ *   color: black;
+ *
+ *   @include mdc-theme-dark {
+ *     color: white;
+ *   }
+ *
+ *   &__bar {
+ *     background: black;
+ *
+ *     @include mdc-theme-dark(".mdc-foo") {
+ *       background: white;
+ *     }
+ *   }
+ * }
+ *
+ * .mdc-foo--disabled {
+ *   opacity: .38;
+ *
+ *   @include mdc-theme-dark(".mdc-foo", true) {
+ *     opacity: .5;
+ *   }
+ * }
+ * ```
+ */
+@-webkit-keyframes primary-indeterminate-translate {
+  0% {
+    -webkit-transform: translateX(0);
+            transform: translateX(0); }
+  20% {
+    -webkit-animation-timing-function: cubic-bezier(0.5, 0, 0.70173, 0.49582);
+            animation-timing-function: cubic-bezier(0.5, 0, 0.70173, 0.49582);
+    -webkit-transform: translateX(0);
+            transform: translateX(0); }
+  59.15% {
+    -webkit-animation-timing-function: cubic-bezier(0.30244, 0.38135, 0.55, 0.95635);
+            animation-timing-function: cubic-bezier(0.30244, 0.38135, 0.55, 0.95635);
+    -webkit-transform: translateX(83.67142%);
+            transform: translateX(83.67142%); }
+  100% {
+    -webkit-transform: translateX(200.61106%);
+            transform: translateX(200.61106%); } }
+@keyframes primary-indeterminate-translate {
+  0% {
+    -webkit-transform: translateX(0);
+            transform: translateX(0); }
+  20% {
+    -webkit-animation-timing-function: cubic-bezier(0.5, 0, 0.70173, 0.49582);
+            animation-timing-function: cubic-bezier(0.5, 0, 0.70173, 0.49582);
+    -webkit-transform: translateX(0);
+            transform: translateX(0); }
+  59.15% {
+    -webkit-animation-timing-function: cubic-bezier(0.30244, 0.38135, 0.55, 0.95635);
+            animation-timing-function: cubic-bezier(0.30244, 0.38135, 0.55, 0.95635);
+    -webkit-transform: translateX(83.67142%);
+            transform: translateX(83.67142%); }
+  100% {
+    -webkit-transform: translateX(200.61106%);
+            transform: translateX(200.61106%); } }
+
+@-webkit-keyframes primary-indeterminate-scale {
+  0% {
+    -webkit-transform: scaleX(0.08);
+            transform: scaleX(0.08); }
+  36.65% {
+    -webkit-animation-timing-function: cubic-bezier(0.33473, 0.12482, 0.78584, 1);
+            animation-timing-function: cubic-bezier(0.33473, 0.12482, 0.78584, 1);
+    -webkit-transform: scaleX(0.08);
+            transform: scaleX(0.08); }
+  69.15% {
+    -webkit-animation-timing-function: cubic-bezier(0.06, 0.11, 0.6, 1);
+            animation-timing-function: cubic-bezier(0.06, 0.11, 0.6, 1);
+    -webkit-transform: scaleX(0.66148);
+            transform: scaleX(0.66148); }
+  100% {
+    -webkit-transform: scaleX(0.08);
+            transform: scaleX(0.08); } }
+
+@keyframes primary-indeterminate-scale {
+  0% {
+    -webkit-transform: scaleX(0.08);
+            transform: scaleX(0.08); }
+  36.65% {
+    -webkit-animation-timing-function: cubic-bezier(0.33473, 0.12482, 0.78584, 1);
+            animation-timing-function: cubic-bezier(0.33473, 0.12482, 0.78584, 1);
+    -webkit-transform: scaleX(0.08);
+            transform: scaleX(0.08); }
+  69.15% {
+    -webkit-animation-timing-function: cubic-bezier(0.06, 0.11, 0.6, 1);
+            animation-timing-function: cubic-bezier(0.06, 0.11, 0.6, 1);
+    -webkit-transform: scaleX(0.66148);
+            transform: scaleX(0.66148); }
+  100% {
+    -webkit-transform: scaleX(0.08);
+            transform: scaleX(0.08); } }
+
+@-webkit-keyframes secondary-indeterminate-translate {
+  0% {
+    -webkit-animation-timing-function: cubic-bezier(0.15, 0, 0.51506, 0.40969);
+            animation-timing-function: cubic-bezier(0.15, 0, 0.51506, 0.40969);
+    -webkit-transform: translateX(0);
+            transform: translateX(0); }
+  25% {
+    -webkit-animation-timing-function: cubic-bezier(0.31033, 0.28406, 0.8, 0.73371);
+            animation-timing-function: cubic-bezier(0.31033, 0.28406, 0.8, 0.73371);
+    -webkit-transform: translateX(37.65191%);
+            transform: translateX(37.65191%); }
+  48.35% {
+    -webkit-animation-timing-function: cubic-bezier(0.4, 0.62704, 0.6, 0.90203);
+            animation-timing-function: cubic-bezier(0.4, 0.62704, 0.6, 0.90203);
+    -webkit-transform: translateX(84.38617%);
+            transform: translateX(84.38617%); }
+  100% {
+    -webkit-transform: translateX(160.27778%);
+            transform: translateX(160.27778%); } }
+
+@keyframes secondary-indeterminate-translate {
+  0% {
+    -webkit-animation-timing-function: cubic-bezier(0.15, 0, 0.51506, 0.40969);
+            animation-timing-function: cubic-bezier(0.15, 0, 0.51506, 0.40969);
+    -webkit-transform: translateX(0);
+            transform: translateX(0); }
+  25% {
+    -webkit-animation-timing-function: cubic-bezier(0.31033, 0.28406, 0.8, 0.73371);
+            animation-timing-function: cubic-bezier(0.31033, 0.28406, 0.8, 0.73371);
+    -webkit-transform: translateX(37.65191%);
+            transform: translateX(37.65191%); }
+  48.35% {
+    -webkit-animation-timing-function: cubic-bezier(0.4, 0.62704, 0.6, 0.90203);
+            animation-timing-function: cubic-bezier(0.4, 0.62704, 0.6, 0.90203);
+    -webkit-transform: translateX(84.38617%);
+            transform: translateX(84.38617%); }
+  100% {
+    -webkit-transform: translateX(160.27778%);
+            transform: translateX(160.27778%); } }
+
+@-webkit-keyframes secondary-indeterminate-scale {
+  0% {
+    -webkit-animation-timing-function: cubic-bezier(0.20503, 0.05705, 0.57661, 0.45397);
+            animation-timing-function: cubic-bezier(0.20503, 0.05705, 0.57661, 0.45397);
+    -webkit-transform: scaleX(0.08);
+            transform: scaleX(0.08); }
+  19.15% {
+    -webkit-animation-timing-function: cubic-bezier(0.15231, 0.19643, 0.64837, 1.00432);
+            animation-timing-function: cubic-bezier(0.15231, 0.19643, 0.64837, 1.00432);
+    -webkit-transform: scaleX(0.4571);
+            transform: scaleX(0.4571); }
+  44.15% {
+    -webkit-animation-timing-function: cubic-bezier(0.25776, -0.00316, 0.21176, 1.38179);
+            animation-timing-function: cubic-bezier(0.25776, -0.00316, 0.21176, 1.38179);
+    -webkit-transform: scaleX(0.72796);
+            transform: scaleX(0.72796); }
+  100% {
+    -webkit-transform: scaleX(0.08);
+            transform: scaleX(0.08); } }
+
+@keyframes secondary-indeterminate-scale {
+  0% {
+    -webkit-animation-timing-function: cubic-bezier(0.20503, 0.05705, 0.57661, 0.45397);
+            animation-timing-function: cubic-bezier(0.20503, 0.05705, 0.57661, 0.45397);
+    -webkit-transform: scaleX(0.08);
+            transform: scaleX(0.08); }
+  19.15% {
+    -webkit-animation-timing-function: cubic-bezier(0.15231, 0.19643, 0.64837, 1.00432);
+            animation-timing-function: cubic-bezier(0.15231, 0.19643, 0.64837, 1.00432);
+    -webkit-transform: scaleX(0.4571);
+            transform: scaleX(0.4571); }
+  44.15% {
+    -webkit-animation-timing-function: cubic-bezier(0.25776, -0.00316, 0.21176, 1.38179);
+            animation-timing-function: cubic-bezier(0.25776, -0.00316, 0.21176, 1.38179);
+    -webkit-transform: scaleX(0.72796);
+            transform: scaleX(0.72796); }
+  100% {
+    -webkit-transform: scaleX(0.08);
+            transform: scaleX(0.08); } }
+
+@-webkit-keyframes buffering {
+  to {
+    -webkit-transform: translateX(-10px);
+            transform: translateX(-10px); } }
+
+@keyframes buffering {
+  to {
+    -webkit-transform: translateX(-10px);
+            transform: translateX(-10px); } }
+
+@-webkit-keyframes primary-indeterminate-translate-reverse {
+  0% {
+    -webkit-transform: translateX(0);
+            transform: translateX(0); }
+  20% {
+    -webkit-animation-timing-function: cubic-bezier(0.5, 0, 0.70173, 0.49582);
+            animation-timing-function: cubic-bezier(0.5, 0, 0.70173, 0.49582);
+    -webkit-transform: translateX(0);
+            transform: translateX(0); }
+  59.15% {
+    -webkit-animation-timing-function: cubic-bezier(0.30244, 0.38135, 0.55, 0.95635);
+            animation-timing-function: cubic-bezier(0.30244, 0.38135, 0.55, 0.95635);
+    -webkit-transform: translateX(-83.67142%);
+            transform: translateX(-83.67142%); }
+  100% {
+    -webkit-transform: translateX(-200.61106%);
+            transform: translateX(-200.61106%); } }
+
+@keyframes primary-indeterminate-translate-reverse {
+  0% {
+    -webkit-transform: translateX(0);
+            transform: translateX(0); }
+  20% {
+    -webkit-animation-timing-function: cubic-bezier(0.5, 0, 0.70173, 0.49582);
+            animation-timing-function: cubic-bezier(0.5, 0, 0.70173, 0.49582);
+    -webkit-transform: translateX(0);
+            transform: translateX(0); }
+  59.15% {
+    -webkit-animation-timing-function: cubic-bezier(0.30244, 0.38135, 0.55, 0.95635);
+            animation-timing-function: cubic-bezier(0.30244, 0.38135, 0.55, 0.95635);
+    -webkit-transform: translateX(-83.67142%);
+            transform: translateX(-83.67142%); }
+  100% {
+    -webkit-transform: translateX(-200.61106%);
+            transform: translateX(-200.61106%); } }
+
+@-webkit-keyframes secondary-indeterminate-translate-reverse {
+  0% {
+    -webkit-animation-timing-function: cubic-bezier(0.15, 0, 0.51506, 0.40969);
+            animation-timing-function: cubic-bezier(0.15, 0, 0.51506, 0.40969);
+    -webkit-transform: translateX(0);
+            transform: translateX(0); }
+  25% {
+    -webkit-animation-timing-function: cubic-bezier(0.31033, 0.28406, 0.8, 0.73371);
+            animation-timing-function: cubic-bezier(0.31033, 0.28406, 0.8, 0.73371);
+    -webkit-transform: translateX(-37.65191%);
+            transform: translateX(-37.65191%); }
+  48.35% {
+    -webkit-animation-timing-function: cubic-bezier(0.4, 0.62704, 0.6, 0.90203);
+            animation-timing-function: cubic-bezier(0.4, 0.62704, 0.6, 0.90203);
+    -webkit-transform: translateX(-84.38617%);
+            transform: translateX(-84.38617%); }
+  100% {
+    -webkit-transform: translateX(-160.27778%);
+            transform: translateX(-160.27778%); } }
+
+@keyframes secondary-indeterminate-translate-reverse {
+  0% {
+    -webkit-animation-timing-function: cubic-bezier(0.15, 0, 0.51506, 0.40969);
+            animation-timing-function: cubic-bezier(0.15, 0, 0.51506, 0.40969);
+    -webkit-transform: translateX(0);
+            transform: translateX(0); }
+  25% {
+    -webkit-animation-timing-function: cubic-bezier(0.31033, 0.28406, 0.8, 0.73371);
+            animation-timing-function: cubic-bezier(0.31033, 0.28406, 0.8, 0.73371);
+    -webkit-transform: translateX(-37.65191%);
+            transform: translateX(-37.65191%); }
+  48.35% {
+    -webkit-animation-timing-function: cubic-bezier(0.4, 0.62704, 0.6, 0.90203);
+            animation-timing-function: cubic-bezier(0.4, 0.62704, 0.6, 0.90203);
+    -webkit-transform: translateX(-84.38617%);
+            transform: translateX(-84.38617%); }
+  100% {
+    -webkit-transform: translateX(-160.27778%);
+            transform: translateX(-160.27778%); } }
+
+@-webkit-keyframes buffering-reverse {
+  to {
+    -webkit-transform: translateX(10px);
+            transform: translateX(10px); } }
+
+@keyframes buffering-reverse {
+  to {
+    -webkit-transform: translateX(10px);
+            transform: translateX(10px); } }
+
+.mdc-linear-progress {
+  position: relative;
+  width: 100%;
+  height: 4px;
+  -webkit-transform: translateZ(0);
+          transform: translateZ(0);
+  -webkit-transition: opacity 250ms 0ms cubic-bezier(0.4, 0, 0.6, 1);
+  transition: opacity 250ms 0ms cubic-bezier(0.4, 0, 0.6, 1);
+  overflow: hidden; }
+  .mdc-linear-progress__bar {
+    -webkit-animation: none;
+            animation: none;
+    position: absolute;
+    width: 100%;
+    height: 100%;
+    -webkit-transform-origin: top left;
+            transform-origin: top left;
+    -webkit-transition: -webkit-transform 250ms 0ms cubic-bezier(0.4, 0, 0.6, 1);
+    transition: -webkit-transform 250ms 0ms cubic-bezier(0.4, 0, 0.6, 1);
+    transition: transform 250ms 0ms cubic-bezier(0.4, 0, 0.6, 1);
+    transition: transform 250ms 0ms cubic-bezier(0.4, 0, 0.6, 1), -webkit-transform 250ms 0ms cubic-bezier(0.4, 0, 0.6, 1); }
+  .mdc-linear-progress__bar-inner {
+    /* @alternate */
+    background-color: #3f51b5;
+    background-color: var(--mdc-theme-primary, #3f51b5);
+    -webkit-animation: none;
+            animation: none;
+    display: inline-block;
+    position: absolute;
+    width: 100%;
+    height: 100%; }
+  .mdc-linear-progress--accent .mdc-linear-progress__bar-inner {
+    /* @alternate */
+    background-color: #ff4081;
+    background-color: var(--mdc-theme-accent, #ff4081); }
+  .mdc-linear-progress__buffering-dots {
+    position: absolute;
+    width: 100%;
+    height: 100%;
+    background-image: url("data:image/svg+xml,%3Csvg version='1.1' xmlns='http://www.w3.org/2000/svg' xmlns:xlink='http://www.w3.org/1999/xlink' x='0px' y='0px' enable-background='new 0 0 5 2' xml:space='preserve' viewBox='0 0 5 2' preserveAspectRatio='none slice'%3E%3Ccircle cx='1' cy='1' r='1' fill='%23e6e6e6'/%3E%3C/svg%3E");
+    background-repeat: repeat-x;
+    background-size: 10px 4px;
+    -webkit-animation: buffering 250ms infinite linear;
+            animation: buffering 250ms infinite linear; }
+  .mdc-linear-progress__buffer {
+    position: absolute;
+    width: 100%;
+    height: 100%;
+    -webkit-transform-origin: top left;
+            transform-origin: top left;
+    -webkit-transition: -webkit-transform 250ms 0ms cubic-bezier(0.4, 0, 0.6, 1);
+    transition: -webkit-transform 250ms 0ms cubic-bezier(0.4, 0, 0.6, 1);
+    transition: transform 250ms 0ms cubic-bezier(0.4, 0, 0.6, 1);
+    transition: transform 250ms 0ms cubic-bezier(0.4, 0, 0.6, 1), -webkit-transform 250ms 0ms cubic-bezier(0.4, 0, 0.6, 1);
+    background-color: #e6e6e6; }
+  .mdc-linear-progress__secondary-bar {
+    visibility: hidden; }
+  .mdc-linear-progress--indeterminate .mdc-linear-progress__bar {
+    -webkit-transition: none;
+    transition: none; }
+  .mdc-linear-progress--indeterminate .mdc-linear-progress__primary-bar {
+    -webkit-animation: primary-indeterminate-translate 2s infinite linear;
+            animation: primary-indeterminate-translate 2s infinite linear;
+    left: -145.166611%; }
+    .mdc-linear-progress--indeterminate .mdc-linear-progress__primary-bar > .mdc-linear-progress__bar-inner {
+      -webkit-animation: primary-indeterminate-scale 2s infinite linear;
+              animation: primary-indeterminate-scale 2s infinite linear; }
+  .mdc-linear-progress--indeterminate .mdc-linear-progress__secondary-bar {
+    -webkit-animation: secondary-indeterminate-translate 2s infinite linear;
+            animation: secondary-indeterminate-translate 2s infinite linear;
+    left: -54.888891%;
+    visibility: visible; }
+    .mdc-linear-progress--indeterminate .mdc-linear-progress__secondary-bar > .mdc-linear-progress__bar-inner {
+      -webkit-animation: secondary-indeterminate-scale 2s infinite linear;
+              animation: secondary-indeterminate-scale 2s infinite linear; }
+  .mdc-linear-progress--reversed .mdc-linear-progress__bar,
+  .mdc-linear-progress--reversed .mdc-linear-progress__buffer {
+    right: 0;
+    -webkit-transform-origin: center right;
+            transform-origin: center right; }
+  .mdc-linear-progress--reversed .mdc-linear-progress__primary-bar {
+    -webkit-animation-name: primary-indeterminate-translate-reverse;
+            animation-name: primary-indeterminate-translate-reverse; }
+  .mdc-linear-progress--reversed .mdc-linear-progress__secondary-bar {
+    -webkit-animation-name: secondary-indeterminate-translate-reverse;
+            animation-name: secondary-indeterminate-translate-reverse; }
+  .mdc-linear-progress--reversed .mdc-linear-progress__buffering-dots {
+    -webkit-animation: buffering-reverse 250ms infinite linear;
+            animation: buffering-reverse 250ms infinite linear; }
+  .mdc-linear-progress--closed {
+    opacity: 0; }
+
+.mdc-linear-progress--indeterminate.mdc-linear-progress--reversed .mdc-linear-progress__primary-bar {
+  right: -145.166611%;
+  left: auto; }
+
+.mdc-linear-progress--indeterminate.mdc-linear-progress--reversed .mdc-linear-progress__secondary-bar {
+  right: -54.888891%;
+  left: auto; }
+
+/*
+  Precomputed linear color channel values, for use in contrast calculations.
+  See https://www.w3.org/TR/WCAG20-TECHS/G17.html#G17-tests
+
+  Algorithm, for c in 0 to 255:
+  f(c) {
+    c = c / 255;
+    return c < 0.03928 ? c / 12.92 : Math.pow((c + 0.055) / 1.055, 2.4);
+  }
+
+  This lookup table is needed since there is no `pow` in SASS.
+*/
+/**
+ * Calculate the luminance for a color.
+ * See https://www.w3.org/TR/WCAG20-TECHS/G17.html#G17-tests
+ */
+/**
+ * Calculate the contrast ratio between two colors.
+ * See https://www.w3.org/TR/WCAG20-TECHS/G17.html#G17-tests
+ */
+/**
+ * Determine whether to use dark or light text on top of given color.
+ * Returns "dark" for dark text and "light" for light text.
+ */
+/*
+  Main theme colors.
+  If you're a user customizing your color scheme in SASS, these are probably the only variables you need to change.
+*/
+/* Indigo 500 */
+/* Pink A200 */
+/* White */
+/* Which set of text colors to use for each main theme color (light or dark) */
+/* Text colors according to light vs dark and text type */
+/* Primary text colors for each of the theme colors */
+/** MDC Ripple keyframes are split into their own file so that _mixins.scss can rely on them. */
+@keyframes mdc-ripple-fg-radius-in {
+  from {
+    -webkit-transform: translate(var(--mdc-ripple-fg-translate-start, 0)) scale(1);
+            transform: translate(var(--mdc-ripple-fg-translate-start, 0)) scale(1);
+    -webkit-animation-timing-function: cubic-bezier(0.4, 0, 0.2, 1);
+            animation-timing-function: cubic-bezier(0.4, 0, 0.2, 1); }
+  to {
+    -webkit-transform: translate(var(--mdc-ripple-fg-translate-end, 0)) scale(var(--mdc-ripple-fg-scale, 1));
+            transform: translate(var(--mdc-ripple-fg-translate-end, 0)) scale(var(--mdc-ripple-fg-scale, 1)); } }
+
+@keyframes mdc-ripple-fg-opacity-in {
+  from {
+    opacity: 0;
+    -webkit-animation-timing-function: linear;
+            animation-timing-function: linear; }
+  to {
+    opacity: 1; } }
+
+@keyframes mdc-ripple-fg-opacity-out {
+  from {
+    opacity: 1;
+    -webkit-animation-timing-function: linear;
+            animation-timing-function: linear; }
+  to {
+    opacity: 0; } }
+
+/**
+ * Creates a rule that will be applied when an MDC-Web component is within the context of an RTL layout.
+ *
+ * Usage Example:
+ * ```scss
+ * .mdc-foo {
+ *   position: absolute;
+ *   left: 0;
+ *
+ *   @include mdc-rtl {
+ *     left: auto;
+ *     right: 0;
+ *   }
+ *
+ *   &__bar {
+ *     margin-left: 4px;
+ *     @include mdc-rtl(".mdc-foo") {
+ *       margin-left: auto;
+ *       margin-right: 4px;
+ *     }
+ *   }
+ * }
+ *
+ * .mdc-foo--mod {
+ *   padding-left: 4px;
+ *
+ *   @include mdc-rtl {
+ *     padding-left: auto;
+ *     padding-right: 4px;
+ *   }
+ * }
+ * ```
+ *
+ * Note that this works by checking for [dir="rtl"] on an ancestor element. While this will work
+ * in most cases, it will in some cases lead to false negatives, e.g.
+ *
+ * ```html
+ * <html dir="rtl">
+ *   <!-- ... -->
+ *   <div dir="ltr">
+ *     <div class="mdc-foo">Styled incorrectly as RTL!</div>
+ *   </div>
+ * </html>
+ * ```
+ *
+ * In the future, selectors such as :dir (http://mdn.io/:dir) will help us mitigate this.
+ */
+/**
+ * Takes a base box-model property - e.g. margin / border / padding - along with a default
+ * direction and value, and emits rules which apply the value to the
+ * "<base-property>-<default-direction>" property by default, but flips the direction
+ * when within an RTL context.
+ *
+ * For example:
+ *
+ * ```scss
+ * .mdc-foo {
+ *   @include mdc-rtl-reflexive-box(margin, left, 8px);
+ * }
+ * ```
+ * is equivalent to:
+ *
+ * ```scss
+ * .mdc-foo {
+ *   margin-left: 8px;
+ *
+ *   @include mdc-rtl {
+ *     margin-right: 8px;
+ *     margin-left: 0;
+ *   }
+ * }
+ * ```
+ * whereas:
+ *
+ * ```scss
+ * .mdc-foo {
+ *   @include mdc-rtl-reflexive-box(margin, right, 8px);
+ * }
+ * ```
+ * is equivalent to:
+ *
+ * ```scss
+ * .mdc-foo {
+ *   margin-right: 8px;
+ *
+ *   @include mdc-rtl {
+ *     margin-right: 0;
+ *     margin-left: 8px;
+ *   }
+ * }
+ * ```
+ *
+ * You can also pass a 4th optional $root-selector argument which will be forwarded to `mdc-rtl`,
+ * e.g. `@include mdc-rtl-reflexive-box(margin, left, 8px, ".mdc-component")`.
+ *
+ * Note that this function will always zero out the original value in an RTL context. If you're
+ * trying to flip the values, use mdc-rtl-reflexive-property().
+ */
+/**
+ * Takes a base property and emits rules that assign <base-property>-left to <left-value> and
+ * <base-property>-right to <right-value> in a LTR context, and vice versa in a RTL context.
+ * For example:
+ *
+ * ```scss
+ * .mdc-foo {
+ *   @include mdc-rtl-reflexive-property(margin, auto, 12px);
+ * }
+ * ```
+ * is equivalent to:
+ *
+ * ```scss
+ * .mdc-foo {
+ *   margin-left: auto;
+ *   margin-right: 12px;
+ *
+ *   @include mdc-rtl {
+ *     margin-left: 12px;
+ *     margin-right: auto;
+ *   }
+ * }
+ * ```
+ *
+ * A 4th optional $root-selector argument can be given, which will be passed to `mdc-rtl`.
+ */
+/**
+ * Takes an argument specifying a horizontal position property (either "left" or "right") as well
+ * as a value, and applies that value to the specified position in a LTR context, and flips it in a
+ * RTL context. For example:
+ *
+ * ```scss
+ * .mdc-foo {
+ *   @include mdc-rtl-reflexive-position(left, 0);
+ *   position: absolute;
+ * }
+ * ```
+ * is equivalent to:
+ *
+ * ```scss
+ *  .mdc-foo {
+ *    position: absolute;
+ *    left: 0;
+ *    right: initial;
+ *
+ *    @include mdc-rtl {
+ *      right: 0;
+ *      left: initial;
+ *    }
+ *  }
+ * ```
+ * An optional third $root-selector argument may also be given, which is passed to `mdc-rtl`.
+ */
+/*
+  Precomputed linear color channel values, for use in contrast calculations.
+  See https://www.w3.org/TR/WCAG20-TECHS/G17.html#G17-tests
+
+  Algorithm, for c in 0 to 255:
+  f(c) {
+    c = c / 255;
+    return c < 0.03928 ? c / 12.92 : Math.pow((c + 0.055) / 1.055, 2.4);
+  }
+
+  This lookup table is needed since there is no `pow` in SASS.
+*/
+/**
+ * Calculate the luminance for a color.
+ * See https://www.w3.org/TR/WCAG20-TECHS/G17.html#G17-tests
+ */
+/**
+ * Calculate the contrast ratio between two colors.
+ * See https://www.w3.org/TR/WCAG20-TECHS/G17.html#G17-tests
+ */
+/**
+ * Determine whether to use dark or light text on top of given color.
+ * Returns "dark" for dark text and "light" for light text.
+ */
+/*
+  Main theme colors.
+  If you're a user customizing your color scheme in SASS, these are probably the only variables you need to change.
+*/
+/* Indigo 500 */
+/* Pink A200 */
+/* White */
+/* Which set of text colors to use for each main theme color (light or dark) */
+/* Text colors according to light vs dark and text type */
+/* Primary text colors for each of the theme colors */
+/**
+ * Applies the correct theme color style to the specified property.
+ * $property is typically color or background-color, but can be any CSS property that accepts color values.
+ * $style should be one of the map keys in $mdc-theme-property-values (_variables.scss).
+ */
+/**
+ * Creates a rule to be used in MDC-Web components for dark theming, and applies the provided contents.
+ * Should provide the $root-selector option if applied to anything other than the root selector.
+ * When used with a modifier class, provide a second argument of `true` for the $compound parameter
+ * to specify that this should be attached as a compound class.
+ *
+ * Usage example:
+ *
+ * ```scss
+ * .mdc-foo {
+ *   color: black;
+ *
+ *   @include mdc-theme-dark {
+ *     color: white;
+ *   }
+ *
+ *   &__bar {
+ *     background: black;
+ *
+ *     @include mdc-theme-dark(".mdc-foo") {
+ *       background: white;
+ *     }
+ *   }
+ * }
+ *
+ * .mdc-foo--disabled {
+ *   opacity: .38;
+ *
+ *   @include mdc-theme-dark(".mdc-foo", true) {
+ *     opacity: .5;
+ *   }
+ * }
+ * ```
+ */
+/* TODO(sgomes): Figure out what to do about desktop font sizes. */
+/* TODO(sgomes): Figure out what to do about i18n and i18n font sizes. */
+/* TODO(sgomes): Figure out what to do about desktop font sizes. */
+/* TODO(sgomes): Figure out what to do about i18n and i18n font sizes. */
+.mdc-list {
+  font-family: Roboto, sans-serif;
+  -moz-osx-font-smoothing: grayscale;
+  -webkit-font-smoothing: antialiased;
+  font-size: 1rem;
+  font-weight: 400;
+  letter-spacing: 0.04em;
+  line-height: 1.75rem;
+  text-decoration: inherit;
+  text-transform: inherit;
+  /* @alternate */
+  color: rgba(0, 0, 0, 0.87);
+  color: var(--mdc-theme-text-primary-on-background, rgba(0, 0, 0, 0.87));
+  margin: 0;
+  padding: 8px 16px 0;
+  line-height: 1.5rem;
+  list-style-type: none; }
+  .mdc-list--theme-dark,
+  .mdc-theme--dark .mdc-list {
+    /* @alternate */
+    color: white;
+    color: var(--mdc-theme-text-primary-on-dark, white); }
+
+.mdc-list--dense {
+  padding-top: 4px;
+  font-size: .812rem; }
+
+.mdc-list-item {
+  display: -webkit-box;
+  display: -ms-flexbox;
+  display: flex;
+  -webkit-box-align: center;
+      -ms-flex-align: center;
+          align-items: center;
+  -webkit-box-pack: start;
+      -ms-flex-pack: start;
+          justify-content: flex-start;
+  height: 48px; }
+  .mdc-list-item__start-detail {
+    width: 24px;
+    height: 24px;
+    margin-left: 0;
+    margin-right: 32px; }
+    [dir="rtl"] .mdc-list-item .mdc-list-item__start-detail,
+    .mdc-list-item[dir="rtl"] .mdc-list-item__start-detail {
+      margin-left: 32px;
+      margin-right: 0; }
+  .mdc-list-item__end-detail {
+    width: 24px;
+    height: 24px;
+    margin-left: auto;
+    margin-right: 0; }
+    [dir="rtl"] .mdc-list-item .mdc-list-item__end-detail,
+    .mdc-list-item[dir="rtl"] .mdc-list-item__end-detail {
+      margin-left: 0;
+      margin-right: auto; }
+  .mdc-list-item__text {
+    display: -webkit-inline-box;
+    display: -ms-inline-flexbox;
+    display: inline-flex;
+    -webkit-box-orient: vertical;
+    -webkit-box-direction: normal;
+        -ms-flex-direction: column;
+            flex-direction: column; }
+    .mdc-list-item__text__secondary {
+      font-family: Roboto, sans-serif;
+      -moz-osx-font-smoothing: grayscale;
+      -webkit-font-smoothing: antialiased;
+      font-size: 0.875rem;
+      font-weight: 400;
+      letter-spacing: 0.04em;
+      line-height: 1.25rem;
+      text-decoration: inherit;
+      text-transform: inherit;
+      /* @alternate */
+      color: rgba(0, 0, 0, 0.54);
+      color: var(--mdc-theme-text-secondary-on-background, rgba(0, 0, 0, 0.54)); }
+      .mdc-list-item__text__secondary--theme-dark,
+      .mdc-theme--dark .mdc-list-item__text__secondary {
+        /* @alternate */
+        color: rgba(255, 255, 255, 0.7);
+        color: var(--mdc-theme-text-secondary-on-dark, rgba(255, 255, 255, 0.7)); }
+      .mdc-list--dense .mdc-list-item__text__secondary {
+        font-size: inherit; }
+  .mdc-list--dense .mdc-list-item {
+    height: 40px; }
+    .mdc-list--dense .mdc-list-item__start-detail {
+      width: 20px;
+      height: 20px;
+      margin-left: 0;
+      margin-right: 36px; }
+      [dir="rtl"] .mdc-list-item .mdc-list--dense .mdc-list-item__start-detail,
+      .mdc-list-item[dir="rtl"] .mdc-list--dense .mdc-list-item__start-detail {
+        margin-left: 36px;
+        margin-right: 0; }
+    .mdc-list--dense .mdc-list-item__end-detail {
+      width: 20px;
+      height: 20px; }
+  .mdc-list--avatar-list .mdc-list-item {
+    height: 56px; }
+    .mdc-list--avatar-list .mdc-list-item__start-detail {
+      width: 40px;
+      height: 40px;
+      margin-left: 0;
+      margin-right: 16px;
+      border-radius: 50%; }
+      [dir="rtl"] .mdc-list-item .mdc-list--avatar-list .mdc-list-item__start-detail,
+      .mdc-list-item[dir="rtl"] .mdc-list--avatar-list .mdc-list-item__start-detail {
+        margin-left: 16px;
+        margin-right: 0; }
+  .mdc-list-item .mdc-list--avatar-list.mdc-list--dense .mdc-list__item {
+    height: 48px; }
+    .mdc-list-item .mdc-list--avatar-list.mdc-list--dense .mdc-list__item__start-detail {
+      width: 36px;
+      height: 36px;
+      margin-left: 0;
+      margin-right: 20px; }
+      [dir="rtl"] .mdc-list-item .mdc-list-item .mdc-list--avatar-list.mdc-list--dense .mdc-list__item__start-detail,
+      .mdc-list-item[dir="rtl"] .mdc-list-item .mdc-list--avatar-list.mdc-list--dense .mdc-list__item__start-detail {
+        margin-left: 20px;
+        margin-right: 0; }
+  .mdc-list--two-line .mdc-list-item {
+    height: 72px; }
+  .mdc-list--two-line.mdc-list--dense .mdc-list-item {
+    height: 60px; }
+
+a.mdc-list-item {
+  color: inherit;
+  text-decoration: none; }
+
+.mdc-list-item.mdc-ripple-upgraded {
+  --mdc-ripple-surface-width: 0;
+  --mdc-ripple-surface-height: 0;
+  --mdc-ripple-fg-size: 0;
+  --mdc-ripple-left: 0;
+  --mdc-ripple-top: 0;
+  --mdc-ripple-fg-scale: 1;
+  --mdc-ripple-fg-translate-end: 0;
+  --mdc-ripple-fg-translate-start: 0;
+  will-change: transform, opacity;
+  -webkit-tap-highlight-color: transparent;
+  left: -16px;
+  right: initial;
+  position: relative;
+  width: 100%;
+  padding: 0 16px;
+  overflow: hidden; }
+  .mdc-list-item.mdc-ripple-upgraded:not(.mdc-ripple-upgraded):hover::before, .mdc-list-item.mdc-ripple-upgraded:not(.mdc-ripple-upgraded):focus::before, .mdc-list-item.mdc-ripple-upgraded:not(.mdc-ripple-upgraded):active::after {
+    -webkit-transition-duration: 85ms;
+            transition-duration: 85ms;
+    opacity: .6; }
+  .mdc-list-item.mdc-ripple-upgraded::before {
+    background-color: rgba(0, 0, 0, 0.06);
+    position: absolute;
+    top: calc(50% - 100%);
+    left: calc(50% - 100%);
+    width: 200%;
+    height: 200%;
+    -webkit-transition: opacity 250ms linear;
+    transition: opacity 250ms linear;
+    border-radius: 50%;
+    opacity: 0;
+    pointer-events: none;
+    content: ""; }
+  .mdc-list-item.mdc-ripple-upgraded.mdc-ripple-upgraded::before {
+    top: calc(50% - 100%);
+    left: calc(50% - 100%);
+    width: 200%;
+    height: 200%;
+    /* @alternate */
+    -webkit-transform: scale(0);
+            transform: scale(0);
+    -webkit-transform: scale(var(--mdc-ripple-fg-scale, 0));
+            transform: scale(var(--mdc-ripple-fg-scale, 0)); }
+  .mdc-list-item.mdc-ripple-upgraded.mdc-ripple-upgraded--background-focused::before {
+    opacity: .99999; }
+  .mdc-list-item.mdc-ripple-upgraded.mdc-ripple-upgraded--background-active-fill::before {
+    -webkit-transition-duration: 120ms;
+            transition-duration: 120ms;
+    opacity: 1; }
+  .mdc-list-item.mdc-ripple-upgraded.mdc-ripple-upgraded--unbounded::before {
+    /* @alternate */
+    top: calc(50% - 50%);
+    top: var(--mdc-ripple-top, calc(50% - 50%));
+    /* @alternate */
+    left: calc(50% - 50%);
+    left: var(--mdc-ripple-left, calc(50% - 50%));
+    /* @alternate */
+    width: 100%;
+    width: var(--mdc-ripple-fg-size, 100%);
+    /* @alternate */
+    height: 100%;
+    height: var(--mdc-ripple-fg-size, 100%);
+    /* @alternate */
+    -webkit-transform: scale(0);
+            transform: scale(0);
+    -webkit-transform: scale(var(--mdc-ripple-fg-scale, 0));
+            transform: scale(var(--mdc-ripple-fg-scale, 0)); }
+  .mdc-list-item.mdc-ripple-upgraded::after {
+    background-color: rgba(0, 0, 0, 0.06);
+    position: absolute;
+    top: calc(50% - 100%);
+    left: calc(50% - 100%);
+    width: 200%;
+    height: 200%;
+    -webkit-transition: opacity 250ms linear;
+    transition: opacity 250ms linear;
+    border-radius: 50%;
+    opacity: 0;
+    pointer-events: none;
+    content: ""; }
+  .mdc-list-item.mdc-ripple-upgraded.mdc-ripple-upgraded::after {
+    top: 0;
+    left: 0;
+    /* @alternate */
+    width: 100%;
+    width: var(--mdc-ripple-fg-size, 100%);
+    /* @alternate */
+    height: 100%;
+    height: var(--mdc-ripple-fg-size, 100%);
+    -webkit-transform: scale(0);
+            transform: scale(0);
+    -webkit-transform-origin: center center;
+            transform-origin: center center;
+    opacity: 0; }
+  .mdc-list-item.mdc-ripple-upgraded:not(.mdc-ripple-upgraded--unbounded)::after {
+    -webkit-transform-origin: center center;
+            transform-origin: center center; }
+  .mdc-list-item.mdc-ripple-upgraded.mdc-ripple-upgraded--unbounded::after {
+    /* @alternate */
+    top: 0;
+    top: var(--mdc-ripple-top, 0);
+    /* @alternate */
+    left: 0;
+    left: var(--mdc-ripple-left, 0);
+    /* @alternate */
+    width: 100%;
+    width: var(--mdc-ripple-fg-size, 100%);
+    /* @alternate */
+    height: 100%;
+    height: var(--mdc-ripple-fg-size, 100%);
+    -webkit-transform: scale(0);
+            transform: scale(0);
+    -webkit-transform-origin: center center;
+            transform-origin: center center; }
+  .mdc-list-item.mdc-ripple-upgraded.mdc-ripple-upgraded--foreground-activation::after {
+    -webkit-animation: 300ms mdc-ripple-fg-radius-in forwards, 83ms mdc-ripple-fg-opacity-in forwards;
+            animation: 300ms mdc-ripple-fg-radius-in forwards, 83ms mdc-ripple-fg-opacity-in forwards; }
+  .mdc-list-item.mdc-ripple-upgraded.mdc-ripple-upgraded--foreground-deactivation::after {
+    -webkit-transform: translate(var(--mdc-ripple-fg-translate-end, 0)) scale(var(--mdc-ripple-fg-scale, 1));
+            transform: translate(var(--mdc-ripple-fg-translate-end, 0)) scale(var(--mdc-ripple-fg-scale, 1));
+    -webkit-animation: 83ms mdc-ripple-fg-opacity-out;
+            animation: 83ms mdc-ripple-fg-opacity-out; }
+  [dir="rtl"] .mdc-list-item.mdc-ripple-upgraded, .mdc-list-item.mdc-ripple-upgraded[dir="rtl"] {
+    left: initial;
+    right: -16px; }
+  .mdc-list-item.mdc-ripple-upgraded:focus {
+    outline: none; }
+  .mdc-list--theme-dark .mdc-list-item.mdc-ripple-upgraded::before,
+  .mdc-theme--dark .mdc-list-item.mdc-ripple-upgraded::before {
+    background-color: rgba(255, 255, 255, 0.12);
+    position: absolute;
+    top: calc(50% - 100%);
+    left: calc(50% - 100%);
+    width: 200%;
+    height: 200%;
+    -webkit-transition: opacity 250ms linear;
+    transition: opacity 250ms linear;
+    border-radius: 50%;
+    opacity: 0;
+    pointer-events: none;
+    content: ""; }
+  .mdc-list--theme-dark .mdc-list-item.mdc-ripple-upgraded.mdc-ripple-upgraded::before,
+  .mdc-theme--dark .mdc-list-item.mdc-ripple-upgraded.mdc-ripple-upgraded::before {
+    top: calc(50% - 100%);
+    left: calc(50% - 100%);
+    width: 200%;
+    height: 200%;
+    /* @alternate */
+    -webkit-transform: scale(0);
+            transform: scale(0);
+    -webkit-transform: scale(var(--mdc-ripple-fg-scale, 0));
+            transform: scale(var(--mdc-ripple-fg-scale, 0)); }
+  .mdc-list--theme-dark .mdc-list-item.mdc-ripple-upgraded.mdc-ripple-upgraded--background-focused::before,
+  .mdc-theme--dark .mdc-list-item.mdc-ripple-upgraded.mdc-ripple-upgraded--background-focused::before {
+    opacity: .99999; }
+  .mdc-list--theme-dark .mdc-list-item.mdc-ripple-upgraded.mdc-ripple-upgraded--background-active-fill::before,
+  .mdc-theme--dark .mdc-list-item.mdc-ripple-upgraded.mdc-ripple-upgraded--background-active-fill::before {
+    -webkit-transition-duration: 120ms;
+            transition-duration: 120ms;
+    opacity: 1; }
+  .mdc-list--theme-dark .mdc-list-item.mdc-ripple-upgraded.mdc-ripple-upgraded--unbounded::before,
+  .mdc-theme--dark .mdc-list-item.mdc-ripple-upgraded.mdc-ripple-upgraded--unbounded::before {
+    /* @alternate */
+    top: calc(50% - 50%);
+    top: var(--mdc-ripple-top, calc(50% - 50%));
+    /* @alternate */
+    left: calc(50% - 50%);
+    left: var(--mdc-ripple-left, calc(50% - 50%));
+    /* @alternate */
+    width: 100%;
+    width: var(--mdc-ripple-fg-size, 100%);
+    /* @alternate */
+    height: 100%;
+    height: var(--mdc-ripple-fg-size, 100%);
+    /* @alternate */
+    -webkit-transform: scale(0);
+            transform: scale(0);
+    -webkit-transform: scale(var(--mdc-ripple-fg-scale, 0));
+            transform: scale(var(--mdc-ripple-fg-scale, 0)); }
+  .mdc-list--theme-dark .mdc-list-item.mdc-ripple-upgraded::after,
+  .mdc-theme--dark .mdc-list-item.mdc-ripple-upgraded::after {
+    background-color: rgba(255, 255, 255, 0.12);
+    position: absolute;
+    top: calc(50% - 100%);
+    left: calc(50% - 100%);
+    width: 200%;
+    height: 200%;
+    -webkit-transition: opacity 250ms linear;
+    transition: opacity 250ms linear;
+    border-radius: 50%;
+    opacity: 0;
+    pointer-events: none;
+    content: ""; }
+  .mdc-list--theme-dark .mdc-list-item.mdc-ripple-upgraded.mdc-ripple-upgraded::after,
+  .mdc-theme--dark .mdc-list-item.mdc-ripple-upgraded.mdc-ripple-upgraded::after {
+    top: 0;
+    left: 0;
+    /* @alternate */
+    width: 100%;
+    width: var(--mdc-ripple-fg-size, 100%);
+    /* @alternate */
+    height: 100%;
+    height: var(--mdc-ripple-fg-size, 100%);
+    -webkit-transform: scale(0);
+            transform: scale(0);
+    -webkit-transform-origin: center center;
+            transform-origin: center center;
+    opacity: 0; }
+  .mdc-list--theme-dark .mdc-list-item.mdc-ripple-upgraded:not(.mdc-ripple-upgraded--unbounded)::after,
+  .mdc-theme--dark .mdc-list-item.mdc-ripple-upgraded:not(.mdc-ripple-upgraded--unbounded)::after {
+    -webkit-transform-origin: center center;
+            transform-origin: center center; }
+  .mdc-list--theme-dark .mdc-list-item.mdc-ripple-upgraded.mdc-ripple-upgraded--unbounded::after,
+  .mdc-theme--dark .mdc-list-item.mdc-ripple-upgraded.mdc-ripple-upgraded--unbounded::after {
+    /* @alternate */
+    top: 0;
+    top: var(--mdc-ripple-top, 0);
+    /* @alternate */
+    left: 0;
+    left: var(--mdc-ripple-left, 0);
+    /* @alternate */
+    width: 100%;
+    width: var(--mdc-ripple-fg-size, 100%);
+    /* @alternate */
+    height: 100%;
+    height: var(--mdc-ripple-fg-size, 100%);
+    -webkit-transform: scale(0);
+            transform: scale(0);
+    -webkit-transform-origin: center center;
+            transform-origin: center center; }
+  .mdc-list--theme-dark .mdc-list-item.mdc-ripple-upgraded.mdc-ripple-upgraded--foreground-activation::after,
+  .mdc-theme--dark .mdc-list-item.mdc-ripple-upgraded.mdc-ripple-upgraded--foreground-activation::after {
+    -webkit-animation: 300ms mdc-ripple-fg-radius-in forwards, 83ms mdc-ripple-fg-opacity-in forwards;
+            animation: 300ms mdc-ripple-fg-radius-in forwards, 83ms mdc-ripple-fg-opacity-in forwards; }
+  .mdc-list--theme-dark .mdc-list-item.mdc-ripple-upgraded.mdc-ripple-upgraded--foreground-deactivation::after,
+  .mdc-theme--dark .mdc-list-item.mdc-ripple-upgraded.mdc-ripple-upgraded--foreground-deactivation::after {
+    -webkit-transform: translate(var(--mdc-ripple-fg-translate-end, 0)) scale(var(--mdc-ripple-fg-scale, 1));
+            transform: translate(var(--mdc-ripple-fg-translate-end, 0)) scale(var(--mdc-ripple-fg-scale, 1));
+    -webkit-animation: 83ms mdc-ripple-fg-opacity-out;
+            animation: 83ms mdc-ripple-fg-opacity-out; }
+
+.mdc-list-divider {
+  height: 0;
+  margin: 0;
+  border: none;
+  border-bottom: 1px solid rgba(0, 0, 0, 0.12); }
+  .mdc-list--theme-dark .mdc-list-divider,
+  .mdc-theme--dark .mdc-list-divider {
+    border-bottom-color: rgba(255, 255, 255, 0.2); }
+
+.mdc-list-divider--inset {
+  margin-left: 56px;
+  margin-right: 0;
+  width: calc(100% - 56px); }
+  [dir="rtl"] .mdc-list-group .mdc-list-divider--inset,
+  .mdc-list-group[dir="rtl"] .mdc-list-divider--inset {
+    margin-left: 0;
+    margin-right: 56px; }
+
+.mdc-list-group {
+  padding: 0 16px; }
+  .mdc-list-group__subheader {
+    font-family: Roboto, sans-serif;
+    -moz-osx-font-smoothing: grayscale;
+    -webkit-font-smoothing: antialiased;
+    font-size: 0.875rem;
+    font-weight: 500;
+    letter-spacing: 0.04em;
+    line-height: 1.5rem;
+    text-decoration: inherit;
+    text-transform: inherit;
+    /* @alternate */
+    color: rgba(0, 0, 0, 0.87);
+    color: var(--mdc-theme-text-primary-on-background, rgba(0, 0, 0, 0.87));
+    margin: 0.75rem 0; }
+    .mdc-list-group__subheader--theme-dark,
+    .mdc-theme--dark .mdc-list-group__subheader {
+      /* @alternate */
+      color: white;
+      color: var(--mdc-theme-text-primary-on-dark, white); }
+  .mdc-list-group .mdc-list {
+    padding: 0; }
+
+/**
+ * The css property used for elevation. In most cases this should not be changed. It is exposed
+ * as a variable for abstraction / easy use when needing to reference the property directly, for
+ * example in a `will-change` rule.
+ */
+/**
+ * The default duration value for elevation transitions.
+ */
+/**
+ * The default easing value for elevation transitions.
+ */
+/**
+ * Applies the correct css rules to an element to give it the elevation specified by $z-value.
+ * The $z-value must be between 0 and 24.
+ */
+/**
+ * Returns a string that can be used as the value for a `transition` property for elevation.
+ * Calling this function directly is useful in situations where a component needs to transition
+ * more than one property.
+ *
+ * ```scss
+ * .foo {
+ *   transition: mdc-elevation-transition-rule(), opacity 100ms ease;
+ *   will-change: $mdc-elevation-property, opacity;
+ * }
+ * ```
+ */
+/**
+ * Applies the correct css rules needed to have an element transition between elevations.
+ * This mixin should be applied to elements whose elevation values will change depending on their
+ * context (e.g. when active or disabled).
+ */
+/*
+  Precomputed linear color channel values, for use in contrast calculations.
+  See https://www.w3.org/TR/WCAG20-TECHS/G17.html#G17-tests
+
+  Algorithm, for c in 0 to 255:
+  f(c) {
+    c = c / 255;
+    return c < 0.03928 ? c / 12.92 : Math.pow((c + 0.055) / 1.055, 2.4);
+  }
+
+  This lookup table is needed since there is no `pow` in SASS.
+*/
+/**
+ * Calculate the luminance for a color.
+ * See https://www.w3.org/TR/WCAG20-TECHS/G17.html#G17-tests
+ */
+/**
+ * Calculate the contrast ratio between two colors.
+ * See https://www.w3.org/TR/WCAG20-TECHS/G17.html#G17-tests
+ */
+/**
+ * Determine whether to use dark or light text on top of given color.
+ * Returns "dark" for dark text and "light" for light text.
+ */
+/*
+  Main theme colors.
+  If you're a user customizing your color scheme in SASS, these are probably the only variables you need to change.
+*/
+/* Indigo 500 */
+/* Pink A200 */
+/* White */
+/* Which set of text colors to use for each main theme color (light or dark) */
+/* Text colors according to light vs dark and text type */
+/* Primary text colors for each of the theme colors */
+/**
+ * Applies the correct theme color style to the specified property.
+ * $property is typically color or background-color, but can be any CSS property that accepts color values.
+ * $style should be one of the map keys in $mdc-theme-property-values (_variables.scss).
+ */
+/**
+ * Creates a rule to be used in MDC-Web components for dark theming, and applies the provided contents.
+ * Should provide the $root-selector option if applied to anything other than the root selector.
+ * When used with a modifier class, provide a second argument of `true` for the $compound parameter
+ * to specify that this should be attached as a compound class.
+ *
+ * Usage example:
+ *
+ * ```scss
+ * .mdc-foo {
+ *   color: black;
+ *
+ *   @include mdc-theme-dark {
+ *     color: white;
+ *   }
+ *
+ *   &__bar {
+ *     background: black;
+ *
+ *     @include mdc-theme-dark(".mdc-foo") {
+ *       background: white;
+ *     }
+ *   }
+ * }
+ *
+ * .mdc-foo--disabled {
+ *   opacity: .38;
+ *
+ *   @include mdc-theme-dark(".mdc-foo", true) {
+ *     opacity: .5;
+ *   }
+ * }
+ * ```
+ */
+/* TODO(sgomes): Figure out what to do about desktop font sizes. */
+/* TODO(sgomes): Figure out what to do about i18n and i18n font sizes. */
+/* postcss-bem-linter: define simple-menu */
+.mdc-simple-menu {
+  display: none;
+  position: absolute;
+  min-width: 170px;
+  max-width: calc(100vw - 32px);
+  max-height: calc(100vh - 32px);
+  margin: 0;
+  padding: 0;
+  -webkit-transform: scale(0);
+          transform: scale(0);
+  -webkit-transform-origin: top left;
+          transform-origin: top left;
+  border-radius: 2px;
+  background-color: white;
+  white-space: nowrap;
+  opacity: 0;
+  overflow: hidden;
+  -webkit-box-sizing: border-box;
+          box-sizing: border-box;
+  will-change: transform, opacity;
+  z-index: 4;
+  -webkit-box-shadow: 0px 3px 1px -2px rgba(0, 0, 0, 0.2), 0px 2px 2px 0px rgba(0, 0, 0, 0.14), 0px 1px 5px 0px rgba(0, 0, 0, 0.12);
+          box-shadow: 0px 3px 1px -2px rgba(0, 0, 0, 0.2), 0px 2px 2px 0px rgba(0, 0, 0, 0.14), 0px 1px 5px 0px rgba(0, 0, 0, 0.12);
+  /* stylelint-disable plugin/selector-bem-pattern */
+  /* stylelint-enable plugin/selector-bem-pattern */
+  /* stylelint-disable plugin/selector-bem-pattern */
+  /* stylelint-disable selector-no-qualifying-type */
+  /* stylelint-enable selector-no-qualifying-type */
+  /* TODO(sgomes): Revisit when we have interactive lists. */
+  /* stylelint-enable plugin/selector-bem-pattern */ }
+  .mdc-simple-menu--theme-dark,
+  .mdc-theme--dark .mdc-simple-menu {
+    background-color: #424242; }
+  .mdc-simple-menu:focus {
+    outline: none; }
+  .mdc-simple-menu--open {
+    display: inline-block;
+    -webkit-transform: scale(1);
+            transform: scale(1);
+    opacity: 1; }
+  .mdc-simple-menu--animating {
+    display: inline-block;
+    -webkit-transition: opacity 0.2s cubic-bezier(0, 0, 0.2, 1);
+    transition: opacity 0.2s cubic-bezier(0, 0, 0.2, 1); }
+  .mdc-simple-menu__items {
+    overflow-x: hidden;
+    overflow-y: auto;
+    -webkit-box-sizing: border-box;
+            box-sizing: border-box;
+    will-change: transform;
+    /* stylelint-disable plugin/selector-bem-pattern, selector-no-universal */
+    /* stylelint-enable plugin/selector-bem-pattern, selector-no-universal */ }
+    .mdc-simple-menu__items > * {
+      opacity: 0; }
+    .mdc-simple-menu__items > .mdc-list-item {
+      cursor: pointer; }
+    .mdc-simple-menu--animating .mdc-simple-menu__items {
+      overflow-y: hidden; }
+      .mdc-simple-menu--animating .mdc-simple-menu__items > * {
+        -webkit-transition-duration: 0.3s;
+                transition-duration: 0.3s;
+        -webkit-transition-property: opacity;
+        transition-property: opacity;
+        -webkit-transition-timing-function: cubic-bezier(0, 0, 0.2, 1);
+                transition-timing-function: cubic-bezier(0, 0, 0.2, 1); }
+    .mdc-simple-menu--open .mdc-simple-menu__items > * {
+      opacity: 1;
+      will-change: opacity; }
+  [dir="rtl"] .mdc-simple-menu {
+    -webkit-transform-origin: top right;
+            transform-origin: top right; }
+  .mdc-simple-menu--open-from-top-left {
+    -webkit-transform-origin: top left !important;
+            transform-origin: top left !important; }
+  .mdc-simple-menu--open-from-top-right {
+    -webkit-transform-origin: top right !important;
+            transform-origin: top right !important; }
+  .mdc-simple-menu--open-from-bottom-left {
+    -webkit-transform-origin: bottom left !important;
+            transform-origin: bottom left !important; }
+  .mdc-simple-menu--open-from-bottom-right {
+    -webkit-transform-origin: bottom right !important;
+            transform-origin: bottom right !important; }
+  .mdc-simple-menu .mdc-list-group,
+  .mdc-simple-menu .mdc-list {
+    padding: 8px 0; }
+  .mdc-simple-menu .mdc-list-item {
+    position: relative;
+    padding: 0 16px;
+    outline: none;
+    color: inherit;
+    text-decoration: none;
+    -webkit-user-select: none;
+       -moz-user-select: none;
+        -ms-user-select: none;
+            user-select: none;
+    font-family: Roboto, sans-serif;
+    -moz-osx-font-smoothing: grayscale;
+    -webkit-font-smoothing: antialiased;
+    font-size: 1rem;
+    font-weight: 400;
+    letter-spacing: 0.04em;
+    line-height: 1.75rem;
+    text-decoration: inherit;
+    text-transform: inherit; }
+    .mdc-simple-menu--theme-dark.mdc-simple-menu .mdc-list-item,
+    .mdc-theme--dark .mdc-simple-menu .mdc-list-item {
+      color: white; }
+  .mdc-simple-menu--theme-dark.mdc-simple-menu .mdc-list-divider,
+  .mdc-theme--dark .mdc-simple-menu .mdc-list-divider {
+    border-color: rgba(255, 255, 255, 0.12); }
+  .mdc-simple-menu .mdc-list-item__start-detail {
+    color: rgba(0, 0, 0, 0.54); }
+    .mdc-simple-menu--theme-dark.mdc-simple-menu .mdc-list-item__start-detail,
+    .mdc-theme--dark .mdc-simple-menu .mdc-list-item__start-detail {
+      color: rgba(255, 255, 255, 0.54); }
+  .mdc-simple-menu--selected.mdc-list-item,
+  .mdc-simple-menu--selected.mdc-list-item .mdc-list-item__start-detail {
+    /* @alternate */
+    color: #3f51b5;
+    color: var(--mdc-theme-primary, #3f51b5); }
+  .mdc-simple-menu .mdc-list-item::before {
+    position: absolute;
+    top: 0;
+    left: 0;
+    width: 100%;
+    height: 100%;
+    -webkit-transition: opacity 120ms cubic-bezier(0, 0, 0.2, 1);
+    transition: opacity 120ms cubic-bezier(0, 0, 0.2, 1);
+    border-radius: inherit;
+    background: currentColor;
+    content: "";
+    opacity: 0; }
+  .mdc-simple-menu .mdc-list-item:focus::before {
+    opacity: .12; }
+  .mdc-simple-menu .mdc-list-item:active::before {
+    /*
+      Slightly darker value for visual distinction.
+      This allows a full base that has distinct modes.
+      Progressive enhancement with ripples will provide complete button spec alignment.
+    */
+    opacity: .18; }
+  .mdc-simple-menu .mdc-list-item[aria-disabled="true"] {
+    cursor: default;
+    /* @alternate */
+    color: rgba(0, 0, 0, 0.38);
+    color: var(--mdc-theme-text-disabled-on-light, rgba(0, 0, 0, 0.38)); }
+    .mdc-select--theme-dark .mdc-simple-menu .mdc-list-item[aria-disabled="true"],
+    .mdc-theme--dark .mdc-simple-menu .mdc-list-item[aria-disabled="true"] {
+      /* @alternate */
+      color: rgba(255, 255, 255, 0.5);
+      color: var(--mdc-theme-text-disabled-on-dark, rgba(255, 255, 255, 0.5)); }
+  .mdc-simple-menu .mdc-list-item[aria-disabled="true"]:focus::before, .mdc-simple-menu .mdc-list-item[aria-disabled="true"]:active::before {
+    opacity: 0; }
+
+/* postcss-bem-linter: end */
+.mdc-menu-anchor {
+  position: relative;
+  overflow: visible; }
+
+/*
+  Precomputed linear color channel values, for use in contrast calculations.
+  See https://www.w3.org/TR/WCAG20-TECHS/G17.html#G17-tests
+
+  Algorithm, for c in 0 to 255:
+  f(c) {
+    c = c / 255;
+    return c < 0.03928 ? c / 12.92 : Math.pow((c + 0.055) / 1.055, 2.4);
+  }
+
+  This lookup table is needed since there is no `pow` in SASS.
+*/
+/**
+ * Calculate the luminance for a color.
+ * See https://www.w3.org/TR/WCAG20-TECHS/G17.html#G17-tests
+ */
+/**
+ * Calculate the contrast ratio between two colors.
+ * See https://www.w3.org/TR/WCAG20-TECHS/G17.html#G17-tests
+ */
+/**
+ * Determine whether to use dark or light text on top of given color.
+ * Returns "dark" for dark text and "light" for light text.
+ */
+/*
+  Main theme colors.
+  If you're a user customizing your color scheme in SASS, these are probably the only variables you need to change.
+*/
+/* Indigo 500 */
+/* Pink A200 */
+/* White */
+/* Which set of text colors to use for each main theme color (light or dark) */
+/* Text colors according to light vs dark and text type */
+/* Primary text colors for each of the theme colors */
+/** MDC Ripple keyframes are split into their own file so that _mixins.scss can rely on them. */
+@keyframes mdc-ripple-fg-radius-in {
+  from {
+    -webkit-transform: translate(var(--mdc-ripple-fg-translate-start, 0)) scale(1);
+            transform: translate(var(--mdc-ripple-fg-translate-start, 0)) scale(1);
+    -webkit-animation-timing-function: cubic-bezier(0.4, 0, 0.2, 1);
+            animation-timing-function: cubic-bezier(0.4, 0, 0.2, 1); }
+  to {
+    -webkit-transform: translate(var(--mdc-ripple-fg-translate-end, 0)) scale(var(--mdc-ripple-fg-scale, 1));
+            transform: translate(var(--mdc-ripple-fg-translate-end, 0)) scale(var(--mdc-ripple-fg-scale, 1)); } }
+
+@keyframes mdc-ripple-fg-opacity-in {
+  from {
+    opacity: 0;
+    -webkit-animation-timing-function: linear;
+            animation-timing-function: linear; }
+  to {
+    opacity: 1; } }
+
+@keyframes mdc-ripple-fg-opacity-out {
+  from {
+    opacity: 1;
+    -webkit-animation-timing-function: linear;
+            animation-timing-function: linear; }
+  to {
+    opacity: 0; } }
+
+/*
+  Precomputed linear color channel values, for use in contrast calculations.
+  See https://www.w3.org/TR/WCAG20-TECHS/G17.html#G17-tests
+
+  Algorithm, for c in 0 to 255:
+  f(c) {
+    c = c / 255;
+    return c < 0.03928 ? c / 12.92 : Math.pow((c + 0.055) / 1.055, 2.4);
+  }
+
+  This lookup table is needed since there is no `pow` in SASS.
+*/
+/**
+ * Calculate the luminance for a color.
+ * See https://www.w3.org/TR/WCAG20-TECHS/G17.html#G17-tests
+ */
+/**
+ * Calculate the contrast ratio between two colors.
+ * See https://www.w3.org/TR/WCAG20-TECHS/G17.html#G17-tests
+ */
+/**
+ * Determine whether to use dark or light text on top of given color.
+ * Returns "dark" for dark text and "light" for light text.
+ */
+/*
+  Main theme colors.
+  If you're a user customizing your color scheme in SASS, these are probably the only variables you need to change.
+*/
+/* Indigo 500 */
+/* Pink A200 */
+/* White */
+/* Which set of text colors to use for each main theme color (light or dark) */
+/* Text colors according to light vs dark and text type */
+/* Primary text colors for each of the theme colors */
+/**
+ * Applies the correct theme color style to the specified property.
+ * $property is typically color or background-color, but can be any CSS property that accepts color values.
+ * $style should be one of the map keys in $mdc-theme-property-values (_variables.scss).
+ */
+/**
+ * Creates a rule to be used in MDC-Web components for dark theming, and applies the provided contents.
+ * Should provide the $root-selector option if applied to anything other than the root selector.
+ * When used with a modifier class, provide a second argument of `true` for the $compound parameter
+ * to specify that this should be attached as a compound class.
+ *
+ * Usage example:
+ *
+ * ```scss
+ * .mdc-foo {
+ *   color: black;
+ *
+ *   @include mdc-theme-dark {
+ *     color: white;
+ *   }
+ *
+ *   &__bar {
+ *     background: black;
+ *
+ *     @include mdc-theme-dark(".mdc-foo") {
+ *       background: white;
+ *     }
+ *   }
+ * }
+ *
+ * .mdc-foo--disabled {
+ *   opacity: .38;
+ *
+ *   @include mdc-theme-dark(".mdc-foo", true) {
+ *     opacity: .5;
+ *   }
+ * }
+ * ```
+ */
+.mdc-radio {
+  --mdc-ripple-surface-width: 0;
+  --mdc-ripple-surface-height: 0;
+  --mdc-ripple-fg-size: 0;
+  --mdc-ripple-left: 0;
+  --mdc-ripple-top: 0;
+  --mdc-ripple-fg-scale: 1;
+  --mdc-ripple-fg-translate-end: 0;
+  --mdc-ripple-fg-translate-start: 0;
+  will-change: transform, opacity;
+  -webkit-tap-highlight-color: transparent;
+  display: inline-block;
+  position: relative;
+  -webkit-box-sizing: border-box;
+          box-sizing: border-box;
+  -webkit-box-flex: 0;
+      -ms-flex: 0 0 auto;
+          flex: 0 0 auto;
+  width: 40px;
+  height: 40px;
+  padding: 10px;
+  cursor: pointer;
+  will-change: opacity, transform, border-color, background-color, color; }
+  .mdc-radio:not(.mdc-ripple-upgraded):hover::before, .mdc-radio:not(.mdc-ripple-upgraded):focus::before, .mdc-radio:not(.mdc-ripple-upgraded):active::after {
+    -webkit-transition-duration: 85ms;
+            transition-duration: 85ms;
+    opacity: .6; }
+  .mdc-radio::before {
+    /* @alternate */
+    background-color: rgba(63, 81, 181, 0.14);
+    position: absolute;
+    top: calc(50% - 100%);
+    left: calc(50% - 100%);
+    width: 200%;
+    height: 200%;
+    -webkit-transition: opacity 250ms linear;
+    transition: opacity 250ms linear;
+    border-radius: 50%;
+    opacity: 0;
+    pointer-events: none;
+    content: ""; }
+    @supports (background-color: color(green a(10%))) {
+      .mdc-radio::before {
+        background-color: color(var(--mdc-theme-primary, #3f51b5) a(14%)); } }
+  .mdc-radio.mdc-ripple-upgraded::before {
+    top: calc(50% - 100%);
+    left: calc(50% - 100%);
+    width: 200%;
+    height: 200%;
+    /* @alternate */
+    -webkit-transform: scale(0);
+            transform: scale(0);
+    -webkit-transform: scale(var(--mdc-ripple-fg-scale, 0));
+            transform: scale(var(--mdc-ripple-fg-scale, 0)); }
+  .mdc-radio.mdc-ripple-upgraded--background-focused::before {
+    opacity: .99999; }
+  .mdc-radio.mdc-ripple-upgraded--background-active-fill::before {
+    -webkit-transition-duration: 120ms;
+            transition-duration: 120ms;
+    opacity: 1; }
+  .mdc-radio.mdc-ripple-upgraded--unbounded::before {
+    /* @alternate */
+    top: calc(50% - 50%);
+    top: var(--mdc-ripple-top, calc(50% - 50%));
+    /* @alternate */
+    left: calc(50% - 50%);
+    left: var(--mdc-ripple-left, calc(50% - 50%));
+    /* @alternate */
+    width: 100%;
+    width: var(--mdc-ripple-fg-size, 100%);
+    /* @alternate */
+    height: 100%;
+    height: var(--mdc-ripple-fg-size, 100%);
+    /* @alternate */
+    -webkit-transform: scale(0);
+            transform: scale(0);
+    -webkit-transform: scale(var(--mdc-ripple-fg-scale, 0));
+            transform: scale(var(--mdc-ripple-fg-scale, 0)); }
+  .mdc-radio::after {
+    /* @alternate */
+    background-color: rgba(63, 81, 181, 0.14);
+    position: absolute;
+    top: calc(50% - 100%);
+    left: calc(50% - 100%);
+    width: 200%;
+    height: 200%;
+    -webkit-transition: opacity 250ms linear;
+    transition: opacity 250ms linear;
+    border-radius: 50%;
+    opacity: 0;
+    pointer-events: none;
+    content: ""; }
+    @supports (background-color: color(green a(10%))) {
+      .mdc-radio::after {
+        background-color: color(var(--mdc-theme-primary, #3f51b5) a(14%)); } }
+  .mdc-radio.mdc-ripple-upgraded::after {
+    top: 0;
+    left: 0;
+    /* @alternate */
+    width: 100%;
+    width: var(--mdc-ripple-fg-size, 100%);
+    /* @alternate */
+    height: 100%;
+    height: var(--mdc-ripple-fg-size, 100%);
+    -webkit-transform: scale(0);
+            transform: scale(0);
+    -webkit-transform-origin: center center;
+            transform-origin: center center;
+    opacity: 0; }
+  .mdc-radio:not(.mdc-ripple-upgraded--unbounded)::after {
+    -webkit-transform-origin: center center;
+            transform-origin: center center; }
+  .mdc-radio.mdc-ripple-upgraded--unbounded::after {
+    /* @alternate */
+    top: 0;
+    top: var(--mdc-ripple-top, 0);
+    /* @alternate */
+    left: 0;
+    left: var(--mdc-ripple-left, 0);
+    /* @alternate */
+    width: 100%;
+    width: var(--mdc-ripple-fg-size, 100%);
+    /* @alternate */
+    height: 100%;
+    height: var(--mdc-ripple-fg-size, 100%);
+    -webkit-transform: scale(0);
+            transform: scale(0);
+    -webkit-transform-origin: center center;
+            transform-origin: center center; }
+  .mdc-radio.mdc-ripple-upgraded--foreground-activation::after {
+    -webkit-animation: 300ms mdc-ripple-fg-radius-in forwards, 83ms mdc-ripple-fg-opacity-in forwards;
+            animation: 300ms mdc-ripple-fg-radius-in forwards, 83ms mdc-ripple-fg-opacity-in forwards; }
+  .mdc-radio.mdc-ripple-upgraded--foreground-deactivation::after {
+    -webkit-transform: translate(var(--mdc-ripple-fg-translate-end, 0)) scale(var(--mdc-ripple-fg-scale, 1));
+            transform: translate(var(--mdc-ripple-fg-translate-end, 0)) scale(var(--mdc-ripple-fg-scale, 1));
+    -webkit-animation: 83ms mdc-ripple-fg-opacity-out;
+            animation: 83ms mdc-ripple-fg-opacity-out; }
+  .mdc-radio::before, .mdc-radio::after {
+    top: 0;
+    left: 0;
+    width: 100%;
+    height: 100%; }
+  .mdc-radio.mdc-ripple-upgraded .mdc-radio__background::before {
+    content: none; }
+  .mdc-radio__background {
+    display: inline-block;
+    position: absolute;
+    left: 10px;
+    width: 50%;
+    height: 50%;
+    -webkit-box-sizing: border-box;
+            box-sizing: border-box; }
+    .mdc-radio__background::before {
+      /* @alternate */
+      background-color: #3f51b5;
+      background-color: var(--mdc-theme-primary, #3f51b5);
+      position: absolute;
+      top: 0;
+      left: 0;
+      width: 100%;
+      height: 100%;
+      -webkit-transform: scale(0, 0);
+              transform: scale(0, 0);
+      -webkit-transition: opacity 120ms 0ms cubic-bezier(0.4, 0, 0.6, 1), -webkit-transform 120ms 0ms cubic-bezier(0.4, 0, 0.6, 1);
+      transition: opacity 120ms 0ms cubic-bezier(0.4, 0, 0.6, 1), -webkit-transform 120ms 0ms cubic-bezier(0.4, 0, 0.6, 1);
+      transition: opacity 120ms 0ms cubic-bezier(0.4, 0, 0.6, 1), transform 120ms 0ms cubic-bezier(0.4, 0, 0.6, 1);
+      transition: opacity 120ms 0ms cubic-bezier(0.4, 0, 0.6, 1), transform 120ms 0ms cubic-bezier(0.4, 0, 0.6, 1), -webkit-transform 120ms 0ms cubic-bezier(0.4, 0, 0.6, 1);
+      border-radius: 50%;
+      content: "";
+      opacity: 0;
+      pointer-events: none; }
+  .mdc-radio__outer-circle {
+    /* @alternate */
+    border-color: rgba(0, 0, 0, 0.54);
+    border-color: var(--mdc-theme-text-secondary-on-light, rgba(0, 0, 0, 0.54));
+    position: absolute;
+    top: 0;
+    left: 0;
+    width: 100%;
+    height: 100%;
+    -webkit-transition: border-color 120ms 0ms cubic-bezier(0.4, 0, 0.6, 1);
+    transition: border-color 120ms 0ms cubic-bezier(0.4, 0, 0.6, 1);
+    border-width: 2px;
+    border-style: solid;
+    border-radius: 50%;
+    -webkit-box-sizing: border-box;
+            box-sizing: border-box; }
+    .mdc-radio--theme-dark .mdc-radio__outer-circle,
+    .mdc-theme--dark .mdc-radio__outer-circle {
+      /* @alternate */
+      border-color: rgba(255, 255, 255, 0.7);
+      border-color: var(--mdc-theme-text-secondary-on-dark, rgba(255, 255, 255, 0.7)); }
+  .mdc-radio__inner-circle {
+    /* @alternate */
+    background-color: rgba(0, 0, 0, 0.54);
+    background-color: var(--mdc-theme-text-secondary-on-light, rgba(0, 0, 0, 0.54));
+    position: absolute;
+    top: 0;
+    left: 0;
+    width: 100%;
+    height: 100%;
+    -webkit-transform: scale(0, 0);
+            transform: scale(0, 0);
+    -webkit-transition: background-color 120ms 0ms cubic-bezier(0.4, 0, 0.6, 1), -webkit-transform 120ms 0ms cubic-bezier(0.4, 0, 0.6, 1);
+    transition: background-color 120ms 0ms cubic-bezier(0.4, 0, 0.6, 1), -webkit-transform 120ms 0ms cubic-bezier(0.4, 0, 0.6, 1);
+    transition: transform 120ms 0ms cubic-bezier(0.4, 0, 0.6, 1), background-color 120ms 0ms cubic-bezier(0.4, 0, 0.6, 1);
+    transition: transform 120ms 0ms cubic-bezier(0.4, 0, 0.6, 1), background-color 120ms 0ms cubic-bezier(0.4, 0, 0.6, 1), -webkit-transform 120ms 0ms cubic-bezier(0.4, 0, 0.6, 1);
+    border-radius: 50%;
+    -webkit-box-sizing: border-box;
+            box-sizing: border-box; }
+    .mdc-radio--theme-dark .mdc-radio__inner-circle,
+    .mdc-theme--dark .mdc-radio__inner-circle {
+      /* @alternate */
+      background-color: rgba(255, 255, 255, 0.7);
+      background-color: var(--mdc-theme-text-secondary-on-dark, rgba(255, 255, 255, 0.7)); }
+  .mdc-radio__native-control {
+    position: absolute;
+    top: 0;
+    left: 0;
+    width: 100%;
+    height: 100%;
+    margin: 0;
+    padding: 0;
+    cursor: inherit;
+    opacity: 0;
+    z-index: 1; }
+
+.mdc-radio__native-control:checked + .mdc-radio__background,
+.mdc-radio__native-control:disabled + .mdc-radio__background {
+  -webkit-transition: opacity 120ms 0ms cubic-bezier(0, 0, 0.2, 1), -webkit-transform 120ms 0ms cubic-bezier(0, 0, 0.2, 1);
+  transition: opacity 120ms 0ms cubic-bezier(0, 0, 0.2, 1), -webkit-transform 120ms 0ms cubic-bezier(0, 0, 0.2, 1);
+  transition: opacity 120ms 0ms cubic-bezier(0, 0, 0.2, 1), transform 120ms 0ms cubic-bezier(0, 0, 0.2, 1);
+  transition: opacity 120ms 0ms cubic-bezier(0, 0, 0.2, 1), transform 120ms 0ms cubic-bezier(0, 0, 0.2, 1), -webkit-transform 120ms 0ms cubic-bezier(0, 0, 0.2, 1); }
+  .mdc-radio__native-control:checked + .mdc-radio__background .mdc-radio__outer-circle,
+  .mdc-radio__native-control:disabled + .mdc-radio__background .mdc-radio__outer-circle {
+    -webkit-transition: border-color 120ms 0ms cubic-bezier(0, 0, 0.2, 1);
+    transition: border-color 120ms 0ms cubic-bezier(0, 0, 0.2, 1); }
+  .mdc-radio__native-control:checked + .mdc-radio__background .mdc-radio__inner-circle,
+  .mdc-radio__native-control:disabled + .mdc-radio__background .mdc-radio__inner-circle {
+    -webkit-transition: background-color 120ms 0ms cubic-bezier(0, 0, 0.2, 1), -webkit-transform 120ms 0ms cubic-bezier(0, 0, 0.2, 1);
+    transition: background-color 120ms 0ms cubic-bezier(0, 0, 0.2, 1), -webkit-transform 120ms 0ms cubic-bezier(0, 0, 0.2, 1);
+    transition: transform 120ms 0ms cubic-bezier(0, 0, 0.2, 1), background-color 120ms 0ms cubic-bezier(0, 0, 0.2, 1);
+    transition: transform 120ms 0ms cubic-bezier(0, 0, 0.2, 1), background-color 120ms 0ms cubic-bezier(0, 0, 0.2, 1), -webkit-transform 120ms 0ms cubic-bezier(0, 0, 0.2, 1); }
+
+.mdc-radio--disabled {
+  cursor: default;
+  pointer-events: none; }
+
+.mdc-radio__native-control:checked + .mdc-radio__background .mdc-radio__outer-circle {
+  /* @alternate */
+  border-color: #3f51b5;
+  border-color: var(--mdc-theme-primary, #3f51b5); }
+
+.mdc-radio__native-control:checked + .mdc-radio__background .mdc-radio__inner-circle {
+  /* @alternate */
+  background-color: #3f51b5;
+  background-color: var(--mdc-theme-primary, #3f51b5);
+  -webkit-transform: scale(0.5);
+          transform: scale(0.5);
+  -webkit-transition: background-color 120ms 0ms cubic-bezier(0, 0, 0.2, 1), -webkit-transform 120ms 0ms cubic-bezier(0, 0, 0.2, 1);
+  transition: background-color 120ms 0ms cubic-bezier(0, 0, 0.2, 1), -webkit-transform 120ms 0ms cubic-bezier(0, 0, 0.2, 1);
+  transition: transform 120ms 0ms cubic-bezier(0, 0, 0.2, 1), background-color 120ms 0ms cubic-bezier(0, 0, 0.2, 1);
+  transition: transform 120ms 0ms cubic-bezier(0, 0, 0.2, 1), background-color 120ms 0ms cubic-bezier(0, 0, 0.2, 1), -webkit-transform 120ms 0ms cubic-bezier(0, 0, 0.2, 1); }
+
+.mdc-radio__native-control:disabled + .mdc-radio__background,
+fieldset:disabled .mdc-radio__native-control + .mdc-radio__background,
+[aria-disabled="true"] .mdc-radio__native-control + .mdc-radio__background {
+  cursor: default; }
+  .mdc-radio__native-control:disabled + .mdc-radio__background .mdc-radio__outer-circle,
+  fieldset:disabled .mdc-radio__native-control + .mdc-radio__background .mdc-radio__outer-circle,
+  [aria-disabled="true"] .mdc-radio__native-control + .mdc-radio__background .mdc-radio__outer-circle {
+    border-color: rgba(0, 0, 0, 0.26); }
+    .mdc-radio--theme-dark .mdc-radio__native-control:disabled + .mdc-radio__background .mdc-radio__outer-circle,
+    .mdc-theme--dark .mdc-radio__native-control:disabled + .mdc-radio__background .mdc-radio__outer-circle, .mdc-radio--theme-dark
+    fieldset:disabled .mdc-radio__native-control + .mdc-radio__background .mdc-radio__outer-circle,
+    .mdc-theme--dark
+    fieldset:disabled .mdc-radio__native-control + .mdc-radio__background .mdc-radio__outer-circle, .mdc-radio--theme-dark
+    [aria-disabled="true"] .mdc-radio__native-control + .mdc-radio__background .mdc-radio__outer-circle,
+    .mdc-theme--dark
+    [aria-disabled="true"] .mdc-radio__native-control + .mdc-radio__background .mdc-radio__outer-circle {
+      border-color: rgba(255, 255, 255, 0.3); }
+  .mdc-radio__native-control:disabled + .mdc-radio__background .mdc-radio__inner-circle,
+  fieldset:disabled .mdc-radio__native-control + .mdc-radio__background .mdc-radio__inner-circle,
+  [aria-disabled="true"] .mdc-radio__native-control + .mdc-radio__background .mdc-radio__inner-circle {
+    background-color: rgba(0, 0, 0, 0.26); }
+    .mdc-radio--theme-dark .mdc-radio__native-control:disabled + .mdc-radio__background .mdc-radio__inner-circle,
+    .mdc-theme--dark .mdc-radio__native-control:disabled + .mdc-radio__background .mdc-radio__inner-circle, .mdc-radio--theme-dark
+    fieldset:disabled .mdc-radio__native-control + .mdc-radio__background .mdc-radio__inner-circle,
+    .mdc-theme--dark
+    fieldset:disabled .mdc-radio__native-control + .mdc-radio__background .mdc-radio__inner-circle, .mdc-radio--theme-dark
+    [aria-disabled="true"] .mdc-radio__native-control + .mdc-radio__background .mdc-radio__inner-circle,
+    .mdc-theme--dark
+    [aria-disabled="true"] .mdc-radio__native-control + .mdc-radio__background .mdc-radio__inner-circle {
+      background-color: rgba(255, 255, 255, 0.3); }
+
+.mdc-radio__native-control:focus + .mdc-radio__background::before {
+  -webkit-transform: scale(2, 2);
+          transform: scale(2, 2);
+  -webkit-transition: opacity 120ms 0ms cubic-bezier(0, 0, 0.2, 1), -webkit-transform 120ms 0ms cubic-bezier(0, 0, 0.2, 1);
+  transition: opacity 120ms 0ms cubic-bezier(0, 0, 0.2, 1), -webkit-transform 120ms 0ms cubic-bezier(0, 0, 0.2, 1);
+  transition: opacity 120ms 0ms cubic-bezier(0, 0, 0.2, 1), transform 120ms 0ms cubic-bezier(0, 0, 0.2, 1);
+  transition: opacity 120ms 0ms cubic-bezier(0, 0, 0.2, 1), transform 120ms 0ms cubic-bezier(0, 0, 0.2, 1), -webkit-transform 120ms 0ms cubic-bezier(0, 0, 0.2, 1);
+  opacity: .26; }
+
+/*
+  Precomputed linear color channel values, for use in contrast calculations.
+  See https://www.w3.org/TR/WCAG20-TECHS/G17.html#G17-tests
+
+  Algorithm, for c in 0 to 255:
+  f(c) {
+    c = c / 255;
+    return c < 0.03928 ? c / 12.92 : Math.pow((c + 0.055) / 1.055, 2.4);
+  }
+
+  This lookup table is needed since there is no `pow` in SASS.
+*/
+/**
+ * Calculate the luminance for a color.
+ * See https://www.w3.org/TR/WCAG20-TECHS/G17.html#G17-tests
+ */
+/**
+ * Calculate the contrast ratio between two colors.
+ * See https://www.w3.org/TR/WCAG20-TECHS/G17.html#G17-tests
+ */
+/**
+ * Determine whether to use dark or light text on top of given color.
+ * Returns "dark" for dark text and "light" for light text.
+ */
+/*
+  Main theme colors.
+  If you're a user customizing your color scheme in SASS, these are probably the only variables you need to change.
+*/
+/* Indigo 500 */
+/* Pink A200 */
+/* White */
+/* Which set of text colors to use for each main theme color (light or dark) */
+/* Text colors according to light vs dark and text type */
+/* Primary text colors for each of the theme colors */
+/**
+ * Applies the correct theme color style to the specified property.
+ * $property is typically color or background-color, but can be any CSS property that accepts color values.
+ * $style should be one of the map keys in $mdc-theme-property-values (_variables.scss).
+ */
+/**
+ * Creates a rule to be used in MDC-Web components for dark theming, and applies the provided contents.
+ * Should provide the $root-selector option if applied to anything other than the root selector.
+ * When used with a modifier class, provide a second argument of `true` for the $compound parameter
+ * to specify that this should be attached as a compound class.
+ *
+ * Usage example:
+ *
+ * ```scss
+ * .mdc-foo {
+ *   color: black;
+ *
+ *   @include mdc-theme-dark {
+ *     color: white;
+ *   }
+ *
+ *   &__bar {
+ *     background: black;
+ *
+ *     @include mdc-theme-dark(".mdc-foo") {
+ *       background: white;
+ *     }
+ *   }
+ * }
+ *
+ * .mdc-foo--disabled {
+ *   opacity: .38;
+ *
+ *   @include mdc-theme-dark(".mdc-foo", true) {
+ *     opacity: .5;
+ *   }
+ * }
+ * ```
+ */
+/*
+  Precomputed linear color channel values, for use in contrast calculations.
+  See https://www.w3.org/TR/WCAG20-TECHS/G17.html#G17-tests
+
+  Algorithm, for c in 0 to 255:
+  f(c) {
+    c = c / 255;
+    return c < 0.03928 ? c / 12.92 : Math.pow((c + 0.055) / 1.055, 2.4);
+  }
+
+  This lookup table is needed since there is no `pow` in SASS.
+*/
+/**
+ * Calculate the luminance for a color.
+ * See https://www.w3.org/TR/WCAG20-TECHS/G17.html#G17-tests
+ */
+/**
+ * Calculate the contrast ratio between two colors.
+ * See https://www.w3.org/TR/WCAG20-TECHS/G17.html#G17-tests
+ */
+/**
+ * Determine whether to use dark or light text on top of given color.
+ * Returns "dark" for dark text and "light" for light text.
+ */
+/*
+  Main theme colors.
+  If you're a user customizing your color scheme in SASS, these are probably the only variables you need to change.
+*/
+/* Indigo 500 */
+/* Pink A200 */
+/* White */
+/* Which set of text colors to use for each main theme color (light or dark) */
+/* Text colors according to light vs dark and text type */
+/* Primary text colors for each of the theme colors */
+/** MDC Ripple keyframes are split into their own file so that _mixins.scss can rely on them. */
+@keyframes mdc-ripple-fg-radius-in {
+  from {
+    -webkit-transform: translate(var(--mdc-ripple-fg-translate-start, 0)) scale(1);
+            transform: translate(var(--mdc-ripple-fg-translate-start, 0)) scale(1);
+    -webkit-animation-timing-function: cubic-bezier(0.4, 0, 0.2, 1);
+            animation-timing-function: cubic-bezier(0.4, 0, 0.2, 1); }
+  to {
+    -webkit-transform: translate(var(--mdc-ripple-fg-translate-end, 0)) scale(var(--mdc-ripple-fg-scale, 1));
+            transform: translate(var(--mdc-ripple-fg-translate-end, 0)) scale(var(--mdc-ripple-fg-scale, 1)); } }
+
+@keyframes mdc-ripple-fg-opacity-in {
+  from {
+    opacity: 0;
+    -webkit-animation-timing-function: linear;
+            animation-timing-function: linear; }
+  to {
+    opacity: 1; } }
+
+@keyframes mdc-ripple-fg-opacity-out {
+  from {
+    opacity: 1;
+    -webkit-animation-timing-function: linear;
+            animation-timing-function: linear; }
+  to {
+    opacity: 0; } }
+
+.mdc-ripple-surface {
+  --mdc-ripple-surface-width: 0;
+  --mdc-ripple-surface-height: 0;
+  --mdc-ripple-fg-size: 0;
+  --mdc-ripple-left: 0;
+  --mdc-ripple-top: 0;
+  --mdc-ripple-fg-scale: 1;
+  --mdc-ripple-fg-translate-end: 0;
+  --mdc-ripple-fg-translate-start: 0;
+  will-change: transform, opacity;
+  -webkit-tap-highlight-color: transparent;
+  position: relative;
+  outline: none;
+  overflow: hidden; }
+  .mdc-ripple-surface:not(.mdc-ripple-upgraded):hover::before, .mdc-ripple-surface:not(.mdc-ripple-upgraded):focus::before, .mdc-ripple-surface:not(.mdc-ripple-upgraded):active::after {
+    -webkit-transition-duration: 85ms;
+            transition-duration: 85ms;
+    opacity: .6; }
+  .mdc-ripple-surface::before {
+    background-color: rgba(0, 0, 0, 0.06);
+    position: absolute;
+    top: calc(50% - 100%);
+    left: calc(50% - 100%);
+    width: 200%;
+    height: 200%;
+    -webkit-transition: opacity 250ms linear;
+    transition: opacity 250ms linear;
+    border-radius: 50%;
+    opacity: 0;
+    pointer-events: none;
+    content: ""; }
+  .mdc-ripple-surface.mdc-ripple-upgraded::before {
+    top: calc(50% - 100%);
+    left: calc(50% - 100%);
+    width: 200%;
+    height: 200%;
+    /* @alternate */
+    -webkit-transform: scale(0);
+            transform: scale(0);
+    -webkit-transform: scale(var(--mdc-ripple-fg-scale, 0));
+            transform: scale(var(--mdc-ripple-fg-scale, 0)); }
+  .mdc-ripple-surface.mdc-ripple-upgraded--background-focused::before {
+    opacity: .99999; }
+  .mdc-ripple-surface.mdc-ripple-upgraded--background-active-fill::before {
+    -webkit-transition-duration: 120ms;
+            transition-duration: 120ms;
+    opacity: 1; }
+  .mdc-ripple-surface.mdc-ripple-upgraded--unbounded::before {
+    /* @alternate */
+    top: calc(50% - 50%);
+    top: var(--mdc-ripple-top, calc(50% - 50%));
+    /* @alternate */
+    left: calc(50% - 50%);
+    left: var(--mdc-ripple-left, calc(50% - 50%));
+    /* @alternate */
+    width: 100%;
+    width: var(--mdc-ripple-fg-size, 100%);
+    /* @alternate */
+    height: 100%;
+    height: var(--mdc-ripple-fg-size, 100%);
+    /* @alternate */
+    -webkit-transform: scale(0);
+            transform: scale(0);
+    -webkit-transform: scale(var(--mdc-ripple-fg-scale, 0));
+            transform: scale(var(--mdc-ripple-fg-scale, 0)); }
+  .mdc-ripple-surface::after {
+    background-color: rgba(0, 0, 0, 0.06);
+    position: absolute;
+    top: calc(50% - 100%);
+    left: calc(50% - 100%);
+    width: 200%;
+    height: 200%;
+    -webkit-transition: opacity 250ms linear;
+    transition: opacity 250ms linear;
+    border-radius: 50%;
+    opacity: 0;
+    pointer-events: none;
+    content: ""; }
+  .mdc-ripple-surface.mdc-ripple-upgraded::after {
+    top: 0;
+    left: 0;
+    /* @alternate */
+    width: 100%;
+    width: var(--mdc-ripple-fg-size, 100%);
+    /* @alternate */
+    height: 100%;
+    height: var(--mdc-ripple-fg-size, 100%);
+    -webkit-transform: scale(0);
+            transform: scale(0);
+    -webkit-transform-origin: center center;
+            transform-origin: center center;
+    opacity: 0; }
+  .mdc-ripple-surface:not(.mdc-ripple-upgraded--unbounded)::after {
+    -webkit-transform-origin: center center;
+            transform-origin: center center; }
+  .mdc-ripple-surface.mdc-ripple-upgraded--unbounded::after {
+    /* @alternate */
+    top: 0;
+    top: var(--mdc-ripple-top, 0);
+    /* @alternate */
+    left: 0;
+    left: var(--mdc-ripple-left, 0);
+    /* @alternate */
+    width: 100%;
+    width: var(--mdc-ripple-fg-size, 100%);
+    /* @alternate */
+    height: 100%;
+    height: var(--mdc-ripple-fg-size, 100%);
+    -webkit-transform: scale(0);
+            transform: scale(0);
+    -webkit-transform-origin: center center;
+            transform-origin: center center; }
+  .mdc-ripple-surface.mdc-ripple-upgraded--foreground-activation::after {
+    -webkit-animation: 300ms mdc-ripple-fg-radius-in forwards, 83ms mdc-ripple-fg-opacity-in forwards;
+            animation: 300ms mdc-ripple-fg-radius-in forwards, 83ms mdc-ripple-fg-opacity-in forwards; }
+  .mdc-ripple-surface.mdc-ripple-upgraded--foreground-deactivation::after {
+    -webkit-transform: translate(var(--mdc-ripple-fg-translate-end, 0)) scale(var(--mdc-ripple-fg-scale, 1));
+            transform: translate(var(--mdc-ripple-fg-translate-end, 0)) scale(var(--mdc-ripple-fg-scale, 1));
+    -webkit-animation: 83ms mdc-ripple-fg-opacity-out;
+            animation: 83ms mdc-ripple-fg-opacity-out; }
+  .mdc-ripple-surface[data-mdc-ripple-is-unbounded] {
+    overflow: visible; }
+  .mdc-ripple-surface--primary::before, .mdc-ripple-surface--primary::after {
+    /* @alternate */
+    background-color: #3f51b5;
+    background-color: var(--mdc-theme-primary, #3f51b5); }
+  .mdc-ripple-surface--primary::before {
+    /* @alternate */
+    background-color: rgba(63, 81, 181, 0.16);
+    position: absolute;
+    top: calc(50% - 100%);
+    left: calc(50% - 100%);
+    width: 200%;
+    height: 200%;
+    -webkit-transition: opacity 250ms linear;
+    transition: opacity 250ms linear;
+    border-radius: 50%;
+    opacity: 0;
+    pointer-events: none;
+    content: ""; }
+    @supports (background-color: color(green a(10%))) {
+      .mdc-ripple-surface--primary::before {
+        background-color: color(var(--mdc-theme-primary, #3f51b5) a(16%)); } }
+  .mdc-ripple-surface--primary.mdc-ripple-upgraded::before {
+    top: calc(50% - 100%);
+    left: calc(50% - 100%);
+    width: 200%;
+    height: 200%;
+    /* @alternate */
+    -webkit-transform: scale(0);
+            transform: scale(0);
+    -webkit-transform: scale(var(--mdc-ripple-fg-scale, 0));
+            transform: scale(var(--mdc-ripple-fg-scale, 0)); }
+  .mdc-ripple-surface--primary.mdc-ripple-upgraded--background-focused::before {
+    opacity: .99999; }
+  .mdc-ripple-surface--primary.mdc-ripple-upgraded--background-active-fill::before {
+    -webkit-transition-duration: 120ms;
+            transition-duration: 120ms;
+    opacity: 1; }
+  .mdc-ripple-surface--primary.mdc-ripple-upgraded--unbounded::before {
+    /* @alternate */
+    top: calc(50% - 50%);
+    top: var(--mdc-ripple-top, calc(50% - 50%));
+    /* @alternate */
+    left: calc(50% - 50%);
+    left: var(--mdc-ripple-left, calc(50% - 50%));
+    /* @alternate */
+    width: 100%;
+    width: var(--mdc-ripple-fg-size, 100%);
+    /* @alternate */
+    height: 100%;
+    height: var(--mdc-ripple-fg-size, 100%);
+    /* @alternate */
+    -webkit-transform: scale(0);
+            transform: scale(0);
+    -webkit-transform: scale(var(--mdc-ripple-fg-scale, 0));
+            transform: scale(var(--mdc-ripple-fg-scale, 0)); }
+  .mdc-ripple-surface--primary::after {
+    /* @alternate */
+    background-color: rgba(63, 81, 181, 0.16);
+    position: absolute;
+    top: calc(50% - 100%);
+    left: calc(50% - 100%);
+    width: 200%;
+    height: 200%;
+    -webkit-transition: opacity 250ms linear;
+    transition: opacity 250ms linear;
+    border-radius: 50%;
+    opacity: 0;
+    pointer-events: none;
+    content: ""; }
+    @supports (background-color: color(green a(10%))) {
+      .mdc-ripple-surface--primary::after {
+        background-color: color(var(--mdc-theme-primary, #3f51b5) a(16%)); } }
+  .mdc-ripple-surface--primary.mdc-ripple-upgraded::after {
+    top: 0;
+    left: 0;
+    /* @alternate */
+    width: 100%;
+    width: var(--mdc-ripple-fg-size, 100%);
+    /* @alternate */
+    height: 100%;
+    height: var(--mdc-ripple-fg-size, 100%);
+    -webkit-transform: scale(0);
+            transform: scale(0);
+    -webkit-transform-origin: center center;
+            transform-origin: center center;
+    opacity: 0; }
+  .mdc-ripple-surface--primary:not(.mdc-ripple-upgraded--unbounded)::after {
+    -webkit-transform-origin: center center;
+            transform-origin: center center; }
+  .mdc-ripple-surface--primary.mdc-ripple-upgraded--unbounded::after {
+    /* @alternate */
+    top: 0;
+    top: var(--mdc-ripple-top, 0);
+    /* @alternate */
+    left: 0;
+    left: var(--mdc-ripple-left, 0);
+    /* @alternate */
+    width: 100%;
+    width: var(--mdc-ripple-fg-size, 100%);
+    /* @alternate */
+    height: 100%;
+    height: var(--mdc-ripple-fg-size, 100%);
+    -webkit-transform: scale(0);
+            transform: scale(0);
+    -webkit-transform-origin: center center;
+            transform-origin: center center; }
+  .mdc-ripple-surface--primary.mdc-ripple-upgraded--foreground-activation::after {
+    -webkit-animation: 300ms mdc-ripple-fg-radius-in forwards, 83ms mdc-ripple-fg-opacity-in forwards;
+            animation: 300ms mdc-ripple-fg-radius-in forwards, 83ms mdc-ripple-fg-opacity-in forwards; }
+  .mdc-ripple-surface--primary.mdc-ripple-upgraded--foreground-deactivation::after {
+    -webkit-transform: translate(var(--mdc-ripple-fg-translate-end, 0)) scale(var(--mdc-ripple-fg-scale, 1));
+            transform: translate(var(--mdc-ripple-fg-translate-end, 0)) scale(var(--mdc-ripple-fg-scale, 1));
+    -webkit-animation: 83ms mdc-ripple-fg-opacity-out;
+            animation: 83ms mdc-ripple-fg-opacity-out; }
+  .mdc-ripple-surface--accent::before, .mdc-ripple-surface--accent::after {
+    /* @alternate */
+    background-color: #3f51b5;
+    background-color: var(--mdc-theme-primary, #3f51b5); }
+  .mdc-ripple-surface--accent::before {
+    /* @alternate */
+    background-color: rgba(255, 64, 129, 0.16);
+    position: absolute;
+    top: calc(50% - 100%);
+    left: calc(50% - 100%);
+    width: 200%;
+    height: 200%;
+    -webkit-transition: opacity 250ms linear;
+    transition: opacity 250ms linear;
+    border-radius: 50%;
+    opacity: 0;
+    pointer-events: none;
+    content: ""; }
+    @supports (background-color: color(green a(10%))) {
+      .mdc-ripple-surface--accent::before {
+        background-color: color(var(--mdc-theme-accent, #ff4081) a(16%)); } }
+  .mdc-ripple-surface--accent.mdc-ripple-upgraded::before {
+    top: calc(50% - 100%);
+    left: calc(50% - 100%);
+    width: 200%;
+    height: 200%;
+    /* @alternate */
+    -webkit-transform: scale(0);
+            transform: scale(0);
+    -webkit-transform: scale(var(--mdc-ripple-fg-scale, 0));
+            transform: scale(var(--mdc-ripple-fg-scale, 0)); }
+  .mdc-ripple-surface--accent.mdc-ripple-upgraded--background-focused::before {
+    opacity: .99999; }
+  .mdc-ripple-surface--accent.mdc-ripple-upgraded--background-active-fill::before {
+    -webkit-transition-duration: 120ms;
+            transition-duration: 120ms;
+    opacity: 1; }
+  .mdc-ripple-surface--accent.mdc-ripple-upgraded--unbounded::before {
+    /* @alternate */
+    top: calc(50% - 50%);
+    top: var(--mdc-ripple-top, calc(50% - 50%));
+    /* @alternate */
+    left: calc(50% - 50%);
+    left: var(--mdc-ripple-left, calc(50% - 50%));
+    /* @alternate */
+    width: 100%;
+    width: var(--mdc-ripple-fg-size, 100%);
+    /* @alternate */
+    height: 100%;
+    height: var(--mdc-ripple-fg-size, 100%);
+    /* @alternate */
+    -webkit-transform: scale(0);
+            transform: scale(0);
+    -webkit-transform: scale(var(--mdc-ripple-fg-scale, 0));
+            transform: scale(var(--mdc-ripple-fg-scale, 0)); }
+  .mdc-ripple-surface--accent::after {
+    /* @alternate */
+    background-color: rgba(255, 64, 129, 0.16);
+    position: absolute;
+    top: calc(50% - 100%);
+    left: calc(50% - 100%);
+    width: 200%;
+    height: 200%;
+    -webkit-transition: opacity 250ms linear;
+    transition: opacity 250ms linear;
+    border-radius: 50%;
+    opacity: 0;
+    pointer-events: none;
+    content: ""; }
+    @supports (background-color: color(green a(10%))) {
+      .mdc-ripple-surface--accent::after {
+        background-color: color(var(--mdc-theme-accent, #ff4081) a(16%)); } }
+  .mdc-ripple-surface--accent.mdc-ripple-upgraded::after {
+    top: 0;
+    left: 0;
+    /* @alternate */
+    width: 100%;
+    width: var(--mdc-ripple-fg-size, 100%);
+    /* @alternate */
+    height: 100%;
+    height: var(--mdc-ripple-fg-size, 100%);
+    -webkit-transform: scale(0);
+            transform: scale(0);
+    -webkit-transform-origin: center center;
+            transform-origin: center center;
+    opacity: 0; }
+  .mdc-ripple-surface--accent:not(.mdc-ripple-upgraded--unbounded)::after {
+    -webkit-transform-origin: center center;
+            transform-origin: center center; }
+  .mdc-ripple-surface--accent.mdc-ripple-upgraded--unbounded::after {
+    /* @alternate */
+    top: 0;
+    top: var(--mdc-ripple-top, 0);
+    /* @alternate */
+    left: 0;
+    left: var(--mdc-ripple-left, 0);
+    /* @alternate */
+    width: 100%;
+    width: var(--mdc-ripple-fg-size, 100%);
+    /* @alternate */
+    height: 100%;
+    height: var(--mdc-ripple-fg-size, 100%);
+    -webkit-transform: scale(0);
+            transform: scale(0);
+    -webkit-transform-origin: center center;
+            transform-origin: center center; }
+  .mdc-ripple-surface--accent.mdc-ripple-upgraded--foreground-activation::after {
+    -webkit-animation: 300ms mdc-ripple-fg-radius-in forwards, 83ms mdc-ripple-fg-opacity-in forwards;
+            animation: 300ms mdc-ripple-fg-radius-in forwards, 83ms mdc-ripple-fg-opacity-in forwards; }
+  .mdc-ripple-surface--accent.mdc-ripple-upgraded--foreground-deactivation::after {
+    -webkit-transform: translate(var(--mdc-ripple-fg-translate-end, 0)) scale(var(--mdc-ripple-fg-scale, 1));
+            transform: translate(var(--mdc-ripple-fg-translate-end, 0)) scale(var(--mdc-ripple-fg-scale, 1));
+    -webkit-animation: 83ms mdc-ripple-fg-opacity-out;
+            animation: 83ms mdc-ripple-fg-opacity-out; }
+
+/* TODO(sgomes): Figure out what to do about desktop font sizes. */
+/* TODO(sgomes): Figure out what to do about i18n and i18n font sizes. */
+/*
+  Precomputed linear color channel values, for use in contrast calculations.
+  See https://www.w3.org/TR/WCAG20-TECHS/G17.html#G17-tests
+
+  Algorithm, for c in 0 to 255:
+  f(c) {
+    c = c / 255;
+    return c < 0.03928 ? c / 12.92 : Math.pow((c + 0.055) / 1.055, 2.4);
+  }
+
+  This lookup table is needed since there is no `pow` in SASS.
+*/
+/**
+ * Calculate the luminance for a color.
+ * See https://www.w3.org/TR/WCAG20-TECHS/G17.html#G17-tests
+ */
+/**
+ * Calculate the contrast ratio between two colors.
+ * See https://www.w3.org/TR/WCAG20-TECHS/G17.html#G17-tests
+ */
+/**
+ * Determine whether to use dark or light text on top of given color.
+ * Returns "dark" for dark text and "light" for light text.
+ */
+/*
+  Main theme colors.
+  If you're a user customizing your color scheme in SASS, these are probably the only variables you need to change.
+*/
+/* Indigo 500 */
+/* Pink A200 */
+/* White */
+/* Which set of text colors to use for each main theme color (light or dark) */
+/* Text colors according to light vs dark and text type */
+/* Primary text colors for each of the theme colors */
+/**
+ * Applies the correct theme color style to the specified property.
+ * $property is typically color or background-color, but can be any CSS property that accepts color values.
+ * $style should be one of the map keys in $mdc-theme-property-values (_variables.scss).
+ */
+/**
+ * Creates a rule to be used in MDC-Web components for dark theming, and applies the provided contents.
+ * Should provide the $root-selector option if applied to anything other than the root selector.
+ * When used with a modifier class, provide a second argument of `true` for the $compound parameter
+ * to specify that this should be attached as a compound class.
+ *
+ * Usage example:
+ *
+ * ```scss
+ * .mdc-foo {
+ *   color: black;
+ *
+ *   @include mdc-theme-dark {
+ *     color: white;
+ *   }
+ *
+ *   &__bar {
+ *     background: black;
+ *
+ *     @include mdc-theme-dark(".mdc-foo") {
+ *       background: white;
+ *     }
+ *   }
+ * }
+ *
+ * .mdc-foo--disabled {
+ *   opacity: .38;
+ *
+ *   @include mdc-theme-dark(".mdc-foo", true) {
+ *     opacity: .5;
+ *   }
+ * }
+ * ```
+ */
+/**
+ * Creates a rule that will be applied when an MDC-Web component is within the context of an RTL layout.
+ *
+ * Usage Example:
+ * ```scss
+ * .mdc-foo {
+ *   position: absolute;
+ *   left: 0;
+ *
+ *   @include mdc-rtl {
+ *     left: auto;
+ *     right: 0;
+ *   }
+ *
+ *   &__bar {
+ *     margin-left: 4px;
+ *     @include mdc-rtl(".mdc-foo") {
+ *       margin-left: auto;
+ *       margin-right: 4px;
+ *     }
+ *   }
+ * }
+ *
+ * .mdc-foo--mod {
+ *   padding-left: 4px;
+ *
+ *   @include mdc-rtl {
+ *     padding-left: auto;
+ *     padding-right: 4px;
+ *   }
+ * }
+ * ```
+ *
+ * Note that this works by checking for [dir="rtl"] on an ancestor element. While this will work
+ * in most cases, it will in some cases lead to false negatives, e.g.
+ *
+ * ```html
+ * <html dir="rtl">
+ *   <!-- ... -->
+ *   <div dir="ltr">
+ *     <div class="mdc-foo">Styled incorrectly as RTL!</div>
+ *   </div>
+ * </html>
+ * ```
+ *
+ * In the future, selectors such as :dir (http://mdn.io/:dir) will help us mitigate this.
+ */
+/**
+ * Takes a base box-model property - e.g. margin / border / padding - along with a default
+ * direction and value, and emits rules which apply the value to the
+ * "<base-property>-<default-direction>" property by default, but flips the direction
+ * when within an RTL context.
+ *
+ * For example:
+ *
+ * ```scss
+ * .mdc-foo {
+ *   @include mdc-rtl-reflexive-box(margin, left, 8px);
+ * }
+ * ```
+ * is equivalent to:
+ *
+ * ```scss
+ * .mdc-foo {
+ *   margin-left: 8px;
+ *
+ *   @include mdc-rtl {
+ *     margin-right: 8px;
+ *     margin-left: 0;
+ *   }
+ * }
+ * ```
+ * whereas:
+ *
+ * ```scss
+ * .mdc-foo {
+ *   @include mdc-rtl-reflexive-box(margin, right, 8px);
+ * }
+ * ```
+ * is equivalent to:
+ *
+ * ```scss
+ * .mdc-foo {
+ *   margin-right: 8px;
+ *
+ *   @include mdc-rtl {
+ *     margin-right: 0;
+ *     margin-left: 8px;
+ *   }
+ * }
+ * ```
+ *
+ * You can also pass a 4th optional $root-selector argument which will be forwarded to `mdc-rtl`,
+ * e.g. `@include mdc-rtl-reflexive-box(margin, left, 8px, ".mdc-component")`.
+ *
+ * Note that this function will always zero out the original value in an RTL context. If you're
+ * trying to flip the values, use mdc-rtl-reflexive-property().
+ */
+/**
+ * Takes a base property and emits rules that assign <base-property>-left to <left-value> and
+ * <base-property>-right to <right-value> in a LTR context, and vice versa in a RTL context.
+ * For example:
+ *
+ * ```scss
+ * .mdc-foo {
+ *   @include mdc-rtl-reflexive-property(margin, auto, 12px);
+ * }
+ * ```
+ * is equivalent to:
+ *
+ * ```scss
+ * .mdc-foo {
+ *   margin-left: auto;
+ *   margin-right: 12px;
+ *
+ *   @include mdc-rtl {
+ *     margin-left: 12px;
+ *     margin-right: auto;
+ *   }
+ * }
+ * ```
+ *
+ * A 4th optional $root-selector argument can be given, which will be passed to `mdc-rtl`.
+ */
+/**
+ * Takes an argument specifying a horizontal position property (either "left" or "right") as well
+ * as a value, and applies that value to the specified position in a LTR context, and flips it in a
+ * RTL context. For example:
+ *
+ * ```scss
+ * .mdc-foo {
+ *   @include mdc-rtl-reflexive-position(left, 0);
+ *   position: absolute;
+ * }
+ * ```
+ * is equivalent to:
+ *
+ * ```scss
+ *  .mdc-foo {
+ *    position: absolute;
+ *    left: 0;
+ *    right: initial;
+ *
+ *    @include mdc-rtl {
+ *      right: 0;
+ *      left: initial;
+ *    }
+ *  }
+ * ```
+ * An optional third $root-selector argument may also be given, which is passed to `mdc-rtl`.
+ */
+.mdc-select {
+  font-family: Roboto, sans-serif;
+  -moz-osx-font-smoothing: grayscale;
+  -webkit-font-smoothing: antialiased;
+  font-size: 1rem;
+  font-weight: 400;
+  letter-spacing: 0.04em;
+  line-height: 1.75rem;
+  text-decoration: inherit;
+  text-transform: inherit;
+  /* @alternate */
+  color: rgba(0, 0, 0, 0.87);
+  color: var(--mdc-theme-text-primary-on-light, rgba(0, 0, 0, 0.87));
+  padding-left: 0;
+  padding-right: 24px;
+  -webkit-appearance: none;
+     -moz-appearance: none;
+          appearance: none;
+  display: -webkit-inline-box;
+  display: -ms-inline-flexbox;
+  display: inline-flex;
+  -webkit-box-align: center;
+      -ms-flex-align: center;
+          align-items: center;
+  -webkit-box-pack: start;
+      -ms-flex-pack: start;
+          justify-content: flex-start;
+  max-width: calc(100% - 24px);
+  height: 32px;
+  -webkit-transition: border-bottom-color 150ms 0ms cubic-bezier(0.4, 0, 0.6, 1), background-color 150ms 0ms cubic-bezier(0.4, 0, 0.6, 1);
+  transition: border-bottom-color 150ms 0ms cubic-bezier(0.4, 0, 0.6, 1), background-color 150ms 0ms cubic-bezier(0.4, 0, 0.6, 1);
+  border: none;
+  border-bottom: 1px solid rgba(0, 0, 0, 0.12);
+  border-radius: 0;
+  background: none;
+  background-repeat: no-repeat;
+  background-position: right center;
+  background-image: url(data:image/svg+xml,%3Csvg%20width%3D%2210px%22%20height%3D%225px%22%20viewBox%3D%227%2010%2010%205%22%20version%3D%221.1%22%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20xmlns%3Axlink%3D%22http%3A%2F%2Fwww.w3.org%2F1999%2Fxlink%22%3E%0A%20%20%20%20%3Cpolygon%20id%3D%22Shape%22%20stroke%3D%22none%22%20fill%3D%22%230%22%20fill-rule%3D%22evenodd%22%20opacity%3D%220.54%22%20points%3D%227%2010%2012%2015%2017%2010%22%3E%3C%2Fpolygon%3E%0A%3C%2Fsvg%3E);
+  font-family: Roboto, sans-serif;
+  font-size: .936rem;
+  cursor: pointer; }
+  [dir="rtl"] .mdc-select, .mdc-select[dir="rtl"] {
+    padding-left: 24px;
+    padding-right: 0; }
+  .mdc-select::-ms-expand {
+    display: none; }
+  .mdc-select:focus {
+    /* @alternate */
+    border-bottom-color: #3f51b5;
+    border-bottom-color: var(--mdc-theme-primary, #3f51b5);
+    outline: none;
+    background-color: rgba(0, 0, 0, 0.06); }
+  [dir="rtl"] .mdc-select, .mdc-select[dir="rtl"] {
+    background-position: left center; }
+  .mdc-select--theme-dark,
+  .mdc-theme--dark .mdc-select {
+    /* @alternate */
+    color: white;
+    color: var(--mdc-theme-text-primary-on-dark, white);
+    background-image: url(data:image/svg+xml,%3Csvg%20width%3D%2210px%22%20height%3D%225px%22%20viewBox%3D%227%2010%2010%205%22%20version%3D%221.1%22%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20xmlns%3Axlink%3D%22http%3A%2F%2Fwww.w3.org%2F1999%2Fxlink%22%3E%0A%20%20%20%20%3Cpolygon%20id%3D%22Shape%22%20stroke%3D%22none%22%20fill%3D%22%23ffffff%22%20fill-rule%3D%22evenodd%22%20opacity%3D%220.54%22%20points%3D%227%2010%2012%2015%2017%2010%22%3E%3C%2Fpolygon%3E%0A%3C%2Fsvg%3E);
+    border-bottom: 1px solid rgba(255, 255, 255, 0.12); }
+    .mdc-select--theme-dark:focus,
+    .mdc-theme--dark .mdc-select:focus {
+      /* @alternate */
+      border-bottom-color: #3f51b5;
+      border-bottom-color: var(--mdc-theme-primary, #3f51b5);
+      background-color: rgba(255, 255, 255, 0.09); }
+  .mdc-select__menu {
+    position: fixed;
+    top: 0;
+    left: 0;
+    max-height: 100%;
+    -webkit-transform-origin: center center;
+            transform-origin: center center;
+    overflow-y: scroll;
+    z-index: 4; }
+  .mdc-select__selected-text {
+    -webkit-transition: opacity 125ms 0ms cubic-bezier(0.4, 0, 0.6, 1), -webkit-transform 125ms 0ms cubic-bezier(0.4, 0, 0.6, 1);
+    transition: opacity 125ms 0ms cubic-bezier(0.4, 0, 0.6, 1), -webkit-transform 125ms 0ms cubic-bezier(0.4, 0, 0.6, 1);
+    transition: opacity 125ms 0ms cubic-bezier(0.4, 0, 0.6, 1), transform 125ms 0ms cubic-bezier(0.4, 0, 0.6, 1);
+    transition: opacity 125ms 0ms cubic-bezier(0.4, 0, 0.6, 1), transform 125ms 0ms cubic-bezier(0.4, 0, 0.6, 1), -webkit-transform 125ms 0ms cubic-bezier(0.4, 0, 0.6, 1);
+    white-space: nowrap;
+    overflow: hidden; }
+
+.mdc-select--open .mdc-select__selected-text {
+  -webkit-transform: translateY(8px);
+          transform: translateY(8px);
+  -webkit-transition: opacity 125ms 125ms cubic-bezier(0, 0, 0.2, 1), -webkit-transform 125ms 125ms cubic-bezier(0, 0, 0.2, 1);
+  transition: opacity 125ms 125ms cubic-bezier(0, 0, 0.2, 1), -webkit-transform 125ms 125ms cubic-bezier(0, 0, 0.2, 1);
+  transition: opacity 125ms 125ms cubic-bezier(0, 0, 0.2, 1), transform 125ms 125ms cubic-bezier(0, 0, 0.2, 1);
+  transition: opacity 125ms 125ms cubic-bezier(0, 0, 0.2, 1), transform 125ms 125ms cubic-bezier(0, 0, 0.2, 1), -webkit-transform 125ms 125ms cubic-bezier(0, 0, 0.2, 1);
+  opacity: 0; }
+
+.mdc-select--disabled,
+.mdc-select[disabled] {
+  /* @alternate */
+  color: rgba(0, 0, 0, 0.38);
+  color: var(--mdc-theme-text-disabled-on-light, rgba(0, 0, 0, 0.38));
+  background-image: url(data:image/svg+xml,%3Csvg%20width%3D%2210px%22%20height%3D%225px%22%20viewBox%3D%227%2010%2010%205%22%20version%3D%221.1%22%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20xmlns%3Axlink%3D%22http%3A%2F%2Fwww.w3.org%2F1999%2Fxlink%22%3E%0A%20%20%20%20%3Cpolygon%20id%3D%22Shape%22%20stroke%3D%22none%22%20fill%3D%22%230%22%20fill-rule%3D%22evenodd%22%20opacity%3D%220.38%22%20points%3D%227%2010%2012%2015%2017%2010%22%3E%3C%2Fpolygon%3E%0A%3C%2Fsvg%3E);
+  border-bottom-style: dotted;
+  cursor: default;
+  pointer-events: none;
+  -webkit-user-select: none;
+     -moz-user-select: none;
+      -ms-user-select: none;
+          user-select: none; }
+
+.mdc-select--theme-dark.mdc-select--disabled,
+.mdc-theme--dark .mdc-select--disabled {
+  /* @alternate */
+  color: rgba(255, 255, 255, 0.5);
+  color: var(--mdc-theme-text-disabled-on-dark, rgba(255, 255, 255, 0.5));
+  background-image: url(data:image/svg+xml,%3Csvg%20width%3D%2210px%22%20height%3D%225px%22%20viewBox%3D%227%2010%2010%205%22%20version%3D%221.1%22%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20xmlns%3Axlink%3D%22http%3A%2F%2Fwww.w3.org%2F1999%2Fxlink%22%3E%0A%20%20%20%20%3Cpolygon%20id%3D%22Shape%22%20stroke%3D%22none%22%20fill%3D%22%23ffffff%22%20fill-rule%3D%22evenodd%22%20opacity%3D%220.38%22%20points%3D%227%2010%2012%2015%2017%2010%22%3E%3C%2Fpolygon%3E%0A%3C%2Fsvg%3E);
+  border-bottom: 1px dotted rgba(255, 255, 255, 0.38); }
+
+.mdc-select--theme-dark.mdc-select[disabled],
+.mdc-theme--dark .mdc-select[disabled] {
+  /* @alternate */
+  color: rgba(255, 255, 255, 0.5);
+  color: var(--mdc-theme-text-disabled-on-dark, rgba(255, 255, 255, 0.5));
+  background-image: url(data:image/svg+xml,%3Csvg%20width%3D%2210px%22%20height%3D%225px%22%20viewBox%3D%227%2010%2010%205%22%20version%3D%221.1%22%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20xmlns%3Axlink%3D%22http%3A%2F%2Fwww.w3.org%2F1999%2Fxlink%22%3E%0A%20%20%20%20%3Cpolygon%20id%3D%22Shape%22%20stroke%3D%22none%22%20fill%3D%22%23ffffff%22%20fill-rule%3D%22evenodd%22%20opacity%3D%220.38%22%20points%3D%227%2010%2012%2015%2017%2010%22%3E%3C%2Fpolygon%3E%0A%3C%2Fsvg%3E);
+  border-bottom: 1px dotted rgba(255, 255, 255, 0.38); }
+
+.mdc-select__menu .mdc-list-item {
+  font-family: Roboto, sans-serif;
+  -moz-osx-font-smoothing: grayscale;
+  -webkit-font-smoothing: antialiased;
+  font-size: 1rem;
+  font-weight: 400;
+  letter-spacing: 0.04em;
+  line-height: 1.75rem;
+  text-decoration: inherit;
+  text-transform: inherit;
+  /* @alternate */
+  color: rgba(0, 0, 0, 0.54);
+  color: var(--mdc-theme-text-secondary-on-light, rgba(0, 0, 0, 0.54)); }
+  .mdc-select__menu .mdc-list-item[aria-selected="true"] {
+    /* @alternate */
+    color: rgba(0, 0, 0, 0.87);
+    color: var(--mdc-theme-text-primary-on-light, rgba(0, 0, 0, 0.87)); }
+  .mdc-select--theme-dark .mdc-select__menu .mdc-list-item,
+  .mdc-theme--dark .mdc-select__menu .mdc-list-item {
+    /* @alternate */
+    color: rgba(255, 255, 255, 0.7);
+    color: var(--mdc-theme-text-secondary-on-dark, rgba(255, 255, 255, 0.7)); }
+    .mdc-select--theme-dark .mdc-select__menu .mdc-list-item[aria-selected="true"],
+    .mdc-theme--dark .mdc-select__menu .mdc-list-item[aria-selected="true"] {
+      /* @alternate */
+      color: white;
+      color: var(--mdc-theme-text-primary-on-dark, white); }
+
+.mdc-select__menu .mdc-list-group,
+.mdc-select__menu .mdc-list-group > .mdc-list-item:first-child {
+  margin-top: 12px; }
+
+.mdc-select__menu .mdc-list-group {
+  /* @alternate */
+  color: rgba(0, 0, 0, 0.38);
+  color: var(--mdc-theme-text-hint-on-light, rgba(0, 0, 0, 0.38));
+  font-weight: normal; }
+  .mdc-select__menu .mdc-list-group .mdc-list-item {
+    /* @alternate */
+    color: rgba(0, 0, 0, 0.87);
+    color: var(--mdc-theme-text-primary-on-light, rgba(0, 0, 0, 0.87)); }
+
+.mdc-select--theme-dark .mdc-select__menu .mdc-list-group,
+.mdc-theme--dark .mdc-select__menu .mdc-list-group {
+  /* @alternate */
+  color: rgba(255, 255, 255, 0.5);
+  color: var(--mdc-theme-text-hint-on-dark, rgba(255, 255, 255, 0.5)); }
+  .mdc-select--theme-dark .mdc-select__menu .mdc-list-group .mdc-list-item,
+  .mdc-theme--dark .mdc-select__menu .mdc-list-group .mdc-list-item {
+    /* @alternate */
+    color: white;
+    color: var(--mdc-theme-text-primary-on-dark, white); }
+
+.mdc-multi-select {
+  -webkit-appearance: none;
+     -moz-appearance: none;
+          appearance: none;
+  width: 250px;
+  padding: 0;
+  border: 1px solid;
+  /* @alternate */
+  border-color: rgba(0, 0, 0, 0.38);
+  border-color: var(--mdc-theme-text-hint-on-light, rgba(0, 0, 0, 0.38));
+  outline: none; }
+  .mdc-multi-select--theme-dark,
+  .mdc-theme--dark .mdc-multi-select {
+    /* @alternate */
+    border-color: rgba(255, 255, 255, 0.5);
+    border-color: var(--mdc-theme-text-hint-on-dark, rgba(255, 255, 255, 0.5)); }
+  .mdc-multi-select .mdc-list-group {
+    margin: 16px 0 0;
+    padding: 0 0 0 16px;
+    /* @alternate */
+    color: rgba(0, 0, 0, 0.38);
+    color: var(--mdc-theme-text-hint-on-light, rgba(0, 0, 0, 0.38));
+    font-weight: normal; }
+    .mdc-multi-select .mdc-list-group--theme-dark,
+    .mdc-theme--dark .mdc-multi-select .mdc-list-group {
+      /* @alternate */
+      color: rgba(255, 255, 255, 0.5);
+      color: var(--mdc-theme-text-hint-on-dark, rgba(255, 255, 255, 0.5)); }
+    .mdc-multi-select .mdc-list-group:last-child {
+      margin-bottom: 16px; }
+    .mdc-multi-select .mdc-list-group .mdc-list-divider {
+      margin-left: -16px; }
+  .mdc-multi-select .mdc-list-item {
+    margin: 0 0 0 -16px;
+    padding: 0 16px;
+    /* @alternate */
+    color: rgba(0, 0, 0, 0.87);
+    color: var(--mdc-theme-text-primary-on-light, rgba(0, 0, 0, 0.87)); }
+    .mdc-multi-select .mdc-list-item--theme-dark,
+    .mdc-theme--dark .mdc-multi-select .mdc-list-item {
+      /* @alternate */
+      color: white;
+      color: var(--mdc-theme-text-primary-on-dark, white); }
+    .mdc-multi-select .mdc-list-item:first-child {
+      margin-top: 12px; }
+    .mdc-multi-select .mdc-list-item:last-child {
+      margin-bottom: 8px; }
+  .mdc-multi-select .mdc-list-item:checked {
+    background-color: rgba(0, 0, 0, 0.12);
+    /* @alternate */
+    background-color: #fff;
+    background-color: var(--mdc-theme-background, #fff); }
+    .mdc-multi-select .mdc-list-item:checked--theme-dark,
+    .mdc-theme--dark .mdc-multi-select .mdc-list-item:checked {
+      /* @alternate */
+      background-color: white;
+      background-color: var(--mdc-theme-text-primary-on-dark, white); }
+  .mdc-multi-select .mdc-list-divider {
+    margin-bottom: 8px;
+    padding-top: 8px;
+    font-size: 0; }
+
+.mdc-multi-select:focus .mdc-list-item:checked {
+  /* @alternate */
+  background-color: #3f51b5;
+  background-color: var(--mdc-theme-primary, #3f51b5); }
+  .mdc-multi-select:focus .mdc-list-item:checked--theme-dark,
+  .mdc-theme--dark .mdc-multi-select:focus .mdc-list-item:checked {
+    /* @alternate */
+    background-color: white;
+    background-color: var(--mdc-theme-text-primary-on-dark, white); }
+
+/*
+  Precomputed linear color channel values, for use in contrast calculations.
+  See https://www.w3.org/TR/WCAG20-TECHS/G17.html#G17-tests
+
+  Algorithm, for c in 0 to 255:
+  f(c) {
+    c = c / 255;
+    return c < 0.03928 ? c / 12.92 : Math.pow((c + 0.055) / 1.055, 2.4);
+  }
+
+  This lookup table is needed since there is no `pow` in SASS.
+*/
+/**
+ * Calculate the luminance for a color.
+ * See https://www.w3.org/TR/WCAG20-TECHS/G17.html#G17-tests
+ */
+/**
+ * Calculate the contrast ratio between two colors.
+ * See https://www.w3.org/TR/WCAG20-TECHS/G17.html#G17-tests
+ */
+/**
+ * Determine whether to use dark or light text on top of given color.
+ * Returns "dark" for dark text and "light" for light text.
+ */
+/*
+  Main theme colors.
+  If you're a user customizing your color scheme in SASS, these are probably the only variables you need to change.
+*/
+/* Indigo 500 */
+/* Pink A200 */
+/* White */
+/* Which set of text colors to use for each main theme color (light or dark) */
+/* Text colors according to light vs dark and text type */
+/* Primary text colors for each of the theme colors */
+/**
+ * Applies the correct theme color style to the specified property.
+ * $property is typically color or background-color, but can be any CSS property that accepts color values.
+ * $style should be one of the map keys in $mdc-theme-property-values (_variables.scss).
+ */
+/**
+ * Creates a rule to be used in MDC-Web components for dark theming, and applies the provided contents.
+ * Should provide the $root-selector option if applied to anything other than the root selector.
+ * When used with a modifier class, provide a second argument of `true` for the $compound parameter
+ * to specify that this should be attached as a compound class.
+ *
+ * Usage example:
+ *
+ * ```scss
+ * .mdc-foo {
+ *   color: black;
+ *
+ *   @include mdc-theme-dark {
+ *     color: white;
+ *   }
+ *
+ *   &__bar {
+ *     background: black;
+ *
+ *     @include mdc-theme-dark(".mdc-foo") {
+ *       background: white;
+ *     }
+ *   }
+ * }
+ *
+ * .mdc-foo--disabled {
+ *   opacity: .38;
+ *
+ *   @include mdc-theme-dark(".mdc-foo", true) {
+ *     opacity: .5;
+ *   }
+ * }
+ * ```
+ */
+/* TODO(sgomes): Figure out what to do about desktop font sizes. */
+/* TODO(sgomes): Figure out what to do about i18n and i18n font sizes. */
+/**
+ * Creates a rule that will be applied when an MDC-Web component is within the context of an RTL layout.
+ *
+ * Usage Example:
+ * ```scss
+ * .mdc-foo {
+ *   position: absolute;
+ *   left: 0;
+ *
+ *   @include mdc-rtl {
+ *     left: auto;
+ *     right: 0;
+ *   }
+ *
+ *   &__bar {
+ *     margin-left: 4px;
+ *     @include mdc-rtl(".mdc-foo") {
+ *       margin-left: auto;
+ *       margin-right: 4px;
+ *     }
+ *   }
+ * }
+ *
+ * .mdc-foo--mod {
+ *   padding-left: 4px;
+ *
+ *   @include mdc-rtl {
+ *     padding-left: auto;
+ *     padding-right: 4px;
+ *   }
+ * }
+ * ```
+ *
+ * Note that this works by checking for [dir="rtl"] on an ancestor element. While this will work
+ * in most cases, it will in some cases lead to false negatives, e.g.
+ *
+ * ```html
+ * <html dir="rtl">
+ *   <!-- ... -->
+ *   <div dir="ltr">
+ *     <div class="mdc-foo">Styled incorrectly as RTL!</div>
+ *   </div>
+ * </html>
+ * ```
+ *
+ * In the future, selectors such as :dir (http://mdn.io/:dir) will help us mitigate this.
+ */
+/**
+ * Takes a base box-model property - e.g. margin / border / padding - along with a default
+ * direction and value, and emits rules which apply the value to the
+ * "<base-property>-<default-direction>" property by default, but flips the direction
+ * when within an RTL context.
+ *
+ * For example:
+ *
+ * ```scss
+ * .mdc-foo {
+ *   @include mdc-rtl-reflexive-box(margin, left, 8px);
+ * }
+ * ```
+ * is equivalent to:
+ *
+ * ```scss
+ * .mdc-foo {
+ *   margin-left: 8px;
+ *
+ *   @include mdc-rtl {
+ *     margin-right: 8px;
+ *     margin-left: 0;
+ *   }
+ * }
+ * ```
+ * whereas:
+ *
+ * ```scss
+ * .mdc-foo {
+ *   @include mdc-rtl-reflexive-box(margin, right, 8px);
+ * }
+ * ```
+ * is equivalent to:
+ *
+ * ```scss
+ * .mdc-foo {
+ *   margin-right: 8px;
+ *
+ *   @include mdc-rtl {
+ *     margin-right: 0;
+ *     margin-left: 8px;
+ *   }
+ * }
+ * ```
+ *
+ * You can also pass a 4th optional $root-selector argument which will be forwarded to `mdc-rtl`,
+ * e.g. `@include mdc-rtl-reflexive-box(margin, left, 8px, ".mdc-component")`.
+ *
+ * Note that this function will always zero out the original value in an RTL context. If you're
+ * trying to flip the values, use mdc-rtl-reflexive-property().
+ */
+/**
+ * Takes a base property and emits rules that assign <base-property>-left to <left-value> and
+ * <base-property>-right to <right-value> in a LTR context, and vice versa in a RTL context.
+ * For example:
+ *
+ * ```scss
+ * .mdc-foo {
+ *   @include mdc-rtl-reflexive-property(margin, auto, 12px);
+ * }
+ * ```
+ * is equivalent to:
+ *
+ * ```scss
+ * .mdc-foo {
+ *   margin-left: auto;
+ *   margin-right: 12px;
+ *
+ *   @include mdc-rtl {
+ *     margin-left: 12px;
+ *     margin-right: auto;
+ *   }
+ * }
+ * ```
+ *
+ * A 4th optional $root-selector argument can be given, which will be passed to `mdc-rtl`.
+ */
+/**
+ * Takes an argument specifying a horizontal position property (either "left" or "right") as well
+ * as a value, and applies that value to the specified position in a LTR context, and flips it in a
+ * RTL context. For example:
+ *
+ * ```scss
+ * .mdc-foo {
+ *   @include mdc-rtl-reflexive-position(left, 0);
+ *   position: absolute;
+ * }
+ * ```
+ * is equivalent to:
+ *
+ * ```scss
+ *  .mdc-foo {
+ *    position: absolute;
+ *    left: 0;
+ *    right: initial;
+ *
+ *    @include mdc-rtl {
+ *      right: 0;
+ *      left: initial;
+ *    }
+ *  }
+ * ```
+ * An optional third $root-selector argument may also be given, which is passed to `mdc-rtl`.
+ */
+@-webkit-keyframes mdc-slider-emphasize {
+  0% {
+    -webkit-animation-timing-function: ease-out;
+            animation-timing-function: ease-out; }
+  50% {
+    -webkit-animation-timing-function: ease-in;
+            animation-timing-function: ease-in;
+    -webkit-transform: scale(0.85);
+            transform: scale(0.85); }
+  100% {
+    -webkit-transform: scale(0.571);
+            transform: scale(0.571); } }
+@keyframes mdc-slider-emphasize {
+  0% {
+    -webkit-animation-timing-function: ease-out;
+            animation-timing-function: ease-out; }
+  50% {
+    -webkit-animation-timing-function: ease-in;
+            animation-timing-function: ease-in;
+    -webkit-transform: scale(0.85);
+            transform: scale(0.85); }
+  100% {
+    -webkit-transform: scale(0.571);
+            transform: scale(0.571); } }
+
+.mdc-slider {
+  position: relative;
+  width: 100%;
+  height: 48px;
+  cursor: pointer;
+  -ms-touch-action: pan-x;
+      touch-action: pan-x;
+  -webkit-tap-highlight-color: transparent; }
+  .mdc-slider:focus {
+    outline: none; }
+  .mdc-slider__track-container {
+    position: absolute;
+    top: 50%;
+    width: 100%;
+    height: 2px;
+    background-color: #bdbdbd;
+    overflow: hidden; }
+    .mdc-slider--theme-dark .mdc-slider__track-container,
+    .mdc-theme--dark .mdc-slider__track-container {
+      background-color: #5c5c5c; }
+  .mdc-slider__track {
+    /* @alternate */
+    background-color: #3f51b5;
+    background-color: var(--mdc-theme-primary, #3f51b5);
+    position: absolute;
+    width: 100%;
+    height: 100%;
+    -webkit-transform-origin: left top;
+            transform-origin: left top;
+    will-change: transform; }
+    [dir="rtl"] .mdc-slider .mdc-slider__track,
+    .mdc-slider[dir="rtl"] .mdc-slider__track {
+      -webkit-transform-origin: right top;
+              transform-origin: right top; }
+  .mdc-slider__track-marker-container {
+    display: -webkit-box;
+    display: -ms-flexbox;
+    display: flex;
+    margin-right: 0;
+    margin-left: -1px;
+    visibility: hidden; }
+    [dir="rtl"] .mdc-slider .mdc-slider__track-marker-container,
+    .mdc-slider[dir="rtl"] .mdc-slider__track-marker-container {
+      margin-right: -1px;
+      margin-left: 0; }
+    .mdc-slider__track-marker-container::after {
+      display: block;
+      width: 2px;
+      height: 2px;
+      background-color: #5c5c5c;
+      content: ""; }
+      .mdc-slider--theme-dark.mdc-slider__track-marker-container::after,
+      .mdc-theme--dark .mdc-slider__track-marker-container::after {
+        background-color: #bdbdbd; }
+  .mdc-slider__track-marker {
+    -webkit-box-flex: 1;
+        -ms-flex: 1;
+            flex: 1; }
+    .mdc-slider__track-marker::after {
+      display: block;
+      width: 2px;
+      height: 2px;
+      background-color: #5c5c5c;
+      content: ""; }
+      .mdc-slider--theme-dark.mdc-slider__track-marker::after,
+      .mdc-theme--dark .mdc-slider__track-marker::after {
+        background-color: #bdbdbd; }
+    .mdc-slider__track-marker:first-child::after {
+      width: 3px; }
+  .mdc-slider__thumb-container {
+    position: absolute;
+    top: 15px;
+    left: 0;
+    width: 21px;
+    height: 100%;
+    will-change: transform;
+    -webkit-user-select: none;
+       -moz-user-select: none;
+        -ms-user-select: none;
+            user-select: none; }
+  .mdc-slider__thumb {
+    /* @alternate */
+    fill: #3f51b5;
+    fill: var(--mdc-theme-primary, #3f51b5);
+    /* @alternate */
+    stroke: #3f51b5;
+    stroke: var(--mdc-theme-primary, #3f51b5);
+    position: absolute;
+    top: 0;
+    left: 0;
+    -webkit-transform: scale(0.571);
+            transform: scale(0.571);
+    -webkit-transition: fill 100ms ease-out, stroke 100ms ease-out, -webkit-transform 100ms ease-out;
+    transition: fill 100ms ease-out, stroke 100ms ease-out, -webkit-transform 100ms ease-out;
+    transition: transform 100ms ease-out, fill 100ms ease-out, stroke 100ms ease-out;
+    transition: transform 100ms ease-out, fill 100ms ease-out, stroke 100ms ease-out, -webkit-transform 100ms ease-out;
+    stroke-width: 3.5; }
+  .mdc-slider__focus-ring {
+    /* @alternate */
+    background-color: #3f51b5;
+    background-color: var(--mdc-theme-primary, #3f51b5);
+    width: 21px;
+    height: 21px;
+    -webkit-transition: opacity 266.67ms ease-out, background-color 266.67ms ease-out, -webkit-transform 266.67ms ease-out;
+    transition: opacity 266.67ms ease-out, background-color 266.67ms ease-out, -webkit-transform 266.67ms ease-out;
+    transition: transform 266.67ms ease-out, opacity 266.67ms ease-out, background-color 266.67ms ease-out;
+    transition: transform 266.67ms ease-out, opacity 266.67ms ease-out, background-color 266.67ms ease-out, -webkit-transform 266.67ms ease-out;
+    border-radius: 50%;
+    opacity: 0; }
+  .mdc-slider__pin {
+    /* @alternate */
+    background-color: #3f51b5;
+    background-color: var(--mdc-theme-primary, #3f51b5);
+    /* @alternate */
+    color: white;
+    color: var(--mdc-theme-text-primary-on-primary, white);
+    display: -webkit-box;
+    display: -ms-flexbox;
+    display: flex;
+    position: absolute;
+    top: 0;
+    left: 0;
+    -webkit-box-align: center;
+        -ms-flex-align: center;
+            align-items: center;
+    -webkit-box-pack: center;
+        -ms-flex-pack: center;
+            justify-content: center;
+    width: 26px;
+    height: 26px;
+    margin-top: -2px;
+    margin-left: -2px;
+    -webkit-transform: rotate(-45deg) scale(0) translate(0, 0);
+            transform: rotate(-45deg) scale(0) translate(0, 0);
+    -webkit-transition: -webkit-transform 100ms ease-out;
+    transition: -webkit-transform 100ms ease-out;
+    transition: transform 100ms ease-out;
+    transition: transform 100ms ease-out, -webkit-transform 100ms ease-out;
+    border-radius: 50% 50% 50% 0%;
+    /**
+     * Ensuring that the pin is higher than the thumb in the stacking order
+     * removes some rendering jank observed in Chrome.
+     */
+    z-index: 1; }
+  .mdc-slider__pin-value-marker {
+    font-family: Roboto, sans-serif;
+    -moz-osx-font-smoothing: grayscale;
+    -webkit-font-smoothing: antialiased;
+    font-size: 0.75rem;
+    font-weight: 400;
+    letter-spacing: 0.08em;
+    line-height: 1.25rem;
+    text-decoration: inherit;
+    text-transform: inherit;
+    -webkit-transform: rotate(45deg);
+            transform: rotate(45deg); }
+
+.mdc-slider--active .mdc-slider__thumb {
+  -webkit-transform: scale3d(1, 1, 1);
+          transform: scale3d(1, 1, 1); }
+
+.mdc-slider--focus .mdc-slider__thumb {
+  -webkit-animation: mdc-slider-emphasize 266.67ms linear;
+          animation: mdc-slider-emphasize 266.67ms linear; }
+
+.mdc-slider--focus .mdc-slider__focus-ring {
+  -webkit-transform: scale3d(1.55, 1.55, 1.55);
+          transform: scale3d(1.55, 1.55, 1.55);
+  opacity: .25; }
+
+.mdc-slider--disabled {
+  cursor: auto; }
+  .mdc-slider--disabled .mdc-slider__track {
+    background-color: #bdbdbd; }
+    .mdc-slider--theme-dark.mdc-slider--disabled .mdc-slider__track,
+    .mdc-theme--dark .mdc-slider--disabled .mdc-slider__track {
+      background-color: #5c5c5c; }
+  .mdc-slider--disabled .mdc-slider__thumb {
+    fill: #bdbdbd !important;
+    stroke: white !important;
+    stroke: var(--mdc-slider-bg-color-behind-component, white) !important; }
+    .mdc-slider--theme-dark.mdc-slider--disabled .mdc-slider__thumb,
+    .mdc-theme--dark .mdc-slider--disabled .mdc-slider__thumb {
+      fill: #5c5c5c !important;
+      stroke: #333 !important;
+      stroke: var(--mdc-slider-bg-color-behind-component, #333) !important; }
+
+.mdc-slider--off .mdc-slider__track {
+  opacity: 0; }
+
+.mdc-slider--off .mdc-slider__thumb {
+  fill: white;
+  fill: var(--mdc-slider-bg-color-behind-component, white);
+  stroke: #bdbdbd; }
+  .mdc-slider--theme-dark.mdc-slider--off .mdc-slider__thumb,
+  .mdc-theme--dark .mdc-slider--off .mdc-slider__thumb {
+    fill: #333;
+    fill: var(--mdc-slider-bg-color-behind-component, #333);
+    stroke: #5c5c5c; }
+
+.mdc-slider--off .mdc-slider__pin {
+  background-color: #bdbdbd; }
+  .mdc-slider--theme-dark.mdc-slider--off .mdc-slider__pin,
+  .mdc-theme--dark .mdc-slider--off .mdc-slider__pin {
+    background-color: #5c5c5c; }
+
+.mdc-slider--off.mdc-slider--focus .mdc-slider__thumb {
+  fill: #dedede; }
+  .mdc-slider--theme-dark.mdc-slider--off.mdc-slider--focus .mdc-slider__thumb,
+  .mdc-theme--dark .mdc-slider--off.mdc-slider--focus .mdc-slider__thumb {
+    fill: #82848c;
+    stroke: #82848c; }
+
+.mdc-slider--off.mdc-slider--active.mdc-slider--focus .mdc-slider__thumb {
+  stroke: #8c8c8c; }
+  .mdc-slider--theme-dark.mdc-slider--off.mdc-slider--active.mdc-slider--focus .mdc-slider__thumb,
+  .mdc-theme--dark .mdc-slider--off.mdc-slider--active.mdc-slider--focus .mdc-slider__thumb {
+    stroke: #5c5c5c; }
+
+.mdc-slider--off .mdc-slider__focus-ring {
+  background-color: #bdbdbd; }
+
+.mdc-slider--in-transit .mdc-slider__thumb {
+  -webkit-transition-delay: 140ms;
+          transition-delay: 140ms; }
+
+.mdc-slider--in-transit .mdc-slider__thumb-container,
+.mdc-slider--in-transit .mdc-slider__track,
+.mdc-slider:focus:not(.mdc-slider--active) .mdc-slider__thumb-container,
+.mdc-slider:focus:not(.mdc-slider--active) .mdc-slider__track {
+  -webkit-transition: -webkit-transform 80ms ease;
+  transition: -webkit-transform 80ms ease;
+  transition: transform 80ms ease;
+  transition: transform 80ms ease, -webkit-transform 80ms ease; }
+
+.mdc-slider--discrete.mdc-slider--active .mdc-slider__thumb {
+  -webkit-transform: scale(calc(12 / 21));
+          transform: scale(calc(12 / 21)); }
+
+.mdc-slider--discrete.mdc-slider--active .mdc-slider__pin {
+  -webkit-transform: rotate(-45deg) scale(1) translate(19px, -20px);
+          transform: rotate(-45deg) scale(1) translate(19px, -20px); }
+
+.mdc-slider--discrete.mdc-slider--focus .mdc-slider__thumb {
+  -webkit-animation: none;
+          animation: none; }
+
+.mdc-slider--discrete.mdc-slider--focus .mdc-slider__focus-ring {
+  -webkit-transform: none;
+          transform: none;
+  opacity: 0; }
+
+.mdc-slider--discrete.mdc-slider--display-markers .mdc-slider__track-marker-container {
+  visibility: visible; }
+
+/**
+ * Creates a rule that will be applied when an MDC-Web component is within the context of an RTL layout.
+ *
+ * Usage Example:
+ * ```scss
+ * .mdc-foo {
+ *   position: absolute;
+ *   left: 0;
+ *
+ *   @include mdc-rtl {
+ *     left: auto;
+ *     right: 0;
+ *   }
+ *
+ *   &__bar {
+ *     margin-left: 4px;
+ *     @include mdc-rtl(".mdc-foo") {
+ *       margin-left: auto;
+ *       margin-right: 4px;
+ *     }
+ *   }
+ * }
+ *
+ * .mdc-foo--mod {
+ *   padding-left: 4px;
+ *
+ *   @include mdc-rtl {
+ *     padding-left: auto;
+ *     padding-right: 4px;
+ *   }
+ * }
+ * ```
+ *
+ * Note that this works by checking for [dir="rtl"] on an ancestor element. While this will work
+ * in most cases, it will in some cases lead to false negatives, e.g.
+ *
+ * ```html
+ * <html dir="rtl">
+ *   <!-- ... -->
+ *   <div dir="ltr">
+ *     <div class="mdc-foo">Styled incorrectly as RTL!</div>
+ *   </div>
+ * </html>
+ * ```
+ *
+ * In the future, selectors such as :dir (http://mdn.io/:dir) will help us mitigate this.
+ */
+/**
+ * Takes a base box-model property - e.g. margin / border / padding - along with a default
+ * direction and value, and emits rules which apply the value to the
+ * "<base-property>-<default-direction>" property by default, but flips the direction
+ * when within an RTL context.
+ *
+ * For example:
+ *
+ * ```scss
+ * .mdc-foo {
+ *   @include mdc-rtl-reflexive-box(margin, left, 8px);
+ * }
+ * ```
+ * is equivalent to:
+ *
+ * ```scss
+ * .mdc-foo {
+ *   margin-left: 8px;
+ *
+ *   @include mdc-rtl {
+ *     margin-right: 8px;
+ *     margin-left: 0;
+ *   }
+ * }
+ * ```
+ * whereas:
+ *
+ * ```scss
+ * .mdc-foo {
+ *   @include mdc-rtl-reflexive-box(margin, right, 8px);
+ * }
+ * ```
+ * is equivalent to:
+ *
+ * ```scss
+ * .mdc-foo {
+ *   margin-right: 8px;
+ *
+ *   @include mdc-rtl {
+ *     margin-right: 0;
+ *     margin-left: 8px;
+ *   }
+ * }
+ * ```
+ *
+ * You can also pass a 4th optional $root-selector argument which will be forwarded to `mdc-rtl`,
+ * e.g. `@include mdc-rtl-reflexive-box(margin, left, 8px, ".mdc-component")`.
+ *
+ * Note that this function will always zero out the original value in an RTL context. If you're
+ * trying to flip the values, use mdc-rtl-reflexive-property().
+ */
+/**
+ * Takes a base property and emits rules that assign <base-property>-left to <left-value> and
+ * <base-property>-right to <right-value> in a LTR context, and vice versa in a RTL context.
+ * For example:
+ *
+ * ```scss
+ * .mdc-foo {
+ *   @include mdc-rtl-reflexive-property(margin, auto, 12px);
+ * }
+ * ```
+ * is equivalent to:
+ *
+ * ```scss
+ * .mdc-foo {
+ *   margin-left: auto;
+ *   margin-right: 12px;
+ *
+ *   @include mdc-rtl {
+ *     margin-left: 12px;
+ *     margin-right: auto;
+ *   }
+ * }
+ * ```
+ *
+ * A 4th optional $root-selector argument can be given, which will be passed to `mdc-rtl`.
+ */
+/**
+ * Takes an argument specifying a horizontal position property (either "left" or "right") as well
+ * as a value, and applies that value to the specified position in a LTR context, and flips it in a
+ * RTL context. For example:
+ *
+ * ```scss
+ * .mdc-foo {
+ *   @include mdc-rtl-reflexive-position(left, 0);
+ *   position: absolute;
+ * }
+ * ```
+ * is equivalent to:
+ *
+ * ```scss
+ *  .mdc-foo {
+ *    position: absolute;
+ *    left: 0;
+ *    right: initial;
+ *
+ *    @include mdc-rtl {
+ *      right: 0;
+ *      left: initial;
+ *    }
+ *  }
+ * ```
+ * An optional third $root-selector argument may also be given, which is passed to `mdc-rtl`.
+ */
+/*
+  Precomputed linear color channel values, for use in contrast calculations.
+  See https://www.w3.org/TR/WCAG20-TECHS/G17.html#G17-tests
+
+  Algorithm, for c in 0 to 255:
+  f(c) {
+    c = c / 255;
+    return c < 0.03928 ? c / 12.92 : Math.pow((c + 0.055) / 1.055, 2.4);
+  }
+
+  This lookup table is needed since there is no `pow` in SASS.
+*/
+/**
+ * Calculate the luminance for a color.
+ * See https://www.w3.org/TR/WCAG20-TECHS/G17.html#G17-tests
+ */
+/**
+ * Calculate the contrast ratio between two colors.
+ * See https://www.w3.org/TR/WCAG20-TECHS/G17.html#G17-tests
+ */
+/**
+ * Determine whether to use dark or light text on top of given color.
+ * Returns "dark" for dark text and "light" for light text.
+ */
+/*
+  Main theme colors.
+  If you're a user customizing your color scheme in SASS, these are probably the only variables you need to change.
+*/
+/* Indigo 500 */
+/* Pink A200 */
+/* White */
+/* Which set of text colors to use for each main theme color (light or dark) */
+/* Text colors according to light vs dark and text type */
+/* Primary text colors for each of the theme colors */
+/**
+ * Applies the correct theme color style to the specified property.
+ * $property is typically color or background-color, but can be any CSS property that accepts color values.
+ * $style should be one of the map keys in $mdc-theme-property-values (_variables.scss).
+ */
+/**
+ * Creates a rule to be used in MDC-Web components for dark theming, and applies the provided contents.
+ * Should provide the $root-selector option if applied to anything other than the root selector.
+ * When used with a modifier class, provide a second argument of `true` for the $compound parameter
+ * to specify that this should be attached as a compound class.
+ *
+ * Usage example:
+ *
+ * ```scss
+ * .mdc-foo {
+ *   color: black;
+ *
+ *   @include mdc-theme-dark {
+ *     color: white;
+ *   }
+ *
+ *   &__bar {
+ *     background: black;
+ *
+ *     @include mdc-theme-dark(".mdc-foo") {
+ *       background: white;
+ *     }
+ *   }
+ * }
+ *
+ * .mdc-foo--disabled {
+ *   opacity: .38;
+ *
+ *   @include mdc-theme-dark(".mdc-foo", true) {
+ *     opacity: .5;
+ *   }
+ * }
+ * ```
+ */
+/* TODO(sgomes): Figure out what to do about desktop font sizes. */
+/* TODO(sgomes): Figure out what to do about i18n and i18n font sizes. */
+/* postcss-bem-linter: define snackbar */
+.mdc-snackbar {
+  display: -webkit-box;
+  display: -ms-flexbox;
+  display: flex;
+  position: fixed;
+  bottom: 0;
+  left: 50%;
+  -webkit-box-align: center;
+      -ms-flex-align: center;
+          align-items: center;
+  -webkit-box-pack: start;
+      -ms-flex-pack: start;
+          justify-content: flex-start;
+  padding-right: 24px;
+  padding-left: 24px;
+  -webkit-transform: translate(-50%, 100%);
+          transform: translate(-50%, 100%);
+  -webkit-transition: -webkit-transform 0.25s 0ms cubic-bezier(0.4, 0, 1, 1);
+  transition: -webkit-transform 0.25s 0ms cubic-bezier(0.4, 0, 1, 1);
+  transition: transform 0.25s 0ms cubic-bezier(0.4, 0, 1, 1);
+  transition: transform 0.25s 0ms cubic-bezier(0.4, 0, 1, 1), -webkit-transform 0.25s 0ms cubic-bezier(0.4, 0, 1, 1);
+  background-color: #323232;
+  will-change: transform;
+  pointer-events: none;
+  /* stylelint-disable plugin/selector-bem-pattern */
+  /* stylelint-enable plugin/selector-bem-pattern */ }
+  .mdc-snackbar--theme-dark .mdc-snackbar,
+  .mdc-theme--dark .mdc-snackbar {
+    background-color: #fafafa; }
+  @media (max-width: 599px) {
+    .mdc-snackbar {
+      left: 0;
+      width: calc(100% - 48px);
+      -webkit-transform: translate(0, 100%);
+              transform: translate(0, 100%); } }
+  @media (min-width: 600px) {
+    .mdc-snackbar {
+      min-width: 288px;
+      max-width: 568px;
+      border-radius: 2px; } }
+  @media (min-width: 600px) {
+    .mdc-snackbar--align-start {
+      bottom: 24px;
+      left: 24px;
+      right: initial;
+      -webkit-transform: translate(0, 200%);
+              transform: translate(0, 200%); }
+      [dir="rtl"] .mdc-snackbar--align-start, .mdc-snackbar--align-start[dir="rtl"] {
+        left: initial;
+        right: 24px; } }
+  @media (max-width: 599px) {
+    .mdc-snackbar--align-start {
+      bottom: 0;
+      left: 0;
+      width: calc(100% - 48px);
+      -webkit-transform: translate(0, 100%);
+              transform: translate(0, 100%); } }
+  .mdc-snackbar--active {
+    -webkit-transform: translate(0);
+            transform: translate(0);
+    pointer-events: auto;
+    -webkit-transition: -webkit-transform 0.25s 0ms cubic-bezier(0, 0, 0.2, 1);
+    transition: -webkit-transform 0.25s 0ms cubic-bezier(0, 0, 0.2, 1);
+    transition: transform 0.25s 0ms cubic-bezier(0, 0, 0.2, 1);
+    transition: transform 0.25s 0ms cubic-bezier(0, 0, 0.2, 1), -webkit-transform 0.25s 0ms cubic-bezier(0, 0, 0.2, 1); }
+    .mdc-snackbar--active:not(.mdc-snackbar--align-start) {
+      -webkit-transform: translate(-50%, 0);
+              transform: translate(-50%, 0); }
+      @media (max-width: 599px) {
+        .mdc-snackbar--active:not(.mdc-snackbar--align-start) {
+          bottom: 0;
+          left: 0;
+          width: calc(100% - 48px);
+          -webkit-transform: translate(0);
+                  transform: translate(0); } }
+  .mdc-snackbar--action-on-bottom {
+    -webkit-box-orient: vertical;
+    -webkit-box-direction: normal;
+        -ms-flex-direction: column;
+            flex-direction: column; }
+  .mdc-snackbar--action-on-bottom .mdc-snackbar__text {
+    margin-right: inherit; }
+  .mdc-snackbar--action-on-bottom .mdc-snackbar__action-wrapper {
+    -webkit-box-orient: vertical;
+    -webkit-box-direction: normal;
+        -ms-flex-direction: column;
+            flex-direction: column;
+    -webkit-box-pack: start;
+        -ms-flex-pack: start;
+            justify-content: flex-start;
+    margin-top: -12px;
+    margin-bottom: 8px;
+    margin-left: auto;
+    margin-right: 0; }
+    [dir="rtl"] .mdc-snackbar--action-on-bottom .mdc-snackbar__action-wrapper, .mdc-snackbar--action-on-bottom .mdc-snackbar__action-wrapper[dir="rtl"] {
+      margin-left: 0;
+      margin-right: auto; }
+  .mdc-snackbar__text {
+    font-family: Roboto, sans-serif;
+    -moz-osx-font-smoothing: grayscale;
+    -webkit-font-smoothing: antialiased;
+    font-size: 0.875rem;
+    font-weight: 400;
+    letter-spacing: 0.04em;
+    line-height: 1.25rem;
+    text-decoration: inherit;
+    text-transform: inherit;
+    margin-left: 0;
+    margin-right: auto;
+    display: -webkit-box;
+    display: -ms-flexbox;
+    display: flex;
+    -webkit-box-align: center;
+        -ms-flex-align: center;
+            align-items: center;
+    height: 48px;
+    -webkit-transition: opacity 0.3s 0ms cubic-bezier(0.4, 0, 1, 1);
+    transition: opacity 0.3s 0ms cubic-bezier(0.4, 0, 1, 1);
+    color: white;
+    opacity: 0; }
+    [dir="rtl"] .mdc-snackbar .mdc-snackbar__text,
+    .mdc-snackbar[dir="rtl"] .mdc-snackbar__text {
+      margin-left: auto;
+      margin-right: 0; }
+    .mdc-snackbar--theme-dark .mdc-snackbar__text,
+    .mdc-theme--dark .mdc-snackbar__text {
+      /* @alternate */
+      color: rgba(0, 0, 0, 0.87);
+      color: var(--mdc-theme-text-primary-on-light, rgba(0, 0, 0, 0.87)); }
+  .mdc-snackbar--multiline .mdc-snackbar__text {
+    height: 80px; }
+  .mdc-snackbar--multiline.mdc-snackbar--action-on-bottom .mdc-snackbar__text {
+    margin: 0; }
+  .mdc-snackbar__action-button {
+    /* @alternate */
+    color: #ff4081;
+    color: var(--mdc-theme-accent, #ff4081);
+    margin-left: 0;
+    margin-right: -16px;
+    min-width: auto;
+    height: inherit;
+    -webkit-transition: opacity 0.3s 0ms cubic-bezier(0.4, 0, 1, 1);
+    transition: opacity 0.3s 0ms cubic-bezier(0.4, 0, 1, 1);
+    opacity: 0;
+    visibility: hidden; }
+    .mdc-snackbar--theme-dark .mdc-snackbar__action-button,
+    .mdc-theme--dark .mdc-snackbar__action-button {
+      /* @alternate */
+      color: #3f51b5;
+      color: var(--mdc-theme-primary, #3f51b5); }
+    [dir="rtl"] .mdc-snackbar .mdc-snackbar__action-button,
+    .mdc-snackbar[dir="rtl"] .mdc-snackbar__action-button {
+      margin-left: -16px;
+      margin-right: 0; }
+    .mdc-snackbar__action-button::-moz-focus-inner {
+      border: 0; }
+    .mdc-snackbar__action-button:not([aria-hidden]) {
+      visibility: inherit; }
+  .mdc-snackbar--active .mdc-snackbar__text,
+  .mdc-snackbar--active .mdc-snackbar__action-button:not([aria-hidden]) {
+    -webkit-transition: opacity 0.3s 0ms cubic-bezier(0.4, 0, 1, 1);
+    transition: opacity 0.3s 0ms cubic-bezier(0.4, 0, 1, 1);
+    opacity: 1; }
+
+/* postcss-bem-linter: end */
+/**
+ * The css property used for elevation. In most cases this should not be changed. It is exposed
+ * as a variable for abstraction / easy use when needing to reference the property directly, for
+ * example in a `will-change` rule.
+ */
+/**
+ * The default duration value for elevation transitions.
+ */
+/**
+ * The default easing value for elevation transitions.
+ */
+/**
+ * Applies the correct css rules to an element to give it the elevation specified by $z-value.
+ * The $z-value must be between 0 and 24.
+ */
+/**
+ * Returns a string that can be used as the value for a `transition` property for elevation.
+ * Calling this function directly is useful in situations where a component needs to transition
+ * more than one property.
+ *
+ * ```scss
+ * .foo {
+ *   transition: mdc-elevation-transition-rule(), opacity 100ms ease;
+ *   will-change: $mdc-elevation-property, opacity;
+ * }
+ * ```
+ */
+/**
+ * Applies the correct css rules needed to have an element transition between elevations.
+ * This mixin should be applied to elements whose elevation values will change depending on their
+ * context (e.g. when active or disabled).
+ */
+/*
+  Precomputed linear color channel values, for use in contrast calculations.
+  See https://www.w3.org/TR/WCAG20-TECHS/G17.html#G17-tests
+
+  Algorithm, for c in 0 to 255:
+  f(c) {
+    c = c / 255;
+    return c < 0.03928 ? c / 12.92 : Math.pow((c + 0.055) / 1.055, 2.4);
+  }
+
+  This lookup table is needed since there is no `pow` in SASS.
+*/
+/**
+ * Calculate the luminance for a color.
+ * See https://www.w3.org/TR/WCAG20-TECHS/G17.html#G17-tests
+ */
+/**
+ * Calculate the contrast ratio between two colors.
+ * See https://www.w3.org/TR/WCAG20-TECHS/G17.html#G17-tests
+ */
+/**
+ * Determine whether to use dark or light text on top of given color.
+ * Returns "dark" for dark text and "light" for light text.
+ */
+/*
+  Main theme colors.
+  If you're a user customizing your color scheme in SASS, these are probably the only variables you need to change.
+*/
+/* Indigo 500 */
+/* Pink A200 */
+/* White */
+/* Which set of text colors to use for each main theme color (light or dark) */
+/* Text colors according to light vs dark and text type */
+/* Primary text colors for each of the theme colors */
+/**
+ * Applies the correct theme color style to the specified property.
+ * $property is typically color or background-color, but can be any CSS property that accepts color values.
+ * $style should be one of the map keys in $mdc-theme-property-values (_variables.scss).
+ */
+/**
+ * Creates a rule to be used in MDC-Web components for dark theming, and applies the provided contents.
+ * Should provide the $root-selector option if applied to anything other than the root selector.
+ * When used with a modifier class, provide a second argument of `true` for the $compound parameter
+ * to specify that this should be attached as a compound class.
+ *
+ * Usage example:
+ *
+ * ```scss
+ * .mdc-foo {
+ *   color: black;
+ *
+ *   @include mdc-theme-dark {
+ *     color: white;
+ *   }
+ *
+ *   &__bar {
+ *     background: black;
+ *
+ *     @include mdc-theme-dark(".mdc-foo") {
+ *       background: white;
+ *     }
+ *   }
+ * }
+ *
+ * .mdc-foo--disabled {
+ *   opacity: .38;
+ *
+ *   @include mdc-theme-dark(".mdc-foo", true) {
+ *     opacity: .5;
+ *   }
+ * }
+ * ```
+ */
+.mdc-switch {
+  display: inline-block;
+  position: relative; }
+  .mdc-switch__native-control {
+    display: inline-block;
+    position: absolute;
+    top: 0;
+    left: 0;
+    width: 34px;
+    height: 14px;
+    cursor: pointer;
+    opacity: 0;
+    z-index: 2; }
+  .mdc-switch__background {
+    display: block;
+    position: relative;
+    width: 34px;
+    height: 14px;
+    border-radius: 7px;
+    outline: none;
+    background-color: transparent;
+    cursor: pointer;
+    -webkit-user-select: none;
+       -moz-user-select: none;
+        -ms-user-select: none;
+            user-select: none; }
+    .mdc-switch--theme-dark .mdc-switch__background,
+    .mdc-theme--dark .mdc-switch__background {
+      background-color: transparent; }
+    .mdc-switch__background::before {
+      display: block;
+      position: absolute;
+      top: 0;
+      right: 0;
+      bottom: 0;
+      left: 0;
+      -webkit-transition: opacity 90ms cubic-bezier(0.4, 0, 0.2, 1), background-color 90ms cubic-bezier(0.4, 0, 0.2, 1);
+      transition: opacity 90ms cubic-bezier(0.4, 0, 0.2, 1), background-color 90ms cubic-bezier(0.4, 0, 0.2, 1);
+      border-radius: 7px;
+      background-color: #000;
+      content: "";
+      opacity: .38; }
+      .mdc-switch--theme-dark .mdc-switch__background::before,
+      .mdc-theme--dark .mdc-switch__background::before {
+        background-color: #fff;
+        opacity: .3; }
+    .mdc-switch__background .mdc-switch__knob {
+      display: block;
+      position: absolute;
+      top: -3px;
+      left: 0;
+      width: 20px;
+      height: 20px;
+      -webkit-transform: translateX(0);
+              transform: translateX(0);
+      -webkit-transition: background-color 90ms cubic-bezier(0.4, 0, 0.2, 1), -webkit-transform 90ms cubic-bezier(0.4, 0, 0.2, 1);
+      transition: background-color 90ms cubic-bezier(0.4, 0, 0.2, 1), -webkit-transform 90ms cubic-bezier(0.4, 0, 0.2, 1);
+      transition: transform 90ms cubic-bezier(0.4, 0, 0.2, 1), background-color 90ms cubic-bezier(0.4, 0, 0.2, 1);
+      transition: transform 90ms cubic-bezier(0.4, 0, 0.2, 1), background-color 90ms cubic-bezier(0.4, 0, 0.2, 1), -webkit-transform 90ms cubic-bezier(0.4, 0, 0.2, 1);
+      border-radius: 10px;
+      background-color: #fafafa;
+      -webkit-box-shadow: 0px 3px 1px -2px rgba(0, 0, 0, 0.2), 0px 2px 2px 0px rgba(0, 0, 0, 0.14), 0px 1px 5px 0px rgba(0, 0, 0, 0.12);
+              box-shadow: 0px 3px 1px -2px rgba(0, 0, 0, 0.2), 0px 2px 2px 0px rgba(0, 0, 0, 0.14), 0px 1px 5px 0px rgba(0, 0, 0, 0.12);
+      z-index: 1; }
+      .mdc-switch--theme-dark .mdc-switch__background .mdc-switch__knob,
+      .mdc-theme--dark .mdc-switch__background .mdc-switch__knob {
+        background-color: #bdbdbd; }
+      .mdc-switch__background .mdc-switch__knob::before {
+        position: absolute;
+        top: -14px;
+        left: -14px;
+        width: 48px;
+        height: 48px;
+        -webkit-transform: scale(0);
+                transform: scale(0);
+        -webkit-transition: background-color 90ms cubic-bezier(0.4, 0, 0.2, 1), -webkit-transform 90ms cubic-bezier(0.4, 0, 0.2, 1);
+        transition: background-color 90ms cubic-bezier(0.4, 0, 0.2, 1), -webkit-transform 90ms cubic-bezier(0.4, 0, 0.2, 1);
+        transition: transform 90ms cubic-bezier(0.4, 0, 0.2, 1), background-color 90ms cubic-bezier(0.4, 0, 0.2, 1);
+        transition: transform 90ms cubic-bezier(0.4, 0, 0.2, 1), background-color 90ms cubic-bezier(0.4, 0, 0.2, 1), -webkit-transform 90ms cubic-bezier(0.4, 0, 0.2, 1);
+        border-radius: 24px;
+        background-color: transparent;
+        content: "";
+        opacity: .2; }
+
+.mdc-switch__native-control:focus ~ .mdc-switch__background .mdc-switch__knob::before {
+  position: absolute;
+  width: 48px;
+  height: 48px;
+  -webkit-transform: scale(1);
+          transform: scale(1);
+  -webkit-transition: background-color 90ms cubic-bezier(0.4, 0, 0.2, 1), -webkit-transform 90ms cubic-bezier(0.4, 0, 0.2, 1);
+  transition: background-color 90ms cubic-bezier(0.4, 0, 0.2, 1), -webkit-transform 90ms cubic-bezier(0.4, 0, 0.2, 1);
+  transition: transform 90ms cubic-bezier(0.4, 0, 0.2, 1), background-color 90ms cubic-bezier(0.4, 0, 0.2, 1);
+  transition: transform 90ms cubic-bezier(0.4, 0, 0.2, 1), background-color 90ms cubic-bezier(0.4, 0, 0.2, 1), -webkit-transform 90ms cubic-bezier(0.4, 0, 0.2, 1);
+  border-radius: 24px;
+  background-color: #9e9e9e; }
+  .mdc-switch--theme-dark .mdc-switch__native-control:focus ~ .mdc-switch__background .mdc-switch__knob::before,
+  .mdc-theme--dark .mdc-switch__native-control:focus ~ .mdc-switch__background .mdc-switch__knob::before {
+    background-color: #f1f1f1;
+    opacity: .14; }
+
+.mdc-switch__native-control:checked ~ .mdc-switch__background::before {
+  /* @alternate */
+  background-color: #3f51b5;
+  background-color: var(--mdc-theme-primary, #3f51b5);
+  opacity: .5; }
+
+.mdc-switch__native-control:checked ~ .mdc-switch__background .mdc-switch__knob {
+  -webkit-transform: translateX(14px);
+          transform: translateX(14px);
+  -webkit-transition: background-color 90ms cubic-bezier(0.4, 0, 0.2, 1), -webkit-transform 90ms cubic-bezier(0.4, 0, 0.2, 1);
+  transition: background-color 90ms cubic-bezier(0.4, 0, 0.2, 1), -webkit-transform 90ms cubic-bezier(0.4, 0, 0.2, 1);
+  transition: transform 90ms cubic-bezier(0.4, 0, 0.2, 1), background-color 90ms cubic-bezier(0.4, 0, 0.2, 1);
+  transition: transform 90ms cubic-bezier(0.4, 0, 0.2, 1), background-color 90ms cubic-bezier(0.4, 0, 0.2, 1), -webkit-transform 90ms cubic-bezier(0.4, 0, 0.2, 1);
+  /* @alternate */
+  background-color: #3f51b5;
+  background-color: var(--mdc-theme-primary, #3f51b5); }
+  .mdc-switch__native-control:checked ~ .mdc-switch__background .mdc-switch__knob::before {
+    /* @alternate */
+    background-color: #3f51b5;
+    background-color: var(--mdc-theme-primary, #3f51b5);
+    opacity: .15; }
+    .mdc-switch--theme-dark .mdc-switch__native-control:checked ~ .mdc-switch__background .mdc-switch__knob::before,
+    .mdc-theme--dark .mdc-switch__native-control:checked ~ .mdc-switch__background .mdc-switch__knob::before {
+      /* @alternate */
+      background-color: #3f51b5;
+      background-color: var(--mdc-theme-primary, #3f51b5); }
+
+.mdc-switch__native-control:disabled {
+  cursor: initial; }
+
+.mdc-switch__native-control:disabled ~ .mdc-switch__background::before {
+  background-color: #000;
+  opacity: .12; }
+  .mdc-switch--theme-dark .mdc-switch__native-control:disabled ~ .mdc-switch__background::before,
+  .mdc-theme--dark .mdc-switch__native-control:disabled ~ .mdc-switch__background::before {
+    background-color: #fff;
+    opacity: .1; }
+
+.mdc-switch__native-control:disabled ~ .mdc-switch__background .mdc-switch__knob {
+  background-color: #bdbdbd; }
+  .mdc-switch--theme-dark .mdc-switch__native-control:disabled ~ .mdc-switch__background .mdc-switch__knob,
+  .mdc-theme--dark .mdc-switch__native-control:disabled ~ .mdc-switch__background .mdc-switch__knob {
+    background-color: #424242; }
+
+/* TODO(sgomes): Figure out what to do about desktop font sizes. */
+/* TODO(sgomes): Figure out what to do about i18n and i18n font sizes. */
+/*
+  Precomputed linear color channel values, for use in contrast calculations.
+  See https://www.w3.org/TR/WCAG20-TECHS/G17.html#G17-tests
+
+  Algorithm, for c in 0 to 255:
+  f(c) {
+    c = c / 255;
+    return c < 0.03928 ? c / 12.92 : Math.pow((c + 0.055) / 1.055, 2.4);
+  }
+
+  This lookup table is needed since there is no `pow` in SASS.
+*/
+/**
+ * Calculate the luminance for a color.
+ * See https://www.w3.org/TR/WCAG20-TECHS/G17.html#G17-tests
+ */
+/**
+ * Calculate the contrast ratio between two colors.
+ * See https://www.w3.org/TR/WCAG20-TECHS/G17.html#G17-tests
+ */
+/**
+ * Determine whether to use dark or light text on top of given color.
+ * Returns "dark" for dark text and "light" for light text.
+ */
+/*
+  Main theme colors.
+  If you're a user customizing your color scheme in SASS, these are probably the only variables you need to change.
+*/
+/* Indigo 500 */
+/* Pink A200 */
+/* White */
+/* Which set of text colors to use for each main theme color (light or dark) */
+/* Text colors according to light vs dark and text type */
+/* Primary text colors for each of the theme colors */
+/**
+ * Applies the correct theme color style to the specified property.
+ * $property is typically color or background-color, but can be any CSS property that accepts color values.
+ * $style should be one of the map keys in $mdc-theme-property-values (_variables.scss).
+ */
+/**
+ * Creates a rule to be used in MDC-Web components for dark theming, and applies the provided contents.
+ * Should provide the $root-selector option if applied to anything other than the root selector.
+ * When used with a modifier class, provide a second argument of `true` for the $compound parameter
+ * to specify that this should be attached as a compound class.
+ *
+ * Usage example:
+ *
+ * ```scss
+ * .mdc-foo {
+ *   color: black;
+ *
+ *   @include mdc-theme-dark {
+ *     color: white;
+ *   }
+ *
+ *   &__bar {
+ *     background: black;
+ *
+ *     @include mdc-theme-dark(".mdc-foo") {
+ *       background: white;
+ *     }
+ *   }
+ * }
+ *
+ * .mdc-foo--disabled {
+ *   opacity: .38;
+ *
+ *   @include mdc-theme-dark(".mdc-foo", true) {
+ *     opacity: .5;
+ *   }
+ * }
+ * ```
+ */
+/*
+  Precomputed linear color channel values, for use in contrast calculations.
+  See https://www.w3.org/TR/WCAG20-TECHS/G17.html#G17-tests
+
+  Algorithm, for c in 0 to 255:
+  f(c) {
+    c = c / 255;
+    return c < 0.03928 ? c / 12.92 : Math.pow((c + 0.055) / 1.055, 2.4);
+  }
+
+  This lookup table is needed since there is no `pow` in SASS.
+*/
+/**
+ * Calculate the luminance for a color.
+ * See https://www.w3.org/TR/WCAG20-TECHS/G17.html#G17-tests
+ */
+/**
+ * Calculate the contrast ratio between two colors.
+ * See https://www.w3.org/TR/WCAG20-TECHS/G17.html#G17-tests
+ */
+/**
+ * Determine whether to use dark or light text on top of given color.
+ * Returns "dark" for dark text and "light" for light text.
+ */
+/*
+  Main theme colors.
+  If you're a user customizing your color scheme in SASS, these are probably the only variables you need to change.
+*/
+/* Indigo 500 */
+/* Pink A200 */
+/* White */
+/* Which set of text colors to use for each main theme color (light or dark) */
+/* Text colors according to light vs dark and text type */
+/* Primary text colors for each of the theme colors */
+/** MDC Ripple keyframes are split into their own file so that _mixins.scss can rely on them. */
+@keyframes mdc-ripple-fg-radius-in {
+  from {
+    -webkit-transform: translate(var(--mdc-ripple-fg-translate-start, 0)) scale(1);
+            transform: translate(var(--mdc-ripple-fg-translate-start, 0)) scale(1);
+    -webkit-animation-timing-function: cubic-bezier(0.4, 0, 0.2, 1);
+            animation-timing-function: cubic-bezier(0.4, 0, 0.2, 1); }
+  to {
+    -webkit-transform: translate(var(--mdc-ripple-fg-translate-end, 0)) scale(var(--mdc-ripple-fg-scale, 1));
+            transform: translate(var(--mdc-ripple-fg-translate-end, 0)) scale(var(--mdc-ripple-fg-scale, 1)); } }
+
+@keyframes mdc-ripple-fg-opacity-in {
+  from {
+    opacity: 0;
+    -webkit-animation-timing-function: linear;
+            animation-timing-function: linear; }
+  to {
+    opacity: 1; } }
+
+@keyframes mdc-ripple-fg-opacity-out {
+  from {
+    opacity: 1;
+    -webkit-animation-timing-function: linear;
+            animation-timing-function: linear; }
+  to {
+    opacity: 0; } }
+
+/**
+ * Creates a rule that will be applied when an MDC-Web component is within the context of an RTL layout.
+ *
+ * Usage Example:
+ * ```scss
+ * .mdc-foo {
+ *   position: absolute;
+ *   left: 0;
+ *
+ *   @include mdc-rtl {
+ *     left: auto;
+ *     right: 0;
+ *   }
+ *
+ *   &__bar {
+ *     margin-left: 4px;
+ *     @include mdc-rtl(".mdc-foo") {
+ *       margin-left: auto;
+ *       margin-right: 4px;
+ *     }
+ *   }
+ * }
+ *
+ * .mdc-foo--mod {
+ *   padding-left: 4px;
+ *
+ *   @include mdc-rtl {
+ *     padding-left: auto;
+ *     padding-right: 4px;
+ *   }
+ * }
+ * ```
+ *
+ * Note that this works by checking for [dir="rtl"] on an ancestor element. While this will work
+ * in most cases, it will in some cases lead to false negatives, e.g.
+ *
+ * ```html
+ * <html dir="rtl">
+ *   <!-- ... -->
+ *   <div dir="ltr">
+ *     <div class="mdc-foo">Styled incorrectly as RTL!</div>
+ *   </div>
+ * </html>
+ * ```
+ *
+ * In the future, selectors such as :dir (http://mdn.io/:dir) will help us mitigate this.
+ */
+/**
+ * Takes a base box-model property - e.g. margin / border / padding - along with a default
+ * direction and value, and emits rules which apply the value to the
+ * "<base-property>-<default-direction>" property by default, but flips the direction
+ * when within an RTL context.
+ *
+ * For example:
+ *
+ * ```scss
+ * .mdc-foo {
+ *   @include mdc-rtl-reflexive-box(margin, left, 8px);
+ * }
+ * ```
+ * is equivalent to:
+ *
+ * ```scss
+ * .mdc-foo {
+ *   margin-left: 8px;
+ *
+ *   @include mdc-rtl {
+ *     margin-right: 8px;
+ *     margin-left: 0;
+ *   }
+ * }
+ * ```
+ * whereas:
+ *
+ * ```scss
+ * .mdc-foo {
+ *   @include mdc-rtl-reflexive-box(margin, right, 8px);
+ * }
+ * ```
+ * is equivalent to:
+ *
+ * ```scss
+ * .mdc-foo {
+ *   margin-right: 8px;
+ *
+ *   @include mdc-rtl {
+ *     margin-right: 0;
+ *     margin-left: 8px;
+ *   }
+ * }
+ * ```
+ *
+ * You can also pass a 4th optional $root-selector argument which will be forwarded to `mdc-rtl`,
+ * e.g. `@include mdc-rtl-reflexive-box(margin, left, 8px, ".mdc-component")`.
+ *
+ * Note that this function will always zero out the original value in an RTL context. If you're
+ * trying to flip the values, use mdc-rtl-reflexive-property().
+ */
+/**
+ * Takes a base property and emits rules that assign <base-property>-left to <left-value> and
+ * <base-property>-right to <right-value> in a LTR context, and vice versa in a RTL context.
+ * For example:
+ *
+ * ```scss
+ * .mdc-foo {
+ *   @include mdc-rtl-reflexive-property(margin, auto, 12px);
+ * }
+ * ```
+ * is equivalent to:
+ *
+ * ```scss
+ * .mdc-foo {
+ *   margin-left: auto;
+ *   margin-right: 12px;
+ *
+ *   @include mdc-rtl {
+ *     margin-left: 12px;
+ *     margin-right: auto;
+ *   }
+ * }
+ * ```
+ *
+ * A 4th optional $root-selector argument can be given, which will be passed to `mdc-rtl`.
+ */
+/**
+ * Takes an argument specifying a horizontal position property (either "left" or "right") as well
+ * as a value, and applies that value to the specified position in a LTR context, and flips it in a
+ * RTL context. For example:
+ *
+ * ```scss
+ * .mdc-foo {
+ *   @include mdc-rtl-reflexive-position(left, 0);
+ *   position: absolute;
+ * }
+ * ```
+ * is equivalent to:
+ *
+ * ```scss
+ *  .mdc-foo {
+ *    position: absolute;
+ *    left: 0;
+ *    right: initial;
+ *
+ *    @include mdc-rtl {
+ *      right: 0;
+ *      left: initial;
+ *    }
+ *  }
+ * ```
+ * An optional third $root-selector argument may also be given, which is passed to `mdc-rtl`.
+ */
+.mdc-tab {
+  font-family: Roboto, sans-serif;
+  -moz-osx-font-smoothing: grayscale;
+  -webkit-font-smoothing: antialiased;
+  font-size: 0.875rem;
+  font-weight: 500;
+  letter-spacing: 0.04em;
+  line-height: 1.5rem;
+  text-decoration: inherit;
+  text-transform: inherit;
+  display: table-cell;
+  position: relative;
+  -webkit-box-sizing: border-box;
+          box-sizing: border-box;
+  min-width: 160px;
+  min-height: 48px;
+  padding: 0 24px;
+  text-align: center;
+  text-decoration: none;
+  white-space: nowrap;
+  cursor: pointer;
+  overflow: hidden;
+  vertical-align: middle;
+  /* @alternate */
+  color: rgba(0, 0, 0, 0.54);
+  color: var(--mdc-theme-text-secondary-on-light, rgba(0, 0, 0, 0.54)); }
+  .mdc-tab:hover {
+    /* @alternate */
+    color: rgba(0, 0, 0, 0.87);
+    color: var(--mdc-theme-text-primary-on-light, rgba(0, 0, 0, 0.87)); }
+  .mdc-tab:focus {
+    /* @alternate */
+    outline-color: rgba(0, 0, 0, 0.54);
+    outline-color: var(--mdc-theme-text-secondary-on-light, rgba(0, 0, 0, 0.54)); }
+  .mdc-tab-bar--theme-dark .mdc-tab,
+  .mdc-theme--dark .mdc-tab {
+    /* @alternate */
+    color: rgba(255, 255, 255, 0.7);
+    color: var(--mdc-theme-text-secondary-on-dark, rgba(255, 255, 255, 0.7)); }
+    .mdc-tab-bar--theme-dark .mdc-tab:hover,
+    .mdc-theme--dark .mdc-tab:hover {
+      /* @alternate */
+      color: white;
+      color: var(--mdc-theme-text-primary-on-dark, white); }
+    .mdc-tab-bar--theme-dark .mdc-tab:focus,
+    .mdc-theme--dark .mdc-tab:focus {
+      /* @alternate */
+      outline-color: rgba(255, 255, 255, 0.7);
+      outline-color: var(--mdc-theme-text-secondary-on-dark, rgba(255, 255, 255, 0.7)); }
+  @media screen and (max-width: 600px) {
+    .mdc-tab {
+      min-width: 72px;
+      padding: 0 12px; } }
+  .mdc-tab__icon {
+    display: block;
+    margin: 0 auto;
+    width: 24px;
+    height: 24px; }
+    .mdc-tab-bar--icons-with-text .mdc-tab__icon {
+      margin-top: 4px; }
+  .mdc-tab__icon-text {
+    display: block;
+    margin: 0 auto; }
+  .mdc-tab__icon + .mdc-tab__icon-text {
+    padding-top: 6px; }
+
+.mdc-tab--active {
+  /* @alternate */
+  color: rgba(0, 0, 0, 0.87);
+  color: var(--mdc-theme-text-primary-on-light, rgba(0, 0, 0, 0.87)); }
+  .mdc-tab-bar--theme-dark .mdc-tab--active,
+  .mdc-theme--dark .mdc-tab--active {
+    /* @alternate */
+    color: white;
+    color: var(--mdc-theme-text-primary-on-dark, white); }
+  .mdc-tab--active::before {
+    bottom: 0; }
+
+.mdc-tab-bar:not(.mdc-tab-bar-upgraded) .mdc-tab {
+  position: relative; }
+  .mdc-tab-bar:not(.mdc-tab-bar-upgraded) .mdc-tab::after {
+    display: none;
+    position: absolute;
+    top: 46px;
+    left: 0;
+    width: calc(100% - 4px);
+    height: 2px;
+    content: "";
+    pointer-events: none;
+    /* @alternate */
+    background-color: rgba(0, 0, 0, 0.87);
+    background-color: var(--mdc-theme-text-primary-on-light, rgba(0, 0, 0, 0.87)); }
+    .mdc-tab-bar--theme-dark.mdc-tab-bar:not(.mdc-tab-bar-upgraded) .mdc-tab::after,
+    .mdc-theme--dark .mdc-tab-bar:not(.mdc-tab-bar-upgraded) .mdc-tab::after {
+      /* @alternate */
+      background-color: white;
+      background-color: var(--mdc-theme-text-primary-on-dark, white); }
+    .mdc-toolbar .mdc-tab-bar:not(.mdc-tab-bar-upgraded) .mdc-tab::after {
+      /* @alternate */
+      background-color: white;
+      background-color: var(--mdc-theme-text-primary-on-primary, white); }
+  .mdc-tab-bar:not(.mdc-tab-bar-upgraded) .mdc-tab--active::after, .mdc-tab-bar:not(.mdc-tab-bar-upgraded) .mdc-tab:active::after, .mdc-tab-bar:not(.mdc-tab-bar-upgraded) .mdc-tab:hover::after {
+    display: block; }
+  .mdc-tab-bar:not(.mdc-tab-bar-upgraded) .mdc-tab:not(.mdc-tab--active):hover::after {
+    opacity: .38; }
+  .mdc-tab-bar:not(.mdc-tab-bar-upgraded) .mdc-tab--active, .mdc-tab-bar:not(.mdc-tab-bar-upgraded) .mdc-tab:not(.mdc-tab--active):active::after {
+    opacity: .87; }
+
+.mdc-tab-bar--icons-with-text:not(.mdc-tab-bar-upgraded) .mdc-tab::after {
+  top: 70px; }
+
+.mdc-tab.mdc-ripple-upgraded {
+  --mdc-ripple-surface-width: 0;
+  --mdc-ripple-surface-height: 0;
+  --mdc-ripple-fg-size: 0;
+  --mdc-ripple-left: 0;
+  --mdc-ripple-top: 0;
+  --mdc-ripple-fg-scale: 1;
+  --mdc-ripple-fg-translate-end: 0;
+  --mdc-ripple-fg-translate-start: 0;
+  will-change: transform, opacity;
+  -webkit-tap-highlight-color: transparent; }
+  .mdc-tab.mdc-ripple-upgraded:not(.mdc-ripple-upgraded):hover::before, .mdc-tab.mdc-ripple-upgraded:not(.mdc-ripple-upgraded):focus::before, .mdc-tab.mdc-ripple-upgraded:not(.mdc-ripple-upgraded):active::after {
+    -webkit-transition-duration: 85ms;
+            transition-duration: 85ms;
+    opacity: .6; }
+  .mdc-tab.mdc-ripple-upgraded::after {
+    background-color: rgba(0, 0, 0, 0.06);
+    position: absolute;
+    top: calc(50% - 100%);
+    left: calc(50% - 100%);
+    width: 200%;
+    height: 200%;
+    -webkit-transition: opacity 250ms linear;
+    transition: opacity 250ms linear;
+    border-radius: 50%;
+    opacity: 0;
+    pointer-events: none;
+    content: ""; }
+  .mdc-tab.mdc-ripple-upgraded.mdc-ripple-upgraded::after {
+    top: 0;
+    left: 0;
+    /* @alternate */
+    width: 100%;
+    width: var(--mdc-ripple-fg-size, 100%);
+    /* @alternate */
+    height: 100%;
+    height: var(--mdc-ripple-fg-size, 100%);
+    -webkit-transform: scale(0);
+            transform: scale(0);
+    -webkit-transform-origin: center center;
+            transform-origin: center center;
+    opacity: 0; }
+  .mdc-tab.mdc-ripple-upgraded:not(.mdc-ripple-upgraded--unbounded)::after {
+    -webkit-transform-origin: center center;
+            transform-origin: center center; }
+  .mdc-tab.mdc-ripple-upgraded.mdc-ripple-upgraded--unbounded::after {
+    /* @alternate */
+    top: 0;
+    top: var(--mdc-ripple-top, 0);
+    /* @alternate */
+    left: 0;
+    left: var(--mdc-ripple-left, 0);
+    /* @alternate */
+    width: 100%;
+    width: var(--mdc-ripple-fg-size, 100%);
+    /* @alternate */
+    height: 100%;
+    height: var(--mdc-ripple-fg-size, 100%);
+    -webkit-transform: scale(0);
+            transform: scale(0);
+    -webkit-transform-origin: center center;
+            transform-origin: center center; }
+  .mdc-tab.mdc-ripple-upgraded.mdc-ripple-upgraded--foreground-activation::after {
+    -webkit-animation: 300ms mdc-ripple-fg-radius-in forwards, 83ms mdc-ripple-fg-opacity-in forwards;
+            animation: 300ms mdc-ripple-fg-radius-in forwards, 83ms mdc-ripple-fg-opacity-in forwards; }
+  .mdc-tab.mdc-ripple-upgraded.mdc-ripple-upgraded--foreground-deactivation::after {
+    -webkit-transform: translate(var(--mdc-ripple-fg-translate-end, 0)) scale(var(--mdc-ripple-fg-scale, 1));
+            transform: translate(var(--mdc-ripple-fg-translate-end, 0)) scale(var(--mdc-ripple-fg-scale, 1));
+    -webkit-animation: 83ms mdc-ripple-fg-opacity-out;
+            animation: 83ms mdc-ripple-fg-opacity-out; }
+  .mdc-tab.mdc-ripple-upgraded::before {
+    background-color: rgba(0, 0, 0, 0.06);
+    position: absolute;
+    top: calc(50% - 100%);
+    left: calc(50% - 100%);
+    width: 200%;
+    height: 200%;
+    -webkit-transition: opacity 250ms linear;
+    transition: opacity 250ms linear;
+    border-radius: 50%;
+    opacity: 0;
+    pointer-events: none;
+    content: ""; }
+  .mdc-tab.mdc-ripple-upgraded.mdc-ripple-upgraded::before {
+    top: calc(50% - 100%);
+    left: calc(50% - 100%);
+    width: 200%;
+    height: 200%;
+    /* @alternate */
+    -webkit-transform: scale(0);
+            transform: scale(0);
+    -webkit-transform: scale(var(--mdc-ripple-fg-scale, 0));
+            transform: scale(var(--mdc-ripple-fg-scale, 0)); }
+  .mdc-tab.mdc-ripple-upgraded.mdc-ripple-upgraded--background-focused::before {
+    opacity: .99999; }
+  .mdc-tab.mdc-ripple-upgraded.mdc-ripple-upgraded--background-active-fill::before {
+    -webkit-transition-duration: 120ms;
+            transition-duration: 120ms;
+    opacity: 1; }
+  .mdc-tab.mdc-ripple-upgraded.mdc-ripple-upgraded--unbounded::before {
+    /* @alternate */
+    top: calc(50% - 50%);
+    top: var(--mdc-ripple-top, calc(50% - 50%));
+    /* @alternate */
+    left: calc(50% - 50%);
+    left: var(--mdc-ripple-left, calc(50% - 50%));
+    /* @alternate */
+    width: 100%;
+    width: var(--mdc-ripple-fg-size, 100%);
+    /* @alternate */
+    height: 100%;
+    height: var(--mdc-ripple-fg-size, 100%);
+    /* @alternate */
+    -webkit-transform: scale(0);
+            transform: scale(0);
+    -webkit-transform: scale(var(--mdc-ripple-fg-scale, 0));
+            transform: scale(var(--mdc-ripple-fg-scale, 0)); }
+  .mdc-tab-bar--theme-dark .mdc-tab.mdc-ripple-upgraded::before,
+  .mdc-theme--dark .mdc-tab.mdc-ripple-upgraded::before {
+    background-color: rgba(255, 255, 255, 0.16);
+    position: absolute;
+    top: calc(50% - 100%);
+    left: calc(50% - 100%);
+    width: 200%;
+    height: 200%;
+    -webkit-transition: opacity 250ms linear;
+    transition: opacity 250ms linear;
+    border-radius: 50%;
+    opacity: 0;
+    pointer-events: none;
+    content: ""; }
+  .mdc-tab-bar--theme-dark .mdc-tab.mdc-ripple-upgraded.mdc-ripple-upgraded::before,
+  .mdc-theme--dark .mdc-tab.mdc-ripple-upgraded.mdc-ripple-upgraded::before {
+    top: calc(50% - 100%);
+    left: calc(50% - 100%);
+    width: 200%;
+    height: 200%;
+    /* @alternate */
+    -webkit-transform: scale(0);
+            transform: scale(0);
+    -webkit-transform: scale(var(--mdc-ripple-fg-scale, 0));
+            transform: scale(var(--mdc-ripple-fg-scale, 0)); }
+  .mdc-tab-bar--theme-dark .mdc-tab.mdc-ripple-upgraded.mdc-ripple-upgraded--background-focused::before,
+  .mdc-theme--dark .mdc-tab.mdc-ripple-upgraded.mdc-ripple-upgraded--background-focused::before {
+    opacity: .99999; }
+  .mdc-tab-bar--theme-dark .mdc-tab.mdc-ripple-upgraded.mdc-ripple-upgraded--background-active-fill::before,
+  .mdc-theme--dark .mdc-tab.mdc-ripple-upgraded.mdc-ripple-upgraded--background-active-fill::before {
+    -webkit-transition-duration: 120ms;
+            transition-duration: 120ms;
+    opacity: 1; }
+  .mdc-tab-bar--theme-dark .mdc-tab.mdc-ripple-upgraded.mdc-ripple-upgraded--unbounded::before,
+  .mdc-theme--dark .mdc-tab.mdc-ripple-upgraded.mdc-ripple-upgraded--unbounded::before {
+    /* @alternate */
+    top: calc(50% - 50%);
+    top: var(--mdc-ripple-top, calc(50% - 50%));
+    /* @alternate */
+    left: calc(50% - 50%);
+    left: var(--mdc-ripple-left, calc(50% - 50%));
+    /* @alternate */
+    width: 100%;
+    width: var(--mdc-ripple-fg-size, 100%);
+    /* @alternate */
+    height: 100%;
+    height: var(--mdc-ripple-fg-size, 100%);
+    /* @alternate */
+    -webkit-transform: scale(0);
+            transform: scale(0);
+    -webkit-transform: scale(var(--mdc-ripple-fg-scale, 0));
+            transform: scale(var(--mdc-ripple-fg-scale, 0)); }
+  .mdc-tab-bar--theme-dark .mdc-tab.mdc-ripple-upgraded::after,
+  .mdc-theme--dark .mdc-tab.mdc-ripple-upgraded::after {
+    background-color: rgba(255, 255, 255, 0.16);
+    position: absolute;
+    top: calc(50% - 100%);
+    left: calc(50% - 100%);
+    width: 200%;
+    height: 200%;
+    -webkit-transition: opacity 250ms linear;
+    transition: opacity 250ms linear;
+    border-radius: 50%;
+    opacity: 0;
+    pointer-events: none;
+    content: ""; }
+  .mdc-tab-bar--theme-dark .mdc-tab.mdc-ripple-upgraded.mdc-ripple-upgraded::after,
+  .mdc-theme--dark .mdc-tab.mdc-ripple-upgraded.mdc-ripple-upgraded::after {
+    top: 0;
+    left: 0;
+    /* @alternate */
+    width: 100%;
+    width: var(--mdc-ripple-fg-size, 100%);
+    /* @alternate */
+    height: 100%;
+    height: var(--mdc-ripple-fg-size, 100%);
+    -webkit-transform: scale(0);
+            transform: scale(0);
+    -webkit-transform-origin: center center;
+            transform-origin: center center;
+    opacity: 0; }
+  .mdc-tab-bar--theme-dark .mdc-tab.mdc-ripple-upgraded:not(.mdc-ripple-upgraded--unbounded)::after,
+  .mdc-theme--dark .mdc-tab.mdc-ripple-upgraded:not(.mdc-ripple-upgraded--unbounded)::after {
+    -webkit-transform-origin: center center;
+            transform-origin: center center; }
+  .mdc-tab-bar--theme-dark .mdc-tab.mdc-ripple-upgraded.mdc-ripple-upgraded--unbounded::after,
+  .mdc-theme--dark .mdc-tab.mdc-ripple-upgraded.mdc-ripple-upgraded--unbounded::after {
+    /* @alternate */
+    top: 0;
+    top: var(--mdc-ripple-top, 0);
+    /* @alternate */
+    left: 0;
+    left: var(--mdc-ripple-left, 0);
+    /* @alternate */
+    width: 100%;
+    width: var(--mdc-ripple-fg-size, 100%);
+    /* @alternate */
+    height: 100%;
+    height: var(--mdc-ripple-fg-size, 100%);
+    -webkit-transform: scale(0);
+            transform: scale(0);
+    -webkit-transform-origin: center center;
+            transform-origin: center center; }
+  .mdc-tab-bar--theme-dark .mdc-tab.mdc-ripple-upgraded.mdc-ripple-upgraded--foreground-activation::after,
+  .mdc-theme--dark .mdc-tab.mdc-ripple-upgraded.mdc-ripple-upgraded--foreground-activation::after {
+    -webkit-animation: 300ms mdc-ripple-fg-radius-in forwards, 83ms mdc-ripple-fg-opacity-in forwards;
+            animation: 300ms mdc-ripple-fg-radius-in forwards, 83ms mdc-ripple-fg-opacity-in forwards; }
+  .mdc-tab-bar--theme-dark .mdc-tab.mdc-ripple-upgraded.mdc-ripple-upgraded--foreground-deactivation::after,
+  .mdc-theme--dark .mdc-tab.mdc-ripple-upgraded.mdc-ripple-upgraded--foreground-deactivation::after {
+    -webkit-transform: translate(var(--mdc-ripple-fg-translate-end, 0)) scale(var(--mdc-ripple-fg-scale, 1));
+            transform: translate(var(--mdc-ripple-fg-translate-end, 0)) scale(var(--mdc-ripple-fg-scale, 1));
+    -webkit-animation: 83ms mdc-ripple-fg-opacity-out;
+            animation: 83ms mdc-ripple-fg-opacity-out; }
+  .mdc-toolbar .mdc-tab.mdc-ripple-upgraded::before {
+    background-color: rgba(255, 255, 255, 0.16);
+    position: absolute;
+    top: calc(50% - 100%);
+    left: calc(50% - 100%);
+    width: 200%;
+    height: 200%;
+    -webkit-transition: opacity 250ms linear;
+    transition: opacity 250ms linear;
+    border-radius: 50%;
+    opacity: 0;
+    pointer-events: none;
+    content: ""; }
+  .mdc-toolbar .mdc-tab.mdc-ripple-upgraded.mdc-ripple-upgraded::before {
+    top: calc(50% - 100%);
+    left: calc(50% - 100%);
+    width: 200%;
+    height: 200%;
+    /* @alternate */
+    -webkit-transform: scale(0);
+            transform: scale(0);
+    -webkit-transform: scale(var(--mdc-ripple-fg-scale, 0));
+            transform: scale(var(--mdc-ripple-fg-scale, 0)); }
+  .mdc-toolbar .mdc-tab.mdc-ripple-upgraded.mdc-ripple-upgraded--background-focused::before {
+    opacity: .99999; }
+  .mdc-toolbar .mdc-tab.mdc-ripple-upgraded.mdc-ripple-upgraded--background-active-fill::before {
+    -webkit-transition-duration: 120ms;
+            transition-duration: 120ms;
+    opacity: 1; }
+  .mdc-toolbar .mdc-tab.mdc-ripple-upgraded.mdc-ripple-upgraded--unbounded::before {
+    /* @alternate */
+    top: calc(50% - 50%);
+    top: var(--mdc-ripple-top, calc(50% - 50%));
+    /* @alternate */
+    left: calc(50% - 50%);
+    left: var(--mdc-ripple-left, calc(50% - 50%));
+    /* @alternate */
+    width: 100%;
+    width: var(--mdc-ripple-fg-size, 100%);
+    /* @alternate */
+    height: 100%;
+    height: var(--mdc-ripple-fg-size, 100%);
+    /* @alternate */
+    -webkit-transform: scale(0);
+            transform: scale(0);
+    -webkit-transform: scale(var(--mdc-ripple-fg-scale, 0));
+            transform: scale(var(--mdc-ripple-fg-scale, 0)); }
+  .mdc-toolbar .mdc-tab.mdc-ripple-upgraded::after {
+    background-color: rgba(255, 255, 255, 0.16);
+    position: absolute;
+    top: calc(50% - 100%);
+    left: calc(50% - 100%);
+    width: 200%;
+    height: 200%;
+    -webkit-transition: opacity 250ms linear;
+    transition: opacity 250ms linear;
+    border-radius: 50%;
+    opacity: 0;
+    pointer-events: none;
+    content: ""; }
+  .mdc-toolbar .mdc-tab.mdc-ripple-upgraded.mdc-ripple-upgraded::after {
+    top: 0;
+    left: 0;
+    /* @alternate */
+    width: 100%;
+    width: var(--mdc-ripple-fg-size, 100%);
+    /* @alternate */
+    height: 100%;
+    height: var(--mdc-ripple-fg-size, 100%);
+    -webkit-transform: scale(0);
+            transform: scale(0);
+    -webkit-transform-origin: center center;
+            transform-origin: center center;
+    opacity: 0; }
+  .mdc-toolbar .mdc-tab.mdc-ripple-upgraded:not(.mdc-ripple-upgraded--unbounded)::after {
+    -webkit-transform-origin: center center;
+            transform-origin: center center; }
+  .mdc-toolbar .mdc-tab.mdc-ripple-upgraded.mdc-ripple-upgraded--unbounded::after {
+    /* @alternate */
+    top: 0;
+    top: var(--mdc-ripple-top, 0);
+    /* @alternate */
+    left: 0;
+    left: var(--mdc-ripple-left, 0);
+    /* @alternate */
+    width: 100%;
+    width: var(--mdc-ripple-fg-size, 100%);
+    /* @alternate */
+    height: 100%;
+    height: var(--mdc-ripple-fg-size, 100%);
+    -webkit-transform: scale(0);
+            transform: scale(0);
+    -webkit-transform-origin: center center;
+            transform-origin: center center; }
+  .mdc-toolbar .mdc-tab.mdc-ripple-upgraded.mdc-ripple-upgraded--foreground-activation::after {
+    -webkit-animation: 300ms mdc-ripple-fg-radius-in forwards, 83ms mdc-ripple-fg-opacity-in forwards;
+            animation: 300ms mdc-ripple-fg-radius-in forwards, 83ms mdc-ripple-fg-opacity-in forwards; }
+  .mdc-toolbar .mdc-tab.mdc-ripple-upgraded.mdc-ripple-upgraded--foreground-deactivation::after {
+    -webkit-transform: translate(var(--mdc-ripple-fg-translate-end, 0)) scale(var(--mdc-ripple-fg-scale, 1));
+            transform: translate(var(--mdc-ripple-fg-translate-end, 0)) scale(var(--mdc-ripple-fg-scale, 1));
+    -webkit-animation: 83ms mdc-ripple-fg-opacity-out;
+            animation: 83ms mdc-ripple-fg-opacity-out; }
+  .mdc-tab.mdc-ripple-upgraded:focus {
+    outline: none; }
+
+/*
+  Precomputed linear color channel values, for use in contrast calculations.
+  See https://www.w3.org/TR/WCAG20-TECHS/G17.html#G17-tests
+
+  Algorithm, for c in 0 to 255:
+  f(c) {
+    c = c / 255;
+    return c < 0.03928 ? c / 12.92 : Math.pow((c + 0.055) / 1.055, 2.4);
+  }
+
+  This lookup table is needed since there is no `pow` in SASS.
+*/
+/**
+ * Calculate the luminance for a color.
+ * See https://www.w3.org/TR/WCAG20-TECHS/G17.html#G17-tests
+ */
+/**
+ * Calculate the contrast ratio between two colors.
+ * See https://www.w3.org/TR/WCAG20-TECHS/G17.html#G17-tests
+ */
+/**
+ * Determine whether to use dark or light text on top of given color.
+ * Returns "dark" for dark text and "light" for light text.
+ */
+/*
+  Main theme colors.
+  If you're a user customizing your color scheme in SASS, these are probably the only variables you need to change.
+*/
+/* Indigo 500 */
+/* Pink A200 */
+/* White */
+/* Which set of text colors to use for each main theme color (light or dark) */
+/* Text colors according to light vs dark and text type */
+/* Primary text colors for each of the theme colors */
+/**
+ * Applies the correct theme color style to the specified property.
+ * $property is typically color or background-color, but can be any CSS property that accepts color values.
+ * $style should be one of the map keys in $mdc-theme-property-values (_variables.scss).
+ */
+/**
+ * Creates a rule to be used in MDC-Web components for dark theming, and applies the provided contents.
+ * Should provide the $root-selector option if applied to anything other than the root selector.
+ * When used with a modifier class, provide a second argument of `true` for the $compound parameter
+ * to specify that this should be attached as a compound class.
+ *
+ * Usage example:
+ *
+ * ```scss
+ * .mdc-foo {
+ *   color: black;
+ *
+ *   @include mdc-theme-dark {
+ *     color: white;
+ *   }
+ *
+ *   &__bar {
+ *     background: black;
+ *
+ *     @include mdc-theme-dark(".mdc-foo") {
+ *       background: white;
+ *     }
+ *   }
+ * }
+ *
+ * .mdc-foo--disabled {
+ *   opacity: .38;
+ *
+ *   @include mdc-theme-dark(".mdc-foo", true) {
+ *     opacity: .5;
+ *   }
+ * }
+ * ```
+ */
+/**
+ * Creates a rule that will be applied when an MDC-Web component is within the context of an RTL layout.
+ *
+ * Usage Example:
+ * ```scss
+ * .mdc-foo {
+ *   position: absolute;
+ *   left: 0;
+ *
+ *   @include mdc-rtl {
+ *     left: auto;
+ *     right: 0;
+ *   }
+ *
+ *   &__bar {
+ *     margin-left: 4px;
+ *     @include mdc-rtl(".mdc-foo") {
+ *       margin-left: auto;
+ *       margin-right: 4px;
+ *     }
+ *   }
+ * }
+ *
+ * .mdc-foo--mod {
+ *   padding-left: 4px;
+ *
+ *   @include mdc-rtl {
+ *     padding-left: auto;
+ *     padding-right: 4px;
+ *   }
+ * }
+ * ```
+ *
+ * Note that this works by checking for [dir="rtl"] on an ancestor element. While this will work
+ * in most cases, it will in some cases lead to false negatives, e.g.
+ *
+ * ```html
+ * <html dir="rtl">
+ *   <!-- ... -->
+ *   <div dir="ltr">
+ *     <div class="mdc-foo">Styled incorrectly as RTL!</div>
+ *   </div>
+ * </html>
+ * ```
+ *
+ * In the future, selectors such as :dir (http://mdn.io/:dir) will help us mitigate this.
+ */
+/**
+ * Takes a base box-model property - e.g. margin / border / padding - along with a default
+ * direction and value, and emits rules which apply the value to the
+ * "<base-property>-<default-direction>" property by default, but flips the direction
+ * when within an RTL context.
+ *
+ * For example:
+ *
+ * ```scss
+ * .mdc-foo {
+ *   @include mdc-rtl-reflexive-box(margin, left, 8px);
+ * }
+ * ```
+ * is equivalent to:
+ *
+ * ```scss
+ * .mdc-foo {
+ *   margin-left: 8px;
+ *
+ *   @include mdc-rtl {
+ *     margin-right: 8px;
+ *     margin-left: 0;
+ *   }
+ * }
+ * ```
+ * whereas:
+ *
+ * ```scss
+ * .mdc-foo {
+ *   @include mdc-rtl-reflexive-box(margin, right, 8px);
+ * }
+ * ```
+ * is equivalent to:
+ *
+ * ```scss
+ * .mdc-foo {
+ *   margin-right: 8px;
+ *
+ *   @include mdc-rtl {
+ *     margin-right: 0;
+ *     margin-left: 8px;
+ *   }
+ * }
+ * ```
+ *
+ * You can also pass a 4th optional $root-selector argument which will be forwarded to `mdc-rtl`,
+ * e.g. `@include mdc-rtl-reflexive-box(margin, left, 8px, ".mdc-component")`.
+ *
+ * Note that this function will always zero out the original value in an RTL context. If you're
+ * trying to flip the values, use mdc-rtl-reflexive-property().
+ */
+/**
+ * Takes a base property and emits rules that assign <base-property>-left to <left-value> and
+ * <base-property>-right to <right-value> in a LTR context, and vice versa in a RTL context.
+ * For example:
+ *
+ * ```scss
+ * .mdc-foo {
+ *   @include mdc-rtl-reflexive-property(margin, auto, 12px);
+ * }
+ * ```
+ * is equivalent to:
+ *
+ * ```scss
+ * .mdc-foo {
+ *   margin-left: auto;
+ *   margin-right: 12px;
+ *
+ *   @include mdc-rtl {
+ *     margin-left: 12px;
+ *     margin-right: auto;
+ *   }
+ * }
+ * ```
+ *
+ * A 4th optional $root-selector argument can be given, which will be passed to `mdc-rtl`.
+ */
+/**
+ * Takes an argument specifying a horizontal position property (either "left" or "right") as well
+ * as a value, and applies that value to the specified position in a LTR context, and flips it in a
+ * RTL context. For example:
+ *
+ * ```scss
+ * .mdc-foo {
+ *   @include mdc-rtl-reflexive-position(left, 0);
+ *   position: absolute;
+ * }
+ * ```
+ * is equivalent to:
+ *
+ * ```scss
+ *  .mdc-foo {
+ *    position: absolute;
+ *    left: 0;
+ *    right: initial;
+ *
+ *    @include mdc-rtl {
+ *      right: 0;
+ *      left: initial;
+ *    }
+ *  }
+ * ```
+ * An optional third $root-selector argument may also be given, which is passed to `mdc-rtl`.
+ */
+.mdc-tab-bar {
+  display: table;
+  position: relative;
+  height: 48px;
+  margin: 0 auto;
+  text-transform: uppercase; }
+  .mdc-tab-bar__indicator {
+    position: absolute;
+    bottom: 0;
+    left: 0;
+    width: 100%;
+    height: 2px;
+    /* @alternate */
+    background-color: rgba(0, 0, 0, 0.87);
+    background-color: var(--mdc-theme-text-primary-on-light, rgba(0, 0, 0, 0.87));
+    -webkit-transform-origin: left top;
+            transform-origin: left top;
+    -webkit-transition: -webkit-transform 240ms 0ms cubic-bezier(0, 0, 0.2, 1);
+    transition: -webkit-transform 240ms 0ms cubic-bezier(0, 0, 0.2, 1);
+    transition: transform 240ms 0ms cubic-bezier(0, 0, 0.2, 1);
+    transition: transform 240ms 0ms cubic-bezier(0, 0, 0.2, 1), -webkit-transform 240ms 0ms cubic-bezier(0, 0, 0.2, 1);
+    will-change: transform;
+    visibility: hidden; }
+    .mdc-tab-bar--theme-dark .mdc-tab-bar__indicator,
+    .mdc-theme--dark .mdc-tab-bar__indicator {
+      /* @alternate */
+      background-color: white;
+      background-color: var(--mdc-theme-text-primary-on-dark, white); }
+  .mdc-toolbar .mdc-tab-bar .mdc-tab {
+    /* @alternate */
+    color: rgba(255, 255, 255, 0.7);
+    color: var(--mdc-theme-text-secondary-on-primary, rgba(255, 255, 255, 0.7)); }
+    .mdc-tab-bar--theme-dark .mdc-toolbar .mdc-tab-bar .mdc-tab,
+    .mdc-theme--dark .mdc-toolbar .mdc-tab-bar .mdc-tab {
+      /* @alternate */
+      color: rgba(255, 255, 255, 0.7);
+      color: var(--mdc-theme-text-secondary-on-dark, rgba(255, 255, 255, 0.7)); }
+  .mdc-toolbar .mdc-tab-bar .mdc-tab--active,
+  .mdc-toolbar .mdc-tab-bar .mdc-tab:hover {
+    /* @alternate */
+    color: white;
+    color: var(--mdc-theme-text-primary-on-primary, white); }
+    .mdc-tab-bar--theme-dark .mdc-toolbar .mdc-tab-bar .mdc-tab--active,
+    .mdc-theme--dark .mdc-toolbar .mdc-tab-bar .mdc-tab--active, .mdc-tab-bar--theme-dark
+    .mdc-toolbar .mdc-tab-bar .mdc-tab:hover,
+    .mdc-theme--dark
+    .mdc-toolbar .mdc-tab-bar .mdc-tab:hover {
+      /* @alternate */
+      color: white;
+      color: var(--mdc-theme-text-primary-on-dark, white); }
+  .mdc-toolbar .mdc-tab-bar .mdc-tab-bar__indicator {
+    /* @alternate */
+    background-color: white;
+    background-color: var(--mdc-theme-text-primary-on-primary, white); }
+    .mdc-tab-bar--theme-dark .mdc-toolbar .mdc-tab-bar .mdc-tab-bar__indicator,
+    .mdc-theme--dark .mdc-toolbar .mdc-tab-bar .mdc-tab-bar__indicator {
+      /* @alternate */
+      background-color: white;
+      background-color: var(--mdc-theme-text-primary-on-dark, white); }
+
+.mdc-tab-bar--icons-with-text {
+  height: 72px; }
+
+.mdc-tab-bar--indicator-primary .mdc-tab-bar__indicator,
+.mdc-toolbar .mdc-tab-bar--indicator-primary .mdc-tab-bar__indicator {
+  /* @alternate */
+  background-color: #3f51b5;
+  background-color: var(--mdc-theme-primary, #3f51b5); }
+  .mdc-tab-bar--theme-dark .mdc-tab-bar--indicator-primary .mdc-tab-bar__indicator,
+  .mdc-theme--dark .mdc-tab-bar--indicator-primary .mdc-tab-bar__indicator, .mdc-tab-bar--theme-dark
+  .mdc-toolbar .mdc-tab-bar--indicator-primary .mdc-tab-bar__indicator,
+  .mdc-theme--dark
+  .mdc-toolbar .mdc-tab-bar--indicator-primary .mdc-tab-bar__indicator {
+    /* @alternate */
+    background-color: #3f51b5;
+    background-color: var(--mdc-theme-primary, #3f51b5); }
+
+.mdc-tab-bar--indicator-primary.mdc-tab-bar:not(.mdc-tab-bar-upgraded) .mdc-tab::after,
+.mdc-toolbar .mdc-tab-bar--indicator-primary.mdc-tab-bar:not(.mdc-tab-bar-upgraded) .mdc-tab::after {
+  /* @alternate */
+  background-color: #3f51b5;
+  background-color: var(--mdc-theme-primary, #3f51b5); }
+
+.mdc-tab-bar--indicator-accent .mdc-tab-bar__indicator,
+.mdc-toolbar .mdc-tab-bar--indicator-accent .mdc-tab-bar__indicator {
+  /* @alternate */
+  background-color: #ff4081;
+  background-color: var(--mdc-theme-accent, #ff4081); }
+  .mdc-tab-bar--theme-dark .mdc-tab-bar--indicator-accent .mdc-tab-bar__indicator,
+  .mdc-theme--dark .mdc-tab-bar--indicator-accent .mdc-tab-bar__indicator, .mdc-tab-bar--theme-dark
+  .mdc-toolbar .mdc-tab-bar--indicator-accent .mdc-tab-bar__indicator,
+  .mdc-theme--dark
+  .mdc-toolbar .mdc-tab-bar--indicator-accent .mdc-tab-bar__indicator {
+    /* @alternate */
+    background-color: #ff4081;
+    background-color: var(--mdc-theme-accent, #ff4081); }
+
+.mdc-tab-bar--indicator-accent.mdc-tab-bar:not(.mdc-tab-bar-upgraded) .mdc-tab::after,
+.mdc-toolbar .mdc-tab-bar--indicator-accent.mdc-tab-bar:not(.mdc-tab-bar-upgraded) .mdc-tab::after {
+  /* @alternate */
+  background-color: #ff4081;
+  background-color: var(--mdc-theme-accent, #ff4081); }
+
+/*
+  Precomputed linear color channel values, for use in contrast calculations.
+  See https://www.w3.org/TR/WCAG20-TECHS/G17.html#G17-tests
+
+  Algorithm, for c in 0 to 255:
+  f(c) {
+    c = c / 255;
+    return c < 0.03928 ? c / 12.92 : Math.pow((c + 0.055) / 1.055, 2.4);
+  }
+
+  This lookup table is needed since there is no `pow` in SASS.
+*/
+/**
+ * Calculate the luminance for a color.
+ * See https://www.w3.org/TR/WCAG20-TECHS/G17.html#G17-tests
+ */
+/**
+ * Calculate the contrast ratio between two colors.
+ * See https://www.w3.org/TR/WCAG20-TECHS/G17.html#G17-tests
+ */
+/**
+ * Determine whether to use dark or light text on top of given color.
+ * Returns "dark" for dark text and "light" for light text.
+ */
+/*
+  Main theme colors.
+  If you're a user customizing your color scheme in SASS, these are probably the only variables you need to change.
+*/
+/* Indigo 500 */
+/* Pink A200 */
+/* White */
+/* Which set of text colors to use for each main theme color (light or dark) */
+/* Text colors according to light vs dark and text type */
+/* Primary text colors for each of the theme colors */
+/**
+ * Applies the correct theme color style to the specified property.
+ * $property is typically color or background-color, but can be any CSS property that accepts color values.
+ * $style should be one of the map keys in $mdc-theme-property-values (_variables.scss).
+ */
+/**
+ * Creates a rule to be used in MDC-Web components for dark theming, and applies the provided contents.
+ * Should provide the $root-selector option if applied to anything other than the root selector.
+ * When used with a modifier class, provide a second argument of `true` for the $compound parameter
+ * to specify that this should be attached as a compound class.
+ *
+ * Usage example:
+ *
+ * ```scss
+ * .mdc-foo {
+ *   color: black;
+ *
+ *   @include mdc-theme-dark {
+ *     color: white;
+ *   }
+ *
+ *   &__bar {
+ *     background: black;
+ *
+ *     @include mdc-theme-dark(".mdc-foo") {
+ *       background: white;
+ *     }
+ *   }
+ * }
+ *
+ * .mdc-foo--disabled {
+ *   opacity: .38;
+ *
+ *   @include mdc-theme-dark(".mdc-foo", true) {
+ *     opacity: .5;
+ *   }
+ * }
+ * ```
+ */
+/**
+ * Creates a rule that will be applied when an MDC-Web component is within the context of an RTL layout.
+ *
+ * Usage Example:
+ * ```scss
+ * .mdc-foo {
+ *   position: absolute;
+ *   left: 0;
+ *
+ *   @include mdc-rtl {
+ *     left: auto;
+ *     right: 0;
+ *   }
+ *
+ *   &__bar {
+ *     margin-left: 4px;
+ *     @include mdc-rtl(".mdc-foo") {
+ *       margin-left: auto;
+ *       margin-right: 4px;
+ *     }
+ *   }
+ * }
+ *
+ * .mdc-foo--mod {
+ *   padding-left: 4px;
+ *
+ *   @include mdc-rtl {
+ *     padding-left: auto;
+ *     padding-right: 4px;
+ *   }
+ * }
+ * ```
+ *
+ * Note that this works by checking for [dir="rtl"] on an ancestor element. While this will work
+ * in most cases, it will in some cases lead to false negatives, e.g.
+ *
+ * ```html
+ * <html dir="rtl">
+ *   <!-- ... -->
+ *   <div dir="ltr">
+ *     <div class="mdc-foo">Styled incorrectly as RTL!</div>
+ *   </div>
+ * </html>
+ * ```
+ *
+ * In the future, selectors such as :dir (http://mdn.io/:dir) will help us mitigate this.
+ */
+/**
+ * Takes a base box-model property - e.g. margin / border / padding - along with a default
+ * direction and value, and emits rules which apply the value to the
+ * "<base-property>-<default-direction>" property by default, but flips the direction
+ * when within an RTL context.
+ *
+ * For example:
+ *
+ * ```scss
+ * .mdc-foo {
+ *   @include mdc-rtl-reflexive-box(margin, left, 8px);
+ * }
+ * ```
+ * is equivalent to:
+ *
+ * ```scss
+ * .mdc-foo {
+ *   margin-left: 8px;
+ *
+ *   @include mdc-rtl {
+ *     margin-right: 8px;
+ *     margin-left: 0;
+ *   }
+ * }
+ * ```
+ * whereas:
+ *
+ * ```scss
+ * .mdc-foo {
+ *   @include mdc-rtl-reflexive-box(margin, right, 8px);
+ * }
+ * ```
+ * is equivalent to:
+ *
+ * ```scss
+ * .mdc-foo {
+ *   margin-right: 8px;
+ *
+ *   @include mdc-rtl {
+ *     margin-right: 0;
+ *     margin-left: 8px;
+ *   }
+ * }
+ * ```
+ *
+ * You can also pass a 4th optional $root-selector argument which will be forwarded to `mdc-rtl`,
+ * e.g. `@include mdc-rtl-reflexive-box(margin, left, 8px, ".mdc-component")`.
+ *
+ * Note that this function will always zero out the original value in an RTL context. If you're
+ * trying to flip the values, use mdc-rtl-reflexive-property().
+ */
+/**
+ * Takes a base property and emits rules that assign <base-property>-left to <left-value> and
+ * <base-property>-right to <right-value> in a LTR context, and vice versa in a RTL context.
+ * For example:
+ *
+ * ```scss
+ * .mdc-foo {
+ *   @include mdc-rtl-reflexive-property(margin, auto, 12px);
+ * }
+ * ```
+ * is equivalent to:
+ *
+ * ```scss
+ * .mdc-foo {
+ *   margin-left: auto;
+ *   margin-right: 12px;
+ *
+ *   @include mdc-rtl {
+ *     margin-left: 12px;
+ *     margin-right: auto;
+ *   }
+ * }
+ * ```
+ *
+ * A 4th optional $root-selector argument can be given, which will be passed to `mdc-rtl`.
+ */
+/**
+ * Takes an argument specifying a horizontal position property (either "left" or "right") as well
+ * as a value, and applies that value to the specified position in a LTR context, and flips it in a
+ * RTL context. For example:
+ *
+ * ```scss
+ * .mdc-foo {
+ *   @include mdc-rtl-reflexive-position(left, 0);
+ *   position: absolute;
+ * }
+ * ```
+ * is equivalent to:
+ *
+ * ```scss
+ *  .mdc-foo {
+ *    position: absolute;
+ *    left: 0;
+ *    right: initial;
+ *
+ *    @include mdc-rtl {
+ *      right: 0;
+ *      left: initial;
+ *    }
+ *  }
+ * ```
+ * An optional third $root-selector argument may also be given, which is passed to `mdc-rtl`.
+ */
+.mdc-tab-bar-scroller {
+  display: -webkit-box;
+  display: -ms-flexbox;
+  display: flex;
+  -webkit-box-align: center;
+      -ms-flex-align: center;
+          align-items: center;
+  -webkit-box-sizing: border-box;
+          box-sizing: border-box;
+  width: 100%;
+  background-color: inherit;
+  overflow: hidden; }
+  .mdc-tab-bar-scroller__scroll-frame {
+    display: -webkit-box;
+    display: -ms-flexbox;
+    display: flex;
+    position: relative;
+    -webkit-box-flex: 1;
+        -ms-flex: 1;
+            flex: 1;
+    -webkit-box-pack: start;
+        -ms-flex-pack: start;
+            justify-content: flex-start;
+    overflow: hidden; }
+    .mdc-tab-bar-scroller__scroll-frame__tabs {
+      -webkit-transition: -webkit-transform 240ms 0ms cubic-bezier(0, 0, 0.2, 1);
+      transition: -webkit-transform 240ms 0ms cubic-bezier(0, 0, 0.2, 1);
+      transition: transform 240ms 0ms cubic-bezier(0, 0, 0.2, 1);
+      transition: transform 240ms 0ms cubic-bezier(0, 0, 0.2, 1), -webkit-transform 240ms 0ms cubic-bezier(0, 0, 0.2, 1);
+      will-change: transform; }
+  .mdc-tab-bar-scroller__indicator {
+    display: -webkit-box;
+    display: -ms-flexbox;
+    display: flex;
+    -webkit-box-align: center;
+        -ms-flex-align: center;
+            align-items: center;
+    -webkit-box-pack: center;
+        -ms-flex-pack: center;
+            justify-content: center;
+    width: 48px;
+    cursor: pointer;
+    visibility: hidden;
+    /* @alternate */
+    color: rgba(0, 0, 0, 0.54);
+    color: var(--mdc-theme-text-secondary-on-light, rgba(0, 0, 0, 0.54)); }
+    .mdc-tab-bar--theme-dark .mdc-tab-bar-scroller__indicator,
+    .mdc-theme--dark .mdc-tab-bar-scroller__indicator {
+      /* @alternate */
+      color: rgba(255, 255, 255, 0.7);
+      color: var(--mdc-theme-text-secondary-on-dark, rgba(255, 255, 255, 0.7)); }
+    .mdc-tab-bar-scroller__indicator:hover {
+      /* @alternate */
+      color: rgba(0, 0, 0, 0.87);
+      color: var(--mdc-theme-text-primary-on-light, rgba(0, 0, 0, 0.87)); }
+      .mdc-tab-bar--theme-dark .mdc-tab-bar-scroller__indicator:hover,
+      .mdc-theme--dark .mdc-tab-bar-scroller__indicator:hover {
+        /* @alternate */
+        color: white;
+        color: var(--mdc-theme-text-primary-on-dark, white); }
+    .mdc-tab-bar-scroller__indicator__inner {
+      color: inherit;
+      text-decoration: inherit;
+      cursor: inherit; }
+      .mdc-tab-bar-scroller__indicator__inner:focus {
+        outline-color: inherit; }
+      [dir="rtl"] .mdc-tab-bar-scroller .mdc-tab-bar-scroller__indicator__inner,
+      .mdc-tab-bar-scroller[dir="rtl"] .mdc-tab-bar-scroller__indicator__inner {
+        -webkit-transform: rotate(180deg);
+                transform: rotate(180deg); }
+    .mdc-tab-bar-scroller__indicator__inner:hover {
+      color: inherit; }
+      .mdc-tab-bar--theme-dark .mdc-tab-bar-scroller__indicator__inner:hover,
+      .mdc-theme--dark .mdc-tab-bar-scroller__indicator__inner:hover {
+        /* @alternate */
+        color: rgba(255, 255, 255, 0.7);
+        color: var(--mdc-theme-text-secondary-on-dark, rgba(255, 255, 255, 0.7)); }
+  .mdc-tab-bar-scroller__indicator--enabled {
+    visibility: visible; }
+
+/*
+  Precomputed linear color channel values, for use in contrast calculations.
+  See https://www.w3.org/TR/WCAG20-TECHS/G17.html#G17-tests
+
+  Algorithm, for c in 0 to 255:
+  f(c) {
+    c = c / 255;
+    return c < 0.03928 ? c / 12.92 : Math.pow((c + 0.055) / 1.055, 2.4);
+  }
+
+  This lookup table is needed since there is no `pow` in SASS.
+*/
+/**
+ * Calculate the luminance for a color.
+ * See https://www.w3.org/TR/WCAG20-TECHS/G17.html#G17-tests
+ */
+/**
+ * Calculate the contrast ratio between two colors.
+ * See https://www.w3.org/TR/WCAG20-TECHS/G17.html#G17-tests
+ */
+/**
+ * Determine whether to use dark or light text on top of given color.
+ * Returns "dark" for dark text and "light" for light text.
+ */
+/*
+  Main theme colors.
+  If you're a user customizing your color scheme in SASS, these are probably the only variables you need to change.
+*/
+/* Indigo 500 */
+/* Pink A200 */
+/* White */
+/* Which set of text colors to use for each main theme color (light or dark) */
+/* Text colors according to light vs dark and text type */
+/* Primary text colors for each of the theme colors */
+/** MDC Ripple keyframes are split into their own file so that _mixins.scss can rely on them. */
+@keyframes mdc-ripple-fg-radius-in {
+  from {
+    -webkit-transform: translate(var(--mdc-ripple-fg-translate-start, 0)) scale(1);
+            transform: translate(var(--mdc-ripple-fg-translate-start, 0)) scale(1);
+    -webkit-animation-timing-function: cubic-bezier(0.4, 0, 0.2, 1);
+            animation-timing-function: cubic-bezier(0.4, 0, 0.2, 1); }
+  to {
+    -webkit-transform: translate(var(--mdc-ripple-fg-translate-end, 0)) scale(var(--mdc-ripple-fg-scale, 1));
+            transform: translate(var(--mdc-ripple-fg-translate-end, 0)) scale(var(--mdc-ripple-fg-scale, 1)); } }
+
+@keyframes mdc-ripple-fg-opacity-in {
+  from {
+    opacity: 0;
+    -webkit-animation-timing-function: linear;
+            animation-timing-function: linear; }
+  to {
+    opacity: 1; } }
+
+@keyframes mdc-ripple-fg-opacity-out {
+  from {
+    opacity: 1;
+    -webkit-animation-timing-function: linear;
+            animation-timing-function: linear; }
+  to {
+    opacity: 0; } }
+
+/**
+ * Creates a rule that will be applied when an MDC-Web component is within the context of an RTL layout.
+ *
+ * Usage Example:
+ * ```scss
+ * .mdc-foo {
+ *   position: absolute;
+ *   left: 0;
+ *
+ *   @include mdc-rtl {
+ *     left: auto;
+ *     right: 0;
+ *   }
+ *
+ *   &__bar {
+ *     margin-left: 4px;
+ *     @include mdc-rtl(".mdc-foo") {
+ *       margin-left: auto;
+ *       margin-right: 4px;
+ *     }
+ *   }
+ * }
+ *
+ * .mdc-foo--mod {
+ *   padding-left: 4px;
+ *
+ *   @include mdc-rtl {
+ *     padding-left: auto;
+ *     padding-right: 4px;
+ *   }
+ * }
+ * ```
+ *
+ * Note that this works by checking for [dir="rtl"] on an ancestor element. While this will work
+ * in most cases, it will in some cases lead to false negatives, e.g.
+ *
+ * ```html
+ * <html dir="rtl">
+ *   <!-- ... -->
+ *   <div dir="ltr">
+ *     <div class="mdc-foo">Styled incorrectly as RTL!</div>
+ *   </div>
+ * </html>
+ * ```
+ *
+ * In the future, selectors such as :dir (http://mdn.io/:dir) will help us mitigate this.
+ */
+/**
+ * Takes a base box-model property - e.g. margin / border / padding - along with a default
+ * direction and value, and emits rules which apply the value to the
+ * "<base-property>-<default-direction>" property by default, but flips the direction
+ * when within an RTL context.
+ *
+ * For example:
+ *
+ * ```scss
+ * .mdc-foo {
+ *   @include mdc-rtl-reflexive-box(margin, left, 8px);
+ * }
+ * ```
+ * is equivalent to:
+ *
+ * ```scss
+ * .mdc-foo {
+ *   margin-left: 8px;
+ *
+ *   @include mdc-rtl {
+ *     margin-right: 8px;
+ *     margin-left: 0;
+ *   }
+ * }
+ * ```
+ * whereas:
+ *
+ * ```scss
+ * .mdc-foo {
+ *   @include mdc-rtl-reflexive-box(margin, right, 8px);
+ * }
+ * ```
+ * is equivalent to:
+ *
+ * ```scss
+ * .mdc-foo {
+ *   margin-right: 8px;
+ *
+ *   @include mdc-rtl {
+ *     margin-right: 0;
+ *     margin-left: 8px;
+ *   }
+ * }
+ * ```
+ *
+ * You can also pass a 4th optional $root-selector argument which will be forwarded to `mdc-rtl`,
+ * e.g. `@include mdc-rtl-reflexive-box(margin, left, 8px, ".mdc-component")`.
+ *
+ * Note that this function will always zero out the original value in an RTL context. If you're
+ * trying to flip the values, use mdc-rtl-reflexive-property().
+ */
+/**
+ * Takes a base property and emits rules that assign <base-property>-left to <left-value> and
+ * <base-property>-right to <right-value> in a LTR context, and vice versa in a RTL context.
+ * For example:
+ *
+ * ```scss
+ * .mdc-foo {
+ *   @include mdc-rtl-reflexive-property(margin, auto, 12px);
+ * }
+ * ```
+ * is equivalent to:
+ *
+ * ```scss
+ * .mdc-foo {
+ *   margin-left: auto;
+ *   margin-right: 12px;
+ *
+ *   @include mdc-rtl {
+ *     margin-left: 12px;
+ *     margin-right: auto;
+ *   }
+ * }
+ * ```
+ *
+ * A 4th optional $root-selector argument can be given, which will be passed to `mdc-rtl`.
+ */
+/**
+ * Takes an argument specifying a horizontal position property (either "left" or "right") as well
+ * as a value, and applies that value to the specified position in a LTR context, and flips it in a
+ * RTL context. For example:
+ *
+ * ```scss
+ * .mdc-foo {
+ *   @include mdc-rtl-reflexive-position(left, 0);
+ *   position: absolute;
+ * }
+ * ```
+ * is equivalent to:
+ *
+ * ```scss
+ *  .mdc-foo {
+ *    position: absolute;
+ *    left: 0;
+ *    right: initial;
+ *
+ *    @include mdc-rtl {
+ *      right: 0;
+ *      left: initial;
+ *    }
+ *  }
+ * ```
+ * An optional third $root-selector argument may also be given, which is passed to `mdc-rtl`.
+ */
+/*
+  Precomputed linear color channel values, for use in contrast calculations.
+  See https://www.w3.org/TR/WCAG20-TECHS/G17.html#G17-tests
+
+  Algorithm, for c in 0 to 255:
+  f(c) {
+    c = c / 255;
+    return c < 0.03928 ? c / 12.92 : Math.pow((c + 0.055) / 1.055, 2.4);
+  }
+
+  This lookup table is needed since there is no `pow` in SASS.
+*/
+/**
+ * Calculate the luminance for a color.
+ * See https://www.w3.org/TR/WCAG20-TECHS/G17.html#G17-tests
+ */
+/**
+ * Calculate the contrast ratio between two colors.
+ * See https://www.w3.org/TR/WCAG20-TECHS/G17.html#G17-tests
+ */
+/**
+ * Determine whether to use dark or light text on top of given color.
+ * Returns "dark" for dark text and "light" for light text.
+ */
+/*
+  Main theme colors.
+  If you're a user customizing your color scheme in SASS, these are probably the only variables you need to change.
+*/
+/* Indigo 500 */
+/* Pink A200 */
+/* White */
+/* Which set of text colors to use for each main theme color (light or dark) */
+/* Text colors according to light vs dark and text type */
+/* Primary text colors for each of the theme colors */
+/*
+  Precomputed linear color channel values, for use in contrast calculations.
+  See https://www.w3.org/TR/WCAG20-TECHS/G17.html#G17-tests
+
+  Algorithm, for c in 0 to 255:
+  f(c) {
+    c = c / 255;
+    return c < 0.03928 ? c / 12.92 : Math.pow((c + 0.055) / 1.055, 2.4);
+  }
+
+  This lookup table is needed since there is no `pow` in SASS.
+*/
+/**
+ * Calculate the luminance for a color.
+ * See https://www.w3.org/TR/WCAG20-TECHS/G17.html#G17-tests
+ */
+/**
+ * Calculate the contrast ratio between two colors.
+ * See https://www.w3.org/TR/WCAG20-TECHS/G17.html#G17-tests
+ */
+/**
+ * Determine whether to use dark or light text on top of given color.
+ * Returns "dark" for dark text and "light" for light text.
+ */
+/*
+  Main theme colors.
+  If you're a user customizing your color scheme in SASS, these are probably the only variables you need to change.
+*/
+/* Indigo 500 */
+/* Pink A200 */
+/* White */
+/* Which set of text colors to use for each main theme color (light or dark) */
+/* Text colors according to light vs dark and text type */
+/* Primary text colors for each of the theme colors */
+/**
+ * Applies the correct theme color style to the specified property.
+ * $property is typically color or background-color, but can be any CSS property that accepts color values.
+ * $style should be one of the map keys in $mdc-theme-property-values (_variables.scss).
+ */
+/**
+ * Creates a rule to be used in MDC-Web components for dark theming, and applies the provided contents.
+ * Should provide the $root-selector option if applied to anything other than the root selector.
+ * When used with a modifier class, provide a second argument of `true` for the $compound parameter
+ * to specify that this should be attached as a compound class.
+ *
+ * Usage example:
+ *
+ * ```scss
+ * .mdc-foo {
+ *   color: black;
+ *
+ *   @include mdc-theme-dark {
+ *     color: white;
+ *   }
+ *
+ *   &__bar {
+ *     background: black;
+ *
+ *     @include mdc-theme-dark(".mdc-foo") {
+ *       background: white;
+ *     }
+ *   }
+ * }
+ *
+ * .mdc-foo--disabled {
+ *   opacity: .38;
+ *
+ *   @include mdc-theme-dark(".mdc-foo", true) {
+ *     opacity: .5;
+ *   }
+ * }
+ * ```
+ */
+/* TODO(sgomes): Figure out what to do about desktop font sizes. */
+/* TODO(sgomes): Figure out what to do about i18n and i18n font sizes. */
+/* TODO(sgomes): Figure out what to do about desktop font sizes. */
+/* TODO(sgomes): Figure out what to do about i18n and i18n font sizes. */
+.mdc-textfield {
+  display: inline-block;
+  margin-bottom: 8px;
+  will-change: opacity, transform, color; }
+  .mdc-textfield__input {
+    /* @alternate */
+    color: rgba(0, 0, 0, 0.87);
+    color: var(--mdc-theme-text-primary-on-light, rgba(0, 0, 0, 0.87));
+    font-family: Roboto, sans-serif;
+    -moz-osx-font-smoothing: grayscale;
+    -webkit-font-smoothing: antialiased;
+    font-size: 1rem;
+    letter-spacing: 0.04em;
+    width: 100%;
+    padding: 0 0 8px;
+    border: none;
+    background: none;
+    font-size: inherit;
+    -webkit-appearance: none;
+       -moz-appearance: none;
+            appearance: none; }
+    .mdc-textfield__input::-webkit-input-placeholder {
+      /* @alternate */
+      color: rgba(0, 0, 0, 0.38);
+      color: var(--mdc-theme-text-hint-on-light, rgba(0, 0, 0, 0.38));
+      -webkit-transition: color 180ms cubic-bezier(0.4, 0, 0.2, 1);
+      transition: color 180ms cubic-bezier(0.4, 0, 0.2, 1);
+      opacity: 1; }
+    .mdc-textfield__input::-moz-placeholder {
+      /* @alternate */
+      color: rgba(0, 0, 0, 0.38);
+      color: var(--mdc-theme-text-hint-on-light, rgba(0, 0, 0, 0.38));
+      -webkit-transition: color 180ms cubic-bezier(0.4, 0, 0.2, 1);
+      transition: color 180ms cubic-bezier(0.4, 0, 0.2, 1);
+      opacity: 1; }
+    .mdc-textfield__input:-ms-input-placeholder {
+      /* @alternate */
+      color: rgba(0, 0, 0, 0.38);
+      color: var(--mdc-theme-text-hint-on-light, rgba(0, 0, 0, 0.38));
+      -webkit-transition: color 180ms cubic-bezier(0.4, 0, 0.2, 1);
+      transition: color 180ms cubic-bezier(0.4, 0, 0.2, 1);
+      opacity: 1; }
+    .mdc-textfield__input::placeholder {
+      /* @alternate */
+      color: rgba(0, 0, 0, 0.38);
+      color: var(--mdc-theme-text-hint-on-light, rgba(0, 0, 0, 0.38));
+      -webkit-transition: color 180ms cubic-bezier(0.4, 0, 0.2, 1);
+      transition: color 180ms cubic-bezier(0.4, 0, 0.2, 1);
+      opacity: 1; }
+    .mdc-textfield__input:focus {
+      outline: none; }
+      .mdc-textfield__input:focus::-webkit-input-placeholder {
+        /* @alternate */
+        color: rgba(0, 0, 0, 0.54);
+        color: var(--mdc-theme-text-secondary-on-light, rgba(0, 0, 0, 0.54)); }
+      .mdc-textfield__input:focus::-moz-placeholder {
+        /* @alternate */
+        color: rgba(0, 0, 0, 0.54);
+        color: var(--mdc-theme-text-secondary-on-light, rgba(0, 0, 0, 0.54)); }
+      .mdc-textfield__input:focus:-ms-input-placeholder {
+        /* @alternate */
+        color: rgba(0, 0, 0, 0.54);
+        color: var(--mdc-theme-text-secondary-on-light, rgba(0, 0, 0, 0.54)); }
+      .mdc-textfield__input:focus::placeholder {
+        /* @alternate */
+        color: rgba(0, 0, 0, 0.54);
+        color: var(--mdc-theme-text-secondary-on-light, rgba(0, 0, 0, 0.54)); }
+    .mdc-textfield__input:invalid {
+      -webkit-box-shadow: none;
+              box-shadow: none; }
+    .mdc-textfield__input--theme-dark,
+    .mdc-theme--dark .mdc-textfield__input {
+      /* @alternate */
+      color: white;
+      color: var(--mdc-theme-text-primary-on-dark, white); }
+      .mdc-textfield__input--theme-dark::-webkit-input-placeholder,
+      .mdc-theme--dark .mdc-textfield__input::-webkit-input-placeholder {
+        /* @alternate */
+        color: rgba(255, 255, 255, 0.5);
+        color: var(--mdc-theme-text-hint-on-dark, rgba(255, 255, 255, 0.5)); }
+      .mdc-textfield__input--theme-dark::-moz-placeholder,
+      .mdc-theme--dark .mdc-textfield__input::-moz-placeholder {
+        /* @alternate */
+        color: rgba(255, 255, 255, 0.5);
+        color: var(--mdc-theme-text-hint-on-dark, rgba(255, 255, 255, 0.5)); }
+      .mdc-textfield__input--theme-dark:-ms-input-placeholder,
+      .mdc-theme--dark .mdc-textfield__input:-ms-input-placeholder {
+        /* @alternate */
+        color: rgba(255, 255, 255, 0.5);
+        color: var(--mdc-theme-text-hint-on-dark, rgba(255, 255, 255, 0.5)); }
+      .mdc-textfield__input--theme-dark::placeholder,
+      .mdc-theme--dark .mdc-textfield__input::placeholder {
+        /* @alternate */
+        color: rgba(255, 255, 255, 0.5);
+        color: var(--mdc-theme-text-hint-on-dark, rgba(255, 255, 255, 0.5)); }
+      .mdc-textfield__input--theme-dark:focus::-webkit-input-placeholder,
+      .mdc-theme--dark .mdc-textfield__input:focus::-webkit-input-placeholder {
+        /* @alternate */
+        color: rgba(255, 255, 255, 0.7);
+        color: var(--mdc-theme-text-secondary-on-dark, rgba(255, 255, 255, 0.7)); }
+      .mdc-textfield__input--theme-dark:focus::-moz-placeholder,
+      .mdc-theme--dark .mdc-textfield__input:focus::-moz-placeholder {
+        /* @alternate */
+        color: rgba(255, 255, 255, 0.7);
+        color: var(--mdc-theme-text-secondary-on-dark, rgba(255, 255, 255, 0.7)); }
+      .mdc-textfield__input--theme-dark:focus:-ms-input-placeholder,
+      .mdc-theme--dark .mdc-textfield__input:focus:-ms-input-placeholder {
+        /* @alternate */
+        color: rgba(255, 255, 255, 0.7);
+        color: var(--mdc-theme-text-secondary-on-dark, rgba(255, 255, 255, 0.7)); }
+      .mdc-textfield__input--theme-dark:focus::placeholder,
+      .mdc-theme--dark .mdc-textfield__input:focus::placeholder {
+        /* @alternate */
+        color: rgba(255, 255, 255, 0.7);
+        color: var(--mdc-theme-text-secondary-on-dark, rgba(255, 255, 255, 0.7)); }
+  .mdc-textfield__label {
+    /* @alternate */
+    color: rgba(0, 0, 0, 0.38);
+    color: var(--mdc-theme-text-hint-on-light, rgba(0, 0, 0, 0.38));
+    position: absolute;
+    bottom: 8px;
+    left: 0;
+    -webkit-transform-origin: left top;
+            transform-origin: left top;
+    -webkit-transition: color 180ms cubic-bezier(0.4, 0, 0.2, 1), -webkit-transform 180ms cubic-bezier(0.4, 0, 0.2, 1);
+    transition: color 180ms cubic-bezier(0.4, 0, 0.2, 1), -webkit-transform 180ms cubic-bezier(0.4, 0, 0.2, 1);
+    transition: transform 180ms cubic-bezier(0.4, 0, 0.2, 1), color 180ms cubic-bezier(0.4, 0, 0.2, 1);
+    transition: transform 180ms cubic-bezier(0.4, 0, 0.2, 1), color 180ms cubic-bezier(0.4, 0, 0.2, 1), -webkit-transform 180ms cubic-bezier(0.4, 0, 0.2, 1);
+    cursor: text; }
+    [dir="rtl"] .mdc-textfield .mdc-textfield__label,
+    .mdc-textfield[dir="rtl"] .mdc-textfield__label {
+      right: 0;
+      left: auto;
+      -webkit-transform-origin: right top;
+              transform-origin: right top; }
+    .mdc-textfield--theme-dark .mdc-textfield__label,
+    .mdc-theme--dark .mdc-textfield__label {
+      /* @alternate */
+      color: rgba(255, 255, 255, 0.5);
+      color: var(--mdc-theme-text-hint-on-dark, rgba(255, 255, 255, 0.5)); }
+    .mdc-textfield__label--float-above {
+      -webkit-transform: translateY(-100%) scale(0.75, 0.75);
+              transform: translateY(-100%) scale(0.75, 0.75);
+      cursor: auto; }
+
+.mdc-textfield__input:-webkit-autofill + .mdc-textfield__label {
+  -webkit-transform: translateY(-100%) scale(0.75, 0.75);
+          transform: translateY(-100%) scale(0.75, 0.75);
+  cursor: auto; }
+
+.mdc-textfield--box {
+  display: -webkit-inline-box;
+  display: -ms-inline-flexbox;
+  display: inline-flex;
+  position: relative;
+  height: 56px;
+  border-radius: 4px 4px 0 0;
+  background-color: rgba(0, 0, 0, 0.04);
+  overflow: hidden; }
+  .mdc-textfield--theme-dark.mdc-textfield--box,
+  .mdc-theme--dark .mdc-textfield--box {
+    background-color: rgba(255, 255, 255, 0.1); }
+  .mdc-textfield--box::before, .mdc-textfield--box::after {
+    position: absolute;
+    top: 0;
+    left: 0;
+    width: 100%;
+    height: 100%;
+    border-radius: 50%;
+    background-color: inherit;
+    content: "";
+    opacity: 0;
+    pointer-events: none; }
+  .mdc-textfield--box::before {
+    -webkit-transition: opacity 17ms linear, -webkit-transform 0ms 85ms linear;
+    transition: opacity 17ms linear, -webkit-transform 0ms 85ms linear;
+    transition: opacity 17ms linear, transform 0ms 85ms linear;
+    transition: opacity 17ms linear, transform 0ms 85ms linear, -webkit-transform 0ms 85ms linear; }
+  .mdc-textfield--box:hover::before {
+    -webkit-transition: opacity 83ms linear 17ms, -webkit-transform 250ms cubic-bezier(0, 0, 0.2, 1) 17ms;
+    transition: opacity 83ms linear 17ms, -webkit-transform 250ms cubic-bezier(0, 0, 0.2, 1) 17ms;
+    transition: opacity 83ms linear 17ms, transform 250ms cubic-bezier(0, 0, 0.2, 1) 17ms;
+    transition: opacity 83ms linear 17ms, transform 250ms cubic-bezier(0, 0, 0.2, 1) 17ms, -webkit-transform 250ms cubic-bezier(0, 0, 0.2, 1) 17ms;
+    opacity: 1; }
+  .mdc-textfield--box .mdc-textfield__input {
+    -ms-flex-item-align: end;
+        align-self: flex-end;
+    height: 100%;
+    -webkit-box-sizing: border-box;
+            box-sizing: border-box;
+    padding: 20px 16px 0; }
+  .mdc-textfield--box .mdc-textfield__label {
+    left: 16px;
+    right: initial;
+    position: absolute;
+    bottom: 20px;
+    color: rgba(0, 0, 0, 0.6);
+    pointer-events: none;
+    will-change: transform; }
+    [dir="rtl"] .mdc-textfield--box .mdc-textfield__label, .mdc-textfield--box .mdc-textfield__label[dir="rtl"] {
+      left: initial;
+      right: 16px; }
+    .mdc-textfield--theme-dark .mdc-textfield--box .mdc-textfield__label,
+    .mdc-theme--dark .mdc-textfield--box .mdc-textfield__label {
+      /* @alternate */
+      color: rgba(255, 255, 255, 0.7);
+      color: var(--mdc-theme-text-secondary-on-dark, rgba(255, 255, 255, 0.7)); }
+    .mdc-textfield--box .mdc-textfield__label--float-above {
+      -webkit-transform: translateY(-50%) scale(0.75, 0.75);
+              transform: translateY(-50%) scale(0.75, 0.75); }
+  .mdc-textfield--box.mdc-ripple-upgraded {
+    --mdc-ripple-surface-width: 0;
+    --mdc-ripple-surface-height: 0;
+    --mdc-ripple-fg-size: 0;
+    --mdc-ripple-left: 0;
+    --mdc-ripple-top: 0;
+    --mdc-ripple-fg-scale: 1;
+    --mdc-ripple-fg-translate-end: 0;
+    --mdc-ripple-fg-translate-start: 0;
+    will-change: transform, opacity;
+    -webkit-tap-highlight-color: transparent; }
+    .mdc-textfield--box.mdc-ripple-upgraded:not(.mdc-ripple-upgraded):hover::before, .mdc-textfield--box.mdc-ripple-upgraded:not(.mdc-ripple-upgraded):focus::before, .mdc-textfield--box.mdc-ripple-upgraded:not(.mdc-ripple-upgraded):active::after {
+      -webkit-transition-duration: 85ms;
+              transition-duration: 85ms;
+      opacity: .6; }
+    .mdc-textfield--box.mdc-ripple-upgraded::after {
+      background-color: rgba(0, 0, 0, 0.04);
+      position: absolute;
+      top: calc(50% - 100%);
+      left: calc(50% - 100%);
+      width: 200%;
+      height: 200%;
+      -webkit-transition: opacity 250ms linear;
+      transition: opacity 250ms linear;
+      border-radius: 50%;
+      opacity: 0;
+      pointer-events: none;
+      content: ""; }
+    .mdc-textfield--box.mdc-ripple-upgraded.mdc-ripple-upgraded::after {
+      top: 0;
+      left: 0;
+      /* @alternate */
+      width: 100%;
+      width: var(--mdc-ripple-fg-size, 100%);
+      /* @alternate */
+      height: 100%;
+      height: var(--mdc-ripple-fg-size, 100%);
+      -webkit-transform: scale(0);
+              transform: scale(0);
+      -webkit-transform-origin: center center;
+              transform-origin: center center;
+      opacity: 0; }
+    .mdc-textfield--box.mdc-ripple-upgraded:not(.mdc-ripple-upgraded--unbounded)::after {
+      -webkit-transform-origin: center center;
+              transform-origin: center center; }
+    .mdc-textfield--box.mdc-ripple-upgraded.mdc-ripple-upgraded--unbounded::after {
+      /* @alternate */
+      top: 0;
+      top: var(--mdc-ripple-top, 0);
+      /* @alternate */
+      left: 0;
+      left: var(--mdc-ripple-left, 0);
+      /* @alternate */
+      width: 100%;
+      width: var(--mdc-ripple-fg-size, 100%);
+      /* @alternate */
+      height: 100%;
+      height: var(--mdc-ripple-fg-size, 100%);
+      -webkit-transform: scale(0);
+              transform: scale(0);
+      -webkit-transform-origin: center center;
+              transform-origin: center center; }
+    .mdc-textfield--box.mdc-ripple-upgraded.mdc-ripple-upgraded--foreground-activation::after {
+      -webkit-animation: 300ms mdc-ripple-fg-radius-in forwards, 83ms mdc-ripple-fg-opacity-in forwards;
+              animation: 300ms mdc-ripple-fg-radius-in forwards, 83ms mdc-ripple-fg-opacity-in forwards; }
+    .mdc-textfield--box.mdc-ripple-upgraded.mdc-ripple-upgraded--foreground-deactivation::after {
+      -webkit-transform: translate(var(--mdc-ripple-fg-translate-end, 0)) scale(var(--mdc-ripple-fg-scale, 1));
+              transform: translate(var(--mdc-ripple-fg-translate-end, 0)) scale(var(--mdc-ripple-fg-scale, 1));
+      -webkit-animation: 83ms mdc-ripple-fg-opacity-out;
+              animation: 83ms mdc-ripple-fg-opacity-out; }
+    .mdc-textfield--box.mdc-ripple-upgraded::before {
+      top: calc(50% - var(--mdc-ripple-fg-size, 100%) / 2);
+      left: calc(50% - var(--mdc-ripple-fg-size, 100%) / 2);
+      width: var(--mdc-ripple-fg-size, 100%);
+      height: var(--mdc-ripple-fg-size, 100%);
+      -webkit-transform: scale(0.8);
+              transform: scale(0.8); }
+    .mdc-textfield--box.mdc-ripple-upgraded:hover::before {
+      -webkit-transform: scale(calc(var(--mdc-ripple-fg-scale, 1) + .1));
+              transform: scale(calc(var(--mdc-ripple-fg-scale, 1) + .1)); }
+    .mdc-textfield--theme-dark.mdc-textfield--box.mdc-ripple-upgraded::after,
+    .mdc-theme--dark .mdc-textfield--box.mdc-ripple-upgraded::after {
+      background-color: rgba(255, 255, 255, 0.05);
+      position: absolute;
+      top: calc(50% - 100%);
+      left: calc(50% - 100%);
+      width: 200%;
+      height: 200%;
+      -webkit-transition: opacity 250ms linear;
+      transition: opacity 250ms linear;
+      border-radius: 50%;
+      opacity: 0;
+      pointer-events: none;
+      content: ""; }
+    .mdc-textfield--theme-dark.mdc-textfield--box.mdc-ripple-upgraded.mdc-ripple-upgraded::after,
+    .mdc-theme--dark .mdc-textfield--box.mdc-ripple-upgraded.mdc-ripple-upgraded::after {
+      top: 0;
+      left: 0;
+      /* @alternate */
+      width: 100%;
+      width: var(--mdc-ripple-fg-size, 100%);
+      /* @alternate */
+      height: 100%;
+      height: var(--mdc-ripple-fg-size, 100%);
+      -webkit-transform: scale(0);
+              transform: scale(0);
+      -webkit-transform-origin: center center;
+              transform-origin: center center;
+      opacity: 0; }
+    .mdc-textfield--theme-dark.mdc-textfield--box.mdc-ripple-upgraded:not(.mdc-ripple-upgraded--unbounded)::after,
+    .mdc-theme--dark .mdc-textfield--box.mdc-ripple-upgraded:not(.mdc-ripple-upgraded--unbounded)::after {
+      -webkit-transform-origin: center center;
+              transform-origin: center center; }
+    .mdc-textfield--theme-dark.mdc-textfield--box.mdc-ripple-upgraded.mdc-ripple-upgraded--unbounded::after,
+    .mdc-theme--dark .mdc-textfield--box.mdc-ripple-upgraded.mdc-ripple-upgraded--unbounded::after {
+      /* @alternate */
+      top: 0;
+      top: var(--mdc-ripple-top, 0);
+      /* @alternate */
+      left: 0;
+      left: var(--mdc-ripple-left, 0);
+      /* @alternate */
+      width: 100%;
+      width: var(--mdc-ripple-fg-size, 100%);
+      /* @alternate */
+      height: 100%;
+      height: var(--mdc-ripple-fg-size, 100%);
+      -webkit-transform: scale(0);
+              transform: scale(0);
+      -webkit-transform-origin: center center;
+              transform-origin: center center; }
+    .mdc-textfield--theme-dark.mdc-textfield--box.mdc-ripple-upgraded.mdc-ripple-upgraded--foreground-activation::after,
+    .mdc-theme--dark .mdc-textfield--box.mdc-ripple-upgraded.mdc-ripple-upgraded--foreground-activation::after {
+      -webkit-animation: 300ms mdc-ripple-fg-radius-in forwards, 83ms mdc-ripple-fg-opacity-in forwards;
+              animation: 300ms mdc-ripple-fg-radius-in forwards, 83ms mdc-ripple-fg-opacity-in forwards; }
+    .mdc-textfield--theme-dark.mdc-textfield--box.mdc-ripple-upgraded.mdc-ripple-upgraded--foreground-deactivation::after,
+    .mdc-theme--dark .mdc-textfield--box.mdc-ripple-upgraded.mdc-ripple-upgraded--foreground-deactivation::after {
+      -webkit-transform: translate(var(--mdc-ripple-fg-translate-end, 0)) scale(var(--mdc-ripple-fg-scale, 1));
+              transform: translate(var(--mdc-ripple-fg-translate-end, 0)) scale(var(--mdc-ripple-fg-scale, 1));
+      -webkit-animation: 83ms mdc-ripple-fg-opacity-out;
+              animation: 83ms mdc-ripple-fg-opacity-out; }
+  .mdc-textfield--box.mdc-textfield--disabled {
+    border-bottom: none;
+    background-color: rgba(0, 0, 0, 0.02);
+    color: rgba(0, 0, 0, 0.38); }
+    .mdc-textfield--theme-dark.mdc-textfield--box.mdc-textfield--disabled,
+    .mdc-theme--dark .mdc-textfield--box.mdc-textfield--disabled {
+      border-bottom: none;
+      background-color: rgba(255, 255, 255, 0.05); }
+    .mdc-textfield--box.mdc-textfield--disabled .mdc-textfield__label {
+      bottom: 20px; }
+    .mdc-textfield--box.mdc-textfield--disabled .mdc-textfield__input {
+      padding-bottom: 0; }
+  .mdc-textfield--box .mdc-textfield__bottom-line {
+    position: absolute;
+    bottom: 0;
+    left: 0;
+    width: 100%;
+    height: 1px;
+    -webkit-transform: scaleY(1);
+            transform: scaleY(1);
+    -webkit-transform-origin: center bottom;
+            transform-origin: center bottom;
+    -webkit-transition: background-color 33ms cubic-bezier(0.4, 0, 0.2, 1), -webkit-transform 180ms cubic-bezier(0.4, 0, 0.2, 1);
+    transition: background-color 33ms cubic-bezier(0.4, 0, 0.2, 1), -webkit-transform 180ms cubic-bezier(0.4, 0, 0.2, 1);
+    transition: background-color 33ms cubic-bezier(0.4, 0, 0.2, 1), transform 180ms cubic-bezier(0.4, 0, 0.2, 1);
+    transition: background-color 33ms cubic-bezier(0.4, 0, 0.2, 1), transform 180ms cubic-bezier(0.4, 0, 0.2, 1), -webkit-transform 180ms cubic-bezier(0.4, 0, 0.2, 1);
+    background-color: rgba(0, 0, 0, 0.42);
+    pointer-events: none; }
+    .mdc-textfield--box .mdc-textfield__bottom-line::after {
+      position: absolute;
+      top: 0;
+      left: 0;
+      width: 100%;
+      height: 100%;
+      -webkit-transition: opacity 180ms cubic-bezier(0.4, 0, 0.2, 1);
+      transition: opacity 180ms cubic-bezier(0.4, 0, 0.2, 1);
+      background-color: #d50000;
+      content: "";
+      opacity: 0; }
+    .mdc-textfield--theme-dark .mdc-textfield--box .mdc-textfield__bottom-line,
+    .mdc-theme--dark .mdc-textfield--box .mdc-textfield__bottom-line {
+      /* @alternate */
+      background-color: rgba(255, 255, 255, 0.5);
+      background-color: var(--mdc-theme-text-hint-on-dark, rgba(255, 255, 255, 0.5)); }
+      .mdc-textfield--theme-dark .mdc-textfield--box .mdc-textfield__bottom-line::after,
+      .mdc-theme--dark .mdc-textfield--box .mdc-textfield__bottom-line::after {
+        background-color: #ff6e6e; }
+  .mdc-textfield--box.mdc-textfield--focused .mdc-textfield__bottom-line {
+    /* @alternate */
+    background-color: #3f51b5;
+    background-color: var(--mdc-theme-primary, #3f51b5);
+    -webkit-transform: scaleY(2);
+            transform: scaleY(2); }
+  .mdc-textfield--box.mdc-textfield--disabled .mdc-textfield__bottom-line {
+    display: none; }
+  .mdc-textfield--box.mdc-textfield--invalid .mdc-textfield__bottom-line::after {
+    opacity: 1; }
+  .mdc-textfield--box.mdc-textfield--dense {
+    height: 44px; }
+    .mdc-textfield--box.mdc-textfield--dense .mdc-textfield__input {
+      padding: 12px 12px 0; }
+    .mdc-textfield--box.mdc-textfield--dense .mdc-textfield__label {
+      left: 12px;
+      right: initial;
+      bottom: 12px; }
+      [dir="rtl"] .mdc-textfield--box.mdc-textfield--dense .mdc-textfield__label, .mdc-textfield--box.mdc-textfield--dense .mdc-textfield__label[dir="rtl"] {
+        left: initial;
+        right: 12px; }
+      .mdc-textfield--box.mdc-textfield--dense .mdc-textfield__label--float-above {
+        -webkit-transform: translateY(calc(-75% - 2px)) scale(0.923, 0.923);
+                transform: translateY(calc(-75% - 2px)) scale(0.923, 0.923); }
+
+.mdc-textfield--upgraded:not(.mdc-textfield--fullwidth):not(.mdc-textfield--box) {
+  display: -webkit-inline-box;
+  display: -ms-inline-flexbox;
+  display: inline-flex;
+  position: relative;
+  -webkit-box-sizing: border-box;
+          box-sizing: border-box;
+  -webkit-box-align: end;
+      -ms-flex-align: end;
+          align-items: flex-end;
+  margin-top: 16px; }
+  .mdc-textfield--upgraded:not(.mdc-textfield--fullwidth):not(.mdc-textfield--box):not(.mdc-textfield--multiline) {
+    height: 48px; }
+    .mdc-textfield--upgraded:not(.mdc-textfield--fullwidth):not(.mdc-textfield--box):not(.mdc-textfield--multiline)::after {
+      position: absolute;
+      bottom: 0;
+      left: 0;
+      width: 100%;
+      height: 1px;
+      -webkit-transform: translateY(50%) scaleY(1);
+              transform: translateY(50%) scaleY(1);
+      -webkit-transform-origin: center bottom;
+              transform-origin: center bottom;
+      -webkit-transition: background-color 180ms cubic-bezier(0.4, 0, 0.2, 1), -webkit-transform 180ms cubic-bezier(0.4, 0, 0.2, 1);
+      transition: background-color 180ms cubic-bezier(0.4, 0, 0.2, 1), -webkit-transform 180ms cubic-bezier(0.4, 0, 0.2, 1);
+      transition: background-color 180ms cubic-bezier(0.4, 0, 0.2, 1), transform 180ms cubic-bezier(0.4, 0, 0.2, 1);
+      transition: background-color 180ms cubic-bezier(0.4, 0, 0.2, 1), transform 180ms cubic-bezier(0.4, 0, 0.2, 1), -webkit-transform 180ms cubic-bezier(0.4, 0, 0.2, 1);
+      background-color: rgba(0, 0, 0, 0.12);
+      content: ""; }
+      .mdc-textfield--theme-dark .mdc-textfield--upgraded:not(.mdc-textfield--fullwidth):not(.mdc-textfield--box):not(.mdc-textfield--multiline)::after,
+      .mdc-theme--dark .mdc-textfield--upgraded:not(.mdc-textfield--fullwidth):not(.mdc-textfield--box):not(.mdc-textfield--multiline)::after {
+        background-color: rgba(255, 255, 255, 0.12); }
+  .mdc-textfield--upgraded:not(.mdc-textfield--fullwidth):not(.mdc-textfield--box) .mdc-textfield__label {
+    pointer-events: none; }
+
+.mdc-textfield--focused.mdc-textfield--upgraded:not(.mdc-textfield--fullwidth):not(.mdc-textfield--multiline):not(.mdc-textfield--box)::after {
+  /* @alternate */
+  background-color: #3f51b5;
+  background-color: var(--mdc-theme-primary, #3f51b5);
+  -webkit-transform: translateY(100%) scaleY(2);
+          transform: translateY(100%) scaleY(2);
+  -webkit-transition: -webkit-transform 180ms cubic-bezier(0.4, 0, 0.2, 1);
+  transition: -webkit-transform 180ms cubic-bezier(0.4, 0, 0.2, 1);
+  transition: transform 180ms cubic-bezier(0.4, 0, 0.2, 1);
+  transition: transform 180ms cubic-bezier(0.4, 0, 0.2, 1), -webkit-transform 180ms cubic-bezier(0.4, 0, 0.2, 1); }
+  .mdc-textfield--theme-dark.mdc-textfield--focused.mdc-textfield--upgraded:not(.mdc-textfield--fullwidth):not(.mdc-textfield--multiline):not(.mdc-textfield--box)::after,
+  .mdc-theme--dark .mdc-textfield--focused.mdc-textfield--upgraded:not(.mdc-textfield--fullwidth):not(.mdc-textfield--multiline):not(.mdc-textfield--box)::after {
+    /* @alternate */
+    background-color: #3f51b5;
+    background-color: var(--mdc-theme-primary, #3f51b5);
+    -webkit-transform: translateY(100%) scaleY(2);
+            transform: translateY(100%) scaleY(2);
+    -webkit-transition: -webkit-transform 180ms cubic-bezier(0.4, 0, 0.2, 1);
+    transition: -webkit-transform 180ms cubic-bezier(0.4, 0, 0.2, 1);
+    transition: transform 180ms cubic-bezier(0.4, 0, 0.2, 1);
+    transition: transform 180ms cubic-bezier(0.4, 0, 0.2, 1), -webkit-transform 180ms cubic-bezier(0.4, 0, 0.2, 1); }
+
+.mdc-textfield--focused .mdc-textfield__label {
+  /* @alternate */
+  color: #3f51b5;
+  color: var(--mdc-theme-primary, #3f51b5); }
+  .mdc-textfield--theme-dark .mdc-textfield--focused .mdc-textfield__label,
+  .mdc-theme--dark .mdc-textfield--focused .mdc-textfield__label {
+    /* @alternate */
+    color: #3f51b5;
+    color: var(--mdc-theme-primary, #3f51b5); }
+
+.mdc-textfield--dense {
+  margin-top: 12px;
+  margin-bottom: 4px;
+  font-size: .813rem; }
+  .mdc-textfield--dense .mdc-textfield__label--float-above {
+    -webkit-transform: translateY(calc(-100% - 2px)) scale(0.923, 0.923);
+            transform: translateY(calc(-100% - 2px)) scale(0.923, 0.923); }
+
+.mdc-textfield--invalid:not(.mdc-textfield--focused):not(.mdc-textfield--box)::after, .mdc-textfield--invalid:not(.mdc-textfield--focused):not(.mdc-textfield--box).mdc-textfield--upgraded::after {
+  background-color: #d50000; }
+
+.mdc-textfield--invalid:not(.mdc-textfield--focused):not(.mdc-textfield--box) .mdc-textfield__label {
+  color: #d50000; }
+
+.mdc-textfield--theme-dark.mdc-textfield--invalid:not(.mdc-textfield--focused)::after, .mdc-textfield--theme-dark.mdc-textfield--invalid:not(.mdc-textfield--focused).mdc-textfield--upgraded::after,
+.mdc-theme--dark .mdc-textfield--invalid:not(.mdc-textfield--focused)::after,
+.mdc-theme--dark .mdc-textfield--invalid:not(.mdc-textfield--focused).mdc-textfield--upgraded::after {
+  background-color: #ff6e6e; }
+
+.mdc-textfield--theme-dark.mdc-textfield--invalid:not(.mdc-textfield--focused) .mdc-textfield__label,
+.mdc-theme--dark .mdc-textfield--invalid:not(.mdc-textfield--focused) .mdc-textfield__label {
+  color: #ff6e6e; }
+
+.mdc-textfield--disabled {
+  pointer-events: none;
+  border-bottom: 1px dotted rgba(35, 31, 32, 0.26); }
+  .mdc-textfield--disabled::after {
+    display: none; }
+  .mdc-textfield--disabled .mdc-textfield__input {
+    padding-bottom: 7px; }
+  .mdc-textfield--theme-dark.mdc-textfield--disabled,
+  .mdc-theme--dark .mdc-textfield--disabled {
+    border-bottom: 1px dotted rgba(255, 255, 255, 0.3); }
+  .mdc-textfield--disabled .mdc-textfield__input,
+  .mdc-textfield--disabled .mdc-textfield__label,
+  .mdc-textfield--disabled + .mdc-textfield-helptext {
+    /* @alternate */
+    color: rgba(0, 0, 0, 0.38);
+    color: var(--mdc-theme-text-disabled-on-light, rgba(0, 0, 0, 0.38)); }
+  .mdc-textfield--theme-dark .mdc-textfield--disabled .mdc-textfield__input,
+  .mdc-theme--dark .mdc-textfield--disabled .mdc-textfield__input, .mdc-textfield--theme-dark
+  .mdc-textfield--disabled .mdc-textfield__label,
+  .mdc-theme--dark
+  .mdc-textfield--disabled .mdc-textfield__label {
+    /* @alternate */
+    color: rgba(255, 255, 255, 0.5);
+    color: var(--mdc-theme-text-disabled-on-dark, rgba(255, 255, 255, 0.5)); }
+  .mdc-textfield--theme-dark.mdc-textfield--disabled + .mdc-textfield-helptext,
+  .mdc-theme--dark .mdc-textfield--disabled + .mdc-textfield-helptext {
+    /* @alternate */
+    color: rgba(255, 255, 255, 0.5);
+    color: var(--mdc-theme-text-disabled-on-dark, rgba(255, 255, 255, 0.5)); }
+  .mdc-textfield--disabled .mdc-textfield__label {
+    bottom: 7px;
+    cursor: default; }
+
+.mdc-textfield__input:required + .mdc-textfield__label::after {
+  margin-left: 1px;
+  content: "*"; }
+  .mdc-textfield--focused .mdc-textfield__input:required + .mdc-textfield__label::after {
+    color: #d50000; }
+    .mdc-textfield--theme-dark.mdc-textfield--focused .mdc-textfield__input:required + .mdc-textfield__label::after,
+    .mdc-theme--dark .mdc-textfield--focused .mdc-textfield__input:required + .mdc-textfield__label::after {
+      color: #ff6e6e; }
+
+.mdc-textfield--multiline {
+  display: -webkit-box;
+  display: -ms-flexbox;
+  display: flex;
+  height: initial;
+  -webkit-transition: none;
+  transition: none; }
+  .mdc-textfield--multiline::after {
+    content: initial; }
+  .mdc-textfield--multiline .mdc-textfield__input {
+    padding: 4px;
+    -webkit-transition: border-color 180ms cubic-bezier(0.4, 0, 0.2, 1);
+    transition: border-color 180ms cubic-bezier(0.4, 0, 0.2, 1);
+    border: 1px solid rgba(0, 0, 0, 0.12);
+    border-radius: 2px; }
+    .mdc-textfield--theme-dark .mdc-textfield--multiline .mdc-textfield__input,
+    .mdc-theme--dark .mdc-textfield--multiline .mdc-textfield__input {
+      border-color: rgba(255, 255, 255, 0.12); }
+    .mdc-textfield--multiline .mdc-textfield__input:focus {
+      /* @alternate */
+      border-color: #3f51b5;
+      border-color: var(--mdc-theme-primary, #3f51b5); }
+    .mdc-textfield--multiline .mdc-textfield__input:invalid:not(:focus) {
+      border-color: #d50000; }
+    .mdc-textfield--theme-dark .mdc-textfield--multiline .mdc-textfield__input:invalid:not(:focus),
+    .mdc-theme--dark .mdc-textfield--multiline .mdc-textfield__input:invalid:not(:focus) {
+      border-color: #ff6e6e; }
+  .mdc-textfield--multiline .mdc-textfield__label {
+    top: 6px;
+    bottom: initial;
+    left: 4px; }
+    [dir="rtl"] .mdc-textfield--multiline .mdc-textfield--multiline .mdc-textfield__label,
+    .mdc-textfield--multiline[dir="rtl"] .mdc-textfield--multiline .mdc-textfield__label {
+      right: 4px;
+      left: auto; }
+    .mdc-textfield--multiline .mdc-textfield__label--float-above {
+      -webkit-transform: translateY(calc(-100% - 6px)) scale(0.923, 0.923);
+              transform: translateY(calc(-100% - 6px)) scale(0.923, 0.923); }
+  .mdc-textfield--multiline.mdc-textfield--disabled {
+    border-bottom: none; }
+    .mdc-textfield--multiline.mdc-textfield--disabled .mdc-textfield__input {
+      border: 1px dotted rgba(35, 31, 32, 0.26); }
+      .mdc-textfield--theme-dark .mdc-textfield--multiline.mdc-textfield--disabled .mdc-textfield__input,
+      .mdc-theme--dark .mdc-textfield--multiline.mdc-textfield--disabled .mdc-textfield__input {
+        border-color: rgba(255, 255, 255, 0.3); }
+
+.mdc-textfield--fullwidth {
+  display: block;
+  width: 100%;
+  -webkit-box-sizing: border-box;
+          box-sizing: border-box;
+  margin: 0;
+  border: none;
+  border-bottom: 1px solid rgba(0, 0, 0, 0.12);
+  outline: none; }
+  .mdc-textfield--fullwidth:not(.mdc-textfield--multiline) {
+    height: 56px; }
+  .mdc-textfield--fullwidth.mdc-textfield--multiline {
+    padding: 20px 0 0; }
+  .mdc-textfield--fullwidth.mdc-textfield--dense:not(.mdc-textfield--multiline) {
+    height: 48px; }
+  .mdc-textfield--fullwidth.mdc-textfield--dense.mdc-textfield--multiline {
+    padding: 16px 0 0; }
+  .mdc-textfield--fullwidth.mdc-textfield--disabled, .mdc-textfield--fullwidth.mdc-textfield--disabled.mdc-textfield--multiline {
+    border-bottom: 1px dotted rgba(0, 0, 0, 0.12); }
+  .mdc-textfield--fullwidth--theme-dark,
+  .mdc-theme--dark .mdc-textfield--fullwidth {
+    border-bottom: 1px solid rgba(255, 255, 255, 0.12); }
+    .mdc-textfield--fullwidth--theme-dark.mdc-textfield--disabled, .mdc-textfield--fullwidth--theme-dark.mdc-textfield--disabled.mdc-textfield--multiline,
+    .mdc-theme--dark .mdc-textfield--fullwidth.mdc-textfield--disabled,
+    .mdc-theme--dark .mdc-textfield--fullwidth.mdc-textfield--disabled.mdc-textfield--multiline {
+      border-bottom: 1px dotted rgba(255, 255, 255, 0.12); }
+  .mdc-textfield--fullwidth .mdc-textfield__input {
+    width: 100%;
+    height: 100%;
+    padding: 0;
+    resize: none;
+    border: none !important; }
+
+.mdc-textfield:not(.mdc-textfield--upgraded):not(.mdc-textfield--multiline) .mdc-textfield__input {
+  -webkit-transition: border-bottom-color 180ms cubic-bezier(0.4, 0, 0.2, 1);
+  transition: border-bottom-color 180ms cubic-bezier(0.4, 0, 0.2, 1);
+  border-bottom: 1px solid rgba(0, 0, 0, 0.12); }
+
+.mdc-textfield:not(.mdc-textfield--upgraded) .mdc-textfield__input:focus {
+  /* @alternate */
+  border-color: #3f51b5;
+  border-color: var(--mdc-theme-primary, #3f51b5); }
+
+.mdc-textfield:not(.mdc-textfield--upgraded) .mdc-textfield__input:disabled {
+  /* @alternate */
+  color: rgba(0, 0, 0, 0.38);
+  color: var(--mdc-theme-text-disabled-on-light, rgba(0, 0, 0, 0.38));
+  border-style: dotted;
+  border-color: rgba(35, 31, 32, 0.26); }
+
+.mdc-textfield:not(.mdc-textfield--upgraded) .mdc-textfield__input:invalid:not(:focus) {
+  border-color: #d50000; }
+
+.mdc-textfield--theme-dark:not(.mdc-textfield--upgraded) .mdc-textfield__input:not(:focus),
+.mdc-theme--dark .mdc-textfield:not(.mdc-textfield--upgraded) .mdc-textfield__input:not(:focus) {
+  border-color: rgba(255, 255, 255, 0.12); }
+
+.mdc-textfield--theme-dark:not(.mdc-textfield--upgraded) .mdc-textfield__input:disabled,
+.mdc-theme--dark .mdc-textfield:not(.mdc-textfield--upgraded) .mdc-textfield__input:disabled {
+  /* @alternate */
+  color: rgba(255, 255, 255, 0.5);
+  color: var(--mdc-theme-text-disabled-on-dark, rgba(255, 255, 255, 0.5));
+  border-color: rgba(255, 255, 255, 0.3); }
+
+.mdc-textfield--theme-dark:not(.mdc-textfield--upgraded) .mdc-textfield__input:invalid:not(:focus),
+.mdc-theme--dark .mdc-textfield:not(.mdc-textfield--upgraded) .mdc-textfield__input:invalid:not(:focus) {
+  border-color: #ff6e6e; }
+
+.mdc-textfield--box:not(.mdc-textfield--upgraded) {
+  height: 36px; }
+  .mdc-textfield--box:not(.mdc-textfield--upgraded)::before, .mdc-textfield--box:not(.mdc-textfield--upgraded)::after {
+    border-radius: 0; }
+  .mdc-textfield--box:not(.mdc-textfield--upgraded) .mdc-textfield__input {
+    padding-top: 0; }
+
+.mdc-textfield-helptext {
+  /* @alternate */
+  color: rgba(0, 0, 0, 0.38);
+  color: var(--mdc-theme-text-hint-on-light, rgba(0, 0, 0, 0.38));
+  margin: 0;
+  -webkit-transition: opacity 180ms cubic-bezier(0.4, 0, 0.2, 1);
+  transition: opacity 180ms cubic-bezier(0.4, 0, 0.2, 1);
+  font-size: .75rem;
+  opacity: 0;
+  will-change: opacity; }
+  .mdc-textfield-helptext--theme-dark,
+  .mdc-theme--dark .mdc-textfield-helptext {
+    /* @alternate */
+    color: rgba(255, 255, 255, 0.5);
+    color: var(--mdc-theme-text-hint-on-dark, rgba(255, 255, 255, 0.5)); }
+  .mdc-textfield + .mdc-textfield-helptext {
+    margin-bottom: 8px; }
+  .mdc-textfield--dense + .mdc-textfield-helptext {
+    margin-bottom: 4px; }
+  .mdc-textfield--focused + .mdc-textfield-helptext:not(.mdc-textfield-helptext--validation-msg) {
+    opacity: 1; }
+
+.mdc-textfield-helptext--persistent {
+  -webkit-transition: none;
+  transition: none;
+  opacity: 1;
+  will-change: initial; }
+
+.mdc-textfield--invalid + .mdc-textfield-helptext--validation-msg {
+  color: #d50000;
+  opacity: 1; }
+
+.mdc-textfield--theme-dark.mdc-textfield--invalid + .mdc-textfield-helptext--validation-msg,
+.mdc-theme--dark .mdc-textfield--invalid + .mdc-textfield-helptext--validation-msg {
+  color: #ff6e6e; }
+
+.mdc-form-field > .mdc-textfield + label {
+  -ms-flex-item-align: start;
+      align-self: flex-start; }
+
+/*
+  Precomputed linear color channel values, for use in contrast calculations.
+  See https://www.w3.org/TR/WCAG20-TECHS/G17.html#G17-tests
+
+  Algorithm, for c in 0 to 255:
+  f(c) {
+    c = c / 255;
+    return c < 0.03928 ? c / 12.92 : Math.pow((c + 0.055) / 1.055, 2.4);
+  }
+
+  This lookup table is needed since there is no `pow` in SASS.
+*/
+/**
+ * Calculate the luminance for a color.
+ * See https://www.w3.org/TR/WCAG20-TECHS/G17.html#G17-tests
+ */
+/**
+ * Calculate the contrast ratio between two colors.
+ * See https://www.w3.org/TR/WCAG20-TECHS/G17.html#G17-tests
+ */
+/**
+ * Determine whether to use dark or light text on top of given color.
+ * Returns "dark" for dark text and "light" for light text.
+ */
+/*
+  Main theme colors.
+  If you're a user customizing your color scheme in SASS, these are probably the only variables you need to change.
+*/
+/* Indigo 500 */
+/* Pink A200 */
+/* White */
+/* Which set of text colors to use for each main theme color (light or dark) */
+/* Text colors according to light vs dark and text type */
+/* Primary text colors for each of the theme colors */
+/**
+ * Applies the correct theme color style to the specified property.
+ * $property is typically color or background-color, but can be any CSS property that accepts color values.
+ * $style should be one of the map keys in $mdc-theme-property-values (_variables.scss).
+ */
+/**
+ * Creates a rule to be used in MDC-Web components for dark theming, and applies the provided contents.
+ * Should provide the $root-selector option if applied to anything other than the root selector.
+ * When used with a modifier class, provide a second argument of `true` for the $compound parameter
+ * to specify that this should be attached as a compound class.
+ *
+ * Usage example:
+ *
+ * ```scss
+ * .mdc-foo {
+ *   color: black;
+ *
+ *   @include mdc-theme-dark {
+ *     color: white;
+ *   }
+ *
+ *   &__bar {
+ *     background: black;
+ *
+ *     @include mdc-theme-dark(".mdc-foo") {
+ *       background: white;
+ *     }
+ *   }
+ * }
+ *
+ * .mdc-foo--disabled {
+ *   opacity: .38;
+ *
+ *   @include mdc-theme-dark(".mdc-foo", true) {
+ *     opacity: .5;
+ *   }
+ * }
+ * ```
+ */
+:root {
+  --mdc-theme-primary: #3f51b5;
+  --mdc-theme-accent: #ff4081;
+  --mdc-theme-background: #fff;
+  --mdc-theme-text-primary-on-primary: white;
+  --mdc-theme-text-secondary-on-primary: rgba(255, 255, 255, 0.7);
+  --mdc-theme-text-hint-on-primary: rgba(255, 255, 255, 0.5);
+  --mdc-theme-text-disabled-on-primary: rgba(255, 255, 255, 0.5);
+  --mdc-theme-text-icon-on-primary: rgba(255, 255, 255, 0.5);
+  --mdc-theme-text-primary-on-accent: white;
+  --mdc-theme-text-secondary-on-accent: rgba(255, 255, 255, 0.7);
+  --mdc-theme-text-hint-on-accent: rgba(255, 255, 255, 0.5);
+  --mdc-theme-text-disabled-on-accent: rgba(255, 255, 255, 0.5);
+  --mdc-theme-text-icon-on-accent: rgba(255, 255, 255, 0.5);
+  --mdc-theme-text-primary-on-background: rgba(0, 0, 0, 0.87);
+  --mdc-theme-text-secondary-on-background: rgba(0, 0, 0, 0.54);
+  --mdc-theme-text-hint-on-background: rgba(0, 0, 0, 0.38);
+  --mdc-theme-text-disabled-on-background: rgba(0, 0, 0, 0.38);
+  --mdc-theme-text-icon-on-background: rgba(0, 0, 0, 0.38);
+  --mdc-theme-text-primary-on-light: rgba(0, 0, 0, 0.87);
+  --mdc-theme-text-secondary-on-light: rgba(0, 0, 0, 0.54);
+  --mdc-theme-text-hint-on-light: rgba(0, 0, 0, 0.38);
+  --mdc-theme-text-disabled-on-light: rgba(0, 0, 0, 0.38);
+  --mdc-theme-text-icon-on-light: rgba(0, 0, 0, 0.38);
+  --mdc-theme-text-primary-on-dark: white;
+  --mdc-theme-text-secondary-on-dark: rgba(255, 255, 255, 0.7);
+  --mdc-theme-text-hint-on-dark: rgba(255, 255, 255, 0.5);
+  --mdc-theme-text-disabled-on-dark: rgba(255, 255, 255, 0.5);
+  --mdc-theme-text-icon-on-dark: rgba(255, 255, 255, 0.5); }
+
+/* Special case, so that .mdc-theme--background changes background color, not text color. */
+.mdc-theme--background {
+  /* @alternate */
+  background-color: #fff;
+  background-color: var(--mdc-theme-background, #fff); }
+
+.mdc-theme--primary {
+  /* @alternate */
+  color: #3f51b5 !important;
+  color: var(--mdc-theme-primary, #3f51b5) !important; }
+
+.mdc-theme--accent {
+  /* @alternate */
+  color: #ff4081 !important;
+  color: var(--mdc-theme-accent, #ff4081) !important; }
+
+.mdc-theme--text-primary-on-primary {
+  /* @alternate */
+  color: white !important;
+  color: var(--mdc-theme-text-primary-on-primary, white) !important; }
+
+.mdc-theme--text-secondary-on-primary {
+  /* @alternate */
+  color: rgba(255, 255, 255, 0.7) !important;
+  color: var(--mdc-theme-text-secondary-on-primary, rgba(255, 255, 255, 0.7)) !important; }
+
+.mdc-theme--text-hint-on-primary {
+  /* @alternate */
+  color: rgba(255, 255, 255, 0.5) !important;
+  color: var(--mdc-theme-text-hint-on-primary, rgba(255, 255, 255, 0.5)) !important; }
+
+.mdc-theme--text-disabled-on-primary {
+  /* @alternate */
+  color: rgba(255, 255, 255, 0.5) !important;
+  color: var(--mdc-theme-text-disabled-on-primary, rgba(255, 255, 255, 0.5)) !important; }
+
+.mdc-theme--text-icon-on-primary {
+  /* @alternate */
+  color: rgba(255, 255, 255, 0.5) !important;
+  color: var(--mdc-theme-text-icon-on-primary, rgba(255, 255, 255, 0.5)) !important; }
+
+.mdc-theme--text-primary-on-accent {
+  /* @alternate */
+  color: white !important;
+  color: var(--mdc-theme-text-primary-on-accent, white) !important; }
+
+.mdc-theme--text-secondary-on-accent {
+  /* @alternate */
+  color: rgba(255, 255, 255, 0.7) !important;
+  color: var(--mdc-theme-text-secondary-on-accent, rgba(255, 255, 255, 0.7)) !important; }
+
+.mdc-theme--text-hint-on-accent {
+  /* @alternate */
+  color: rgba(255, 255, 255, 0.5) !important;
+  color: var(--mdc-theme-text-hint-on-accent, rgba(255, 255, 255, 0.5)) !important; }
+
+.mdc-theme--text-disabled-on-accent {
+  /* @alternate */
+  color: rgba(255, 255, 255, 0.5) !important;
+  color: var(--mdc-theme-text-disabled-on-accent, rgba(255, 255, 255, 0.5)) !important; }
+
+.mdc-theme--text-icon-on-accent {
+  /* @alternate */
+  color: rgba(255, 255, 255, 0.5) !important;
+  color: var(--mdc-theme-text-icon-on-accent, rgba(255, 255, 255, 0.5)) !important; }
+
+.mdc-theme--text-primary-on-background {
+  /* @alternate */
+  color: rgba(0, 0, 0, 0.87) !important;
+  color: var(--mdc-theme-text-primary-on-background, rgba(0, 0, 0, 0.87)) !important; }
+
+.mdc-theme--text-secondary-on-background {
+  /* @alternate */
+  color: rgba(0, 0, 0, 0.54) !important;
+  color: var(--mdc-theme-text-secondary-on-background, rgba(0, 0, 0, 0.54)) !important; }
+
+.mdc-theme--text-hint-on-background {
+  /* @alternate */
+  color: rgba(0, 0, 0, 0.38) !important;
+  color: var(--mdc-theme-text-hint-on-background, rgba(0, 0, 0, 0.38)) !important; }
+
+.mdc-theme--text-disabled-on-background {
+  /* @alternate */
+  color: rgba(0, 0, 0, 0.38) !important;
+  color: var(--mdc-theme-text-disabled-on-background, rgba(0, 0, 0, 0.38)) !important; }
+
+.mdc-theme--text-icon-on-background {
+  /* @alternate */
+  color: rgba(0, 0, 0, 0.38) !important;
+  color: var(--mdc-theme-text-icon-on-background, rgba(0, 0, 0, 0.38)) !important; }
+
+.mdc-theme--text-primary-on-light {
+  /* @alternate */
+  color: rgba(0, 0, 0, 0.87) !important;
+  color: var(--mdc-theme-text-primary-on-light, rgba(0, 0, 0, 0.87)) !important; }
+
+.mdc-theme--text-secondary-on-light {
+  /* @alternate */
+  color: rgba(0, 0, 0, 0.54) !important;
+  color: var(--mdc-theme-text-secondary-on-light, rgba(0, 0, 0, 0.54)) !important; }
+
+.mdc-theme--text-hint-on-light {
+  /* @alternate */
+  color: rgba(0, 0, 0, 0.38) !important;
+  color: var(--mdc-theme-text-hint-on-light, rgba(0, 0, 0, 0.38)) !important; }
+
+.mdc-theme--text-disabled-on-light {
+  /* @alternate */
+  color: rgba(0, 0, 0, 0.38) !important;
+  color: var(--mdc-theme-text-disabled-on-light, rgba(0, 0, 0, 0.38)) !important; }
+
+.mdc-theme--text-icon-on-light {
+  /* @alternate */
+  color: rgba(0, 0, 0, 0.38) !important;
+  color: var(--mdc-theme-text-icon-on-light, rgba(0, 0, 0, 0.38)) !important; }
+
+.mdc-theme--text-primary-on-dark {
+  /* @alternate */
+  color: white !important;
+  color: var(--mdc-theme-text-primary-on-dark, white) !important; }
+
+.mdc-theme--text-secondary-on-dark {
+  /* @alternate */
+  color: rgba(255, 255, 255, 0.7) !important;
+  color: var(--mdc-theme-text-secondary-on-dark, rgba(255, 255, 255, 0.7)) !important; }
+
+.mdc-theme--text-hint-on-dark {
+  /* @alternate */
+  color: rgba(255, 255, 255, 0.5) !important;
+  color: var(--mdc-theme-text-hint-on-dark, rgba(255, 255, 255, 0.5)) !important; }
+
+.mdc-theme--text-disabled-on-dark {
+  /* @alternate */
+  color: rgba(255, 255, 255, 0.5) !important;
+  color: var(--mdc-theme-text-disabled-on-dark, rgba(255, 255, 255, 0.5)) !important; }
+
+.mdc-theme--text-icon-on-dark {
+  /* @alternate */
+  color: rgba(255, 255, 255, 0.5) !important;
+  color: var(--mdc-theme-text-icon-on-dark, rgba(255, 255, 255, 0.5)) !important; }
+
+/* CSS rules for using primary and accent as background colors. */
+.mdc-theme--primary-bg {
+  /* @alternate */
+  background-color: #3f51b5 !important;
+  background-color: var(--mdc-theme-primary, #3f51b5) !important; }
+
+.mdc-theme--accent-bg {
+  /* @alternate */
+  background-color: #ff4081 !important;
+  background-color: var(--mdc-theme-accent, #ff4081) !important; }
+
+/**
+ * The css property used for elevation. In most cases this should not be changed. It is exposed
+ * as a variable for abstraction / easy use when needing to reference the property directly, for
+ * example in a `will-change` rule.
+ */
+/**
+ * The default duration value for elevation transitions.
+ */
+/**
+ * The default easing value for elevation transitions.
+ */
+/**
+ * Applies the correct css rules to an element to give it the elevation specified by $z-value.
+ * The $z-value must be between 0 and 24.
+ */
+/**
+ * Returns a string that can be used as the value for a `transition` property for elevation.
+ * Calling this function directly is useful in situations where a component needs to transition
+ * more than one property.
+ *
+ * ```scss
+ * .foo {
+ *   transition: mdc-elevation-transition-rule(), opacity 100ms ease;
+ *   will-change: $mdc-elevation-property, opacity;
+ * }
+ * ```
+ */
+/**
+ * Applies the correct css rules needed to have an element transition between elevations.
+ * This mixin should be applied to elements whose elevation values will change depending on their
+ * context (e.g. when active or disabled).
+ */
+/**
+ * Creates a rule that will be applied when an MDC-Web component is within the context of an RTL layout.
+ *
+ * Usage Example:
+ * ```scss
+ * .mdc-foo {
+ *   position: absolute;
+ *   left: 0;
+ *
+ *   @include mdc-rtl {
+ *     left: auto;
+ *     right: 0;
+ *   }
+ *
+ *   &__bar {
+ *     margin-left: 4px;
+ *     @include mdc-rtl(".mdc-foo") {
+ *       margin-left: auto;
+ *       margin-right: 4px;
+ *     }
+ *   }
+ * }
+ *
+ * .mdc-foo--mod {
+ *   padding-left: 4px;
+ *
+ *   @include mdc-rtl {
+ *     padding-left: auto;
+ *     padding-right: 4px;
+ *   }
+ * }
+ * ```
+ *
+ * Note that this works by checking for [dir="rtl"] on an ancestor element. While this will work
+ * in most cases, it will in some cases lead to false negatives, e.g.
+ *
+ * ```html
+ * <html dir="rtl">
+ *   <!-- ... -->
+ *   <div dir="ltr">
+ *     <div class="mdc-foo">Styled incorrectly as RTL!</div>
+ *   </div>
+ * </html>
+ * ```
+ *
+ * In the future, selectors such as :dir (http://mdn.io/:dir) will help us mitigate this.
+ */
+/**
+ * Takes a base box-model property - e.g. margin / border / padding - along with a default
+ * direction and value, and emits rules which apply the value to the
+ * "<base-property>-<default-direction>" property by default, but flips the direction
+ * when within an RTL context.
+ *
+ * For example:
+ *
+ * ```scss
+ * .mdc-foo {
+ *   @include mdc-rtl-reflexive-box(margin, left, 8px);
+ * }
+ * ```
+ * is equivalent to:
+ *
+ * ```scss
+ * .mdc-foo {
+ *   margin-left: 8px;
+ *
+ *   @include mdc-rtl {
+ *     margin-right: 8px;
+ *     margin-left: 0;
+ *   }
+ * }
+ * ```
+ * whereas:
+ *
+ * ```scss
+ * .mdc-foo {
+ *   @include mdc-rtl-reflexive-box(margin, right, 8px);
+ * }
+ * ```
+ * is equivalent to:
+ *
+ * ```scss
+ * .mdc-foo {
+ *   margin-right: 8px;
+ *
+ *   @include mdc-rtl {
+ *     margin-right: 0;
+ *     margin-left: 8px;
+ *   }
+ * }
+ * ```
+ *
+ * You can also pass a 4th optional $root-selector argument which will be forwarded to `mdc-rtl`,
+ * e.g. `@include mdc-rtl-reflexive-box(margin, left, 8px, ".mdc-component")`.
+ *
+ * Note that this function will always zero out the original value in an RTL context. If you're
+ * trying to flip the values, use mdc-rtl-reflexive-property().
+ */
+/**
+ * Takes a base property and emits rules that assign <base-property>-left to <left-value> and
+ * <base-property>-right to <right-value> in a LTR context, and vice versa in a RTL context.
+ * For example:
+ *
+ * ```scss
+ * .mdc-foo {
+ *   @include mdc-rtl-reflexive-property(margin, auto, 12px);
+ * }
+ * ```
+ * is equivalent to:
+ *
+ * ```scss
+ * .mdc-foo {
+ *   margin-left: auto;
+ *   margin-right: 12px;
+ *
+ *   @include mdc-rtl {
+ *     margin-left: 12px;
+ *     margin-right: auto;
+ *   }
+ * }
+ * ```
+ *
+ * A 4th optional $root-selector argument can be given, which will be passed to `mdc-rtl`.
+ */
+/**
+ * Takes an argument specifying a horizontal position property (either "left" or "right") as well
+ * as a value, and applies that value to the specified position in a LTR context, and flips it in a
+ * RTL context. For example:
+ *
+ * ```scss
+ * .mdc-foo {
+ *   @include mdc-rtl-reflexive-position(left, 0);
+ *   position: absolute;
+ * }
+ * ```
+ * is equivalent to:
+ *
+ * ```scss
+ *  .mdc-foo {
+ *    position: absolute;
+ *    left: 0;
+ *    right: initial;
+ *
+ *    @include mdc-rtl {
+ *      right: 0;
+ *      left: initial;
+ *    }
+ *  }
+ * ```
+ * An optional third $root-selector argument may also be given, which is passed to `mdc-rtl`.
+ */
+/*
+  Precomputed linear color channel values, for use in contrast calculations.
+  See https://www.w3.org/TR/WCAG20-TECHS/G17.html#G17-tests
+
+  Algorithm, for c in 0 to 255:
+  f(c) {
+    c = c / 255;
+    return c < 0.03928 ? c / 12.92 : Math.pow((c + 0.055) / 1.055, 2.4);
+  }
+
+  This lookup table is needed since there is no `pow` in SASS.
+*/
+/**
+ * Calculate the luminance for a color.
+ * See https://www.w3.org/TR/WCAG20-TECHS/G17.html#G17-tests
+ */
+/**
+ * Calculate the contrast ratio between two colors.
+ * See https://www.w3.org/TR/WCAG20-TECHS/G17.html#G17-tests
+ */
+/**
+ * Determine whether to use dark or light text on top of given color.
+ * Returns "dark" for dark text and "light" for light text.
+ */
+/*
+  Main theme colors.
+  If you're a user customizing your color scheme in SASS, these are probably the only variables you need to change.
+*/
+/* Indigo 500 */
+/* Pink A200 */
+/* White */
+/* Which set of text colors to use for each main theme color (light or dark) */
+/* Text colors according to light vs dark and text type */
+/* Primary text colors for each of the theme colors */
+/**
+ * Applies the correct theme color style to the specified property.
+ * $property is typically color or background-color, but can be any CSS property that accepts color values.
+ * $style should be one of the map keys in $mdc-theme-property-values (_variables.scss).
+ */
+/**
+ * Creates a rule to be used in MDC-Web components for dark theming, and applies the provided contents.
+ * Should provide the $root-selector option if applied to anything other than the root selector.
+ * When used with a modifier class, provide a second argument of `true` for the $compound parameter
+ * to specify that this should be attached as a compound class.
+ *
+ * Usage example:
+ *
+ * ```scss
+ * .mdc-foo {
+ *   color: black;
+ *
+ *   @include mdc-theme-dark {
+ *     color: white;
+ *   }
+ *
+ *   &__bar {
+ *     background: black;
+ *
+ *     @include mdc-theme-dark(".mdc-foo") {
+ *       background: white;
+ *     }
+ *   }
+ * }
+ *
+ * .mdc-foo--disabled {
+ *   opacity: .38;
+ *
+ *   @include mdc-theme-dark(".mdc-foo", true) {
+ *     opacity: .5;
+ *   }
+ * }
+ * ```
+ */
+/* TODO(sgomes): Figure out what to do about desktop font sizes. */
+/* TODO(sgomes): Figure out what to do about i18n and i18n font sizes. */
+/**
+ * Applies styles to the different types of icons that can exist in toolbars.
+ * Both .mdc-toolbar__icon and .mdc-toolbar__icon--menu share all styles except for
+ * horizontal padding.
+ */
+.mdc-toolbar {
+  display: -webkit-box;
+  display: -ms-flexbox;
+  display: flex;
+  position: relative;
+  -webkit-box-orient: vertical;
+  -webkit-box-direction: normal;
+      -ms-flex-direction: column;
+          flex-direction: column;
+  -webkit-box-pack: justify;
+      -ms-flex-pack: justify;
+          justify-content: space-between;
+  width: 100%;
+  -webkit-box-sizing: border-box;
+          box-sizing: border-box;
+  /* @alternate */
+  background-color: #3f51b5;
+  background-color: var(--mdc-theme-primary, #3f51b5);
+  /* @alternate */
+  color: white;
+  color: var(--mdc-theme-text-primary-on-primary, white); }
+  .mdc-toolbar__row {
+    display: -webkit-box;
+    display: -ms-flexbox;
+    display: flex;
+    position: relative;
+    -webkit-box-align: center;
+        -ms-flex-align: center;
+            align-items: center;
+    width: 100%;
+    height: auto;
+    min-height: 64px;
+    -webkit-box-sizing: border-box;
+            box-sizing: border-box; }
+    @media (max-width: 959px) and (orientation: landscape) {
+      .mdc-toolbar__row {
+        min-height: 48px; } }
+    @media (max-width: 599px) {
+      .mdc-toolbar__row {
+        min-height: 56px; } }
+  .mdc-toolbar__section {
+    display: -webkit-inline-box;
+    display: -ms-inline-flexbox;
+    display: inline-flex;
+    -webkit-box-flex: 1;
+        -ms-flex: 1;
+            flex: 1;
+    -webkit-box-align: start;
+        -ms-flex-align: start;
+            align-items: flex-start;
+    -webkit-box-pack: center;
+        -ms-flex-pack: center;
+            justify-content: center;
+    min-width: 0;
+    height: 100%;
+    z-index: 1; }
+    .mdc-toolbar__section--align-start {
+      -webkit-box-pack: start;
+          -ms-flex-pack: start;
+              justify-content: flex-start;
+      -webkit-box-ordinal-group: 0;
+          -ms-flex-order: -1;
+              order: -1; }
+    .mdc-toolbar__section--align-end {
+      -webkit-box-pack: end;
+          -ms-flex-pack: end;
+              justify-content: flex-end;
+      -webkit-box-ordinal-group: 2;
+          -ms-flex-order: 1;
+              order: 1; }
+  .mdc-toolbar__title {
+    font-family: Roboto, sans-serif;
+    -moz-osx-font-smoothing: grayscale;
+    -webkit-font-smoothing: antialiased;
+    font-size: 1.25rem;
+    font-weight: 500;
+    letter-spacing: 0.02em;
+    line-height: 2rem;
+    text-decoration: inherit;
+    text-transform: inherit;
+    text-overflow: ellipsis;
+    white-space: nowrap;
+    overflow: hidden;
+    -ms-flex-item-align: center;
+        align-self: center;
+    margin: 0;
+    margin-left: 24px;
+    padding: 16px 0;
+    line-height: 1.5rem;
+    z-index: 1; }
+  .mdc-toolbar__icon {
+    display: -webkit-box;
+    display: -ms-flexbox;
+    display: flex;
+    -webkit-box-align: center;
+        -ms-flex-align: center;
+            align-items: center;
+    -webkit-box-pack: center;
+        -ms-flex-pack: center;
+            justify-content: center;
+    padding: 16px 8px;
+    border: none;
+    background-color: inherit;
+    color: inherit;
+    text-decoration: none;
+    /* @alternate */
+    color: white;
+    color: var(--mdc-theme-text-primary-on-primary, white);
+    cursor: pointer; }
+  .mdc-toolbar__icon:last-child {
+    padding-right: 16px; }
+  .mdc-toolbar__icon--menu {
+    display: -webkit-box;
+    display: -ms-flexbox;
+    display: flex;
+    -webkit-box-align: center;
+        -ms-flex-align: center;
+            align-items: center;
+    -webkit-box-pack: center;
+        -ms-flex-pack: center;
+            justify-content: center;
+    padding: 16px;
+    border: none;
+    background-color: inherit;
+    color: inherit;
+    text-decoration: none;
+    /* @alternate */
+    color: white;
+    color: var(--mdc-theme-text-primary-on-primary, white);
+    padding: 16px 24px;
+    cursor: pointer; }
+
+.mdc-toolbar__icon--menu + .mdc-toolbar__title {
+  margin-left: 8px; }
+
+@media (max-width: 599px) {
+  .mdc-toolbar__icon--menu {
+    padding: 16px; }
+  .mdc-toolbar__icon:last-child {
+    padding: 16px 8px; }
+  .mdc-toolbar__title {
+    margin-left: 16px !important; } }
+
+.mdc-toolbar--fixed {
+  position: fixed;
+  top: 0;
+  left: 0;
+  z-index: 4;
+  -webkit-box-shadow: 0px 2px 4px -1px rgba(0, 0, 0, 0.2), 0px 4px 5px 0px rgba(0, 0, 0, 0.14), 0px 1px 10px 0px rgba(0, 0, 0, 0.12);
+          box-shadow: 0px 2px 4px -1px rgba(0, 0, 0, 0.2), 0px 4px 5px 0px rgba(0, 0, 0, 0.14), 0px 1px 10px 0px rgba(0, 0, 0, 0.12); }
+
+.mdc-toolbar--flexible {
+  --mdc-toolbar-ratio-to-extend-flexible: 4; }
+  .mdc-toolbar--flexible .mdc-toolbar__row:first-child {
+    height: 256px;
+    height: calc(64px * var(--mdc-toolbar-ratio-to-extend-flexible, 4)); }
+    @media (max-width: 599px) {
+      .mdc-toolbar--flexible .mdc-toolbar__row:first-child {
+        height: 224px;
+        height: calc(56px * var(--mdc-toolbar-ratio-to-extend-flexible, 4)); } }
+    .mdc-toolbar--flexible .mdc-toolbar__row:first-child::after {
+      position: absolute;
+      content: ""; }
+  .mdc-toolbar--flexible-default-behavior .mdc-toolbar__title {
+    font-family: Roboto, sans-serif;
+    -moz-osx-font-smoothing: grayscale;
+    -webkit-font-smoothing: antialiased;
+    font-size: 2.125rem;
+    font-weight: 400;
+    letter-spacing: normal;
+    line-height: 2.5rem;
+    text-decoration: inherit;
+    text-transform: inherit;
+    -ms-flex-item-align: end;
+        align-self: flex-end;
+    line-height: 1.5rem; }
+  .mdc-toolbar--flexible-default-behavior .mdc-toolbar__row:first-child::after {
+    top: 0;
+    left: 0;
+    width: 100%;
+    height: 100%;
+    -webkit-transition: opacity .2s ease;
+    transition: opacity .2s ease;
+    opacity: 1; }
+  .mdc-toolbar--flexible-default-behavior.mdc-toolbar--flexible-space-minimized .mdc-toolbar__row:first-child::after {
+    opacity: 0; }
+  .mdc-toolbar--flexible-default-behavior.mdc-toolbar--flexible-space-minimized .mdc-toolbar__title {
+    font-weight: 500; }
+
+.mdc-toolbar--waterfall.mdc-toolbar--fixed {
+  -webkit-box-shadow: 0px 0px 0px 0px rgba(0, 0, 0, 0.2), 0px 0px 0px 0px rgba(0, 0, 0, 0.14), 0px 0px 0px 0px rgba(0, 0, 0, 0.12);
+          box-shadow: 0px 0px 0px 0px rgba(0, 0, 0, 0.2), 0px 0px 0px 0px rgba(0, 0, 0, 0.14), 0px 0px 0px 0px rgba(0, 0, 0, 0.12);
+  -webkit-transition: -webkit-box-shadow 280ms cubic-bezier(0.4, 0, 0.2, 1);
+  transition: -webkit-box-shadow 280ms cubic-bezier(0.4, 0, 0.2, 1);
+  transition: box-shadow 280ms cubic-bezier(0.4, 0, 0.2, 1);
+  transition: box-shadow 280ms cubic-bezier(0.4, 0, 0.2, 1), -webkit-box-shadow 280ms cubic-bezier(0.4, 0, 0.2, 1);
+  will-change: box-shadow; }
+  .mdc-toolbar--waterfall.mdc-toolbar--fixed.mdc-toolbar--flexible-space-minimized {
+    -webkit-box-shadow: 0px 2px 4px -1px rgba(0, 0, 0, 0.2), 0px 4px 5px 0px rgba(0, 0, 0, 0.14), 0px 1px 10px 0px rgba(0, 0, 0, 0.12);
+            box-shadow: 0px 2px 4px -1px rgba(0, 0, 0, 0.2), 0px 4px 5px 0px rgba(0, 0, 0, 0.14), 0px 1px 10px 0px rgba(0, 0, 0, 0.12); }
+  .mdc-toolbar--waterfall.mdc-toolbar--fixed.mdc-toolbar--fixed-lastrow-only.mdc-toolbar--flexible-space-minimized {
+    -webkit-box-shadow: 0px 0px 0px 0px rgba(0, 0, 0, 0.2), 0px 0px 0px 0px rgba(0, 0, 0, 0.14), 0px 0px 0px 0px rgba(0, 0, 0, 0.12);
+            box-shadow: 0px 0px 0px 0px rgba(0, 0, 0, 0.2), 0px 0px 0px 0px rgba(0, 0, 0, 0.14), 0px 0px 0px 0px rgba(0, 0, 0, 0.12); }
+  .mdc-toolbar--waterfall.mdc-toolbar--fixed.mdc-toolbar--fixed-lastrow-only.mdc-toolbar--fixed-at-last-row {
+    -webkit-box-shadow: 0px 2px 4px -1px rgba(0, 0, 0, 0.2), 0px 4px 5px 0px rgba(0, 0, 0, 0.14), 0px 1px 10px 0px rgba(0, 0, 0, 0.12);
+            box-shadow: 0px 2px 4px -1px rgba(0, 0, 0, 0.2), 0px 4px 5px 0px rgba(0, 0, 0, 0.14), 0px 1px 10px 0px rgba(0, 0, 0, 0.12); }
+
+.mdc-toolbar-fixed-adjust {
+  margin-top: 64px; }
+  @media (max-width: 959px) and (orientation: landscape) {
+    .mdc-toolbar-fixed-adjust {
+      margin-top: 48px; } }
+  @media (max-width: 599px) {
+    .mdc-toolbar-fixed-adjust {
+      margin-top: 56px; } }
+
+.mdc-toolbar__section--shrink-to-fit {
+  -webkit-box-flex: 0;
+      -ms-flex: none;
+          flex: none; }
+
+/* TODO(sgomes): Figure out what to do about desktop font sizes. */
+/* TODO(sgomes): Figure out what to do about i18n and i18n font sizes. */
+/* TODO(sgomes): Figure out what to do about desktop font sizes. */
+/* TODO(sgomes): Figure out what to do about i18n and i18n font sizes. */
+.mdc-typography {
+  font-family: Roboto, sans-serif;
+  -moz-osx-font-smoothing: grayscale;
+  -webkit-font-smoothing: antialiased; }
+
+.mdc-typography--display4 {
+  font-family: Roboto, sans-serif;
+  -moz-osx-font-smoothing: grayscale;
+  -webkit-font-smoothing: antialiased;
+  font-size: 7rem;
+  font-weight: 300;
+  letter-spacing: -0.04em;
+  line-height: 7rem;
+  text-decoration: inherit;
+  text-transform: inherit; }
+
+.mdc-typography--adjust-margin.mdc-typography--display4 {
+  margin: -1rem 0 3.5rem -0.085em; }
+
+.mdc-typography--display3 {
+  font-family: Roboto, sans-serif;
+  -moz-osx-font-smoothing: grayscale;
+  -webkit-font-smoothing: antialiased;
+  font-size: 3.5rem;
+  font-weight: 400;
+  letter-spacing: -0.02em;
+  line-height: 3.5rem;
+  text-decoration: inherit;
+  text-transform: inherit; }
+
+.mdc-typography--adjust-margin.mdc-typography--display3 {
+  margin: -8px 0 64px -0.07em; }
+
+.mdc-typography--display2 {
+  font-family: Roboto, sans-serif;
+  -moz-osx-font-smoothing: grayscale;
+  -webkit-font-smoothing: antialiased;
+  font-size: 2.813rem;
+  font-weight: 400;
+  letter-spacing: normal;
+  line-height: 3rem;
+  text-decoration: inherit;
+  text-transform: inherit; }
+
+.mdc-typography--adjust-margin.mdc-typography--display2 {
+  margin: -0.5rem 0 4rem -0.07em; }
+
+.mdc-typography--display1 {
+  font-family: Roboto, sans-serif;
+  -moz-osx-font-smoothing: grayscale;
+  -webkit-font-smoothing: antialiased;
+  font-size: 2.125rem;
+  font-weight: 400;
+  letter-spacing: normal;
+  line-height: 2.5rem;
+  text-decoration: inherit;
+  text-transform: inherit; }
+
+.mdc-typography--adjust-margin.mdc-typography--display1 {
+  margin: -0.5rem 0 4rem -0.07em; }
+
+.mdc-typography--headline {
+  font-family: Roboto, sans-serif;
+  -moz-osx-font-smoothing: grayscale;
+  -webkit-font-smoothing: antialiased;
+  font-size: 1.5rem;
+  font-weight: 400;
+  letter-spacing: normal;
+  line-height: 2rem;
+  text-decoration: inherit;
+  text-transform: inherit; }
+
+.mdc-typography--adjust-margin.mdc-typography--headline {
+  margin: -0.5rem 0 1rem -0.06em; }
+
+.mdc-typography--title {
+  font-family: Roboto, sans-serif;
+  -moz-osx-font-smoothing: grayscale;
+  -webkit-font-smoothing: antialiased;
+  font-size: 1.25rem;
+  font-weight: 500;
+  letter-spacing: 0.02em;
+  line-height: 2rem;
+  text-decoration: inherit;
+  text-transform: inherit; }
+
+.mdc-typography--adjust-margin.mdc-typography--title {
+  margin: -0.5rem 0 1rem -0.05em; }
+
+.mdc-typography--subheading2 {
+  font-family: Roboto, sans-serif;
+  -moz-osx-font-smoothing: grayscale;
+  -webkit-font-smoothing: antialiased;
+  font-size: 1rem;
+  font-weight: 400;
+  letter-spacing: 0.04em;
+  line-height: 1.75rem;
+  text-decoration: inherit;
+  text-transform: inherit; }
+
+.mdc-typography--adjust-margin.mdc-typography--subheading2 {
+  margin: -0.5rem 0 1rem -0.06em; }
+
+.mdc-typography--subheading1 {
+  font-family: Roboto, sans-serif;
+  -moz-osx-font-smoothing: grayscale;
+  -webkit-font-smoothing: antialiased;
+  font-size: 0.938rem;
+  font-weight: 400;
+  letter-spacing: 0.04em;
+  line-height: 1.5rem;
+  text-decoration: inherit;
+  text-transform: inherit; }
+
+.mdc-typography--adjust-margin.mdc-typography--subheading1 {
+  margin: -0.313rem 0 0.813rem -0.06em; }
+
+.mdc-typography--body2 {
+  font-family: Roboto, sans-serif;
+  -moz-osx-font-smoothing: grayscale;
+  -webkit-font-smoothing: antialiased;
+  font-size: 0.875rem;
+  font-weight: 500;
+  letter-spacing: 0.04em;
+  line-height: 1.5rem;
+  text-decoration: inherit;
+  text-transform: inherit; }
+
+.mdc-typography--adjust-margin.mdc-typography--body2 {
+  margin: -0.25rem 0 0.75rem 0; }
+
+.mdc-typography--body1 {
+  font-family: Roboto, sans-serif;
+  -moz-osx-font-smoothing: grayscale;
+  -webkit-font-smoothing: antialiased;
+  font-size: 0.875rem;
+  font-weight: 400;
+  letter-spacing: 0.04em;
+  line-height: 1.25rem;
+  text-decoration: inherit;
+  text-transform: inherit; }
+
+.mdc-typography--adjust-margin.mdc-typography--body1 {
+  margin: -0.25rem 0 0.75rem 0; }
+
+.mdc-typography--caption {
+  font-family: Roboto, sans-serif;
+  -moz-osx-font-smoothing: grayscale;
+  -webkit-font-smoothing: antialiased;
+  font-size: 0.75rem;
+  font-weight: 400;
+  letter-spacing: 0.08em;
+  line-height: 1.25rem;
+  text-decoration: inherit;
+  text-transform: inherit; }
+
+.mdc-typography--adjust-margin.mdc-typography--caption {
+  margin: -0.5rem 0 1rem -0.04em; }
+
+.mdc-typography--button {
+  font-family: Roboto, sans-serif;
+  -moz-osx-font-smoothing: grayscale;
+  -webkit-font-smoothing: antialiased;
+  font-size: 0.875rem;
+  font-weight: 500;
+  letter-spacing: 0.04em;
+  line-height: 2.25rem;
+  text-decoration: none;
+  text-transform: uppercase; }
+
+.mdc-typography--adjust-margin.mdc-typography--button {
+  margin: inherit; }

+ 81 - 0
support/client/lib/vwf/view/lib/mdc/dist/material-components-web.css-entry

@@ -0,0 +1,81 @@
+/*!
+ Material Components for the web
+ Copyright (c) 2017 Google Inc.
+ License: Apache-2.0
+*/
+/******/ (function(modules) { // webpackBootstrap
+/******/ 	// The module cache
+/******/ 	var installedModules = {};
+/******/
+/******/ 	// The require function
+/******/ 	function __webpack_require__(moduleId) {
+/******/
+/******/ 		// Check if module is in cache
+/******/ 		if(installedModules[moduleId]) {
+/******/ 			return installedModules[moduleId].exports;
+/******/ 		}
+/******/ 		// Create a new module (and put it into the cache)
+/******/ 		var module = installedModules[moduleId] = {
+/******/ 			i: moduleId,
+/******/ 			l: false,
+/******/ 			exports: {}
+/******/ 		};
+/******/
+/******/ 		// Execute the module function
+/******/ 		modules[moduleId].call(module.exports, module, module.exports, __webpack_require__);
+/******/
+/******/ 		// Flag the module as loaded
+/******/ 		module.l = true;
+/******/
+/******/ 		// Return the exports of the module
+/******/ 		return module.exports;
+/******/ 	}
+/******/
+/******/
+/******/ 	// expose the modules object (__webpack_modules__)
+/******/ 	__webpack_require__.m = modules;
+/******/
+/******/ 	// expose the module cache
+/******/ 	__webpack_require__.c = installedModules;
+/******/
+/******/ 	// identity function for calling harmony imports with the correct context
+/******/ 	__webpack_require__.i = function(value) { return value; };
+/******/
+/******/ 	// define getter function for harmony exports
+/******/ 	__webpack_require__.d = function(exports, name, getter) {
+/******/ 		if(!__webpack_require__.o(exports, name)) {
+/******/ 			Object.defineProperty(exports, name, {
+/******/ 				configurable: false,
+/******/ 				enumerable: true,
+/******/ 				get: getter
+/******/ 			});
+/******/ 		}
+/******/ 	};
+/******/
+/******/ 	// getDefaultExport function for compatibility with non-harmony modules
+/******/ 	__webpack_require__.n = function(module) {
+/******/ 		var getter = module && module.__esModule ?
+/******/ 			function getDefault() { return module['default']; } :
+/******/ 			function getModuleExports() { return module; };
+/******/ 		__webpack_require__.d(getter, 'a', getter);
+/******/ 		return getter;
+/******/ 	};
+/******/
+/******/ 	// Object.prototype.hasOwnProperty.call
+/******/ 	__webpack_require__.o = function(object, property) { return Object.prototype.hasOwnProperty.call(object, property); };
+/******/
+/******/ 	// __webpack_public_path__
+/******/ 	__webpack_require__.p = "/assets/";
+/******/
+/******/ 	// Load entry module and return exports
+/******/ 	return __webpack_require__(__webpack_require__.s = 0);
+/******/ })
+/************************************************************************/
+/******/ ([
+/* 0 */
+/***/ (function(module, exports) {
+
+// removed by extract-text-webpack-plugin
+
+/***/ })
+/******/ ]);

+ 12486 - 0
support/client/lib/vwf/view/lib/mdc/dist/material-components-web.js

@@ -0,0 +1,12486 @@
+/*!
+ Material Components for the web
+ Copyright (c) 2017 Google Inc.
+ License: Apache-2.0
+*/
+(function webpackUniversalModuleDefinition(root, factory) {
+	if(typeof exports === 'object' && typeof module === 'object')
+		module.exports = factory();
+	else if(typeof define === 'function' && define.amd)
+		define([], factory);
+	else if(typeof exports === 'object')
+		exports["mdc"] = factory();
+	else
+		root["mdc"] = factory();
+})(this, function() {
+return /******/ (function(modules) { // webpackBootstrap
+/******/ 	// The module cache
+/******/ 	var installedModules = {};
+/******/
+/******/ 	// The require function
+/******/ 	function __webpack_require__(moduleId) {
+/******/
+/******/ 		// Check if module is in cache
+/******/ 		if(installedModules[moduleId]) {
+/******/ 			return installedModules[moduleId].exports;
+/******/ 		}
+/******/ 		// Create a new module (and put it into the cache)
+/******/ 		var module = installedModules[moduleId] = {
+/******/ 			i: moduleId,
+/******/ 			l: false,
+/******/ 			exports: {}
+/******/ 		};
+/******/
+/******/ 		// Execute the module function
+/******/ 		modules[moduleId].call(module.exports, module, module.exports, __webpack_require__);
+/******/
+/******/ 		// Flag the module as loaded
+/******/ 		module.l = true;
+/******/
+/******/ 		// Return the exports of the module
+/******/ 		return module.exports;
+/******/ 	}
+/******/
+/******/
+/******/ 	// expose the modules object (__webpack_modules__)
+/******/ 	__webpack_require__.m = modules;
+/******/
+/******/ 	// expose the module cache
+/******/ 	__webpack_require__.c = installedModules;
+/******/
+/******/ 	// identity function for calling harmony imports with the correct context
+/******/ 	__webpack_require__.i = function(value) { return value; };
+/******/
+/******/ 	// define getter function for harmony exports
+/******/ 	__webpack_require__.d = function(exports, name, getter) {
+/******/ 		if(!__webpack_require__.o(exports, name)) {
+/******/ 			Object.defineProperty(exports, name, {
+/******/ 				configurable: false,
+/******/ 				enumerable: true,
+/******/ 				get: getter
+/******/ 			});
+/******/ 		}
+/******/ 	};
+/******/
+/******/ 	// getDefaultExport function for compatibility with non-harmony modules
+/******/ 	__webpack_require__.n = function(module) {
+/******/ 		var getter = module && module.__esModule ?
+/******/ 			function getDefault() { return module['default']; } :
+/******/ 			function getModuleExports() { return module; };
+/******/ 		__webpack_require__.d(getter, 'a', getter);
+/******/ 		return getter;
+/******/ 	};
+/******/
+/******/ 	// Object.prototype.hasOwnProperty.call
+/******/ 	__webpack_require__.o = function(object, property) { return Object.prototype.hasOwnProperty.call(object, property); };
+/******/
+/******/ 	// __webpack_public_path__
+/******/ 	__webpack_require__.p = "/assets/";
+/******/
+/******/ 	// Load entry module and return exports
+/******/ 	return __webpack_require__(__webpack_require__.s = 32);
+/******/ })
+/************************************************************************/
+/******/ ([
+/* 0 */
+/***/ (function(module, __webpack_exports__, __webpack_require__) {
+
+"use strict";
+Object.defineProperty(__webpack_exports__, "__esModule", { value: true });
+/* harmony import */ var __WEBPACK_IMPORTED_MODULE_0__foundation__ = __webpack_require__(1);
+/* harmony import */ var __WEBPACK_IMPORTED_MODULE_1__component__ = __webpack_require__(2);
+/* harmony import */ var __WEBPACK_IMPORTED_MODULE_2__selection_control__ = __webpack_require__(4);
+/* harmony reexport (binding) */ __webpack_require__.d(__webpack_exports__, "MDCFoundation", function() { return __WEBPACK_IMPORTED_MODULE_0__foundation__["a"]; });
+/* harmony reexport (binding) */ __webpack_require__.d(__webpack_exports__, "MDCComponent", function() { return __WEBPACK_IMPORTED_MODULE_1__component__["a"]; });
+/* harmony reexport (binding) */ __webpack_require__.d(__webpack_exports__, "SelectionControlState", function() { return __WEBPACK_IMPORTED_MODULE_2__selection_control__["a"]; });
+/**
+ * Copyright 2016 Google Inc.
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *   http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+
+
+
+
+
+
+
+/***/ }),
+/* 1 */
+/***/ (function(module, __webpack_exports__, __webpack_require__) {
+
+"use strict";
+var _createClass = function () { function defineProperties(target, props) { for (var i = 0; i < props.length; i++) { var descriptor = props[i]; descriptor.enumerable = descriptor.enumerable || false; descriptor.configurable = true; if ("value" in descriptor) descriptor.writable = true; Object.defineProperty(target, descriptor.key, descriptor); } } return function (Constructor, protoProps, staticProps) { if (protoProps) defineProperties(Constructor.prototype, protoProps); if (staticProps) defineProperties(Constructor, staticProps); return Constructor; }; }();
+
+function _classCallCheck(instance, Constructor) { if (!(instance instanceof Constructor)) { throw new TypeError("Cannot call a class as a function"); } }
+
+/**
+ * Copyright 2016 Google Inc.
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *   http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+
+/**
+ * @template A
+ */
+var MDCFoundation = function () {
+  _createClass(MDCFoundation, null, [{
+    key: "cssClasses",
+
+    /** @return enum{cssClasses} */
+    get: function get() {
+      // Classes extending MDCFoundation should implement this method to return an object which exports every
+      // CSS class the foundation class needs as a property. e.g. {ACTIVE: 'mdc-component--active'}
+      return {};
+    }
+
+    /** @return enum{strings} */
+
+  }, {
+    key: "strings",
+    get: function get() {
+      // Classes extending MDCFoundation should implement this method to return an object which exports all
+      // semantic strings as constants. e.g. {ARIA_ROLE: 'tablist'}
+      return {};
+    }
+
+    /** @return enum{numbers} */
+
+  }, {
+    key: "numbers",
+    get: function get() {
+      // Classes extending MDCFoundation should implement this method to return an object which exports all
+      // of its semantic numbers as constants. e.g. {ANIMATION_DELAY_MS: 350}
+      return {};
+    }
+
+    /** @return {!Object} */
+
+  }, {
+    key: "defaultAdapter",
+    get: function get() {
+      // Classes extending MDCFoundation may choose to implement this getter in order to provide a convenient
+      // way of viewing the necessary methods of an adapter. In the future, this could also be used for adapter
+      // validation.
+      return {};
+    }
+
+    /**
+     * @param {A=} adapter
+     */
+
+  }]);
+
+  function MDCFoundation() {
+    var adapter = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : {};
+
+    _classCallCheck(this, MDCFoundation);
+
+    /** @protected {!A} */
+    this.adapter_ = adapter;
+  }
+
+  _createClass(MDCFoundation, [{
+    key: "init",
+    value: function init() {
+      // Subclasses should override this method to perform initialization routines (registering events, etc.)
+    }
+  }, {
+    key: "destroy",
+    value: function destroy() {
+      // Subclasses should override this method to perform de-initialization routines (de-registering events, etc.)
+    }
+  }]);
+
+  return MDCFoundation;
+}();
+
+/* harmony default export */ __webpack_exports__["a"] = (MDCFoundation);
+
+/***/ }),
+/* 2 */
+/***/ (function(module, __webpack_exports__, __webpack_require__) {
+
+"use strict";
+/* harmony import */ var __WEBPACK_IMPORTED_MODULE_0__foundation__ = __webpack_require__(1);
+var _createClass = function () { function defineProperties(target, props) { for (var i = 0; i < props.length; i++) { var descriptor = props[i]; descriptor.enumerable = descriptor.enumerable || false; descriptor.configurable = true; if ("value" in descriptor) descriptor.writable = true; Object.defineProperty(target, descriptor.key, descriptor); } } return function (Constructor, protoProps, staticProps) { if (protoProps) defineProperties(Constructor.prototype, protoProps); if (staticProps) defineProperties(Constructor, staticProps); return Constructor; }; }();
+
+function _classCallCheck(instance, Constructor) { if (!(instance instanceof Constructor)) { throw new TypeError("Cannot call a class as a function"); } }
+
+/**
+ * Copyright 2016 Google Inc.
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *   http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+
+
+
+/**
+ * @template F
+ */
+
+var MDCComponent = function () {
+  _createClass(MDCComponent, null, [{
+    key: 'attachTo',
+
+    /**
+     * @param {!Element} root
+     * @return {!MDCComponent}
+     */
+    value: function attachTo(root) {
+      // Subclasses which extend MDCBase should provide an attachTo() method that takes a root element and
+      // returns an instantiated component with its root set to that element. Also note that in the cases of
+      // subclasses, an explicit foundation class will not have to be passed in; it will simply be initialized
+      // from getDefaultFoundation().
+      return new MDCComponent(root, new __WEBPACK_IMPORTED_MODULE_0__foundation__["a" /* default */]());
+    }
+
+    /**
+     * @param {!Element} root
+     * @param {F=} foundation
+     * @param {...?} args
+     */
+
+  }]);
+
+  function MDCComponent(root) {
+    var foundation = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : undefined;
+
+    _classCallCheck(this, MDCComponent);
+
+    /** @protected {!Element} */
+    this.root_ = root;
+
+    for (var _len = arguments.length, args = Array(_len > 2 ? _len - 2 : 0), _key = 2; _key < _len; _key++) {
+      args[_key - 2] = arguments[_key];
+    }
+
+    this.initialize.apply(this, args);
+    // Note that we initialize foundation here and not within the constructor's default param so that
+    // this.root_ is defined and can be used within the foundation class.
+    /** @protected {!F} */
+    this.foundation_ = foundation === undefined ? this.getDefaultFoundation() : foundation;
+    this.foundation_.init();
+    this.initialSyncWithDOM();
+  }
+
+  _createClass(MDCComponent, [{
+    key: 'initialize',
+    value: function initialize() /* ...args */{}
+    // Subclasses can override this to do any additional setup work that would be considered part of a
+    // "constructor". Essentially, it is a hook into the parent constructor before the foundation is
+    // initialized. Any additional arguments besides root and foundation will be passed in here.
+
+
+    /**
+     * @return {!F} foundation
+     */
+
+  }, {
+    key: 'getDefaultFoundation',
+    value: function getDefaultFoundation() {
+      // Subclasses must override this method to return a properly configured foundation class for the
+      // component.
+      throw new Error('Subclasses must override getDefaultFoundation to return a properly configured ' + 'foundation class');
+    }
+  }, {
+    key: 'initialSyncWithDOM',
+    value: function initialSyncWithDOM() {
+      // Subclasses should override this method if they need to perform work to synchronize with a host DOM
+      // object. An example of this would be a form control wrapper that needs to synchronize its internal state
+      // to some property or attribute of the host DOM. Please note: this is *not* the place to perform DOM
+      // reads/writes that would cause layout / paint, as this is called synchronously from within the constructor.
+    }
+  }, {
+    key: 'destroy',
+    value: function destroy() {
+      // Subclasses may implement this method to release any resources / deregister any listeners they have
+      // attached. An example of this might be deregistering a resize event from the window object.
+      this.foundation_.destroy();
+    }
+
+    /**
+     * Wrapper method to add an event listener to the component's root element. This is most useful when
+     * listening for custom events.
+     * @param {string} evtType
+     * @param {!Function} handler
+     */
+
+  }, {
+    key: 'listen',
+    value: function listen(evtType, handler) {
+      this.root_.addEventListener(evtType, handler);
+    }
+
+    /**
+     * Wrapper method to remove an event listener to the component's root element. This is most useful when
+     * unlistening for custom events.
+     * @param {string} evtType
+     * @param {!Function} handler
+     */
+
+  }, {
+    key: 'unlisten',
+    value: function unlisten(evtType, handler) {
+      this.root_.removeEventListener(evtType, handler);
+    }
+
+    /**
+     * Fires a cross-browser-compatible custom event from the component root of the given type,
+     * with the given data.
+     * @param {string} evtType
+     * @param {!Object} evtData
+     * @param {boolean=} shouldBubble
+     */
+
+  }, {
+    key: 'emit',
+    value: function emit(evtType, evtData) {
+      var shouldBubble = arguments.length > 2 && arguments[2] !== undefined ? arguments[2] : false;
+
+      var evt = void 0;
+      if (typeof CustomEvent === 'function') {
+        evt = new CustomEvent(evtType, {
+          detail: evtData,
+          bubbles: shouldBubble
+        });
+      } else {
+        evt = document.createEvent('CustomEvent');
+        evt.initCustomEvent(evtType, shouldBubble, false, evtData);
+      }
+
+      this.root_.dispatchEvent(evt);
+    }
+  }]);
+
+  return MDCComponent;
+}();
+
+/* harmony default export */ __webpack_exports__["a"] = (MDCComponent);
+
+/***/ }),
+/* 3 */
+/***/ (function(module, __webpack_exports__, __webpack_require__) {
+
+"use strict";
+Object.defineProperty(__webpack_exports__, "__esModule", { value: true });
+/* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, "MDCRipple", function() { return MDCRipple; });
+/* harmony import */ var __WEBPACK_IMPORTED_MODULE_0__material_base_component__ = __webpack_require__(2);
+/* harmony import */ var __WEBPACK_IMPORTED_MODULE_1__adapter__ = __webpack_require__(10);
+/* harmony import */ var __WEBPACK_IMPORTED_MODULE_2__foundation__ = __webpack_require__(64);
+/* harmony import */ var __WEBPACK_IMPORTED_MODULE_3__util__ = __webpack_require__(11);
+/* harmony reexport (binding) */ __webpack_require__.d(__webpack_exports__, "MDCRippleFoundation", function() { return __WEBPACK_IMPORTED_MODULE_2__foundation__["a"]; });
+/* harmony reexport (module object) */ __webpack_require__.d(__webpack_exports__, "util", function() { return __WEBPACK_IMPORTED_MODULE_3__util__; });
+var _createClass = function () { function defineProperties(target, props) { for (var i = 0; i < props.length; i++) { var descriptor = props[i]; descriptor.enumerable = descriptor.enumerable || false; descriptor.configurable = true; if ("value" in descriptor) descriptor.writable = true; Object.defineProperty(target, descriptor.key, descriptor); } } return function (Constructor, protoProps, staticProps) { if (protoProps) defineProperties(Constructor.prototype, protoProps); if (staticProps) defineProperties(Constructor, staticProps); return Constructor; }; }();
+
+function _classCallCheck(instance, Constructor) { if (!(instance instanceof Constructor)) { throw new TypeError("Cannot call a class as a function"); } }
+
+function _possibleConstructorReturn(self, call) { if (!self) { throw new ReferenceError("this hasn't been initialised - super() hasn't been called"); } return call && (typeof call === "object" || typeof call === "function") ? call : self; }
+
+function _inherits(subClass, superClass) { if (typeof superClass !== "function" && superClass !== null) { throw new TypeError("Super expression must either be null or a function, not " + typeof superClass); } subClass.prototype = Object.create(superClass && superClass.prototype, { constructor: { value: subClass, enumerable: false, writable: true, configurable: true } }); if (superClass) Object.setPrototypeOf ? Object.setPrototypeOf(subClass, superClass) : subClass.__proto__ = superClass; }
+
+/**
+ * Copyright 2016 Google Inc. All Rights Reserved.
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *      http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+
+
+
+
+
+
+
+
+
+/**
+ * @extends MDCComponent<!MDCRippleFoundation>
+ */
+var MDCRipple = function (_MDCComponent) {
+  _inherits(MDCRipple, _MDCComponent);
+
+  /** @param {...?} args */
+  function MDCRipple() {
+    var _ref;
+
+    _classCallCheck(this, MDCRipple);
+
+    for (var _len = arguments.length, args = Array(_len), _key = 0; _key < _len; _key++) {
+      args[_key] = arguments[_key];
+    }
+
+    /** @type {boolean} */
+    var _this = _possibleConstructorReturn(this, (_ref = MDCRipple.__proto__ || Object.getPrototypeOf(MDCRipple)).call.apply(_ref, [this].concat(args)));
+
+    _this.disabled = false;
+
+    /** @private {boolean} */
+    _this.unbounded_;
+    return _this;
+  }
+
+  /**
+   * @param {!Element} root
+   * @param {{isUnbounded: (boolean|undefined)}=} options
+   * @return {!MDCRipple}
+   */
+
+
+  _createClass(MDCRipple, [{
+    key: 'activate',
+    value: function activate() {
+      this.foundation_.activate();
+    }
+  }, {
+    key: 'deactivate',
+    value: function deactivate() {
+      this.foundation_.deactivate();
+    }
+  }, {
+    key: 'layout',
+    value: function layout() {
+      this.foundation_.layout();
+    }
+
+    /** @return {!MDCRippleFoundation} */
+
+  }, {
+    key: 'getDefaultFoundation',
+    value: function getDefaultFoundation() {
+      return new __WEBPACK_IMPORTED_MODULE_2__foundation__["a" /* default */](MDCRipple.createAdapter(this));
+    }
+  }, {
+    key: 'initialSyncWithDOM',
+    value: function initialSyncWithDOM() {
+      this.unbounded = 'mdcRippleIsUnbounded' in this.root_.dataset;
+    }
+  }, {
+    key: 'unbounded',
+
+
+    /** @return {boolean} */
+    get: function get() {
+      return this.unbounded_;
+    }
+
+    /** @param {boolean} unbounded */
+    ,
+    set: function set(unbounded) {
+      var UNBOUNDED = __WEBPACK_IMPORTED_MODULE_2__foundation__["a" /* default */].cssClasses.UNBOUNDED;
+
+      this.unbounded_ = Boolean(unbounded);
+      if (this.unbounded_) {
+        this.root_.classList.add(UNBOUNDED);
+      } else {
+        this.root_.classList.remove(UNBOUNDED);
+      }
+    }
+  }], [{
+    key: 'attachTo',
+    value: function attachTo(root) {
+      var _ref2 = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : {},
+          _ref2$isUnbounded = _ref2.isUnbounded,
+          isUnbounded = _ref2$isUnbounded === undefined ? undefined : _ref2$isUnbounded;
+
+      var ripple = new MDCRipple(root);
+      // Only override unbounded behavior if option is explicitly specified
+      if (isUnbounded !== undefined) {
+        ripple.unbounded = /** @type {boolean} */isUnbounded;
+      }
+      return ripple;
+    }
+
+    /**
+     * @param {!RippleCapableSurface} instance
+     * @return {!MDCRippleAdapter}
+     */
+
+  }, {
+    key: 'createAdapter',
+    value: function createAdapter(instance) {
+      var MATCHES = __WEBPACK_IMPORTED_MODULE_3__util__["getMatchesProperty"](HTMLElement.prototype);
+
+      return {
+        browserSupportsCssVars: function browserSupportsCssVars() {
+          return __WEBPACK_IMPORTED_MODULE_3__util__["supportsCssVariables"](window);
+        },
+        isUnbounded: function isUnbounded() {
+          return instance.unbounded;
+        },
+        isSurfaceActive: function isSurfaceActive() {
+          return instance.root_[MATCHES](':active');
+        },
+        isSurfaceDisabled: function isSurfaceDisabled() {
+          return instance.disabled;
+        },
+        addClass: function addClass(className) {
+          return instance.root_.classList.add(className);
+        },
+        removeClass: function removeClass(className) {
+          return instance.root_.classList.remove(className);
+        },
+        registerInteractionHandler: function registerInteractionHandler(evtType, handler) {
+          return instance.root_.addEventListener(evtType, handler, __WEBPACK_IMPORTED_MODULE_3__util__["applyPassive"]());
+        },
+        deregisterInteractionHandler: function deregisterInteractionHandler(evtType, handler) {
+          return instance.root_.removeEventListener(evtType, handler, __WEBPACK_IMPORTED_MODULE_3__util__["applyPassive"]());
+        },
+        registerResizeHandler: function registerResizeHandler(handler) {
+          return window.addEventListener('resize', handler);
+        },
+        deregisterResizeHandler: function deregisterResizeHandler(handler) {
+          return window.removeEventListener('resize', handler);
+        },
+        updateCssVariable: function updateCssVariable(varName, value) {
+          return instance.root_.style.setProperty(varName, value);
+        },
+        computeBoundingRect: function computeBoundingRect() {
+          return instance.root_.getBoundingClientRect();
+        },
+        getWindowPageOffset: function getWindowPageOffset() {
+          return { x: window.pageXOffset, y: window.pageYOffset };
+        }
+      };
+    }
+  }]);
+
+  return MDCRipple;
+}(__WEBPACK_IMPORTED_MODULE_0__material_base_component__["a" /* default */]);
+
+/**
+ * See Material Design spec for more details on when to use ripples.
+ * https://material.io/guidelines/motion/choreography.html#choreography-creation
+ * @record
+ */
+
+var RippleCapableSurface = function RippleCapableSurface() {
+  _classCallCheck(this, RippleCapableSurface);
+};
+
+/** @protected {!Element} */
+
+
+RippleCapableSurface.prototype.root_;
+
+/**
+ * Whether or not the ripple bleeds out of the bounds of the element.
+ * @type {boolean|undefined}
+ */
+RippleCapableSurface.prototype.unbounded;
+
+/**
+ * Whether or not the ripple is attached to a disabled component.
+ * @type {boolean|undefined}
+ */
+RippleCapableSurface.prototype.disabled;
+
+/***/ }),
+/* 4 */
+/***/ (function(module, __webpack_exports__, __webpack_require__) {
+
+"use strict";
+/* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, "a", function() { return SelectionControlState; });
+/**
+ * Copyright 2017 Google Inc. All Rights Reserved.
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *      http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+
+/**
+ * @typedef {!{
+ *   checked: boolean,
+ *   indeterminate: boolean,
+ *   disabled: boolean,
+ *   value: ?string
+ * }}
+ */
+var SelectionControlState = void 0;
+
+/***/ }),
+/* 5 */
+/***/ (function(module, __webpack_exports__, __webpack_require__) {
+
+"use strict";
+/* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, "c", function() { return transformStyleProperties; });
+/* harmony export (immutable) */ __webpack_exports__["b"] = getCorrectEventName;
+/* harmony export (immutable) */ __webpack_exports__["a"] = getCorrectPropertyName;
+/**
+ * Copyright 2016 Google Inc. All Rights Reserved.
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *      http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+
+/**
+ * @typedef {{
+ *   noPrefix: string,
+ *   webkitPrefix: string
+ * }}
+ */
+var VendorPropertyMapType = void 0;
+
+/** @const {Object<string, !VendorPropertyMapType>} */
+var eventTypeMap = {
+  'animationstart': {
+    noPrefix: 'animationstart',
+    webkitPrefix: 'webkitAnimationStart',
+    styleProperty: 'animation'
+  },
+  'animationend': {
+    noPrefix: 'animationend',
+    webkitPrefix: 'webkitAnimationEnd',
+    styleProperty: 'animation'
+  },
+  'animationiteration': {
+    noPrefix: 'animationiteration',
+    webkitPrefix: 'webkitAnimationIteration',
+    styleProperty: 'animation'
+  },
+  'transitionend': {
+    noPrefix: 'transitionend',
+    webkitPrefix: 'webkitTransitionEnd',
+    styleProperty: 'transition'
+  }
+};
+
+/** @const {Object<string, !VendorPropertyMapType>} */
+var cssPropertyMap = {
+  'animation': {
+    noPrefix: 'animation',
+    webkitPrefix: '-webkit-animation'
+  },
+  'transform': {
+    noPrefix: 'transform',
+    webkitPrefix: '-webkit-transform'
+  },
+  'transition': {
+    noPrefix: 'transition',
+    webkitPrefix: '-webkit-transition'
+  }
+};
+
+/**
+ * @param {!Object} windowObj
+ * @return {boolean}
+ */
+function hasProperShape(windowObj) {
+  return windowObj['document'] !== undefined && typeof windowObj['document']['createElement'] === 'function';
+}
+
+/**
+ * @param {string} eventType
+ * @return {boolean}
+ */
+function eventFoundInMaps(eventType) {
+  return eventType in eventTypeMap || eventType in cssPropertyMap;
+}
+
+/**
+ * @param {string} eventType
+ * @param {!Object<string, !VendorPropertyMapType>} map
+ * @param {!Element} el
+ * @return {string}
+ */
+function getJavaScriptEventName(eventType, map, el) {
+  return map[eventType].styleProperty in el.style ? map[eventType].noPrefix : map[eventType].webkitPrefix;
+}
+
+/**
+ * Helper function to determine browser prefix for CSS3 animation events
+ * and property names.
+ * @param {!Object} windowObj
+ * @param {string} eventType
+ * @return {string}
+ */
+function getAnimationName(windowObj, eventType) {
+  if (!hasProperShape(windowObj) || !eventFoundInMaps(eventType)) {
+    return eventType;
+  }
+
+  var map = /** @type {!Object<string, !VendorPropertyMapType>} */eventType in eventTypeMap ? eventTypeMap : cssPropertyMap;
+  var el = windowObj['document']['createElement']('div');
+  var eventName = '';
+
+  if (map === eventTypeMap) {
+    eventName = getJavaScriptEventName(eventType, map, el);
+  } else {
+    eventName = map[eventType].noPrefix in el.style ? map[eventType].noPrefix : map[eventType].webkitPrefix;
+  }
+
+  return eventName;
+}
+
+// Public functions to access getAnimationName() for JavaScript events or CSS
+// property names.
+
+var transformStyleProperties = ['transform', 'WebkitTransform', 'MozTransform', 'OTransform', 'MSTransform'];
+
+/**
+ * @param {!Object} windowObj
+ * @param {string} eventType
+ * @return {string}
+ */
+function getCorrectEventName(windowObj, eventType) {
+  return getAnimationName(windowObj, eventType);
+}
+
+/**
+ * @param {!Object} windowObj
+ * @param {string} eventType
+ * @return {string}
+ */
+function getCorrectPropertyName(windowObj, eventType) {
+  return getAnimationName(windowObj, eventType);
+}
+
+/***/ }),
+/* 6 */
+/***/ (function(module, __webpack_exports__, __webpack_require__) {
+
+"use strict";
+/* harmony import */ var __WEBPACK_IMPORTED_MODULE_0__constants__ = __webpack_require__(42);
+/* harmony reexport (binding) */ __webpack_require__.d(__webpack_exports__, "b", function() { return __WEBPACK_IMPORTED_MODULE_0__constants__["a"]; });
+/* harmony import */ var __WEBPACK_IMPORTED_MODULE_1__foundation__ = __webpack_require__(43);
+/* harmony reexport (binding) */ __webpack_require__.d(__webpack_exports__, "a", function() { return __WEBPACK_IMPORTED_MODULE_1__foundation__["a"]; });
+/**
+ * Copyright 2016 Google Inc. All Rights Reserved.
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *      http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+
+
+
+
+/***/ }),
+/* 7 */
+/***/ (function(module, __webpack_exports__, __webpack_require__) {
+
+"use strict";
+Object.defineProperty(__webpack_exports__, "__esModule", { value: true });
+/* harmony import */ var __WEBPACK_IMPORTED_MODULE_0__util__ = __webpack_require__(9);
+/* harmony import */ var __WEBPACK_IMPORTED_MODULE_1__simple__ = __webpack_require__(59);
+/* harmony reexport (binding) */ __webpack_require__.d(__webpack_exports__, "MDCSimpleMenu", function() { return __WEBPACK_IMPORTED_MODULE_1__simple__["a"]; });
+/* harmony reexport (binding) */ __webpack_require__.d(__webpack_exports__, "MDCSimpleMenuFoundation", function() { return __WEBPACK_IMPORTED_MODULE_1__simple__["b"]; });
+/* harmony reexport (module object) */ __webpack_require__.d(__webpack_exports__, "util", function() { return __WEBPACK_IMPORTED_MODULE_0__util__; });
+/**
+ * Copyright 2016 Google Inc. All Rights Reserved.
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *      http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+
+
+
+
+
+/***/ }),
+/* 8 */
+/***/ (function(module, __webpack_exports__, __webpack_require__) {
+
+"use strict";
+Object.defineProperty(__webpack_exports__, "__esModule", { value: true });
+/* harmony export (immutable) */ __webpack_exports__["remapEvent"] = remapEvent;
+/* harmony export (immutable) */ __webpack_exports__["getTransformPropertyName"] = getTransformPropertyName;
+/* harmony export (immutable) */ __webpack_exports__["supportsCssCustomProperties"] = supportsCssCustomProperties;
+/* harmony export (immutable) */ __webpack_exports__["applyPassive"] = applyPassive;
+/* harmony export (immutable) */ __webpack_exports__["saveElementTabState"] = saveElementTabState;
+/* harmony export (immutable) */ __webpack_exports__["restoreElementTabState"] = restoreElementTabState;
+/**
+ * Copyright 2016 Google Inc. All Rights Reserved.
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *      http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+
+var TAB_DATA = 'data-mdc-tabindex';
+var TAB_DATA_HANDLED = 'data-mdc-tabindex-handled';
+
+var storedTransformPropertyName_ = void 0;
+var supportsPassive_ = void 0;
+
+// Remap touch events to pointer events, if the browser doesn't support touch events.
+function remapEvent(eventName) {
+  var globalObj = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : window;
+
+  if (!('ontouchstart' in globalObj.document)) {
+    switch (eventName) {
+      case 'touchstart':
+        return 'pointerdown';
+      case 'touchmove':
+        return 'pointermove';
+      case 'touchend':
+        return 'pointerup';
+      default:
+        return eventName;
+    }
+  }
+
+  return eventName;
+}
+
+// Choose the correct transform property to use on the current browser.
+function getTransformPropertyName() {
+  var globalObj = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : window;
+  var forceRefresh = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : false;
+
+  if (storedTransformPropertyName_ === undefined || forceRefresh) {
+    var el = globalObj.document.createElement('div');
+    var transformPropertyName = 'transform' in el.style ? 'transform' : '-webkit-transform';
+    storedTransformPropertyName_ = transformPropertyName;
+  }
+
+  return storedTransformPropertyName_;
+}
+
+// Determine whether the current browser supports CSS properties.
+function supportsCssCustomProperties() {
+  var globalObj = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : window;
+
+  if ('CSS' in globalObj) {
+    return globalObj.CSS.supports('(--color: red)');
+  }
+  return false;
+}
+
+// Determine whether the current browser supports passive event listeners, and if so, use them.
+function applyPassive() {
+  var globalObj = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : window;
+  var forceRefresh = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : false;
+
+  if (supportsPassive_ === undefined || forceRefresh) {
+    var isSupported = false;
+    try {
+      globalObj.document.addEventListener('test', null, { get passive() {
+          isSupported = true;
+        } });
+    } catch (e) {}
+
+    supportsPassive_ = isSupported;
+  }
+
+  return supportsPassive_ ? { passive: true } : false;
+}
+
+// Save the tab state for an element.
+function saveElementTabState(el) {
+  if (el.hasAttribute('tabindex')) {
+    el.setAttribute(TAB_DATA, el.getAttribute('tabindex'));
+  }
+  el.setAttribute(TAB_DATA_HANDLED, true);
+}
+
+// Restore the tab state for an element, if it was saved.
+function restoreElementTabState(el) {
+  // Only modify elements we've already handled, in case anything was dynamically added since we saved state.
+  if (el.hasAttribute(TAB_DATA_HANDLED)) {
+    if (el.hasAttribute(TAB_DATA)) {
+      el.setAttribute('tabindex', el.getAttribute(TAB_DATA));
+      el.removeAttribute(TAB_DATA);
+    } else {
+      el.removeAttribute('tabindex');
+    }
+    el.removeAttribute(TAB_DATA_HANDLED);
+  }
+}
+
+/***/ }),
+/* 9 */
+/***/ (function(module, __webpack_exports__, __webpack_require__) {
+
+"use strict";
+Object.defineProperty(__webpack_exports__, "__esModule", { value: true });
+/* harmony export (immutable) */ __webpack_exports__["getTransformPropertyName"] = getTransformPropertyName;
+/* harmony export (immutable) */ __webpack_exports__["clamp"] = clamp;
+/* harmony export (immutable) */ __webpack_exports__["bezierProgress"] = bezierProgress;
+/**
+ * Copyright 2016 Google Inc. All Rights Reserved.
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *      http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+
+/** @type {string|undefined} */
+var storedTransformPropertyName_ = void 0;
+
+/**
+ * Returns the name of the correct transform property to use on the current browser.
+ * @param {!Window} globalObj
+ * @param {boolean=} forceRefresh
+ * @return {string}
+ */
+function getTransformPropertyName(globalObj) {
+  var forceRefresh = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : false;
+
+  if (storedTransformPropertyName_ === undefined || forceRefresh) {
+    var el = globalObj.document.createElement('div');
+    var transformPropertyName = 'transform' in el.style ? 'transform' : 'webkitTransform';
+    storedTransformPropertyName_ = transformPropertyName;
+  }
+
+  return storedTransformPropertyName_;
+}
+
+/**
+ * Clamps a value between the minimum and the maximum, returning the clamped value.
+ * @param {number} value
+ * @param {number} min
+ * @param {number} max
+ * @return {number}
+ */
+function clamp(value) {
+  var min = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : 0;
+  var max = arguments.length > 2 && arguments[2] !== undefined ? arguments[2] : 1;
+
+  return Math.min(max, Math.max(min, value));
+}
+
+/**
+ * Returns the easing value to apply at time t, for a given cubic bezier curve.
+ * Control points P0 and P3 are assumed to be (0,0) and (1,1), respectively.
+ * Parameters are as follows:
+ * - time: The current time in the animation, scaled between 0 and 1.
+ * - x1: The x value of control point P1.
+ * - y1: The y value of control point P1.
+ * - x2: The x value of control point P2.
+ * - y2: The y value of control point P2.
+ * @param {number} time
+ * @param {number} x1
+ * @param {number} y1
+ * @param {number} x2
+ * @param {number} y2
+ * @return {number}
+ */
+function bezierProgress(time, x1, y1, x2, y2) {
+  return getBezierCoordinate_(solvePositionFromXValue_(time, x1, x2), y1, y2);
+}
+
+/**
+ * Compute a single coordinate at a position point between 0 and 1.
+ * c1 and c2 are the matching coordinate on control points P1 and P2, respectively.
+ * Control points P0 and P3 are assumed to be (0,0) and (1,1), respectively.
+ * Adapted from https://github.com/google/closure-library/blob/master/closure/goog/math/bezier.js.
+ * @param {number} t
+ * @param {number} c1
+ * @param {number} c2
+ * @return {number}
+ */
+function getBezierCoordinate_(t, c1, c2) {
+  // Special case start and end.
+  if (t === 0 || t === 1) {
+    return t;
+  }
+
+  // Step one - from 4 points to 3
+  var ic0 = t * c1;
+  var ic1 = c1 + t * (c2 - c1);
+  var ic2 = c2 + t * (1 - c2);
+
+  // Step two - from 3 points to 2
+  ic0 += t * (ic1 - ic0);
+  ic1 += t * (ic2 - ic1);
+
+  // Final step - last point
+  return ic0 + t * (ic1 - ic0);
+}
+
+/**
+ * Project a point onto the Bezier curve, from a given X. Calculates the position t along the curve.
+ * Adapted from https://github.com/google/closure-library/blob/master/closure/goog/math/bezier.js.
+ * @param {number} xVal
+ * @param {number} x1
+ * @param {number} x2
+ * @return {number}
+ */
+function solvePositionFromXValue_(xVal, x1, x2) {
+  var EPSILON = 1e-6;
+  var MAX_ITERATIONS = 8;
+
+  if (xVal <= 0) {
+    return 0;
+  } else if (xVal >= 1) {
+    return 1;
+  }
+
+  // Initial estimate of t using linear interpolation.
+  var t = xVal;
+
+  // Try gradient descent to solve for t. If it works, it is very fast.
+  var tMin = 0;
+  var tMax = 1;
+  var value = 0;
+  for (var i = 0; i < MAX_ITERATIONS; i++) {
+    value = getBezierCoordinate_(t, x1, x2);
+    var derivative = (getBezierCoordinate_(t + EPSILON, x1, x2) - value) / EPSILON;
+    if (Math.abs(value - xVal) < EPSILON) {
+      return t;
+    } else if (Math.abs(derivative) < EPSILON) {
+      break;
+    } else {
+      if (value < xVal) {
+        tMin = t;
+      } else {
+        tMax = t;
+      }
+      t -= (value - xVal) / derivative;
+    }
+  }
+
+  // If the gradient descent got stuck in a local minimum, e.g. because
+  // the derivative was close to 0, use a Dichotomy refinement instead.
+  // We limit the number of interations to 8.
+  for (var _i = 0; Math.abs(value - xVal) > EPSILON && _i < MAX_ITERATIONS; _i++) {
+    if (value < xVal) {
+      tMin = t;
+      t = (t + tMax) / 2;
+    } else {
+      tMax = t;
+      t = (t + tMin) / 2;
+    }
+    value = getBezierCoordinate_(t, x1, x2);
+  }
+  return t;
+}
+
+/***/ }),
+/* 10 */
+/***/ (function(module, __webpack_exports__, __webpack_require__) {
+
+"use strict";
+var _createClass = function () { function defineProperties(target, props) { for (var i = 0; i < props.length; i++) { var descriptor = props[i]; descriptor.enumerable = descriptor.enumerable || false; descriptor.configurable = true; if ("value" in descriptor) descriptor.writable = true; Object.defineProperty(target, descriptor.key, descriptor); } } return function (Constructor, protoProps, staticProps) { if (protoProps) defineProperties(Constructor.prototype, protoProps); if (staticProps) defineProperties(Constructor, staticProps); return Constructor; }; }();
+
+function _classCallCheck(instance, Constructor) { if (!(instance instanceof Constructor)) { throw new TypeError("Cannot call a class as a function"); } }
+
+/**
+ * Copyright 2016 Google Inc. All Rights Reserved.
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *      http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+
+/* eslint no-unused-vars: [2, {"args": "none"}] */
+
+/**
+ * Adapter for MDC Ripple. Provides an interface for managing
+ * - classes
+ * - dom
+ * - CSS variables
+ * - position
+ * - dimensions
+ * - scroll position
+ * - event handlers
+ * - unbounded, active and disabled states
+ *
+ * Additionally, provides type information for the adapter to the Closure
+ * compiler.
+ *
+ * Implement this adapter for your framework of choice to delegate updates to
+ * the component in your framework of choice. See architecture documentation
+ * for more details.
+ * https://github.com/material-components/material-components-web/blob/master/docs/architecture.md
+ *
+ * @record
+ */
+var MDCRippleAdapter = function () {
+  function MDCRippleAdapter() {
+    _classCallCheck(this, MDCRippleAdapter);
+  }
+
+  _createClass(MDCRippleAdapter, [{
+    key: "browserSupportsCssVars",
+
+    /** @return {boolean} */
+    value: function browserSupportsCssVars() {}
+
+    /** @return {boolean} */
+
+  }, {
+    key: "isUnbounded",
+    value: function isUnbounded() {}
+
+    /** @return {boolean} */
+
+  }, {
+    key: "isSurfaceActive",
+    value: function isSurfaceActive() {}
+
+    /** @return {boolean} */
+
+  }, {
+    key: "isSurfaceDisabled",
+    value: function isSurfaceDisabled() {}
+
+    /** @param {string} className */
+
+  }, {
+    key: "addClass",
+    value: function addClass(className) {}
+
+    /** @param {string} className */
+
+  }, {
+    key: "removeClass",
+    value: function removeClass(className) {}
+
+    /**
+     * @param {string} evtType
+     * @param {!Function} handler
+     */
+
+  }, {
+    key: "registerInteractionHandler",
+    value: function registerInteractionHandler(evtType, handler) {}
+
+    /**
+     * @param {string} evtType
+     * @param {!Function} handler
+     */
+
+  }, {
+    key: "deregisterInteractionHandler",
+    value: function deregisterInteractionHandler(evtType, handler) {}
+
+    /**
+     * @param {!Function} handler
+     */
+
+  }, {
+    key: "registerResizeHandler",
+    value: function registerResizeHandler(handler) {}
+
+    /**
+     * @param {!Function} handler
+     */
+
+  }, {
+    key: "deregisterResizeHandler",
+    value: function deregisterResizeHandler(handler) {}
+
+    /**
+     * @param {string} varName
+     * @param {?number|string} value
+     */
+
+  }, {
+    key: "updateCssVariable",
+    value: function updateCssVariable(varName, value) {}
+
+    /** @return {!ClientRect} */
+
+  }, {
+    key: "computeBoundingRect",
+    value: function computeBoundingRect() {}
+
+    /** @return {{x: number, y: number}} */
+
+  }, {
+    key: "getWindowPageOffset",
+    value: function getWindowPageOffset() {}
+  }]);
+
+  return MDCRippleAdapter;
+}();
+
+/* unused harmony default export */ var _unused_webpack_default_export = (MDCRippleAdapter);
+
+/***/ }),
+/* 11 */
+/***/ (function(module, __webpack_exports__, __webpack_require__) {
+
+"use strict";
+Object.defineProperty(__webpack_exports__, "__esModule", { value: true });
+/* harmony export (immutable) */ __webpack_exports__["supportsCssVariables"] = supportsCssVariables;
+/* harmony export (immutable) */ __webpack_exports__["applyPassive"] = applyPassive;
+/* harmony export (immutable) */ __webpack_exports__["getMatchesProperty"] = getMatchesProperty;
+/* harmony export (immutable) */ __webpack_exports__["getNormalizedEventCoords"] = getNormalizedEventCoords;
+/**
+ * Copyright 2016 Google Inc. All Rights Reserved.
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *      http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+
+/**
+ * Stores result from supportsCssVariables to avoid redundant processing to detect CSS custom variable support.
+ * @private {boolean|undefined}
+ */
+var supportsCssVariables_ = void 0;
+
+/**
+ * Stores result from applyPassive to avoid redundant processing to detect passive event listener support.
+ * @private {boolean|undefined}
+ */
+var supportsPassive_ = void 0;
+
+/**
+ * @param {!Window} windowObj
+ * @return {boolean}
+ */
+function detectEdgePseudoVarBug(windowObj) {
+  // Detect versions of Edge with buggy var() support
+  // See: https://developer.microsoft.com/en-us/microsoft-edge/platform/issues/11495448/
+  var document = windowObj.document;
+  var className = 'test-edge-css-var';
+  var styleNode = document.createElement('style');
+  document.head.appendChild(styleNode);
+  var sheet = styleNode.sheet;
+  // Internet Explorer 11 requires indices to always be specified to insertRule
+  sheet.insertRule(':root { --' + className + ': 1px solid #000; }', 0);
+  sheet.insertRule('.' + className + ' { visibility: hidden; }', 1);
+  sheet.insertRule('.' + className + '::before { border: var(--' + className + '); }', 2);
+  var node = document.createElement('div');
+  node.className = className;
+  document.body.appendChild(node);
+  // Bug exists if ::before style ends up propagating to the parent element
+  var hasPseudoVarBug = windowObj.getComputedStyle(node).borderTopStyle === 'solid';
+  node.remove();
+  styleNode.remove();
+  return hasPseudoVarBug;
+}
+
+/**
+ * @param {!Window} windowObj
+ * @param {boolean=} forceRefresh
+ * @return {boolean|undefined}
+ */
+function supportsCssVariables(windowObj) {
+  var forceRefresh = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : false;
+
+  if (typeof supportsCssVariables_ === 'boolean' && !forceRefresh) {
+    return supportsCssVariables_;
+  }
+
+  var supportsFunctionPresent = windowObj.CSS && typeof windowObj.CSS.supports === 'function';
+  if (!supportsFunctionPresent) {
+    return;
+  }
+
+  var explicitlySupportsCssVars = windowObj.CSS.supports('--css-vars', 'yes');
+  // See: https://bugs.webkit.org/show_bug.cgi?id=154669
+  // See: README section on Safari
+  var weAreFeatureDetectingSafari10plus = windowObj.CSS.supports('(--css-vars: yes)') && windowObj.CSS.supports('color', '#00000000');
+
+  if (explicitlySupportsCssVars || weAreFeatureDetectingSafari10plus) {
+    supportsCssVariables_ = !detectEdgePseudoVarBug(windowObj);
+  } else {
+    supportsCssVariables_ = false;
+  }
+  return supportsCssVariables_;
+}
+
+//
+/**
+ * Determine whether the current browser supports passive event listeners, and if so, use them.
+ * @param {!Window=} globalObj
+ * @param {boolean=} forceRefresh
+ * @return {boolean|{passive: boolean}}
+ */
+function applyPassive() {
+  var globalObj = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : window;
+  var forceRefresh = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : false;
+
+  if (supportsPassive_ === undefined || forceRefresh) {
+    var isSupported = false;
+    try {
+      globalObj.document.addEventListener('test', null, { get passive() {
+          isSupported = true;
+        } });
+    } catch (e) {}
+
+    supportsPassive_ = isSupported;
+  }
+
+  return supportsPassive_ ? { passive: true } : false;
+}
+
+/**
+ * @param {!Object} HTMLElementPrototype
+ * @return {!Array<string>}
+ */
+function getMatchesProperty(HTMLElementPrototype) {
+  return ['webkitMatchesSelector', 'msMatchesSelector', 'matches'].filter(function (p) {
+    return p in HTMLElementPrototype;
+  }).pop();
+}
+
+/**
+ * @param {!Event} ev
+ * @param {!{x: number, y: number}} pageOffset
+ * @param {!ClientRect} clientRect
+ * @return {!{x: number, y: number}}
+ */
+function getNormalizedEventCoords(ev, pageOffset, clientRect) {
+  var x = pageOffset.x,
+      y = pageOffset.y;
+
+  var documentX = x + clientRect.left;
+  var documentY = y + clientRect.top;
+
+  var normalizedX = void 0;
+  var normalizedY = void 0;
+  // Determine touch point relative to the ripple container.
+  if (ev.type === 'touchstart') {
+    normalizedX = ev.changedTouches[0].pageX - documentX;
+    normalizedY = ev.changedTouches[0].pageY - documentY;
+  } else {
+    normalizedX = ev.pageX - documentX;
+    normalizedY = ev.pageY - documentY;
+  }
+
+  return { x: normalizedX, y: normalizedY };
+}
+
+/***/ }),
+/* 12 */
+/***/ (function(module, __webpack_exports__, __webpack_require__) {
+
+"use strict";
+/* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, "b", function() { return cssClasses; });
+/* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, "a", function() { return strings; });
+/* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, "c", function() { return numbers; });
+/**
+ * Copyright 2017 Google Inc. All Rights Reserved.
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ * http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+
+var cssClasses = {
+  ACTIVE: 'mdc-slider--active',
+  DISABLED: 'mdc-slider--disabled',
+  DISCRETE: 'mdc-slider--discrete',
+  FOCUS: 'mdc-slider--focus',
+  IN_TRANSIT: 'mdc-slider--in-transit',
+  OFF: 'mdc-slider--off',
+  IS_DISCRETE: 'mdc-slider--discrete',
+  HAS_TRACK_MARKER: 'mdc-slider--display-markers'
+};
+
+var strings = {
+  TRACK_SELECTOR: '.mdc-slider__track',
+  TRACK_MARKER_CONTAINER_SELECTOR: '.mdc-slider__track-marker-container',
+  LAST_TRACK_MARKER_SELECTOR: '.mdc-slider__track-marker:last-child',
+  THUMB_CONTAINER_SELECTOR: '.mdc-slider__thumb-container',
+  PIN_VALUE_MARKER_SELECTOR: '.mdc-slider__pin-value-marker',
+  ARIA_VALUEMIN: 'aria-valuemin',
+  ARIA_VALUEMAX: 'aria-valuemax',
+  ARIA_VALUENOW: 'aria-valuenow',
+  ARIA_DISABLED: 'aria-disabled',
+  STEP_DATA_ATTR: 'data-step',
+  CHANGE_EVENT: 'MDCSlider:change',
+  INPUT_EVENT: 'MDCSlider:input'
+};
+
+var numbers = {
+  PAGE_FACTOR: 4
+};
+
+/***/ }),
+/* 13 */
+/***/ (function(module, __webpack_exports__, __webpack_require__) {
+
+"use strict";
+/* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, "b", function() { return MDCTabBar; });
+/* harmony import */ var __WEBPACK_IMPORTED_MODULE_0__material_base_component__ = __webpack_require__(2);
+/* harmony import */ var __WEBPACK_IMPORTED_MODULE_1__tab__ = __webpack_require__(15);
+/* harmony import */ var __WEBPACK_IMPORTED_MODULE_2__foundation__ = __webpack_require__(74);
+/* harmony reexport (binding) */ __webpack_require__.d(__webpack_exports__, "a", function() { return __WEBPACK_IMPORTED_MODULE_2__foundation__["a"]; });
+var _createClass = function () { function defineProperties(target, props) { for (var i = 0; i < props.length; i++) { var descriptor = props[i]; descriptor.enumerable = descriptor.enumerable || false; descriptor.configurable = true; if ("value" in descriptor) descriptor.writable = true; Object.defineProperty(target, descriptor.key, descriptor); } } return function (Constructor, protoProps, staticProps) { if (protoProps) defineProperties(Constructor.prototype, protoProps); if (staticProps) defineProperties(Constructor, staticProps); return Constructor; }; }();
+
+function _classCallCheck(instance, Constructor) { if (!(instance instanceof Constructor)) { throw new TypeError("Cannot call a class as a function"); } }
+
+function _possibleConstructorReturn(self, call) { if (!self) { throw new ReferenceError("this hasn't been initialised - super() hasn't been called"); } return call && (typeof call === "object" || typeof call === "function") ? call : self; }
+
+function _inherits(subClass, superClass) { if (typeof superClass !== "function" && superClass !== null) { throw new TypeError("Super expression must either be null or a function, not " + typeof superClass); } subClass.prototype = Object.create(superClass && superClass.prototype, { constructor: { value: subClass, enumerable: false, writable: true, configurable: true } }); if (superClass) Object.setPrototypeOf ? Object.setPrototypeOf(subClass, superClass) : subClass.__proto__ = superClass; }
+
+/**
+ * Copyright 2017 Google Inc. All Rights Reserved.
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *      http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+
+
+
+
+
+
+
+
+var MDCTabBar = function (_MDCComponent) {
+  _inherits(MDCTabBar, _MDCComponent);
+
+  function MDCTabBar() {
+    _classCallCheck(this, MDCTabBar);
+
+    return _possibleConstructorReturn(this, (MDCTabBar.__proto__ || Object.getPrototypeOf(MDCTabBar)).apply(this, arguments));
+  }
+
+  _createClass(MDCTabBar, [{
+    key: 'initialize',
+    value: function initialize() {
+      var _this2 = this;
+
+      var tabFactory = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : function (el) {
+        return new __WEBPACK_IMPORTED_MODULE_1__tab__["b" /* MDCTab */](el);
+      };
+
+      this.indicator_ = this.root_.querySelector(__WEBPACK_IMPORTED_MODULE_2__foundation__["a" /* default */].strings.INDICATOR_SELECTOR);
+      this.tabs_ = this.gatherTabs_(tabFactory);
+      this.tabSelectedHandler_ = function (_ref) {
+        var detail = _ref.detail;
+        var tab = detail.tab;
+
+        _this2.setActiveTab_(tab, true);
+      };
+    }
+  }, {
+    key: 'getDefaultFoundation',
+    value: function getDefaultFoundation() {
+      var _this3 = this;
+
+      return new __WEBPACK_IMPORTED_MODULE_2__foundation__["a" /* default */]({
+        addClass: function addClass(className) {
+          return _this3.root_.classList.add(className);
+        },
+        removeClass: function removeClass(className) {
+          return _this3.root_.classList.remove(className);
+        },
+        bindOnMDCTabSelectedEvent: function bindOnMDCTabSelectedEvent() {
+          return _this3.listen(__WEBPACK_IMPORTED_MODULE_1__tab__["a" /* MDCTabFoundation */].strings.SELECTED_EVENT, _this3.tabSelectedHandler_);
+        },
+        unbindOnMDCTabSelectedEvent: function unbindOnMDCTabSelectedEvent() {
+          return _this3.unlisten(__WEBPACK_IMPORTED_MODULE_1__tab__["a" /* MDCTabFoundation */].strings.SELECTED_EVENT, _this3.tabSelectedHandler_);
+        },
+        registerResizeHandler: function registerResizeHandler(handler) {
+          return window.addEventListener('resize', handler);
+        },
+        deregisterResizeHandler: function deregisterResizeHandler(handler) {
+          return window.removeEventListener('resize', handler);
+        },
+        getOffsetWidth: function getOffsetWidth() {
+          return _this3.root_.offsetWidth;
+        },
+        setStyleForIndicator: function setStyleForIndicator(propertyName, value) {
+          return _this3.indicator_.style.setProperty(propertyName, value);
+        },
+        getOffsetWidthForIndicator: function getOffsetWidthForIndicator() {
+          return _this3.indicator_.offsetWidth;
+        },
+        notifyChange: function notifyChange(evtData) {
+          return _this3.emit(__WEBPACK_IMPORTED_MODULE_2__foundation__["a" /* default */].strings.CHANGE_EVENT, evtData);
+        },
+        getNumberOfTabs: function getNumberOfTabs() {
+          return _this3.tabs.length;
+        },
+        isTabActiveAtIndex: function isTabActiveAtIndex(index) {
+          return _this3.tabs[index].isActive;
+        },
+        setTabActiveAtIndex: function setTabActiveAtIndex(index, isActive) {
+          _this3.tabs[index].isActive = isActive;
+        },
+        isDefaultPreventedOnClickForTabAtIndex: function isDefaultPreventedOnClickForTabAtIndex(index) {
+          return _this3.tabs[index].preventDefaultOnClick;
+        },
+        setPreventDefaultOnClickForTabAtIndex: function setPreventDefaultOnClickForTabAtIndex(index, preventDefaultOnClick) {
+          _this3.tabs[index].preventDefaultOnClick = preventDefaultOnClick;
+        },
+        measureTabAtIndex: function measureTabAtIndex(index) {
+          return _this3.tabs[index].measureSelf();
+        },
+        getComputedWidthForTabAtIndex: function getComputedWidthForTabAtIndex(index) {
+          return _this3.tabs[index].computedWidth;
+        },
+        getComputedLeftForTabAtIndex: function getComputedLeftForTabAtIndex(index) {
+          return _this3.tabs[index].computedLeft;
+        }
+      });
+    }
+  }, {
+    key: 'gatherTabs_',
+    value: function gatherTabs_(tabFactory) {
+      var tabElements = [].slice.call(this.root_.querySelectorAll(__WEBPACK_IMPORTED_MODULE_2__foundation__["a" /* default */].strings.TAB_SELECTOR));
+      return tabElements.map(function (el) {
+        return tabFactory(el);
+      });
+    }
+  }, {
+    key: 'setActiveTabIndex_',
+    value: function setActiveTabIndex_(activeTabIndex, notifyChange) {
+      this.foundation_.switchToTabAtIndex(activeTabIndex, notifyChange);
+    }
+  }, {
+    key: 'layout',
+    value: function layout() {
+      this.foundation_.layout();
+    }
+  }, {
+    key: 'setActiveTab_',
+    value: function setActiveTab_(activeTab, notifyChange) {
+      var indexOfTab = this.tabs.indexOf(activeTab);
+      if (indexOfTab < 0) {
+        throw new Error('Invalid tab component given as activeTab: Tab not found within this component\'s tab list');
+      }
+      this.setActiveTabIndex_(indexOfTab, notifyChange);
+    }
+  }, {
+    key: 'tabs',
+    get: function get() {
+      return this.tabs_;
+    }
+  }, {
+    key: 'activeTab',
+    get: function get() {
+      var activeIndex = this.foundation_.getActiveTabIndex();
+      return this.tabs[activeIndex];
+    },
+    set: function set(tab) {
+      this.setActiveTab_(tab, false);
+    }
+  }, {
+    key: 'activeTabIndex',
+    get: function get() {
+      return this.foundation_.getActiveTabIndex();
+    },
+    set: function set(index) {
+      this.setActiveTabIndex_(index, false);
+    }
+  }], [{
+    key: 'attachTo',
+    value: function attachTo(root) {
+      return new MDCTabBar(root);
+    }
+  }]);
+
+  return MDCTabBar;
+}(__WEBPACK_IMPORTED_MODULE_0__material_base_component__["a" /* default */]);
+
+/***/ }),
+/* 14 */
+/***/ (function(module, __webpack_exports__, __webpack_require__) {
+
+"use strict";
+/* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, "a", function() { return cssClasses; });
+/* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, "b", function() { return strings; });
+/**
+ * Copyright 2017 Google Inc. All Rights Reserved.
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *      http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+
+var cssClasses = {
+  ACTIVE: 'mdc-tab--active'
+};
+
+var strings = {
+  SELECTED_EVENT: 'MDCTab:selected'
+};
+
+/***/ }),
+/* 15 */
+/***/ (function(module, __webpack_exports__, __webpack_require__) {
+
+"use strict";
+/* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, "b", function() { return MDCTab; });
+/* harmony import */ var __WEBPACK_IMPORTED_MODULE_0__material_base_component__ = __webpack_require__(2);
+/* harmony import */ var __WEBPACK_IMPORTED_MODULE_1__material_ripple__ = __webpack_require__(3);
+/* harmony import */ var __WEBPACK_IMPORTED_MODULE_2__constants__ = __webpack_require__(14);
+/* harmony import */ var __WEBPACK_IMPORTED_MODULE_3__foundation__ = __webpack_require__(75);
+/* harmony reexport (binding) */ __webpack_require__.d(__webpack_exports__, "a", function() { return __WEBPACK_IMPORTED_MODULE_3__foundation__["a"]; });
+var _get = function get(object, property, receiver) { if (object === null) object = Function.prototype; var desc = Object.getOwnPropertyDescriptor(object, property); if (desc === undefined) { var parent = Object.getPrototypeOf(object); if (parent === null) { return undefined; } else { return get(parent, property, receiver); } } else if ("value" in desc) { return desc.value; } else { var getter = desc.get; if (getter === undefined) { return undefined; } return getter.call(receiver); } };
+
+var _createClass = function () { function defineProperties(target, props) { for (var i = 0; i < props.length; i++) { var descriptor = props[i]; descriptor.enumerable = descriptor.enumerable || false; descriptor.configurable = true; if ("value" in descriptor) descriptor.writable = true; Object.defineProperty(target, descriptor.key, descriptor); } } return function (Constructor, protoProps, staticProps) { if (protoProps) defineProperties(Constructor.prototype, protoProps); if (staticProps) defineProperties(Constructor, staticProps); return Constructor; }; }();
+
+function _classCallCheck(instance, Constructor) { if (!(instance instanceof Constructor)) { throw new TypeError("Cannot call a class as a function"); } }
+
+function _possibleConstructorReturn(self, call) { if (!self) { throw new ReferenceError("this hasn't been initialised - super() hasn't been called"); } return call && (typeof call === "object" || typeof call === "function") ? call : self; }
+
+function _inherits(subClass, superClass) { if (typeof superClass !== "function" && superClass !== null) { throw new TypeError("Super expression must either be null or a function, not " + typeof superClass); } subClass.prototype = Object.create(superClass && superClass.prototype, { constructor: { value: subClass, enumerable: false, writable: true, configurable: true } }); if (superClass) Object.setPrototypeOf ? Object.setPrototypeOf(subClass, superClass) : subClass.__proto__ = superClass; }
+
+/**
+ * Copyright 2017 Google Inc. All Rights Reserved.
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *      http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+
+
+
+
+
+
+
+
+
+var MDCTab = function (_MDCComponent) {
+  _inherits(MDCTab, _MDCComponent);
+
+  _createClass(MDCTab, [{
+    key: 'computedWidth',
+    get: function get() {
+      return this.foundation_.getComputedWidth();
+    }
+  }, {
+    key: 'computedLeft',
+    get: function get() {
+      return this.foundation_.getComputedLeft();
+    }
+  }, {
+    key: 'isActive',
+    get: function get() {
+      return this.foundation_.isActive();
+    },
+    set: function set(isActive) {
+      this.foundation_.setActive(isActive);
+    }
+  }, {
+    key: 'preventDefaultOnClick',
+    get: function get() {
+      return this.foundation_.preventsDefaultOnClick();
+    },
+    set: function set(preventDefaultOnClick) {
+      this.foundation_.setPreventDefaultOnClick(preventDefaultOnClick);
+    }
+  }], [{
+    key: 'attachTo',
+    value: function attachTo(root) {
+      return new MDCTab(root);
+    }
+  }]);
+
+  function MDCTab() {
+    var _ref;
+
+    _classCallCheck(this, MDCTab);
+
+    for (var _len = arguments.length, args = Array(_len), _key = 0; _key < _len; _key++) {
+      args[_key] = arguments[_key];
+    }
+
+    var _this = _possibleConstructorReturn(this, (_ref = MDCTab.__proto__ || Object.getPrototypeOf(MDCTab)).call.apply(_ref, [this].concat(args)));
+
+    _this.ripple_ = __WEBPACK_IMPORTED_MODULE_1__material_ripple__["MDCRipple"].attachTo(_this.root_);
+    return _this;
+  }
+
+  _createClass(MDCTab, [{
+    key: 'destroy',
+    value: function destroy() {
+      this.ripple_.destroy();
+      _get(MDCTab.prototype.__proto__ || Object.getPrototypeOf(MDCTab.prototype), 'destroy', this).call(this);
+    }
+  }, {
+    key: 'getDefaultFoundation',
+    value: function getDefaultFoundation() {
+      var _this2 = this;
+
+      return new __WEBPACK_IMPORTED_MODULE_3__foundation__["a" /* default */]({
+        addClass: function addClass(className) {
+          return _this2.root_.classList.add(className);
+        },
+        removeClass: function removeClass(className) {
+          return _this2.root_.classList.remove(className);
+        },
+        registerInteractionHandler: function registerInteractionHandler(type, handler) {
+          return _this2.root_.addEventListener(type, handler);
+        },
+        deregisterInteractionHandler: function deregisterInteractionHandler(type, handler) {
+          return _this2.root_.removeEventListener(type, handler);
+        },
+        getOffsetWidth: function getOffsetWidth() {
+          return _this2.root_.offsetWidth;
+        },
+        getOffsetLeft: function getOffsetLeft() {
+          return _this2.root_.offsetLeft;
+        },
+        notifySelected: function notifySelected() {
+          return _this2.emit(__WEBPACK_IMPORTED_MODULE_3__foundation__["a" /* default */].strings.SELECTED_EVENT, { tab: _this2 }, true);
+        }
+      });
+    }
+  }, {
+    key: 'initialSyncWithDOM',
+    value: function initialSyncWithDOM() {
+      this.isActive = this.root_.classList.contains(__WEBPACK_IMPORTED_MODULE_2__constants__["a" /* cssClasses */].ACTIVE);
+    }
+  }, {
+    key: 'measureSelf',
+    value: function measureSelf() {
+      this.foundation_.measureSelf();
+    }
+  }]);
+
+  return MDCTab;
+}(__WEBPACK_IMPORTED_MODULE_0__material_base_component__["a" /* default */]);
+
+/***/ }),
+/* 16 */
+/***/ (function(module, __webpack_exports__, __webpack_require__) {
+
+"use strict";
+/* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, "a", function() { return strings; });
+/* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, "b", function() { return cssClasses; });
+/**
+ * Copyright 2016 Google Inc. All Rights Reserved.
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *      http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+var strings = {
+  ARIA_HIDDEN: 'aria-hidden',
+  ROLE: 'role',
+  INPUT_SELECTOR: '.mdc-textfield__input',
+  LABEL_SELECTOR: '.mdc-textfield__label'
+};
+
+var cssClasses = {
+  ROOT: 'mdc-textfield',
+  UPGRADED: 'mdc-textfield--upgraded',
+  DISABLED: 'mdc-textfield--disabled',
+  FOCUSED: 'mdc-textfield--focused',
+  INVALID: 'mdc-textfield--invalid',
+  HELPTEXT_PERSISTENT: 'mdc-textfield-helptext--persistent',
+  HELPTEXT_VALIDATION_MSG: 'mdc-textfield-helptext--validation-msg',
+  LABEL_FLOAT_ABOVE: 'mdc-textfield__label--float-above',
+  BOX: 'mdc-textfield--box'
+};
+
+/***/ }),
+/* 17 */
+/***/ (function(module, __webpack_exports__, __webpack_require__) {
+
+"use strict";
+/* harmony export (immutable) */ __webpack_exports__["a"] = mdcAutoInit;
+/**
+ * Copyright 2016 Google Inc. All Rights Reserved.
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *      http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+
+var registry = Object.create(null);
+
+var CONSOLE_WARN = console.warn.bind(console);
+
+/**
+ * Auto-initializes all mdc components on a page.
+ */
+function mdcAutoInit() {
+  var root = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : document;
+  var warn = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : CONSOLE_WARN;
+
+  var nodes = root.querySelectorAll('[data-mdc-auto-init]');
+  for (var i = 0, node; node = nodes[i]; i++) {
+    var ctorName = node.dataset.mdcAutoInit;
+    if (!ctorName) {
+      throw new Error('(mdc-auto-init) Constructor name must be given.');
+    }
+
+    var Ctor = registry[ctorName];
+    if (typeof Ctor !== 'function') {
+      throw new Error('(mdc-auto-init) Could not find constructor in registry for ' + ctorName);
+    }
+
+    if (node[ctorName]) {
+      warn('(mdc-auto-init) Component already initialized for ' + node + '. Skipping...');
+      continue;
+    }
+
+    // TODO: Should we make an eslint rule for an attachTo() static method?
+    var component = Ctor.attachTo(node);
+    Object.defineProperty(node, ctorName, {
+      value: component,
+      writable: false,
+      enumerable: false,
+      configurable: true
+    });
+  }
+}
+
+mdcAutoInit.register = function (componentName, Ctor) {
+  var warn = arguments.length > 2 && arguments[2] !== undefined ? arguments[2] : CONSOLE_WARN;
+
+  if (typeof Ctor !== 'function') {
+    throw new Error('(mdc-auto-init) Invalid Ctor value ' + Ctor + '. Expected function');
+  }
+  if (registry[componentName]) {
+    warn('(mdc-auto-init) Overriding registration for ' + componentName + ' with ' + Ctor + '. ' + ('Was: ' + registry[componentName]));
+  }
+  registry[componentName] = Ctor;
+};
+
+mdcAutoInit.deregister = function (componentName) {
+  delete registry[componentName];
+};
+
+mdcAutoInit.deregisterAll = function () {
+  Object.keys(registry).forEach(this.deregister, this);
+};
+
+/***/ }),
+/* 18 */
+/***/ (function(module, __webpack_exports__, __webpack_require__) {
+
+"use strict";
+Object.defineProperty(__webpack_exports__, "__esModule", { value: true });
+/* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, "MDCCheckbox", function() { return MDCCheckbox; });
+/* harmony import */ var __WEBPACK_IMPORTED_MODULE_0__material_animation__ = __webpack_require__(5);
+/* harmony import */ var __WEBPACK_IMPORTED_MODULE_1__material_base_component__ = __webpack_require__(2);
+/* harmony import */ var __WEBPACK_IMPORTED_MODULE_2__material_base_selection_control__ = __webpack_require__(4);
+/* harmony import */ var __WEBPACK_IMPORTED_MODULE_3__foundation__ = __webpack_require__(35);
+/* harmony import */ var __WEBPACK_IMPORTED_MODULE_4__material_ripple__ = __webpack_require__(3);
+/* harmony import */ var __WEBPACK_IMPORTED_MODULE_5__material_ripple_util__ = __webpack_require__(11);
+/* harmony reexport (binding) */ __webpack_require__.d(__webpack_exports__, "MDCCheckboxFoundation", function() { return __WEBPACK_IMPORTED_MODULE_3__foundation__["a"]; });
+var _extends = Object.assign || function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; };
+
+var _get = function get(object, property, receiver) { if (object === null) object = Function.prototype; var desc = Object.getOwnPropertyDescriptor(object, property); if (desc === undefined) { var parent = Object.getPrototypeOf(object); if (parent === null) { return undefined; } else { return get(parent, property, receiver); } } else if ("value" in desc) { return desc.value; } else { var getter = desc.get; if (getter === undefined) { return undefined; } return getter.call(receiver); } };
+
+var _createClass = function () { function defineProperties(target, props) { for (var i = 0; i < props.length; i++) { var descriptor = props[i]; descriptor.enumerable = descriptor.enumerable || false; descriptor.configurable = true; if ("value" in descriptor) descriptor.writable = true; Object.defineProperty(target, descriptor.key, descriptor); } } return function (Constructor, protoProps, staticProps) { if (protoProps) defineProperties(Constructor.prototype, protoProps); if (staticProps) defineProperties(Constructor, staticProps); return Constructor; }; }();
+
+function _classCallCheck(instance, Constructor) { if (!(instance instanceof Constructor)) { throw new TypeError("Cannot call a class as a function"); } }
+
+function _possibleConstructorReturn(self, call) { if (!self) { throw new ReferenceError("this hasn't been initialised - super() hasn't been called"); } return call && (typeof call === "object" || typeof call === "function") ? call : self; }
+
+function _inherits(subClass, superClass) { if (typeof superClass !== "function" && superClass !== null) { throw new TypeError("Super expression must either be null or a function, not " + typeof superClass); } subClass.prototype = Object.create(superClass && superClass.prototype, { constructor: { value: subClass, enumerable: false, writable: true, configurable: true } }); if (superClass) Object.setPrototypeOf ? Object.setPrototypeOf(subClass, superClass) : subClass.__proto__ = superClass; }
+
+/**
+ * Copyright 2016 Google Inc. All Rights Reserved.
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *      http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+
+
+
+/* eslint-disable no-unused-vars */
+
+/* eslint-enable no-unused-vars */
+
+
+
+
+
+
+/**
+ * @extends MDCComponent<!MDCCheckboxFoundation>
+ */
+var MDCCheckbox = function (_MDCComponent) {
+  _inherits(MDCCheckbox, _MDCComponent);
+
+  _createClass(MDCCheckbox, [{
+    key: 'nativeCb_',
+
+
+    /**
+     * Returns the state of the native control element, or null if the native control element is not present.
+     * @return {?SelectionControlState}
+     * @private
+     */
+    get: function get() {
+      var NATIVE_CONTROL_SELECTOR = __WEBPACK_IMPORTED_MODULE_3__foundation__["a" /* default */].strings.NATIVE_CONTROL_SELECTOR;
+
+      var cbEl = /** @type {?SelectionControlState} */this.root_.querySelector(NATIVE_CONTROL_SELECTOR);
+      return cbEl;
+    }
+  }], [{
+    key: 'attachTo',
+    value: function attachTo(root) {
+      return new MDCCheckbox(root);
+    }
+  }]);
+
+  function MDCCheckbox() {
+    var _ref;
+
+    _classCallCheck(this, MDCCheckbox);
+
+    for (var _len = arguments.length, args = Array(_len), _key = 0; _key < _len; _key++) {
+      args[_key] = arguments[_key];
+    }
+
+    /** @private {!MDCRipple} */
+    var _this = _possibleConstructorReturn(this, (_ref = MDCCheckbox.__proto__ || Object.getPrototypeOf(MDCCheckbox)).call.apply(_ref, [this].concat(args)));
+
+    _this.ripple_ = _this.initRipple_();
+    return _this;
+  }
+
+  /**
+   * @return {!MDCRipple}
+   * @private
+   */
+
+
+  _createClass(MDCCheckbox, [{
+    key: 'initRipple_',
+    value: function initRipple_() {
+      var _this2 = this;
+
+      var MATCHES = __webpack_require__.i(__WEBPACK_IMPORTED_MODULE_5__material_ripple_util__["getMatchesProperty"])(HTMLElement.prototype);
+      var adapter = _extends(__WEBPACK_IMPORTED_MODULE_4__material_ripple__["MDCRipple"].createAdapter(this), {
+        isUnbounded: function isUnbounded() {
+          return true;
+        },
+        isSurfaceActive: function isSurfaceActive() {
+          return _this2.nativeCb_[MATCHES](':active');
+        },
+        registerInteractionHandler: function registerInteractionHandler(type, handler) {
+          return _this2.nativeCb_.addEventListener(type, handler);
+        },
+        deregisterInteractionHandler: function deregisterInteractionHandler(type, handler) {
+          return _this2.nativeCb_.removeEventListener(type, handler);
+        },
+        computeBoundingRect: function computeBoundingRect() {
+          var _root_$getBoundingCli = _this2.root_.getBoundingClientRect(),
+              left = _root_$getBoundingCli.left,
+              top = _root_$getBoundingCli.top;
+
+          var DIM = 40;
+          return {
+            top: top,
+            left: left,
+            right: left + DIM,
+            bottom: top + DIM,
+            width: DIM,
+            height: DIM
+          };
+        }
+      });
+      var foundation = new __WEBPACK_IMPORTED_MODULE_4__material_ripple__["MDCRippleFoundation"](adapter);
+      return new __WEBPACK_IMPORTED_MODULE_4__material_ripple__["MDCRipple"](this.root_, foundation);
+    }
+
+    /** @return {!MDCCheckboxFoundation} */
+
+  }, {
+    key: 'getDefaultFoundation',
+    value: function getDefaultFoundation() {
+      var _this3 = this;
+
+      return new __WEBPACK_IMPORTED_MODULE_3__foundation__["a" /* default */]({
+        addClass: function addClass(className) {
+          return _this3.root_.classList.add(className);
+        },
+        removeClass: function removeClass(className) {
+          return _this3.root_.classList.remove(className);
+        },
+        registerAnimationEndHandler: function registerAnimationEndHandler(handler) {
+          return _this3.root_.addEventListener(__webpack_require__.i(__WEBPACK_IMPORTED_MODULE_0__material_animation__["b" /* getCorrectEventName */])(window, 'animationend'), handler);
+        },
+        deregisterAnimationEndHandler: function deregisterAnimationEndHandler(handler) {
+          return _this3.root_.removeEventListener(__webpack_require__.i(__WEBPACK_IMPORTED_MODULE_0__material_animation__["b" /* getCorrectEventName */])(window, 'animationend'), handler);
+        },
+        registerChangeHandler: function registerChangeHandler(handler) {
+          return _this3.nativeCb_.addEventListener('change', handler);
+        },
+        deregisterChangeHandler: function deregisterChangeHandler(handler) {
+          return _this3.nativeCb_.removeEventListener('change', handler);
+        },
+        getNativeControl: function getNativeControl() {
+          return _this3.nativeCb_;
+        },
+        forceLayout: function forceLayout() {
+          return _this3.root_.offsetWidth;
+        },
+        isAttachedToDOM: function isAttachedToDOM() {
+          return Boolean(_this3.root_.parentNode);
+        }
+      });
+    }
+
+    /** @return {!MDCRipple} */
+
+  }, {
+    key: 'destroy',
+    value: function destroy() {
+      this.ripple_.destroy();
+      _get(MDCCheckbox.prototype.__proto__ || Object.getPrototypeOf(MDCCheckbox.prototype), 'destroy', this).call(this);
+    }
+  }, {
+    key: 'ripple',
+    get: function get() {
+      return this.ripple_;
+    }
+
+    /** @return {boolean} */
+
+  }, {
+    key: 'checked',
+    get: function get() {
+      return this.foundation_.isChecked();
+    }
+
+    /** @param {boolean} checked */
+    ,
+    set: function set(checked) {
+      this.foundation_.setChecked(checked);
+    }
+
+    /** @return {boolean} */
+
+  }, {
+    key: 'indeterminate',
+    get: function get() {
+      return this.foundation_.isIndeterminate();
+    }
+
+    /** @param {boolean} indeterminate */
+    ,
+    set: function set(indeterminate) {
+      this.foundation_.setIndeterminate(indeterminate);
+    }
+
+    /** @return {boolean} */
+
+  }, {
+    key: 'disabled',
+    get: function get() {
+      return this.foundation_.isDisabled();
+    }
+
+    /** @param {boolean} disabled */
+    ,
+    set: function set(disabled) {
+      this.foundation_.setDisabled(disabled);
+    }
+
+    /** @return {?string} */
+
+  }, {
+    key: 'value',
+    get: function get() {
+      return this.foundation_.getValue();
+    }
+
+    /** @param {?string} value */
+    ,
+    set: function set(value) {
+      this.foundation_.setValue(value);
+    }
+  }]);
+
+  return MDCCheckbox;
+}(__WEBPACK_IMPORTED_MODULE_1__material_base_component__["a" /* default */]);
+
+/***/ }),
+/* 19 */
+/***/ (function(module, __webpack_exports__, __webpack_require__) {
+
+"use strict";
+Object.defineProperty(__webpack_exports__, "__esModule", { value: true });
+/* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, "MDCDialog", function() { return MDCDialog; });
+/* harmony import */ var __WEBPACK_IMPORTED_MODULE_0__material_base__ = __webpack_require__(0);
+/* harmony import */ var __WEBPACK_IMPORTED_MODULE_1__material_ripple__ = __webpack_require__(3);
+/* harmony import */ var __WEBPACK_IMPORTED_MODULE_2__foundation__ = __webpack_require__(37);
+/* harmony import */ var __WEBPACK_IMPORTED_MODULE_3__util__ = __webpack_require__(38);
+/* harmony reexport (binding) */ __webpack_require__.d(__webpack_exports__, "MDCDialogFoundation", function() { return __WEBPACK_IMPORTED_MODULE_2__foundation__["a"]; });
+/* harmony reexport (module object) */ __webpack_require__.d(__webpack_exports__, "util", function() { return __WEBPACK_IMPORTED_MODULE_3__util__; });
+var _createClass = function () { function defineProperties(target, props) { for (var i = 0; i < props.length; i++) { var descriptor = props[i]; descriptor.enumerable = descriptor.enumerable || false; descriptor.configurable = true; if ("value" in descriptor) descriptor.writable = true; Object.defineProperty(target, descriptor.key, descriptor); } } return function (Constructor, protoProps, staticProps) { if (protoProps) defineProperties(Constructor.prototype, protoProps); if (staticProps) defineProperties(Constructor, staticProps); return Constructor; }; }();
+
+var _get = function get(object, property, receiver) { if (object === null) object = Function.prototype; var desc = Object.getOwnPropertyDescriptor(object, property); if (desc === undefined) { var parent = Object.getPrototypeOf(object); if (parent === null) { return undefined; } else { return get(parent, property, receiver); } } else if ("value" in desc) { return desc.value; } else { var getter = desc.get; if (getter === undefined) { return undefined; } return getter.call(receiver); } };
+
+function _classCallCheck(instance, Constructor) { if (!(instance instanceof Constructor)) { throw new TypeError("Cannot call a class as a function"); } }
+
+function _possibleConstructorReturn(self, call) { if (!self) { throw new ReferenceError("this hasn't been initialised - super() hasn't been called"); } return call && (typeof call === "object" || typeof call === "function") ? call : self; }
+
+function _inherits(subClass, superClass) { if (typeof superClass !== "function" && superClass !== null) { throw new TypeError("Super expression must either be null or a function, not " + typeof superClass); } subClass.prototype = Object.create(superClass && superClass.prototype, { constructor: { value: subClass, enumerable: false, writable: true, configurable: true } }); if (superClass) Object.setPrototypeOf ? Object.setPrototypeOf(subClass, superClass) : subClass.__proto__ = superClass; }
+
+/**
+ * Copyright 2017 Google Inc. All Rights Reserved.
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *      http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+
+
+
+
+
+
+
+
+
+
+var MDCDialog = function (_MDCComponent) {
+  _inherits(MDCDialog, _MDCComponent);
+
+  function MDCDialog() {
+    _classCallCheck(this, MDCDialog);
+
+    return _possibleConstructorReturn(this, (MDCDialog.__proto__ || Object.getPrototypeOf(MDCDialog)).apply(this, arguments));
+  }
+
+  _createClass(MDCDialog, [{
+    key: 'initialize',
+    value: function initialize() {
+      this.focusTrap_ = __WEBPACK_IMPORTED_MODULE_3__util__["createFocusTrapInstance"](this.dialogSurface_, this.acceptButton_);
+      this.footerBtnRipples_ = [];
+
+      var footerBtns = this.root_.querySelectorAll('.mdc-dialog__footer__button');
+      for (var i = 0, footerBtn; footerBtn = footerBtns[i]; i++) {
+        this.footerBtnRipples_.push(new __WEBPACK_IMPORTED_MODULE_1__material_ripple__["MDCRipple"](footerBtn));
+      }
+    }
+  }, {
+    key: 'destroy',
+    value: function destroy() {
+      this.footerBtnRipples_.forEach(function (ripple) {
+        return ripple.destroy();
+      });
+      _get(MDCDialog.prototype.__proto__ || Object.getPrototypeOf(MDCDialog.prototype), 'destroy', this).call(this);
+    }
+  }, {
+    key: 'show',
+    value: function show() {
+      this.foundation_.open();
+    }
+  }, {
+    key: 'close',
+    value: function close() {
+      this.foundation_.close();
+    }
+  }, {
+    key: 'getDefaultFoundation',
+    value: function getDefaultFoundation() {
+      var _this2 = this;
+
+      return new __WEBPACK_IMPORTED_MODULE_2__foundation__["a" /* default */]({
+        addClass: function addClass(className) {
+          return _this2.root_.classList.add(className);
+        },
+        removeClass: function removeClass(className) {
+          return _this2.root_.classList.remove(className);
+        },
+        addBodyClass: function addBodyClass(className) {
+          return document.body.classList.add(className);
+        },
+        removeBodyClass: function removeBodyClass(className) {
+          return document.body.classList.remove(className);
+        },
+        eventTargetHasClass: function eventTargetHasClass(target, className) {
+          return target.classList.contains(className);
+        },
+        registerInteractionHandler: function registerInteractionHandler(evt, handler) {
+          return _this2.root_.addEventListener(evt, handler);
+        },
+        deregisterInteractionHandler: function deregisterInteractionHandler(evt, handler) {
+          return _this2.root_.removeEventListener(evt, handler);
+        },
+        registerSurfaceInteractionHandler: function registerSurfaceInteractionHandler(evt, handler) {
+          return _this2.dialogSurface_.addEventListener(evt, handler);
+        },
+        deregisterSurfaceInteractionHandler: function deregisterSurfaceInteractionHandler(evt, handler) {
+          return _this2.dialogSurface_.removeEventListener(evt, handler);
+        },
+        registerDocumentKeydownHandler: function registerDocumentKeydownHandler(handler) {
+          return document.addEventListener('keydown', handler);
+        },
+        deregisterDocumentKeydownHandler: function deregisterDocumentKeydownHandler(handler) {
+          return document.removeEventListener('keydown', handler);
+        },
+        registerTransitionEndHandler: function registerTransitionEndHandler(handler) {
+          return _this2.dialogSurface_.addEventListener('transitionend', handler);
+        },
+        deregisterTransitionEndHandler: function deregisterTransitionEndHandler(handler) {
+          return _this2.dialogSurface_.removeEventListener('transitionend', handler);
+        },
+        notifyAccept: function notifyAccept() {
+          return _this2.emit(__WEBPACK_IMPORTED_MODULE_2__foundation__["a" /* default */].strings.ACCEPT_EVENT);
+        },
+        notifyCancel: function notifyCancel() {
+          return _this2.emit(__WEBPACK_IMPORTED_MODULE_2__foundation__["a" /* default */].strings.CANCEL_EVENT);
+        },
+        trapFocusOnSurface: function trapFocusOnSurface() {
+          return _this2.focusTrap_.activate();
+        },
+        untrapFocusOnSurface: function untrapFocusOnSurface() {
+          return _this2.focusTrap_.deactivate();
+        },
+        isDialog: function isDialog(el) {
+          return el === _this2.dialogSurface_;
+        }
+      });
+    }
+  }, {
+    key: 'open',
+    get: function get() {
+      return this.foundation_.isOpen();
+    }
+  }, {
+    key: 'acceptButton_',
+    get: function get() {
+      return this.root_.querySelector(__WEBPACK_IMPORTED_MODULE_2__foundation__["a" /* default */].strings.ACCEPT_SELECTOR);
+    }
+  }, {
+    key: 'dialogSurface_',
+    get: function get() {
+      return this.root_.querySelector(__WEBPACK_IMPORTED_MODULE_2__foundation__["a" /* default */].strings.DIALOG_SURFACE_SELECTOR);
+    }
+  }], [{
+    key: 'attachTo',
+    value: function attachTo(root) {
+      return new MDCDialog(root);
+    }
+  }]);
+
+  return MDCDialog;
+}(__WEBPACK_IMPORTED_MODULE_0__material_base__["MDCComponent"]);
+
+/***/ }),
+/* 20 */
+/***/ (function(module, __webpack_exports__, __webpack_require__) {
+
+"use strict";
+Object.defineProperty(__webpack_exports__, "__esModule", { value: true });
+/* harmony import */ var __WEBPACK_IMPORTED_MODULE_0__util__ = __webpack_require__(8);
+/* harmony import */ var __WEBPACK_IMPORTED_MODULE_1__temporary__ = __webpack_require__(46);
+/* harmony reexport (binding) */ __webpack_require__.d(__webpack_exports__, "MDCTemporaryDrawer", function() { return __WEBPACK_IMPORTED_MODULE_1__temporary__["a"]; });
+/* harmony reexport (binding) */ __webpack_require__.d(__webpack_exports__, "MDCTemporaryDrawerFoundation", function() { return __WEBPACK_IMPORTED_MODULE_1__temporary__["b"]; });
+/* harmony import */ var __WEBPACK_IMPORTED_MODULE_2__persistent__ = __webpack_require__(41);
+/* harmony reexport (binding) */ __webpack_require__.d(__webpack_exports__, "MDCPersistentDrawer", function() { return __WEBPACK_IMPORTED_MODULE_2__persistent__["a"]; });
+/* harmony reexport (binding) */ __webpack_require__.d(__webpack_exports__, "MDCPersistentDrawerFoundation", function() { return __WEBPACK_IMPORTED_MODULE_2__persistent__["b"]; });
+/* harmony reexport (module object) */ __webpack_require__.d(__webpack_exports__, "util", function() { return __WEBPACK_IMPORTED_MODULE_0__util__; });
+/**
+ * Copyright 2016 Google Inc. All Rights Reserved.
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *      http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+
+
+
+
+
+
+/***/ }),
+/* 21 */
+/***/ (function(module, __webpack_exports__, __webpack_require__) {
+
+"use strict";
+Object.defineProperty(__webpack_exports__, "__esModule", { value: true });
+/* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, "MDCFormField", function() { return MDCFormField; });
+/* harmony import */ var __WEBPACK_IMPORTED_MODULE_0__material_base__ = __webpack_require__(0);
+/* harmony import */ var __WEBPACK_IMPORTED_MODULE_1__foundation__ = __webpack_require__(48);
+/* harmony reexport (binding) */ __webpack_require__.d(__webpack_exports__, "MDCFormFieldFoundation", function() { return __WEBPACK_IMPORTED_MODULE_1__foundation__["a"]; });
+var _createClass = function () { function defineProperties(target, props) { for (var i = 0; i < props.length; i++) { var descriptor = props[i]; descriptor.enumerable = descriptor.enumerable || false; descriptor.configurable = true; if ("value" in descriptor) descriptor.writable = true; Object.defineProperty(target, descriptor.key, descriptor); } } return function (Constructor, protoProps, staticProps) { if (protoProps) defineProperties(Constructor.prototype, protoProps); if (staticProps) defineProperties(Constructor, staticProps); return Constructor; }; }();
+
+function _classCallCheck(instance, Constructor) { if (!(instance instanceof Constructor)) { throw new TypeError("Cannot call a class as a function"); } }
+
+function _possibleConstructorReturn(self, call) { if (!self) { throw new ReferenceError("this hasn't been initialised - super() hasn't been called"); } return call && (typeof call === "object" || typeof call === "function") ? call : self; }
+
+function _inherits(subClass, superClass) { if (typeof superClass !== "function" && superClass !== null) { throw new TypeError("Super expression must either be null or a function, not " + typeof superClass); } subClass.prototype = Object.create(superClass && superClass.prototype, { constructor: { value: subClass, enumerable: false, writable: true, configurable: true } }); if (superClass) Object.setPrototypeOf ? Object.setPrototypeOf(subClass, superClass) : subClass.__proto__ = superClass; }
+
+/**
+ * Copyright 2017 Google Inc. All Rights Reserved.
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *      http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+
+
+
+
+
+
+var MDCFormField = function (_MDCComponent) {
+  _inherits(MDCFormField, _MDCComponent);
+
+  function MDCFormField() {
+    _classCallCheck(this, MDCFormField);
+
+    return _possibleConstructorReturn(this, (MDCFormField.__proto__ || Object.getPrototypeOf(MDCFormField)).apply(this, arguments));
+  }
+
+  _createClass(MDCFormField, [{
+    key: 'getDefaultFoundation',
+    value: function getDefaultFoundation() {
+      var _this2 = this;
+
+      return new __WEBPACK_IMPORTED_MODULE_1__foundation__["a" /* default */]({
+        registerInteractionHandler: function registerInteractionHandler(type, handler) {
+          return _this2.label_.addEventListener(type, handler);
+        },
+        deregisterInteractionHandler: function deregisterInteractionHandler(type, handler) {
+          return _this2.label_.removeEventListener(type, handler);
+        },
+        activateInputRipple: function activateInputRipple() {
+          if (_this2.input_ && _this2.input_.ripple) {
+            _this2.input_.ripple.activate();
+          }
+        },
+        deactivateInputRipple: function deactivateInputRipple() {
+          if (_this2.input_ && _this2.input_.ripple) {
+            _this2.input_.ripple.deactivate();
+          }
+        }
+      });
+    }
+  }, {
+    key: 'input',
+    set: function set(input) {
+      this.input_ = input;
+    },
+    get: function get() {
+      return this.input_;
+    }
+  }, {
+    key: 'label_',
+    get: function get() {
+      return this.root_.querySelector(__WEBPACK_IMPORTED_MODULE_1__foundation__["a" /* default */].strings.LABEL_SELECTOR);
+    }
+  }], [{
+    key: 'attachTo',
+    value: function attachTo(root) {
+      return new MDCFormField(root);
+    }
+  }]);
+
+  return MDCFormField;
+}(__WEBPACK_IMPORTED_MODULE_0__material_base__["MDCComponent"]);
+
+/***/ }),
+/* 22 */
+/***/ (function(module, __webpack_exports__, __webpack_require__) {
+
+"use strict";
+Object.defineProperty(__webpack_exports__, "__esModule", { value: true });
+/* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, "MDCGridList", function() { return MDCGridList; });
+/* harmony import */ var __WEBPACK_IMPORTED_MODULE_0__material_base__ = __webpack_require__(0);
+/* harmony import */ var __WEBPACK_IMPORTED_MODULE_1__foundation__ = __webpack_require__(50);
+/* harmony reexport (binding) */ __webpack_require__.d(__webpack_exports__, "MDCGridListFoundation", function() { return __WEBPACK_IMPORTED_MODULE_1__foundation__["a"]; });
+var _createClass = function () { function defineProperties(target, props) { for (var i = 0; i < props.length; i++) { var descriptor = props[i]; descriptor.enumerable = descriptor.enumerable || false; descriptor.configurable = true; if ("value" in descriptor) descriptor.writable = true; Object.defineProperty(target, descriptor.key, descriptor); } } return function (Constructor, protoProps, staticProps) { if (protoProps) defineProperties(Constructor.prototype, protoProps); if (staticProps) defineProperties(Constructor, staticProps); return Constructor; }; }();
+
+function _classCallCheck(instance, Constructor) { if (!(instance instanceof Constructor)) { throw new TypeError("Cannot call a class as a function"); } }
+
+function _possibleConstructorReturn(self, call) { if (!self) { throw new ReferenceError("this hasn't been initialised - super() hasn't been called"); } return call && (typeof call === "object" || typeof call === "function") ? call : self; }
+
+function _inherits(subClass, superClass) { if (typeof superClass !== "function" && superClass !== null) { throw new TypeError("Super expression must either be null or a function, not " + typeof superClass); } subClass.prototype = Object.create(superClass && superClass.prototype, { constructor: { value: subClass, enumerable: false, writable: true, configurable: true } }); if (superClass) Object.setPrototypeOf ? Object.setPrototypeOf(subClass, superClass) : subClass.__proto__ = superClass; }
+
+/**
+ * Copyright 2016 Google Inc. All Rights Reserved.
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *      http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+
+
+
+
+
+
+
+var MDCGridList = function (_MDCComponent) {
+  _inherits(MDCGridList, _MDCComponent);
+
+  function MDCGridList() {
+    _classCallCheck(this, MDCGridList);
+
+    return _possibleConstructorReturn(this, (MDCGridList.__proto__ || Object.getPrototypeOf(MDCGridList)).apply(this, arguments));
+  }
+
+  _createClass(MDCGridList, [{
+    key: 'getDefaultFoundation',
+    value: function getDefaultFoundation() {
+      var _this2 = this;
+
+      return new __WEBPACK_IMPORTED_MODULE_1__foundation__["a" /* default */]({
+        getOffsetWidth: function getOffsetWidth() {
+          return _this2.root_.offsetWidth;
+        },
+        getNumberOfTiles: function getNumberOfTiles() {
+          return _this2.root_.querySelectorAll(__WEBPACK_IMPORTED_MODULE_1__foundation__["a" /* default */].strings.TILE_SELECTOR).length;
+        },
+        getOffsetWidthForTileAtIndex: function getOffsetWidthForTileAtIndex(index) {
+          return _this2.root_.querySelectorAll(__WEBPACK_IMPORTED_MODULE_1__foundation__["a" /* default */].strings.TILE_SELECTOR)[index].offsetWidth;
+        },
+        setStyleForTilesElement: function setStyleForTilesElement(property, value) {
+          _this2.root_.querySelector(__WEBPACK_IMPORTED_MODULE_1__foundation__["a" /* default */].strings.TILES_SELECTOR).style[property] = value;
+        },
+        registerResizeHandler: function registerResizeHandler(handler) {
+          return window.addEventListener('resize', handler);
+        },
+        deregisterResizeHandler: function deregisterResizeHandler(handler) {
+          return window.removeEventListener('resize', handler);
+        }
+      });
+    }
+  }], [{
+    key: 'attachTo',
+    value: function attachTo(root) {
+      return new MDCGridList(root);
+    }
+  }]);
+
+  return MDCGridList;
+}(__WEBPACK_IMPORTED_MODULE_0__material_base__["MDCComponent"]);
+
+/***/ }),
+/* 23 */
+/***/ (function(module, __webpack_exports__, __webpack_require__) {
+
+"use strict";
+Object.defineProperty(__webpack_exports__, "__esModule", { value: true });
+/* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, "MDCIconToggle", function() { return MDCIconToggle; });
+/* harmony import */ var __WEBPACK_IMPORTED_MODULE_0__material_base_component__ = __webpack_require__(2);
+/* harmony import */ var __WEBPACK_IMPORTED_MODULE_1__foundation__ = __webpack_require__(53);
+/* harmony import */ var __WEBPACK_IMPORTED_MODULE_2__material_ripple_adapter__ = __webpack_require__(10);
+/* harmony import */ var __WEBPACK_IMPORTED_MODULE_3__material_ripple__ = __webpack_require__(3);
+/* harmony reexport (binding) */ __webpack_require__.d(__webpack_exports__, "MDCIconToggleFoundation", function() { return __WEBPACK_IMPORTED_MODULE_1__foundation__["a"]; });
+var _extends = Object.assign || function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; };
+
+var _get = function get(object, property, receiver) { if (object === null) object = Function.prototype; var desc = Object.getOwnPropertyDescriptor(object, property); if (desc === undefined) { var parent = Object.getPrototypeOf(object); if (parent === null) { return undefined; } else { return get(parent, property, receiver); } } else if ("value" in desc) { return desc.value; } else { var getter = desc.get; if (getter === undefined) { return undefined; } return getter.call(receiver); } };
+
+var _createClass = function () { function defineProperties(target, props) { for (var i = 0; i < props.length; i++) { var descriptor = props[i]; descriptor.enumerable = descriptor.enumerable || false; descriptor.configurable = true; if ("value" in descriptor) descriptor.writable = true; Object.defineProperty(target, descriptor.key, descriptor); } } return function (Constructor, protoProps, staticProps) { if (protoProps) defineProperties(Constructor.prototype, protoProps); if (staticProps) defineProperties(Constructor, staticProps); return Constructor; }; }();
+
+function _classCallCheck(instance, Constructor) { if (!(instance instanceof Constructor)) { throw new TypeError("Cannot call a class as a function"); } }
+
+function _possibleConstructorReturn(self, call) { if (!self) { throw new ReferenceError("this hasn't been initialised - super() hasn't been called"); } return call && (typeof call === "object" || typeof call === "function") ? call : self; }
+
+function _inherits(subClass, superClass) { if (typeof superClass !== "function" && superClass !== null) { throw new TypeError("Super expression must either be null or a function, not " + typeof superClass); } subClass.prototype = Object.create(superClass && superClass.prototype, { constructor: { value: subClass, enumerable: false, writable: true, configurable: true } }); if (superClass) Object.setPrototypeOf ? Object.setPrototypeOf(subClass, superClass) : subClass.__proto__ = superClass; }
+
+/**
+ * Copyright 2016 Google Inc. All Rights Reserved.
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *      http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+
+
+
+/* eslint-disable no-unused-vars */
+
+/* eslint-enable no-unused-vars */
+
+
+
+
+/**
+ * @extends {MDCComponent<!MDCIconToggleFoundation>}
+ */
+var MDCIconToggle = function (_MDCComponent) {
+  _inherits(MDCIconToggle, _MDCComponent);
+
+  _createClass(MDCIconToggle, null, [{
+    key: 'attachTo',
+    value: function attachTo(root) {
+      return new MDCIconToggle(root);
+    }
+  }]);
+
+  function MDCIconToggle() {
+    var _ref;
+
+    _classCallCheck(this, MDCIconToggle);
+
+    for (var _len = arguments.length, args = Array(_len), _key = 0; _key < _len; _key++) {
+      args[_key] = arguments[_key];
+    }
+
+    /** @private {!MDCRipple} */
+    var _this = _possibleConstructorReturn(this, (_ref = MDCIconToggle.__proto__ || Object.getPrototypeOf(MDCIconToggle)).call.apply(_ref, [this].concat(args)));
+
+    _this.ripple_ = _this.initRipple_();
+    return _this;
+  }
+
+  /** @return {!Element} */
+
+
+  _createClass(MDCIconToggle, [{
+    key: 'initRipple_',
+
+
+    /**
+     * @return {!MDCRipple}
+     * @private
+     */
+    value: function initRipple_() {
+      var _this2 = this;
+
+      var adapter = _extends(__WEBPACK_IMPORTED_MODULE_3__material_ripple__["MDCRipple"].createAdapter(this), {
+        isUnbounded: function isUnbounded() {
+          return true;
+        },
+        isSurfaceActive: function isSurfaceActive() {
+          return _this2.foundation_.isKeyboardActivated();
+        },
+        computeBoundingRect: function computeBoundingRect() {
+          var dim = 48;
+
+          var _root_$getBoundingCli = _this2.root_.getBoundingClientRect(),
+              left = _root_$getBoundingCli.left,
+              top = _root_$getBoundingCli.top;
+
+          return {
+            left: left,
+            top: top,
+            width: dim,
+            height: dim,
+            right: left + dim,
+            bottom: left + dim
+          };
+        }
+      });
+      var foundation = new __WEBPACK_IMPORTED_MODULE_3__material_ripple__["MDCRippleFoundation"](adapter);
+      return new __WEBPACK_IMPORTED_MODULE_3__material_ripple__["MDCRipple"](this.root_, foundation);
+    }
+  }, {
+    key: 'destroy',
+    value: function destroy() {
+      this.ripple_.destroy();
+      _get(MDCIconToggle.prototype.__proto__ || Object.getPrototypeOf(MDCIconToggle.prototype), 'destroy', this).call(this);
+    }
+
+    /** @return {!MDCIconToggleFoundation} */
+
+  }, {
+    key: 'getDefaultFoundation',
+    value: function getDefaultFoundation() {
+      var _this3 = this;
+
+      return new __WEBPACK_IMPORTED_MODULE_1__foundation__["a" /* default */]({
+        addClass: function addClass(className) {
+          return _this3.iconEl_.classList.add(className);
+        },
+        removeClass: function removeClass(className) {
+          return _this3.iconEl_.classList.remove(className);
+        },
+        registerInteractionHandler: function registerInteractionHandler(type, handler) {
+          return _this3.root_.addEventListener(type, handler);
+        },
+        deregisterInteractionHandler: function deregisterInteractionHandler(type, handler) {
+          return _this3.root_.removeEventListener(type, handler);
+        },
+        setText: function setText(text) {
+          return _this3.iconEl_.textContent = text;
+        },
+        getTabIndex: function getTabIndex() {
+          return (/* number */_this3.root_.tabIndex
+          );
+        },
+        setTabIndex: function setTabIndex(tabIndex) {
+          return _this3.root_.tabIndex = tabIndex;
+        },
+        getAttr: function getAttr(name, value) {
+          return _this3.root_.getAttribute(name, value);
+        },
+        setAttr: function setAttr(name, value) {
+          return _this3.root_.setAttribute(name, value);
+        },
+        rmAttr: function rmAttr(name) {
+          return _this3.root_.removeAttribute(name);
+        },
+        notifyChange: function notifyChange(evtData) {
+          return _this3.emit(__WEBPACK_IMPORTED_MODULE_1__foundation__["a" /* default */].strings.CHANGE_EVENT, evtData);
+        }
+      });
+    }
+  }, {
+    key: 'initialSyncWithDOM',
+    value: function initialSyncWithDOM() {
+      this.on = this.root_.getAttribute(__WEBPACK_IMPORTED_MODULE_1__foundation__["a" /* default */].strings.ARIA_PRESSED) === 'true';
+      this.disabled = this.root_.getAttribute(__WEBPACK_IMPORTED_MODULE_1__foundation__["a" /* default */].strings.ARIA_DISABLED) === 'true';
+    }
+
+    /** @return {boolean} */
+
+  }, {
+    key: 'refreshToggleData',
+    value: function refreshToggleData() {
+      this.foundation_.refreshToggleData();
+    }
+  }, {
+    key: 'iconEl_',
+    get: function get() {
+      var sel = this.root_.dataset['iconInnerSelector'];
+
+      return sel ?
+      /** @type {!Element} */this.root_.querySelector(sel) : this.root_;
+    }
+  }, {
+    key: 'on',
+    get: function get() {
+      return this.foundation_.isOn();
+    }
+
+    /** @param {boolean} isOn */
+    ,
+    set: function set(isOn) {
+      this.foundation_.toggle(isOn);
+    }
+
+    /** @return {boolean} */
+
+  }, {
+    key: 'disabled',
+    get: function get() {
+      return this.foundation_.isDisabled();
+    }
+
+    /** @param {boolean} isDisabled */
+    ,
+    set: function set(isDisabled) {
+      this.foundation_.setDisabled(isDisabled);
+    }
+  }]);
+
+  return MDCIconToggle;
+}(__WEBPACK_IMPORTED_MODULE_0__material_base_component__["a" /* default */]);
+
+/***/ }),
+/* 24 */
+/***/ (function(module, __webpack_exports__, __webpack_require__) {
+
+"use strict";
+Object.defineProperty(__webpack_exports__, "__esModule", { value: true });
+/* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, "MDCLinearProgress", function() { return MDCLinearProgress; });
+/* harmony import */ var __WEBPACK_IMPORTED_MODULE_0__material_base__ = __webpack_require__(0);
+/* harmony import */ var __WEBPACK_IMPORTED_MODULE_1__foundation__ = __webpack_require__(55);
+/* harmony reexport (binding) */ __webpack_require__.d(__webpack_exports__, "MDCLinearProgressFoundation", function() { return __WEBPACK_IMPORTED_MODULE_1__foundation__["a"]; });
+var _createClass = function () { function defineProperties(target, props) { for (var i = 0; i < props.length; i++) { var descriptor = props[i]; descriptor.enumerable = descriptor.enumerable || false; descriptor.configurable = true; if ("value" in descriptor) descriptor.writable = true; Object.defineProperty(target, descriptor.key, descriptor); } } return function (Constructor, protoProps, staticProps) { if (protoProps) defineProperties(Constructor.prototype, protoProps); if (staticProps) defineProperties(Constructor, staticProps); return Constructor; }; }();
+
+function _classCallCheck(instance, Constructor) { if (!(instance instanceof Constructor)) { throw new TypeError("Cannot call a class as a function"); } }
+
+function _possibleConstructorReturn(self, call) { if (!self) { throw new ReferenceError("this hasn't been initialised - super() hasn't been called"); } return call && (typeof call === "object" || typeof call === "function") ? call : self; }
+
+function _inherits(subClass, superClass) { if (typeof superClass !== "function" && superClass !== null) { throw new TypeError("Super expression must either be null or a function, not " + typeof superClass); } subClass.prototype = Object.create(superClass && superClass.prototype, { constructor: { value: subClass, enumerable: false, writable: true, configurable: true } }); if (superClass) Object.setPrototypeOf ? Object.setPrototypeOf(subClass, superClass) : subClass.__proto__ = superClass; }
+
+/**
+ * Copyright 2017 Google Inc. All Rights Reserved.
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *      http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+
+
+
+
+
+
+var MDCLinearProgress = function (_MDCComponent) {
+  _inherits(MDCLinearProgress, _MDCComponent);
+
+  function MDCLinearProgress() {
+    _classCallCheck(this, MDCLinearProgress);
+
+    return _possibleConstructorReturn(this, (MDCLinearProgress.__proto__ || Object.getPrototypeOf(MDCLinearProgress)).apply(this, arguments));
+  }
+
+  _createClass(MDCLinearProgress, [{
+    key: 'open',
+    value: function open() {
+      this.foundation_.open();
+    }
+  }, {
+    key: 'close',
+    value: function close() {
+      this.foundation_.close();
+    }
+  }, {
+    key: 'getDefaultFoundation',
+    value: function getDefaultFoundation() {
+      var _this2 = this;
+
+      return new __WEBPACK_IMPORTED_MODULE_1__foundation__["a" /* default */]({
+        addClass: function addClass(className) {
+          return _this2.root_.classList.add(className);
+        },
+        getPrimaryBar: function getPrimaryBar() {
+          return _this2.root_.querySelector(__WEBPACK_IMPORTED_MODULE_1__foundation__["a" /* default */].strings.PRIMARY_BAR_SELECTOR);
+        },
+        getBuffer: function getBuffer() {
+          return _this2.root_.querySelector(__WEBPACK_IMPORTED_MODULE_1__foundation__["a" /* default */].strings.BUFFER_SELECTOR);
+        },
+        hasClass: function hasClass(className) {
+          return _this2.root_.classList.contains(className);
+        },
+        removeClass: function removeClass(className) {
+          return _this2.root_.classList.remove(className);
+        },
+        setStyle: function setStyle(el, styleProperty, value) {
+          return el.style[styleProperty] = value;
+        }
+      });
+    }
+  }, {
+    key: 'determinate',
+    set: function set(value) {
+      this.foundation_.setDeterminate(value);
+    }
+  }, {
+    key: 'progress',
+    set: function set(value) {
+      this.foundation_.setProgress(value);
+    }
+  }, {
+    key: 'buffer',
+    set: function set(value) {
+      this.foundation_.setBuffer(value);
+    }
+  }, {
+    key: 'reverse',
+    set: function set(value) {
+      this.foundation_.setReverse(value);
+    }
+  }], [{
+    key: 'attachTo',
+    value: function attachTo(root) {
+      return new MDCLinearProgress(root);
+    }
+  }]);
+
+  return MDCLinearProgress;
+}(__WEBPACK_IMPORTED_MODULE_0__material_base__["MDCComponent"]);
+
+/***/ }),
+/* 25 */
+/***/ (function(module, __webpack_exports__, __webpack_require__) {
+
+"use strict";
+Object.defineProperty(__webpack_exports__, "__esModule", { value: true });
+/* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, "MDCRadio", function() { return MDCRadio; });
+/* harmony import */ var __WEBPACK_IMPORTED_MODULE_0__material_base_component__ = __webpack_require__(2);
+/* harmony import */ var __WEBPACK_IMPORTED_MODULE_1__material_base_selection_control__ = __webpack_require__(4);
+/* harmony import */ var __WEBPACK_IMPORTED_MODULE_2__foundation__ = __webpack_require__(62);
+/* harmony import */ var __WEBPACK_IMPORTED_MODULE_3__material_ripple__ = __webpack_require__(3);
+/* harmony reexport (binding) */ __webpack_require__.d(__webpack_exports__, "MDCRadioFoundation", function() { return __WEBPACK_IMPORTED_MODULE_2__foundation__["a"]; });
+var _extends = Object.assign || function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; };
+
+var _get = function get(object, property, receiver) { if (object === null) object = Function.prototype; var desc = Object.getOwnPropertyDescriptor(object, property); if (desc === undefined) { var parent = Object.getPrototypeOf(object); if (parent === null) { return undefined; } else { return get(parent, property, receiver); } } else if ("value" in desc) { return desc.value; } else { var getter = desc.get; if (getter === undefined) { return undefined; } return getter.call(receiver); } };
+
+var _createClass = function () { function defineProperties(target, props) { for (var i = 0; i < props.length; i++) { var descriptor = props[i]; descriptor.enumerable = descriptor.enumerable || false; descriptor.configurable = true; if ("value" in descriptor) descriptor.writable = true; Object.defineProperty(target, descriptor.key, descriptor); } } return function (Constructor, protoProps, staticProps) { if (protoProps) defineProperties(Constructor.prototype, protoProps); if (staticProps) defineProperties(Constructor, staticProps); return Constructor; }; }();
+
+function _classCallCheck(instance, Constructor) { if (!(instance instanceof Constructor)) { throw new TypeError("Cannot call a class as a function"); } }
+
+function _possibleConstructorReturn(self, call) { if (!self) { throw new ReferenceError("this hasn't been initialised - super() hasn't been called"); } return call && (typeof call === "object" || typeof call === "function") ? call : self; }
+
+function _inherits(subClass, superClass) { if (typeof superClass !== "function" && superClass !== null) { throw new TypeError("Super expression must either be null or a function, not " + typeof superClass); } subClass.prototype = Object.create(superClass && superClass.prototype, { constructor: { value: subClass, enumerable: false, writable: true, configurable: true } }); if (superClass) Object.setPrototypeOf ? Object.setPrototypeOf(subClass, superClass) : subClass.__proto__ = superClass; }
+
+/**
+ * Copyright 2016 Google Inc. All Rights Reserved.
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *      http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+
+
+/* eslint-disable no-unused-vars */
+
+/* eslint-enable no-unused-vars */
+
+
+
+
+
+/**
+ * @extends MDCComponent<!MDCRadioFoundation>
+ */
+var MDCRadio = function (_MDCComponent) {
+  _inherits(MDCRadio, _MDCComponent);
+
+  _createClass(MDCRadio, [{
+    key: 'checked',
+
+
+    /** @return {boolean} */
+    get: function get() {
+      return this.foundation_.isChecked();
+    }
+
+    /** @param {boolean} checked */
+    ,
+    set: function set(checked) {
+      this.foundation_.setChecked(checked);
+    }
+
+    /** @return {boolean} */
+
+  }, {
+    key: 'disabled',
+    get: function get() {
+      return this.foundation_.isDisabled();
+    }
+
+    /** @param {boolean} disabled */
+    ,
+    set: function set(disabled) {
+      this.foundation_.setDisabled(disabled);
+    }
+
+    /** @return {?string} */
+
+  }, {
+    key: 'value',
+    get: function get() {
+      return this.foundation_.getValue();
+    }
+
+    /** @param {?string} value */
+    ,
+    set: function set(value) {
+      this.foundation_.setValue(value);
+    }
+
+    /** @return {!MDCRipple} */
+
+  }, {
+    key: 'ripple',
+    get: function get() {
+      return this.ripple_;
+    }
+  }], [{
+    key: 'attachTo',
+    value: function attachTo(root) {
+      return new MDCRadio(root);
+    }
+  }]);
+
+  function MDCRadio() {
+    var _ref;
+
+    _classCallCheck(this, MDCRadio);
+
+    for (var _len = arguments.length, args = Array(_len), _key = 0; _key < _len; _key++) {
+      args[_key] = arguments[_key];
+    }
+
+    /** @private {!MDCRipple} */
+    var _this = _possibleConstructorReturn(this, (_ref = MDCRadio.__proto__ || Object.getPrototypeOf(MDCRadio)).call.apply(_ref, [this].concat(args)));
+
+    _this.ripple_ = _this.initRipple_();
+    return _this;
+  }
+
+  /**
+   * @return {!MDCRipple}
+   * @private
+   */
+
+
+  _createClass(MDCRadio, [{
+    key: 'initRipple_',
+    value: function initRipple_() {
+      var _this2 = this;
+
+      var adapter = _extends(__WEBPACK_IMPORTED_MODULE_3__material_ripple__["MDCRipple"].createAdapter(this), {
+        isUnbounded: function isUnbounded() {
+          return true;
+        },
+        // Radio buttons technically go "active" whenever there is *any* keyboard interaction. This is not the
+        // UI we desire.
+        isSurfaceActive: function isSurfaceActive() {
+          return false;
+        },
+        registerInteractionHandler: function registerInteractionHandler(type, handler) {
+          return _this2.nativeControl_.addEventListener(type, handler);
+        },
+        deregisterInteractionHandler: function deregisterInteractionHandler(type, handler) {
+          return _this2.nativeControl_.removeEventListener(type, handler);
+        },
+        computeBoundingRect: function computeBoundingRect() {
+          var _root_$getBoundingCli = _this2.root_.getBoundingClientRect(),
+              left = _root_$getBoundingCli.left,
+              top = _root_$getBoundingCli.top;
+
+          var DIM = 40;
+          return {
+            top: top,
+            left: left,
+            right: left + DIM,
+            bottom: top + DIM,
+            width: DIM,
+            height: DIM
+          };
+        }
+      });
+      var foundation = new __WEBPACK_IMPORTED_MODULE_3__material_ripple__["MDCRippleFoundation"](adapter);
+      return new __WEBPACK_IMPORTED_MODULE_3__material_ripple__["MDCRipple"](this.root_, foundation);
+    }
+
+    /**
+     * Returns the state of the native control element, or null if the native control element is not present.
+     * @return {?SelectionControlState}
+     * @private
+     */
+
+  }, {
+    key: 'destroy',
+    value: function destroy() {
+      this.ripple_.destroy();
+      _get(MDCRadio.prototype.__proto__ || Object.getPrototypeOf(MDCRadio.prototype), 'destroy', this).call(this);
+    }
+
+    /** @return {!MDCRadioFoundation} */
+
+  }, {
+    key: 'getDefaultFoundation',
+    value: function getDefaultFoundation() {
+      var _this3 = this;
+
+      return new __WEBPACK_IMPORTED_MODULE_2__foundation__["a" /* default */]({
+        addClass: function addClass(className) {
+          return _this3.root_.classList.add(className);
+        },
+        removeClass: function removeClass(className) {
+          return _this3.root_.classList.remove(className);
+        },
+        getNativeControl: function getNativeControl() {
+          return _this3.root_.querySelector(__WEBPACK_IMPORTED_MODULE_2__foundation__["a" /* default */].strings.NATIVE_CONTROL_SELECTOR);
+        }
+      });
+    }
+  }, {
+    key: 'nativeControl_',
+    get: function get() {
+      var NATIVE_CONTROL_SELECTOR = __WEBPACK_IMPORTED_MODULE_2__foundation__["a" /* default */].strings.NATIVE_CONTROL_SELECTOR;
+
+      var el = /** @type {?SelectionControlState} */this.root_.querySelector(NATIVE_CONTROL_SELECTOR);
+      return el;
+    }
+  }]);
+
+  return MDCRadio;
+}(__WEBPACK_IMPORTED_MODULE_0__material_base_component__["a" /* default */]);
+
+/***/ }),
+/* 26 */
+/***/ (function(module, __webpack_exports__, __webpack_require__) {
+
+"use strict";
+Object.defineProperty(__webpack_exports__, "__esModule", { value: true });
+/* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, "MDCSelect", function() { return MDCSelect; });
+/* harmony import */ var __WEBPACK_IMPORTED_MODULE_0__material_base__ = __webpack_require__(0);
+/* harmony import */ var __WEBPACK_IMPORTED_MODULE_1__material_menu__ = __webpack_require__(7);
+/* harmony import */ var __WEBPACK_IMPORTED_MODULE_2__foundation__ = __webpack_require__(66);
+/* harmony reexport (binding) */ __webpack_require__.d(__webpack_exports__, "MDCSelectFoundation", function() { return __WEBPACK_IMPORTED_MODULE_2__foundation__["a"]; });
+var _createClass = function () { function defineProperties(target, props) { for (var i = 0; i < props.length; i++) { var descriptor = props[i]; descriptor.enumerable = descriptor.enumerable || false; descriptor.configurable = true; if ("value" in descriptor) descriptor.writable = true; Object.defineProperty(target, descriptor.key, descriptor); } } return function (Constructor, protoProps, staticProps) { if (protoProps) defineProperties(Constructor.prototype, protoProps); if (staticProps) defineProperties(Constructor, staticProps); return Constructor; }; }();
+
+function _classCallCheck(instance, Constructor) { if (!(instance instanceof Constructor)) { throw new TypeError("Cannot call a class as a function"); } }
+
+function _possibleConstructorReturn(self, call) { if (!self) { throw new ReferenceError("this hasn't been initialised - super() hasn't been called"); } return call && (typeof call === "object" || typeof call === "function") ? call : self; }
+
+function _inherits(subClass, superClass) { if (typeof superClass !== "function" && superClass !== null) { throw new TypeError("Super expression must either be null or a function, not " + typeof superClass); } subClass.prototype = Object.create(superClass && superClass.prototype, { constructor: { value: subClass, enumerable: false, writable: true, configurable: true } }); if (superClass) Object.setPrototypeOf ? Object.setPrototypeOf(subClass, superClass) : subClass.__proto__ = superClass; }
+
+/**
+ * Copyright 2016 Google Inc. All Rights Reserved.
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *      http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+
+
+
+
+
+
+
+
+var MDCSelect = function (_MDCComponent) {
+  _inherits(MDCSelect, _MDCComponent);
+
+  function MDCSelect() {
+    _classCallCheck(this, MDCSelect);
+
+    return _possibleConstructorReturn(this, (MDCSelect.__proto__ || Object.getPrototypeOf(MDCSelect)).apply(this, arguments));
+  }
+
+  _createClass(MDCSelect, [{
+    key: 'item',
+    value: function item(index) {
+      return this.options[index] || null;
+    }
+  }, {
+    key: 'nameditem',
+    value: function nameditem(key) {
+      // NOTE: IE11 precludes us from using Array.prototype.find
+      for (var i = 0, options = this.options, option; option = options[i]; i++) {
+        if (option.id === key || option.getAttribute('name') === key) {
+          return option;
+        }
+      }
+      return null;
+    }
+  }, {
+    key: 'initialize',
+    value: function initialize() {
+      var menuFactory = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : function (el) {
+        return new __WEBPACK_IMPORTED_MODULE_1__material_menu__["MDCSimpleMenu"](el);
+      };
+
+      this.menuEl_ = this.root_.querySelector('.mdc-select__menu');
+      this.menu_ = menuFactory(this.menuEl_);
+      this.selectedText_ = this.root_.querySelector('.mdc-select__selected-text');
+    }
+  }, {
+    key: 'getDefaultFoundation',
+    value: function getDefaultFoundation() {
+      var _this2 = this;
+
+      return new __WEBPACK_IMPORTED_MODULE_2__foundation__["a" /* default */]({
+        addClass: function addClass(className) {
+          return _this2.root_.classList.add(className);
+        },
+        removeClass: function removeClass(className) {
+          return _this2.root_.classList.remove(className);
+        },
+        setAttr: function setAttr(attr, value) {
+          return _this2.root_.setAttribute(attr, value);
+        },
+        rmAttr: function rmAttr(attr, value) {
+          return _this2.root_.removeAttribute(attr, value);
+        },
+        computeBoundingRect: function computeBoundingRect() {
+          return _this2.root_.getBoundingClientRect();
+        },
+        registerInteractionHandler: function registerInteractionHandler(type, handler) {
+          return _this2.root_.addEventListener(type, handler);
+        },
+        deregisterInteractionHandler: function deregisterInteractionHandler(type, handler) {
+          return _this2.root_.removeEventListener(type, handler);
+        },
+        focus: function focus() {
+          return _this2.root_.focus();
+        },
+        makeTabbable: function makeTabbable() {
+          _this2.root_.tabIndex = 0;
+        },
+        makeUntabbable: function makeUntabbable() {
+          _this2.root_.tabIndex = -1;
+        },
+        getComputedStyleValue: function getComputedStyleValue(prop) {
+          return window.getComputedStyle(_this2.root_).getPropertyValue(prop);
+        },
+        setStyle: function setStyle(propertyName, value) {
+          return _this2.root_.style.setProperty(propertyName, value);
+        },
+        create2dRenderingContext: function create2dRenderingContext() {
+          return document.createElement('canvas').getContext('2d');
+        },
+        setMenuElStyle: function setMenuElStyle(propertyName, value) {
+          return _this2.menuEl_.style.setProperty(propertyName, value);
+        },
+        setMenuElAttr: function setMenuElAttr(attr, value) {
+          return _this2.menuEl_.setAttribute(attr, value);
+        },
+        rmMenuElAttr: function rmMenuElAttr(attr) {
+          return _this2.menuEl_.removeAttribute(attr);
+        },
+        getMenuElOffsetHeight: function getMenuElOffsetHeight() {
+          return _this2.menuEl_.offsetHeight;
+        },
+        openMenu: function openMenu(focusIndex) {
+          return _this2.menu_.show({ focusIndex: focusIndex });
+        },
+        isMenuOpen: function isMenuOpen() {
+          return _this2.menu_.open;
+        },
+        setSelectedTextContent: function setSelectedTextContent(selectedTextContent) {
+          _this2.selectedText_.textContent = selectedTextContent;
+        },
+        getNumberOfOptions: function getNumberOfOptions() {
+          return _this2.options.length;
+        },
+        getTextForOptionAtIndex: function getTextForOptionAtIndex(index) {
+          return _this2.options[index].textContent;
+        },
+        getValueForOptionAtIndex: function getValueForOptionAtIndex(index) {
+          return _this2.options[index].id || _this2.options[index].textContent;
+        },
+        setAttrForOptionAtIndex: function setAttrForOptionAtIndex(index, attr, value) {
+          return _this2.options[index].setAttribute(attr, value);
+        },
+        rmAttrForOptionAtIndex: function rmAttrForOptionAtIndex(index, attr) {
+          return _this2.options[index].removeAttribute(attr);
+        },
+        getOffsetTopForOptionAtIndex: function getOffsetTopForOptionAtIndex(index) {
+          return _this2.options[index].offsetTop;
+        },
+        registerMenuInteractionHandler: function registerMenuInteractionHandler(type, handler) {
+          return _this2.menu_.listen(type, handler);
+        },
+        deregisterMenuInteractionHandler: function deregisterMenuInteractionHandler(type, handler) {
+          return _this2.menu_.unlisten(type, handler);
+        },
+        notifyChange: function notifyChange() {
+          return _this2.emit(__WEBPACK_IMPORTED_MODULE_2__foundation__["a" /* default */].strings.CHANGE_EVENT, _this2);
+        },
+        getWindowInnerHeight: function getWindowInnerHeight() {
+          return window.innerHeight;
+        }
+      });
+    }
+  }, {
+    key: 'initialSyncWithDOM',
+    value: function initialSyncWithDOM() {
+      var selectedOption = this.selectedOptions[0];
+      var idx = selectedOption ? this.options.indexOf(selectedOption) : -1;
+      if (idx >= 0) {
+        this.selectedIndex = idx;
+      }
+
+      if (this.root_.getAttribute('aria-disabled') === 'true') {
+        this.disabled = true;
+      }
+    }
+  }, {
+    key: 'value',
+    get: function get() {
+      return this.foundation_.getValue();
+    }
+  }, {
+    key: 'options',
+    get: function get() {
+      return this.menu_.items;
+    }
+  }, {
+    key: 'selectedOptions',
+    get: function get() {
+      return this.root_.querySelectorAll('[aria-selected]');
+    }
+  }, {
+    key: 'selectedIndex',
+    get: function get() {
+      return this.foundation_.getSelectedIndex();
+    },
+    set: function set(selectedIndex) {
+      this.foundation_.setSelectedIndex(selectedIndex);
+    }
+  }, {
+    key: 'disabled',
+    get: function get() {
+      return this.foundation_.isDisabled();
+    },
+    set: function set(disabled) {
+      this.foundation_.setDisabled(disabled);
+    }
+  }], [{
+    key: 'attachTo',
+    value: function attachTo(root) {
+      return new MDCSelect(root);
+    }
+  }]);
+
+  return MDCSelect;
+}(__WEBPACK_IMPORTED_MODULE_0__material_base__["MDCComponent"]);
+
+/***/ }),
+/* 27 */
+/***/ (function(module, __webpack_exports__, __webpack_require__) {
+
+"use strict";
+Object.defineProperty(__webpack_exports__, "__esModule", { value: true });
+/* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, "MDCSlider", function() { return MDCSlider; });
+/* harmony import */ var __WEBPACK_IMPORTED_MODULE_0__material_base_component__ = __webpack_require__(2);
+/* harmony import */ var __WEBPACK_IMPORTED_MODULE_1__constants__ = __webpack_require__(12);
+/* harmony import */ var __WEBPACK_IMPORTED_MODULE_2__foundation__ = __webpack_require__(67);
+/* harmony reexport (binding) */ __webpack_require__.d(__webpack_exports__, "MDCSliderFoundation", function() { return __WEBPACK_IMPORTED_MODULE_2__foundation__["a"]; });
+var _createClass = function () { function defineProperties(target, props) { for (var i = 0; i < props.length; i++) { var descriptor = props[i]; descriptor.enumerable = descriptor.enumerable || false; descriptor.configurable = true; if ("value" in descriptor) descriptor.writable = true; Object.defineProperty(target, descriptor.key, descriptor); } } return function (Constructor, protoProps, staticProps) { if (protoProps) defineProperties(Constructor.prototype, protoProps); if (staticProps) defineProperties(Constructor, staticProps); return Constructor; }; }();
+
+function _classCallCheck(instance, Constructor) { if (!(instance instanceof Constructor)) { throw new TypeError("Cannot call a class as a function"); } }
+
+function _possibleConstructorReturn(self, call) { if (!self) { throw new ReferenceError("this hasn't been initialised - super() hasn't been called"); } return call && (typeof call === "object" || typeof call === "function") ? call : self; }
+
+function _inherits(subClass, superClass) { if (typeof superClass !== "function" && superClass !== null) { throw new TypeError("Super expression must either be null or a function, not " + typeof superClass); } subClass.prototype = Object.create(superClass && superClass.prototype, { constructor: { value: subClass, enumerable: false, writable: true, configurable: true } }); if (superClass) Object.setPrototypeOf ? Object.setPrototypeOf(subClass, superClass) : subClass.__proto__ = superClass; }
+
+/**
+ * Copyright 2017 Google Inc. All Rights Reserved.
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ * http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+
+
+
+
+
+
+
+
+var MDCSlider = function (_MDCComponent) {
+  _inherits(MDCSlider, _MDCComponent);
+
+  function MDCSlider() {
+    _classCallCheck(this, MDCSlider);
+
+    return _possibleConstructorReturn(this, (MDCSlider.__proto__ || Object.getPrototypeOf(MDCSlider)).apply(this, arguments));
+  }
+
+  _createClass(MDCSlider, [{
+    key: 'initialize',
+    value: function initialize() {
+      this.thumbContainer_ = this.root_.querySelector(__WEBPACK_IMPORTED_MODULE_1__constants__["a" /* strings */].THUMB_CONTAINER_SELECTOR);
+      this.track_ = this.root_.querySelector(__WEBPACK_IMPORTED_MODULE_1__constants__["a" /* strings */].TRACK_SELECTOR);
+      this.pinValueMarker_ = this.root_.querySelector(__WEBPACK_IMPORTED_MODULE_1__constants__["a" /* strings */].PIN_VALUE_MARKER_SELECTOR);
+      this.trackMarkerContainer_ = this.root_.querySelector(__WEBPACK_IMPORTED_MODULE_1__constants__["a" /* strings */].TRACK_MARKER_CONTAINER_SELECTOR);
+    }
+  }, {
+    key: 'getDefaultFoundation',
+    value: function getDefaultFoundation() {
+      var _this2 = this;
+
+      return new __WEBPACK_IMPORTED_MODULE_2__foundation__["a" /* default */]({
+        hasClass: function hasClass(className) {
+          return _this2.root_.classList.contains(className);
+        },
+        addClass: function addClass(className) {
+          return _this2.root_.classList.add(className);
+        },
+        removeClass: function removeClass(className) {
+          return _this2.root_.classList.remove(className);
+        },
+        getAttribute: function getAttribute(name) {
+          return _this2.root_.getAttribute(name);
+        },
+        setAttribute: function setAttribute(name, value) {
+          return _this2.root_.setAttribute(name, value);
+        },
+        removeAttribute: function removeAttribute(name) {
+          return _this2.root_.removeAttribute(name);
+        },
+        computeBoundingRect: function computeBoundingRect() {
+          return _this2.root_.getBoundingClientRect();
+        },
+        getTabIndex: function getTabIndex() {
+          return _this2.root_.tabIndex;
+        },
+        registerInteractionHandler: function registerInteractionHandler(type, handler) {
+          _this2.root_.addEventListener(type, handler);
+        },
+        deregisterInteractionHandler: function deregisterInteractionHandler(type, handler) {
+          _this2.root_.removeEventListener(type, handler);
+        },
+        registerThumbContainerInteractionHandler: function registerThumbContainerInteractionHandler(type, handler) {
+          _this2.thumbContainer_.addEventListener(type, handler);
+        },
+        deregisterThumbContainerInteractionHandler: function deregisterThumbContainerInteractionHandler(type, handler) {
+          _this2.thumbContainer_.removeEventListener(type, handler);
+        },
+        registerBodyInteractionHandler: function registerBodyInteractionHandler(type, handler) {
+          document.body.addEventListener(type, handler);
+        },
+        deregisterBodyInteractionHandler: function deregisterBodyInteractionHandler(type, handler) {
+          document.body.removeEventListener(type, handler);
+        },
+        registerResizeHandler: function registerResizeHandler(handler) {
+          window.addEventListener('resize', handler);
+        },
+        deregisterResizeHandler: function deregisterResizeHandler(handler) {
+          window.removeEventListener('resize', handler);
+        },
+        notifyInput: function notifyInput() {
+          _this2.emit(__WEBPACK_IMPORTED_MODULE_1__constants__["a" /* strings */].INPUT_EVENT, _this2);
+        },
+        notifyChange: function notifyChange() {
+          _this2.emit(__WEBPACK_IMPORTED_MODULE_1__constants__["a" /* strings */].CHANGE_EVENT, _this2);
+        },
+        setThumbContainerStyleProperty: function setThumbContainerStyleProperty(propertyName, value) {
+          _this2.thumbContainer_.style.setProperty(propertyName, value);
+        },
+        setTrackStyleProperty: function setTrackStyleProperty(propertyName, value) {
+          _this2.track_.style.setProperty(propertyName, value);
+        },
+        setMarkerValue: function setMarkerValue(value) {
+          _this2.pinValueMarker_.innerText = value;
+        },
+        appendTrackMarkers: function appendTrackMarkers(numMarkers) {
+          var frag = document.createDocumentFragment();
+          for (var i = 0; i < numMarkers; i++) {
+            var marker = document.createElement('div');
+            marker.classList.add('mdc-slider__track-marker');
+            frag.appendChild(marker);
+          }
+          _this2.trackMarkerContainer_.appendChild(frag);
+        },
+        removeTrackMarkers: function removeTrackMarkers() {
+          while (_this2.trackMarkerContainer_.firstChild) {
+            _this2.trackMarkerContainer_.removeChild(_this2.trackMarkerContainer_.firstChild);
+          }
+        },
+        setLastTrackMarkersStyleProperty: function setLastTrackMarkersStyleProperty(propertyName, value) {
+          // We remove and append new nodes, thus, the last track marker must be dynamically found.
+          var lastTrackMarker = _this2.root_.querySelector(__WEBPACK_IMPORTED_MODULE_1__constants__["a" /* strings */].LAST_TRACK_MARKER_SELECTOR);
+          lastTrackMarker.style.setProperty(propertyName, value);
+        },
+        isRTL: function isRTL() {
+          return getComputedStyle(_this2.root_).direction === 'rtl';
+        }
+      });
+    }
+  }, {
+    key: 'initialSyncWithDOM',
+    value: function initialSyncWithDOM() {
+      var origValueNow = parseFloat(this.root_.getAttribute(__WEBPACK_IMPORTED_MODULE_1__constants__["a" /* strings */].ARIA_VALUENOW));
+      this.min = parseFloat(this.root_.getAttribute(__WEBPACK_IMPORTED_MODULE_1__constants__["a" /* strings */].ARIA_VALUEMIN)) || this.min;
+      this.max = parseFloat(this.root_.getAttribute(__WEBPACK_IMPORTED_MODULE_1__constants__["a" /* strings */].ARIA_VALUEMAX)) || this.max;
+      this.step = parseFloat(this.root_.getAttribute(__WEBPACK_IMPORTED_MODULE_1__constants__["a" /* strings */].STEP_DATA_ATTR)) || this.step;
+      this.value = origValueNow || this.value;
+      this.disabled = this.root_.hasAttribute(__WEBPACK_IMPORTED_MODULE_1__constants__["a" /* strings */].ARIA_DISABLED) && this.root_.getAttribute(__WEBPACK_IMPORTED_MODULE_1__constants__["a" /* strings */].ARIA_DISABLED) !== 'false';
+      this.foundation_.setupTrackMarker();
+    }
+  }, {
+    key: 'layout',
+    value: function layout() {
+      this.foundation_.layout();
+    }
+  }, {
+    key: 'stepUp',
+    value: function stepUp() {
+      var amount = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : this.step || 1;
+
+      this.value += amount;
+    }
+  }, {
+    key: 'stepDown',
+    value: function stepDown() {
+      var amount = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : this.step || 1;
+
+      this.value -= amount;
+    }
+  }, {
+    key: 'value',
+    get: function get() {
+      return this.foundation_.getValue();
+    },
+    set: function set(value) {
+      this.foundation_.setValue(value);
+    }
+  }, {
+    key: 'min',
+    get: function get() {
+      return this.foundation_.getMin();
+    },
+    set: function set(min) {
+      this.foundation_.setMin(min);
+    }
+  }, {
+    key: 'max',
+    get: function get() {
+      return this.foundation_.getMax();
+    },
+    set: function set(max) {
+      this.foundation_.setMax(max);
+    }
+  }, {
+    key: 'step',
+    get: function get() {
+      return this.foundation_.getStep();
+    },
+    set: function set(step) {
+      this.foundation_.setStep(step);
+    }
+  }, {
+    key: 'disabled',
+    get: function get() {
+      return this.foundation_.isDisabled();
+    },
+    set: function set(disabled) {
+      this.foundation_.setDisabled(disabled);
+    }
+  }], [{
+    key: 'attachTo',
+    value: function attachTo(root) {
+      return new MDCSlider(root);
+    }
+  }]);
+
+  return MDCSlider;
+}(__WEBPACK_IMPORTED_MODULE_0__material_base_component__["a" /* default */]);
+
+/***/ }),
+/* 28 */
+/***/ (function(module, __webpack_exports__, __webpack_require__) {
+
+"use strict";
+Object.defineProperty(__webpack_exports__, "__esModule", { value: true });
+/* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, "MDCSnackbar", function() { return MDCSnackbar; });
+/* harmony import */ var __WEBPACK_IMPORTED_MODULE_0__material_base__ = __webpack_require__(0);
+/* harmony import */ var __WEBPACK_IMPORTED_MODULE_1__foundation__ = __webpack_require__(69);
+/* harmony import */ var __WEBPACK_IMPORTED_MODULE_2__material_animation__ = __webpack_require__(5);
+/* harmony reexport (binding) */ __webpack_require__.d(__webpack_exports__, "MDCSnackbarFoundation", function() { return __WEBPACK_IMPORTED_MODULE_1__foundation__["a"]; });
+var _createClass = function () { function defineProperties(target, props) { for (var i = 0; i < props.length; i++) { var descriptor = props[i]; descriptor.enumerable = descriptor.enumerable || false; descriptor.configurable = true; if ("value" in descriptor) descriptor.writable = true; Object.defineProperty(target, descriptor.key, descriptor); } } return function (Constructor, protoProps, staticProps) { if (protoProps) defineProperties(Constructor.prototype, protoProps); if (staticProps) defineProperties(Constructor, staticProps); return Constructor; }; }();
+
+function _classCallCheck(instance, Constructor) { if (!(instance instanceof Constructor)) { throw new TypeError("Cannot call a class as a function"); } }
+
+function _possibleConstructorReturn(self, call) { if (!self) { throw new ReferenceError("this hasn't been initialised - super() hasn't been called"); } return call && (typeof call === "object" || typeof call === "function") ? call : self; }
+
+function _inherits(subClass, superClass) { if (typeof superClass !== "function" && superClass !== null) { throw new TypeError("Super expression must either be null or a function, not " + typeof superClass); } subClass.prototype = Object.create(superClass && superClass.prototype, { constructor: { value: subClass, enumerable: false, writable: true, configurable: true } }); if (superClass) Object.setPrototypeOf ? Object.setPrototypeOf(subClass, superClass) : subClass.__proto__ = superClass; }
+
+/**
+ * Copyright 2016 Google Inc. All Rights Reserved.
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *      http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+
+
+
+
+
+
+
+var MDCSnackbar = function (_MDCComponent) {
+  _inherits(MDCSnackbar, _MDCComponent);
+
+  function MDCSnackbar() {
+    _classCallCheck(this, MDCSnackbar);
+
+    return _possibleConstructorReturn(this, (MDCSnackbar.__proto__ || Object.getPrototypeOf(MDCSnackbar)).apply(this, arguments));
+  }
+
+  _createClass(MDCSnackbar, [{
+    key: 'show',
+    value: function show(data) {
+      this.foundation_.show(data);
+    }
+  }, {
+    key: 'getDefaultFoundation',
+    value: function getDefaultFoundation() {
+      var _this2 = this;
+
+      var _MDCSnackbarFoundatio = __WEBPACK_IMPORTED_MODULE_1__foundation__["a" /* default */].strings,
+          TEXT_SELECTOR = _MDCSnackbarFoundatio.TEXT_SELECTOR,
+          ACTION_BUTTON_SELECTOR = _MDCSnackbarFoundatio.ACTION_BUTTON_SELECTOR;
+
+      var getText = function getText() {
+        return _this2.root_.querySelector(TEXT_SELECTOR);
+      };
+      var getActionButton = function getActionButton() {
+        return _this2.root_.querySelector(ACTION_BUTTON_SELECTOR);
+      };
+
+      /* eslint brace-style: "off" */
+      return new __WEBPACK_IMPORTED_MODULE_1__foundation__["a" /* default */]({
+        addClass: function addClass(className) {
+          return _this2.root_.classList.add(className);
+        },
+        removeClass: function removeClass(className) {
+          return _this2.root_.classList.remove(className);
+        },
+        setAriaHidden: function setAriaHidden() {
+          return _this2.root_.setAttribute('aria-hidden', 'true');
+        },
+        unsetAriaHidden: function unsetAriaHidden() {
+          return _this2.root_.removeAttribute('aria-hidden');
+        },
+        setActionAriaHidden: function setActionAriaHidden() {
+          return getActionButton().setAttribute('aria-hidden', 'true');
+        },
+        unsetActionAriaHidden: function unsetActionAriaHidden() {
+          return getActionButton().removeAttribute('aria-hidden');
+        },
+        setActionText: function setActionText(text) {
+          getActionButton().textContent = text;
+        },
+        setMessageText: function setMessageText(text) {
+          getText().textContent = text;
+        },
+        setFocus: function setFocus() {
+          return getActionButton().focus();
+        },
+        visibilityIsHidden: function visibilityIsHidden() {
+          return document.hidden;
+        },
+        registerCapturedBlurHandler: function registerCapturedBlurHandler(handler) {
+          return getActionButton().addEventListener('blur', handler, true);
+        },
+        deregisterCapturedBlurHandler: function deregisterCapturedBlurHandler(handler) {
+          return getActionButton().removeEventListener('blur', handler, true);
+        },
+        registerVisibilityChangeHandler: function registerVisibilityChangeHandler(handler) {
+          return document.addEventListener('visibilitychange', handler);
+        },
+        deregisterVisibilityChangeHandler: function deregisterVisibilityChangeHandler(handler) {
+          return document.removeEventListener('visibilitychange', handler);
+        },
+        registerCapturedInteractionHandler: function registerCapturedInteractionHandler(evt, handler) {
+          return document.body.addEventListener(evt, handler, true);
+        },
+        deregisterCapturedInteractionHandler: function deregisterCapturedInteractionHandler(evt, handler) {
+          return document.body.removeEventListener(evt, handler, true);
+        },
+        registerActionClickHandler: function registerActionClickHandler(handler) {
+          return getActionButton().addEventListener('click', handler);
+        },
+        deregisterActionClickHandler: function deregisterActionClickHandler(handler) {
+          return getActionButton().removeEventListener('click', handler);
+        },
+        registerTransitionEndHandler: function registerTransitionEndHandler(handler) {
+          return _this2.root_.addEventListener(__webpack_require__.i(__WEBPACK_IMPORTED_MODULE_2__material_animation__["b" /* getCorrectEventName */])(window, 'transitionend'), handler);
+        },
+        deregisterTransitionEndHandler: function deregisterTransitionEndHandler(handler) {
+          return _this2.root_.removeEventListener(__webpack_require__.i(__WEBPACK_IMPORTED_MODULE_2__material_animation__["b" /* getCorrectEventName */])(window, 'transitionend'), handler);
+        }
+      });
+    }
+  }, {
+    key: 'dismissesOnAction',
+    get: function get() {
+      return this.foundation_.dismissesOnAction();
+    },
+    set: function set(dismissesOnAction) {
+      this.foundation_.setDismissOnAction(dismissesOnAction);
+    }
+  }], [{
+    key: 'attachTo',
+    value: function attachTo(root) {
+      return new MDCSnackbar(root);
+    }
+  }]);
+
+  return MDCSnackbar;
+}(__WEBPACK_IMPORTED_MODULE_0__material_base__["MDCComponent"]);
+
+/***/ }),
+/* 29 */
+/***/ (function(module, __webpack_exports__, __webpack_require__) {
+
+"use strict";
+Object.defineProperty(__webpack_exports__, "__esModule", { value: true });
+/* harmony import */ var __WEBPACK_IMPORTED_MODULE_0__tab__ = __webpack_require__(15);
+/* harmony reexport (binding) */ __webpack_require__.d(__webpack_exports__, "MDCTabFoundation", function() { return __WEBPACK_IMPORTED_MODULE_0__tab__["a"]; });
+/* harmony reexport (binding) */ __webpack_require__.d(__webpack_exports__, "MDCTab", function() { return __WEBPACK_IMPORTED_MODULE_0__tab__["b"]; });
+/* harmony import */ var __WEBPACK_IMPORTED_MODULE_1__tab_bar__ = __webpack_require__(13);
+/* harmony reexport (binding) */ __webpack_require__.d(__webpack_exports__, "MDCTabBarFoundation", function() { return __WEBPACK_IMPORTED_MODULE_1__tab_bar__["a"]; });
+/* harmony reexport (binding) */ __webpack_require__.d(__webpack_exports__, "MDCTabBar", function() { return __WEBPACK_IMPORTED_MODULE_1__tab_bar__["b"]; });
+/* harmony import */ var __WEBPACK_IMPORTED_MODULE_2__tab_bar_scroller__ = __webpack_require__(72);
+/* harmony reexport (binding) */ __webpack_require__.d(__webpack_exports__, "MDCTabBarScrollerFoundation", function() { return __WEBPACK_IMPORTED_MODULE_2__tab_bar_scroller__["a"]; });
+/* harmony reexport (binding) */ __webpack_require__.d(__webpack_exports__, "MDCTabBarScroller", function() { return __WEBPACK_IMPORTED_MODULE_2__tab_bar_scroller__["b"]; });
+/**
+ * Copyright 2017 Google Inc. All Rights Reserved.
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *      http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+
+
+
+
+
+/***/ }),
+/* 30 */
+/***/ (function(module, __webpack_exports__, __webpack_require__) {
+
+"use strict";
+Object.defineProperty(__webpack_exports__, "__esModule", { value: true });
+/* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, "MDCTextfield", function() { return MDCTextfield; });
+/* harmony import */ var __WEBPACK_IMPORTED_MODULE_0__material_base__ = __webpack_require__(0);
+/* harmony import */ var __WEBPACK_IMPORTED_MODULE_1__material_ripple__ = __webpack_require__(3);
+/* harmony import */ var __WEBPACK_IMPORTED_MODULE_2__constants__ = __webpack_require__(16);
+/* harmony import */ var __WEBPACK_IMPORTED_MODULE_3__foundation__ = __webpack_require__(76);
+/* harmony reexport (binding) */ __webpack_require__.d(__webpack_exports__, "MDCTextfieldFoundation", function() { return __WEBPACK_IMPORTED_MODULE_3__foundation__["a"]; });
+var _extends = Object.assign || function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; };
+
+var _createClass = function () { function defineProperties(target, props) { for (var i = 0; i < props.length; i++) { var descriptor = props[i]; descriptor.enumerable = descriptor.enumerable || false; descriptor.configurable = true; if ("value" in descriptor) descriptor.writable = true; Object.defineProperty(target, descriptor.key, descriptor); } } return function (Constructor, protoProps, staticProps) { if (protoProps) defineProperties(Constructor.prototype, protoProps); if (staticProps) defineProperties(Constructor, staticProps); return Constructor; }; }();
+
+var _get = function get(object, property, receiver) { if (object === null) object = Function.prototype; var desc = Object.getOwnPropertyDescriptor(object, property); if (desc === undefined) { var parent = Object.getPrototypeOf(object); if (parent === null) { return undefined; } else { return get(parent, property, receiver); } } else if ("value" in desc) { return desc.value; } else { var getter = desc.get; if (getter === undefined) { return undefined; } return getter.call(receiver); } };
+
+function _classCallCheck(instance, Constructor) { if (!(instance instanceof Constructor)) { throw new TypeError("Cannot call a class as a function"); } }
+
+function _possibleConstructorReturn(self, call) { if (!self) { throw new ReferenceError("this hasn't been initialised - super() hasn't been called"); } return call && (typeof call === "object" || typeof call === "function") ? call : self; }
+
+function _inherits(subClass, superClass) { if (typeof superClass !== "function" && superClass !== null) { throw new TypeError("Super expression must either be null or a function, not " + typeof superClass); } subClass.prototype = Object.create(superClass && superClass.prototype, { constructor: { value: subClass, enumerable: false, writable: true, configurable: true } }); if (superClass) Object.setPrototypeOf ? Object.setPrototypeOf(subClass, superClass) : subClass.__proto__ = superClass; }
+
+/**
+ * Copyright 2016 Google Inc. All Rights Reserved.
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *      http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+
+
+
+
+
+
+
+
+
+var MDCTextfield = function (_MDCComponent) {
+  _inherits(MDCTextfield, _MDCComponent);
+
+  function MDCTextfield() {
+    _classCallCheck(this, MDCTextfield);
+
+    return _possibleConstructorReturn(this, (MDCTextfield.__proto__ || Object.getPrototypeOf(MDCTextfield)).apply(this, arguments));
+  }
+
+  _createClass(MDCTextfield, [{
+    key: 'initialize',
+    value: function initialize() {
+      var rippleFactory = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : function (el) {
+        return new __WEBPACK_IMPORTED_MODULE_1__material_ripple__["MDCRipple"](el);
+      };
+
+      this.input_ = this.root_.querySelector(__WEBPACK_IMPORTED_MODULE_2__constants__["a" /* strings */].INPUT_SELECTOR);
+      this.label_ = this.root_.querySelector(__WEBPACK_IMPORTED_MODULE_2__constants__["a" /* strings */].LABEL_SELECTOR);
+      this.helptextElement = null;
+      this.ripple = null;
+      if (this.input_.hasAttribute('aria-controls')) {
+        this.helptextElement = document.getElementById(this.input_.getAttribute('aria-controls'));
+      }
+      if (this.root_.classList.contains(__WEBPACK_IMPORTED_MODULE_2__constants__["b" /* cssClasses */].BOX)) {
+        this.ripple = rippleFactory(this.root_);
+      };
+    }
+  }, {
+    key: 'destroy',
+    value: function destroy() {
+      if (this.ripple) {
+        this.ripple.destroy();
+      }
+      _get(MDCTextfield.prototype.__proto__ || Object.getPrototypeOf(MDCTextfield.prototype), 'destroy', this).call(this);
+    }
+  }, {
+    key: 'initialSyncWithDom',
+    value: function initialSyncWithDom() {
+      this.disabled = this.input_.disabled;
+    }
+  }, {
+    key: 'getDefaultFoundation',
+    value: function getDefaultFoundation() {
+      var _this2 = this;
+
+      return new __WEBPACK_IMPORTED_MODULE_3__foundation__["a" /* default */](_extends({
+        addClass: function addClass(className) {
+          return _this2.root_.classList.add(className);
+        },
+        removeClass: function removeClass(className) {
+          return _this2.root_.classList.remove(className);
+        },
+        addClassToLabel: function addClassToLabel(className) {
+          var label = _this2.label_;
+          if (label) {
+            label.classList.add(className);
+          }
+        },
+        removeClassFromLabel: function removeClassFromLabel(className) {
+          var label = _this2.label_;
+          if (label) {
+            label.classList.remove(className);
+          }
+        }
+      }, this.getInputAdapterMethods_(), this.getHelptextAdapterMethods_()));
+    }
+  }, {
+    key: 'getInputAdapterMethods_',
+    value: function getInputAdapterMethods_() {
+      var _this3 = this;
+
+      return {
+        registerInputFocusHandler: function registerInputFocusHandler(handler) {
+          return _this3.input_.addEventListener('focus', handler);
+        },
+        registerInputBlurHandler: function registerInputBlurHandler(handler) {
+          return _this3.input_.addEventListener('blur', handler);
+        },
+        registerInputInputHandler: function registerInputInputHandler(handler) {
+          return _this3.input_.addEventListener('input', handler);
+        },
+        registerInputKeydownHandler: function registerInputKeydownHandler(handler) {
+          return _this3.input_.addEventListener('keydown', handler);
+        },
+        deregisterInputFocusHandler: function deregisterInputFocusHandler(handler) {
+          return _this3.input_.removeEventListener('focus', handler);
+        },
+        deregisterInputBlurHandler: function deregisterInputBlurHandler(handler) {
+          return _this3.input_.removeEventListener('blur', handler);
+        },
+        deregisterInputInputHandler: function deregisterInputInputHandler(handler) {
+          return _this3.input_.removeEventListener('input', handler);
+        },
+        deregisterInputKeydownHandler: function deregisterInputKeydownHandler(handler) {
+          return _this3.input_.removeEventListener('keydown', handler);
+        },
+        getNativeInput: function getNativeInput() {
+          return _this3.input_;
+        }
+      };
+    }
+  }, {
+    key: 'getHelptextAdapterMethods_',
+    value: function getHelptextAdapterMethods_() {
+      var _this4 = this;
+
+      return {
+        addClassToHelptext: function addClassToHelptext(className) {
+          if (_this4.helptextElement) {
+            _this4.helptextElement.classList.add(className);
+          }
+        },
+        removeClassFromHelptext: function removeClassFromHelptext(className) {
+          if (_this4.helptextElement) {
+            _this4.helptextElement.classList.remove(className);
+          }
+        },
+        helptextHasClass: function helptextHasClass(className) {
+          if (!_this4.helptextElement) {
+            return false;
+          }
+          return _this4.helptextElement.classList.contains(className);
+        },
+        setHelptextAttr: function setHelptextAttr(name, value) {
+          if (_this4.helptextElement) {
+            _this4.helptextElement.setAttribute(name, value);
+          }
+        },
+        removeHelptextAttr: function removeHelptextAttr(name) {
+          if (_this4.helptextElement) {
+            _this4.helptextElement.removeAttribute(name);
+          }
+        }
+      };
+    }
+  }, {
+    key: 'disabled',
+    get: function get() {
+      return this.foundation_.isDisabled();
+    },
+    set: function set(disabled) {
+      this.foundation_.setDisabled(disabled);
+    }
+  }], [{
+    key: 'attachTo',
+    value: function attachTo(root) {
+      return new MDCTextfield(root);
+    }
+  }]);
+
+  return MDCTextfield;
+}(__WEBPACK_IMPORTED_MODULE_0__material_base__["MDCComponent"]);
+
+/***/ }),
+/* 31 */
+/***/ (function(module, __webpack_exports__, __webpack_require__) {
+
+"use strict";
+Object.defineProperty(__webpack_exports__, "__esModule", { value: true });
+/* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, "MDCToolbar", function() { return MDCToolbar; });
+/* harmony import */ var __WEBPACK_IMPORTED_MODULE_0__material_base__ = __webpack_require__(0);
+/* harmony import */ var __WEBPACK_IMPORTED_MODULE_1__foundation__ = __webpack_require__(78);
+/* harmony import */ var __WEBPACK_IMPORTED_MODULE_2__util__ = __webpack_require__(79);
+/* harmony reexport (binding) */ __webpack_require__.d(__webpack_exports__, "MDCToolbarFoundation", function() { return __WEBPACK_IMPORTED_MODULE_1__foundation__["a"]; });
+/* harmony reexport (module object) */ __webpack_require__.d(__webpack_exports__, "util", function() { return __WEBPACK_IMPORTED_MODULE_2__util__; });
+var _createClass = function () { function defineProperties(target, props) { for (var i = 0; i < props.length; i++) { var descriptor = props[i]; descriptor.enumerable = descriptor.enumerable || false; descriptor.configurable = true; if ("value" in descriptor) descriptor.writable = true; Object.defineProperty(target, descriptor.key, descriptor); } } return function (Constructor, protoProps, staticProps) { if (protoProps) defineProperties(Constructor.prototype, protoProps); if (staticProps) defineProperties(Constructor, staticProps); return Constructor; }; }();
+
+function _classCallCheck(instance, Constructor) { if (!(instance instanceof Constructor)) { throw new TypeError("Cannot call a class as a function"); } }
+
+function _possibleConstructorReturn(self, call) { if (!self) { throw new ReferenceError("this hasn't been initialised - super() hasn't been called"); } return call && (typeof call === "object" || typeof call === "function") ? call : self; }
+
+function _inherits(subClass, superClass) { if (typeof superClass !== "function" && superClass !== null) { throw new TypeError("Super expression must either be null or a function, not " + typeof superClass); } subClass.prototype = Object.create(superClass && superClass.prototype, { constructor: { value: subClass, enumerable: false, writable: true, configurable: true } }); if (superClass) Object.setPrototypeOf ? Object.setPrototypeOf(subClass, superClass) : subClass.__proto__ = superClass; }
+
+/**
+ * Copyright 2017 Google Inc. All Rights Reserved.
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *      http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+
+
+
+
+
+
+
+
+
+var MDCToolbar = function (_MDCComponent) {
+  _inherits(MDCToolbar, _MDCComponent);
+
+  function MDCToolbar() {
+    _classCallCheck(this, MDCToolbar);
+
+    return _possibleConstructorReturn(this, (MDCToolbar.__proto__ || Object.getPrototypeOf(MDCToolbar)).apply(this, arguments));
+  }
+
+  _createClass(MDCToolbar, [{
+    key: 'getDefaultFoundation',
+    value: function getDefaultFoundation() {
+      var _this2 = this;
+
+      return new __WEBPACK_IMPORTED_MODULE_1__foundation__["a" /* default */]({
+        hasClass: function hasClass(className) {
+          return _this2.root_.classList.contains(className);
+        },
+        addClass: function addClass(className) {
+          return _this2.root_.classList.add(className);
+        },
+        removeClass: function removeClass(className) {
+          return _this2.root_.classList.remove(className);
+        },
+        registerScrollHandler: function registerScrollHandler(handler) {
+          return window.addEventListener('scroll', handler, __WEBPACK_IMPORTED_MODULE_2__util__["applyPassive"]());
+        },
+        deregisterScrollHandler: function deregisterScrollHandler(handler) {
+          return window.removeEventListener('scroll', handler, __WEBPACK_IMPORTED_MODULE_2__util__["applyPassive"]());
+        },
+        registerResizeHandler: function registerResizeHandler(handler) {
+          return window.addEventListener('resize', handler);
+        },
+        deregisterResizeHandler: function deregisterResizeHandler(handler) {
+          return window.removeEventListener('resize', handler);
+        },
+        getViewportWidth: function getViewportWidth() {
+          return window.innerWidth;
+        },
+        getViewportScrollY: function getViewportScrollY() {
+          return window.pageYOffset;
+        },
+        getOffsetHeight: function getOffsetHeight() {
+          return _this2.root_.offsetHeight;
+        },
+        getFirstRowElementOffsetHeight: function getFirstRowElementOffsetHeight() {
+          return _this2.firstRowElement_.offsetHeight;
+        },
+        notifyChange: function notifyChange(evtData) {
+          return _this2.emit(__WEBPACK_IMPORTED_MODULE_1__foundation__["a" /* default */].strings.CHANGE_EVENT, evtData);
+        },
+        setStyle: function setStyle(property, value) {
+          return _this2.root_.style.setProperty(property, value);
+        },
+        setStyleForTitleElement: function setStyleForTitleElement(property, value) {
+          return _this2.titleElement_.style.setProperty(property, value);
+        },
+        setStyleForFlexibleRowElement: function setStyleForFlexibleRowElement(property, value) {
+          return _this2.firstRowElement_.style.setProperty(property, value);
+        },
+        setStyleForFixedAdjustElement: function setStyleForFixedAdjustElement(property, value) {
+          if (_this2.fixedAdjustElement) {
+            _this2.fixedAdjustElement.style.setProperty(property, value);
+          }
+        }
+      });
+    }
+  }, {
+    key: 'firstRowElement_',
+    get: function get() {
+      return this.root_.querySelector(__WEBPACK_IMPORTED_MODULE_1__foundation__["a" /* default */].strings.FIRST_ROW_SELECTOR);
+    }
+  }, {
+    key: 'titleElement_',
+    get: function get() {
+      return this.root_.querySelector(__WEBPACK_IMPORTED_MODULE_1__foundation__["a" /* default */].strings.TITLE_SELECTOR);
+    }
+  }, {
+    key: 'fixedAdjustElement',
+    set: function set(fixedAdjustElement) {
+      this.fixedAdjustElement_ = fixedAdjustElement;
+      this.foundation_.updateAdjustElementStyles();
+    },
+    get: function get() {
+      return this.fixedAdjustElement_;
+    }
+  }], [{
+    key: 'attachTo',
+    value: function attachTo(root) {
+      return new MDCToolbar(root);
+    }
+  }]);
+
+  return MDCToolbar;
+}(__WEBPACK_IMPORTED_MODULE_0__material_base__["MDCComponent"]);
+
+/***/ }),
+/* 32 */
+/***/ (function(module, __webpack_exports__, __webpack_require__) {
+
+"use strict";
+Object.defineProperty(__webpack_exports__, "__esModule", { value: true });
+/* harmony import */ var __WEBPACK_IMPORTED_MODULE_0__material_auto_init__ = __webpack_require__(17);
+/* harmony import */ var __WEBPACK_IMPORTED_MODULE_1__material_base__ = __webpack_require__(0);
+/* harmony import */ var __WEBPACK_IMPORTED_MODULE_2__material_checkbox__ = __webpack_require__(18);
+/* harmony import */ var __WEBPACK_IMPORTED_MODULE_3__material_dialog__ = __webpack_require__(19);
+/* harmony import */ var __WEBPACK_IMPORTED_MODULE_4__material_drawer__ = __webpack_require__(20);
+/* harmony import */ var __WEBPACK_IMPORTED_MODULE_5__material_form_field__ = __webpack_require__(21);
+/* harmony import */ var __WEBPACK_IMPORTED_MODULE_6__material_grid_list__ = __webpack_require__(22);
+/* harmony import */ var __WEBPACK_IMPORTED_MODULE_7__material_icon_toggle__ = __webpack_require__(23);
+/* harmony import */ var __WEBPACK_IMPORTED_MODULE_8__material_linear_progress__ = __webpack_require__(24);
+/* harmony import */ var __WEBPACK_IMPORTED_MODULE_9__material_menu__ = __webpack_require__(7);
+/* harmony import */ var __WEBPACK_IMPORTED_MODULE_10__material_radio__ = __webpack_require__(25);
+/* harmony import */ var __WEBPACK_IMPORTED_MODULE_11__material_ripple__ = __webpack_require__(3);
+/* harmony import */ var __WEBPACK_IMPORTED_MODULE_12__material_select__ = __webpack_require__(26);
+/* harmony import */ var __WEBPACK_IMPORTED_MODULE_13__material_slider__ = __webpack_require__(27);
+/* harmony import */ var __WEBPACK_IMPORTED_MODULE_14__material_snackbar__ = __webpack_require__(28);
+/* harmony import */ var __WEBPACK_IMPORTED_MODULE_15__material_tabs__ = __webpack_require__(29);
+/* harmony import */ var __WEBPACK_IMPORTED_MODULE_16__material_textfield__ = __webpack_require__(30);
+/* harmony import */ var __WEBPACK_IMPORTED_MODULE_17__material_toolbar__ = __webpack_require__(31);
+/* harmony reexport (binding) */ __webpack_require__.d(__webpack_exports__, "autoInit", function() { return __WEBPACK_IMPORTED_MODULE_0__material_auto_init__["a"]; });
+/* harmony reexport (module object) */ __webpack_require__.d(__webpack_exports__, "base", function() { return __WEBPACK_IMPORTED_MODULE_1__material_base__; });
+/* harmony reexport (module object) */ __webpack_require__.d(__webpack_exports__, "checkbox", function() { return __WEBPACK_IMPORTED_MODULE_2__material_checkbox__; });
+/* harmony reexport (module object) */ __webpack_require__.d(__webpack_exports__, "dialog", function() { return __WEBPACK_IMPORTED_MODULE_3__material_dialog__; });
+/* harmony reexport (module object) */ __webpack_require__.d(__webpack_exports__, "drawer", function() { return __WEBPACK_IMPORTED_MODULE_4__material_drawer__; });
+/* harmony reexport (module object) */ __webpack_require__.d(__webpack_exports__, "formField", function() { return __WEBPACK_IMPORTED_MODULE_5__material_form_field__; });
+/* harmony reexport (module object) */ __webpack_require__.d(__webpack_exports__, "gridList", function() { return __WEBPACK_IMPORTED_MODULE_6__material_grid_list__; });
+/* harmony reexport (module object) */ __webpack_require__.d(__webpack_exports__, "iconToggle", function() { return __WEBPACK_IMPORTED_MODULE_7__material_icon_toggle__; });
+/* harmony reexport (module object) */ __webpack_require__.d(__webpack_exports__, "linearProgress", function() { return __WEBPACK_IMPORTED_MODULE_8__material_linear_progress__; });
+/* harmony reexport (module object) */ __webpack_require__.d(__webpack_exports__, "menu", function() { return __WEBPACK_IMPORTED_MODULE_9__material_menu__; });
+/* harmony reexport (module object) */ __webpack_require__.d(__webpack_exports__, "radio", function() { return __WEBPACK_IMPORTED_MODULE_10__material_radio__; });
+/* harmony reexport (module object) */ __webpack_require__.d(__webpack_exports__, "ripple", function() { return __WEBPACK_IMPORTED_MODULE_11__material_ripple__; });
+/* harmony reexport (module object) */ __webpack_require__.d(__webpack_exports__, "select", function() { return __WEBPACK_IMPORTED_MODULE_12__material_select__; });
+/* harmony reexport (module object) */ __webpack_require__.d(__webpack_exports__, "slider", function() { return __WEBPACK_IMPORTED_MODULE_13__material_slider__; });
+/* harmony reexport (module object) */ __webpack_require__.d(__webpack_exports__, "snackbar", function() { return __WEBPACK_IMPORTED_MODULE_14__material_snackbar__; });
+/* harmony reexport (module object) */ __webpack_require__.d(__webpack_exports__, "tabs", function() { return __WEBPACK_IMPORTED_MODULE_15__material_tabs__; });
+/* harmony reexport (module object) */ __webpack_require__.d(__webpack_exports__, "textfield", function() { return __WEBPACK_IMPORTED_MODULE_16__material_textfield__; });
+/* harmony reexport (module object) */ __webpack_require__.d(__webpack_exports__, "toolbar", function() { return __WEBPACK_IMPORTED_MODULE_17__material_toolbar__; });
+/**
+ * Copyright 2016 Google Inc. All Rights Reserved.
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *      http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+// Register all components
+__WEBPACK_IMPORTED_MODULE_0__material_auto_init__["a" /* default */].register('MDCCheckbox', __WEBPACK_IMPORTED_MODULE_2__material_checkbox__["MDCCheckbox"]);
+__WEBPACK_IMPORTED_MODULE_0__material_auto_init__["a" /* default */].register('MDCDialog', __WEBPACK_IMPORTED_MODULE_3__material_dialog__["MDCDialog"]);
+__WEBPACK_IMPORTED_MODULE_0__material_auto_init__["a" /* default */].register('MDCPersistentDrawer', __WEBPACK_IMPORTED_MODULE_4__material_drawer__["MDCPersistentDrawer"]);
+__WEBPACK_IMPORTED_MODULE_0__material_auto_init__["a" /* default */].register('MDCTemporaryDrawer', __WEBPACK_IMPORTED_MODULE_4__material_drawer__["MDCTemporaryDrawer"]);
+__WEBPACK_IMPORTED_MODULE_0__material_auto_init__["a" /* default */].register('MDCFormField', __WEBPACK_IMPORTED_MODULE_5__material_form_field__["MDCFormField"]);
+__WEBPACK_IMPORTED_MODULE_0__material_auto_init__["a" /* default */].register('MDCRipple', __WEBPACK_IMPORTED_MODULE_11__material_ripple__["MDCRipple"]);
+__WEBPACK_IMPORTED_MODULE_0__material_auto_init__["a" /* default */].register('MDCGridList', __WEBPACK_IMPORTED_MODULE_6__material_grid_list__["MDCGridList"]);
+__WEBPACK_IMPORTED_MODULE_0__material_auto_init__["a" /* default */].register('MDCIconToggle', __WEBPACK_IMPORTED_MODULE_7__material_icon_toggle__["MDCIconToggle"]);
+__WEBPACK_IMPORTED_MODULE_0__material_auto_init__["a" /* default */].register('MDCLinearProgress', __WEBPACK_IMPORTED_MODULE_8__material_linear_progress__["MDCLinearProgress"]);
+__WEBPACK_IMPORTED_MODULE_0__material_auto_init__["a" /* default */].register('MDCRadio', __WEBPACK_IMPORTED_MODULE_10__material_radio__["MDCRadio"]);
+__WEBPACK_IMPORTED_MODULE_0__material_auto_init__["a" /* default */].register('MDCSnackbar', __WEBPACK_IMPORTED_MODULE_14__material_snackbar__["MDCSnackbar"]);
+__WEBPACK_IMPORTED_MODULE_0__material_auto_init__["a" /* default */].register('MDCTab', __WEBPACK_IMPORTED_MODULE_15__material_tabs__["MDCTab"]);
+__WEBPACK_IMPORTED_MODULE_0__material_auto_init__["a" /* default */].register('MDCTabBar', __WEBPACK_IMPORTED_MODULE_15__material_tabs__["MDCTabBar"]);
+__WEBPACK_IMPORTED_MODULE_0__material_auto_init__["a" /* default */].register('MDCTextfield', __WEBPACK_IMPORTED_MODULE_16__material_textfield__["MDCTextfield"]);
+__WEBPACK_IMPORTED_MODULE_0__material_auto_init__["a" /* default */].register('MDCSimpleMenu', __WEBPACK_IMPORTED_MODULE_9__material_menu__["MDCSimpleMenu"]);
+__WEBPACK_IMPORTED_MODULE_0__material_auto_init__["a" /* default */].register('MDCSelect', __WEBPACK_IMPORTED_MODULE_12__material_select__["MDCSelect"]);
+__WEBPACK_IMPORTED_MODULE_0__material_auto_init__["a" /* default */].register('MDCSlider', __WEBPACK_IMPORTED_MODULE_13__material_slider__["MDCSlider"]);
+__WEBPACK_IMPORTED_MODULE_0__material_auto_init__["a" /* default */].register('MDCToolbar', __WEBPACK_IMPORTED_MODULE_17__material_toolbar__["MDCToolbar"]);
+
+// Export all components.
+
+
+/***/ }),
+/* 33 */
+/***/ (function(module, __webpack_exports__, __webpack_require__) {
+
+"use strict";
+/* harmony import */ var __WEBPACK_IMPORTED_MODULE_0__material_base_selection_control__ = __webpack_require__(4);
+var _createClass = function () { function defineProperties(target, props) { for (var i = 0; i < props.length; i++) { var descriptor = props[i]; descriptor.enumerable = descriptor.enumerable || false; descriptor.configurable = true; if ("value" in descriptor) descriptor.writable = true; Object.defineProperty(target, descriptor.key, descriptor); } } return function (Constructor, protoProps, staticProps) { if (protoProps) defineProperties(Constructor.prototype, protoProps); if (staticProps) defineProperties(Constructor, staticProps); return Constructor; }; }();
+
+function _classCallCheck(instance, Constructor) { if (!(instance instanceof Constructor)) { throw new TypeError("Cannot call a class as a function"); } }
+
+/**
+ * Copyright 2016 Google Inc. All Rights Reserved.
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *      http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+
+/* eslint-disable no-unused-vars */
+
+
+/* eslint no-unused-vars: [2, {"args": "none"}] */
+
+/**
+ * Adapter for MDC Checkbox. Provides an interface for managing
+ * - classes
+ * - dom
+ * - event handlers
+ *
+ * Additionally, provides type information for the adapter to the Closure
+ * compiler.
+ *
+ * Implement this adapter for your framework of choice to delegate updates to
+ * the component in your framework of choice. See architecture documentation
+ * for more details.
+ * https://github.com/material-components/material-components-web/blob/master/docs/architecture.md
+ *
+ * @record
+ */
+
+var MDCCheckboxAdapter = function () {
+  function MDCCheckboxAdapter() {
+    _classCallCheck(this, MDCCheckboxAdapter);
+  }
+
+  _createClass(MDCCheckboxAdapter, [{
+    key: 'addClass',
+
+    /** @param {string} className */
+    value: function addClass(className) {}
+
+    /** @param {string} className */
+
+  }, {
+    key: 'removeClass',
+    value: function removeClass(className) {}
+
+    /** @param {!EventListener} handler */
+
+  }, {
+    key: 'registerAnimationEndHandler',
+    value: function registerAnimationEndHandler(handler) {}
+
+    /** @param {!EventListener} handler */
+
+  }, {
+    key: 'deregisterAnimationEndHandler',
+    value: function deregisterAnimationEndHandler(handler) {}
+
+    /** @param {!EventListener} handler */
+
+  }, {
+    key: 'registerChangeHandler',
+    value: function registerChangeHandler(handler) {}
+
+    /** @param {!EventListener} handler */
+
+  }, {
+    key: 'deregisterChangeHandler',
+    value: function deregisterChangeHandler(handler) {}
+
+    /** @return {!SelectionControlState} */
+
+  }, {
+    key: 'getNativeControl',
+    value: function getNativeControl() {}
+  }, {
+    key: 'forceLayout',
+    value: function forceLayout() {}
+
+    /** @return {boolean} */
+
+  }, {
+    key: 'isAttachedToDOM',
+    value: function isAttachedToDOM() {}
+  }]);
+
+  return MDCCheckboxAdapter;
+}();
+
+/* unused harmony default export */ var _unused_webpack_default_export = (MDCCheckboxAdapter);
+
+/***/ }),
+/* 34 */
+/***/ (function(module, __webpack_exports__, __webpack_require__) {
+
+"use strict";
+/* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, "a", function() { return cssClasses; });
+/* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, "b", function() { return strings; });
+/* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, "c", function() { return numbers; });
+/**
+ * Copyright 2016 Google Inc. All Rights Reserved.
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *      http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+
+/** @const {string} */
+var ROOT = 'mdc-checkbox';
+
+/** @enum {string} */
+var cssClasses = {
+  UPGRADED: 'mdc-checkbox--upgraded',
+  CHECKED: 'mdc-checkbox--checked',
+  INDETERMINATE: 'mdc-checkbox--indeterminate',
+  DISABLED: 'mdc-checkbox--disabled',
+  ANIM_UNCHECKED_CHECKED: 'mdc-checkbox--anim-unchecked-checked',
+  ANIM_UNCHECKED_INDETERMINATE: 'mdc-checkbox--anim-unchecked-indeterminate',
+  ANIM_CHECKED_UNCHECKED: 'mdc-checkbox--anim-checked-unchecked',
+  ANIM_CHECKED_INDETERMINATE: 'mdc-checkbox--anim-checked-indeterminate',
+  ANIM_INDETERMINATE_CHECKED: 'mdc-checkbox--anim-indeterminate-checked',
+  ANIM_INDETERMINATE_UNCHECKED: 'mdc-checkbox--anim-indeterminate-unchecked'
+};
+
+/** @enum {string} */
+var strings = {
+  NATIVE_CONTROL_SELECTOR: '.' + ROOT + '__native-control',
+  TRANSITION_STATE_INIT: 'init',
+  TRANSITION_STATE_CHECKED: 'checked',
+  TRANSITION_STATE_UNCHECKED: 'unchecked',
+  TRANSITION_STATE_INDETERMINATE: 'indeterminate'
+};
+
+/** @enum {number} */
+var numbers = {
+  ANIM_END_LATCH_MS: 100
+};
+
+/***/ }),
+/* 35 */
+/***/ (function(module, __webpack_exports__, __webpack_require__) {
+
+"use strict";
+/* harmony import */ var __WEBPACK_IMPORTED_MODULE_0__material_base_foundation__ = __webpack_require__(1);
+/* harmony import */ var __WEBPACK_IMPORTED_MODULE_1__material_base_selection_control__ = __webpack_require__(4);
+/* harmony import */ var __WEBPACK_IMPORTED_MODULE_2__adapter__ = __webpack_require__(33);
+/* harmony import */ var __WEBPACK_IMPORTED_MODULE_3__constants__ = __webpack_require__(34);
+var _extends = Object.assign || function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; };
+
+var _createClass = function () { function defineProperties(target, props) { for (var i = 0; i < props.length; i++) { var descriptor = props[i]; descriptor.enumerable = descriptor.enumerable || false; descriptor.configurable = true; if ("value" in descriptor) descriptor.writable = true; Object.defineProperty(target, descriptor.key, descriptor); } } return function (Constructor, protoProps, staticProps) { if (protoProps) defineProperties(Constructor.prototype, protoProps); if (staticProps) defineProperties(Constructor, staticProps); return Constructor; }; }();
+
+function _classCallCheck(instance, Constructor) { if (!(instance instanceof Constructor)) { throw new TypeError("Cannot call a class as a function"); } }
+
+function _possibleConstructorReturn(self, call) { if (!self) { throw new ReferenceError("this hasn't been initialised - super() hasn't been called"); } return call && (typeof call === "object" || typeof call === "function") ? call : self; }
+
+function _inherits(subClass, superClass) { if (typeof superClass !== "function" && superClass !== null) { throw new TypeError("Super expression must either be null or a function, not " + typeof superClass); } subClass.prototype = Object.create(superClass && superClass.prototype, { constructor: { value: subClass, enumerable: false, writable: true, configurable: true } }); if (superClass) Object.setPrototypeOf ? Object.setPrototypeOf(subClass, superClass) : subClass.__proto__ = superClass; }
+
+/**
+ * Copyright 2016 Google Inc. All Rights Reserved.
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *      http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+
+
+/* eslint-disable no-unused-vars */
+
+
+/* eslint-enable no-unused-vars */
+
+
+/** @const {!Array<string>} */
+var CB_PROTO_PROPS = ['checked', 'indeterminate'];
+
+/**
+ * @extends {MDCFoundation<!MDCCheckboxAdapter>}
+ */
+
+var MDCCheckboxFoundation = function (_MDCFoundation) {
+  _inherits(MDCCheckboxFoundation, _MDCFoundation);
+
+  _createClass(MDCCheckboxFoundation, null, [{
+    key: 'cssClasses',
+
+    /** @return enum {cssClasses} */
+    get: function get() {
+      return __WEBPACK_IMPORTED_MODULE_3__constants__["a" /* cssClasses */];
+    }
+
+    /** @return enum {strings} */
+
+  }, {
+    key: 'strings',
+    get: function get() {
+      return __WEBPACK_IMPORTED_MODULE_3__constants__["b" /* strings */];
+    }
+
+    /** @return enum {numbers} */
+
+  }, {
+    key: 'numbers',
+    get: function get() {
+      return __WEBPACK_IMPORTED_MODULE_3__constants__["c" /* numbers */];
+    }
+
+    /** @return {!MDCCheckboxAdapter} */
+
+  }, {
+    key: 'defaultAdapter',
+    get: function get() {
+      return (/** @type {!MDCCheckboxAdapter} */{
+          addClass: function addClass() /* className: string */{},
+          removeClass: function removeClass() /* className: string */{},
+          registerAnimationEndHandler: function registerAnimationEndHandler() /* handler: EventListener */{},
+          deregisterAnimationEndHandler: function deregisterAnimationEndHandler() /* handler: EventListener */{},
+          registerChangeHandler: function registerChangeHandler() /* handler: EventListener */{},
+          deregisterChangeHandler: function deregisterChangeHandler() /* handler: EventListener */{},
+          getNativeControl: function getNativeControl() /* !SelectionControlState */{},
+          forceLayout: function forceLayout() {},
+          isAttachedToDOM: function isAttachedToDOM() /* boolean */{}
+        }
+      );
+    }
+  }]);
+
+  function MDCCheckboxFoundation(adapter) {
+    _classCallCheck(this, MDCCheckboxFoundation);
+
+    /** @private {string} */
+    var _this = _possibleConstructorReturn(this, (MDCCheckboxFoundation.__proto__ || Object.getPrototypeOf(MDCCheckboxFoundation)).call(this, _extends(MDCCheckboxFoundation.defaultAdapter, adapter)));
+
+    _this.currentCheckState_ = __WEBPACK_IMPORTED_MODULE_3__constants__["b" /* strings */].TRANSITION_STATE_INIT;
+
+    /** @private {string} */
+    _this.currentAnimationClass_ = '';
+
+    /** @private {number} */
+    _this.animEndLatchTimer_ = 0;
+
+    _this.animEndHandler_ = /** @private {!EventListener} */function () {
+      clearTimeout(_this.animEndLatchTimer_);
+      _this.animEndLatchTimer_ = setTimeout(function () {
+        _this.adapter_.removeClass(_this.currentAnimationClass_);
+        _this.adapter_.deregisterAnimationEndHandler(_this.animEndHandler_);
+      }, __WEBPACK_IMPORTED_MODULE_3__constants__["c" /* numbers */].ANIM_END_LATCH_MS);
+    };
+
+    _this.changeHandler_ = /** @private {!EventListener} */function () {
+      return _this.transitionCheckState_();
+    };
+    return _this;
+  }
+
+  _createClass(MDCCheckboxFoundation, [{
+    key: 'init',
+    value: function init() {
+      this.adapter_.addClass(__WEBPACK_IMPORTED_MODULE_3__constants__["a" /* cssClasses */].UPGRADED);
+      this.adapter_.registerChangeHandler(this.changeHandler_);
+      this.installPropertyChangeHooks_();
+    }
+  }, {
+    key: 'destroy',
+    value: function destroy() {
+      this.adapter_.deregisterChangeHandler(this.changeHandler_);
+      this.uninstallPropertyChangeHooks_();
+    }
+
+    /** @return {boolean} */
+
+  }, {
+    key: 'isChecked',
+    value: function isChecked() {
+      return this.getNativeControl_().checked;
+    }
+
+    /** @param {boolean} checked */
+
+  }, {
+    key: 'setChecked',
+    value: function setChecked(checked) {
+      this.getNativeControl_().checked = checked;
+    }
+
+    /** @return {boolean} */
+
+  }, {
+    key: 'isIndeterminate',
+    value: function isIndeterminate() {
+      return this.getNativeControl_().indeterminate;
+    }
+
+    /** @param {boolean} indeterminate */
+
+  }, {
+    key: 'setIndeterminate',
+    value: function setIndeterminate(indeterminate) {
+      this.getNativeControl_().indeterminate = indeterminate;
+    }
+
+    /** @return {boolean} */
+
+  }, {
+    key: 'isDisabled',
+    value: function isDisabled() {
+      return this.getNativeControl_().disabled;
+    }
+
+    /** @param {boolean} disabled */
+
+  }, {
+    key: 'setDisabled',
+    value: function setDisabled(disabled) {
+      this.getNativeControl_().disabled = disabled;
+      if (disabled) {
+        this.adapter_.addClass(__WEBPACK_IMPORTED_MODULE_3__constants__["a" /* cssClasses */].DISABLED);
+      } else {
+        this.adapter_.removeClass(__WEBPACK_IMPORTED_MODULE_3__constants__["a" /* cssClasses */].DISABLED);
+      }
+    }
+
+    /** @return {?string} */
+
+  }, {
+    key: 'getValue',
+    value: function getValue() {
+      return this.getNativeControl_().value;
+    }
+
+    /** @param {?string} value */
+
+  }, {
+    key: 'setValue',
+    value: function setValue(value) {
+      this.getNativeControl_().value = value;
+    }
+
+    /** @private */
+
+  }, {
+    key: 'installPropertyChangeHooks_',
+    value: function installPropertyChangeHooks_() {
+      var _this2 = this;
+
+      var nativeCb = this.getNativeControl_();
+      var cbProto = Object.getPrototypeOf(nativeCb);
+
+      CB_PROTO_PROPS.forEach(function (controlState) {
+        var desc = Object.getOwnPropertyDescriptor(cbProto, controlState);
+        // We have to check for this descriptor, since some browsers (Safari) don't support its return.
+        // See: https://bugs.webkit.org/show_bug.cgi?id=49739
+        if (validDescriptor(desc)) {
+          var nativeCbDesc = /** @type {!ObjectPropertyDescriptor} */{
+            get: desc.get,
+            set: function set(state) {
+              desc.set.call(nativeCb, state);
+              _this2.transitionCheckState_();
+            },
+            configurable: desc.configurable,
+            enumerable: desc.enumerable
+          };
+          Object.defineProperty(nativeCb, controlState, nativeCbDesc);
+        }
+      });
+    }
+
+    /** @private */
+
+  }, {
+    key: 'uninstallPropertyChangeHooks_',
+    value: function uninstallPropertyChangeHooks_() {
+      var nativeCb = this.getNativeControl_();
+      var cbProto = Object.getPrototypeOf(nativeCb);
+
+      CB_PROTO_PROPS.forEach(function (controlState) {
+        var desc = /** @type {!ObjectPropertyDescriptor} */Object.getOwnPropertyDescriptor(cbProto, controlState);
+        if (validDescriptor(desc)) {
+          Object.defineProperty(nativeCb, controlState, desc);
+        }
+      });
+    }
+
+    /** @private */
+
+  }, {
+    key: 'transitionCheckState_',
+    value: function transitionCheckState_() {
+      var nativeCb = this.adapter_.getNativeControl();
+      if (!nativeCb) {
+        return;
+      }
+      var oldState = this.currentCheckState_;
+      var newState = this.determineCheckState_(nativeCb);
+      if (oldState === newState) {
+        return;
+      }
+
+      // Check to ensure that there isn't a previously existing animation class, in case for example
+      // the user interacted with the checkbox before the animation was finished.
+      if (this.currentAnimationClass_.length > 0) {
+        clearTimeout(this.animEndLatchTimer_);
+        this.adapter_.forceLayout();
+        this.adapter_.removeClass(this.currentAnimationClass_);
+      }
+
+      this.currentAnimationClass_ = this.getTransitionAnimationClass_(oldState, newState);
+      this.currentCheckState_ = newState;
+
+      // Check for parentNode so that animations are only run when the element is attached
+      // to the DOM.
+      if (this.adapter_.isAttachedToDOM() && this.currentAnimationClass_.length > 0) {
+        this.adapter_.addClass(this.currentAnimationClass_);
+        this.adapter_.registerAnimationEndHandler(this.animEndHandler_);
+      }
+    }
+
+    /**
+     * @param {!SelectionControlState} nativeCb
+     * @return {string}
+     * @private
+     */
+
+  }, {
+    key: 'determineCheckState_',
+    value: function determineCheckState_(nativeCb) {
+      var TRANSITION_STATE_INDETERMINATE = __WEBPACK_IMPORTED_MODULE_3__constants__["b" /* strings */].TRANSITION_STATE_INDETERMINATE,
+          TRANSITION_STATE_CHECKED = __WEBPACK_IMPORTED_MODULE_3__constants__["b" /* strings */].TRANSITION_STATE_CHECKED,
+          TRANSITION_STATE_UNCHECKED = __WEBPACK_IMPORTED_MODULE_3__constants__["b" /* strings */].TRANSITION_STATE_UNCHECKED;
+
+
+      if (nativeCb.indeterminate) {
+        return TRANSITION_STATE_INDETERMINATE;
+      }
+      return nativeCb.checked ? TRANSITION_STATE_CHECKED : TRANSITION_STATE_UNCHECKED;
+    }
+
+    /**
+     * @param {string} oldState
+     * @param {string} newState
+     * @return {string}
+     */
+
+  }, {
+    key: 'getTransitionAnimationClass_',
+    value: function getTransitionAnimationClass_(oldState, newState) {
+      var TRANSITION_STATE_INIT = __WEBPACK_IMPORTED_MODULE_3__constants__["b" /* strings */].TRANSITION_STATE_INIT,
+          TRANSITION_STATE_CHECKED = __WEBPACK_IMPORTED_MODULE_3__constants__["b" /* strings */].TRANSITION_STATE_CHECKED,
+          TRANSITION_STATE_UNCHECKED = __WEBPACK_IMPORTED_MODULE_3__constants__["b" /* strings */].TRANSITION_STATE_UNCHECKED;
+      var _MDCCheckboxFoundatio = MDCCheckboxFoundation.cssClasses,
+          ANIM_UNCHECKED_CHECKED = _MDCCheckboxFoundatio.ANIM_UNCHECKED_CHECKED,
+          ANIM_UNCHECKED_INDETERMINATE = _MDCCheckboxFoundatio.ANIM_UNCHECKED_INDETERMINATE,
+          ANIM_CHECKED_UNCHECKED = _MDCCheckboxFoundatio.ANIM_CHECKED_UNCHECKED,
+          ANIM_CHECKED_INDETERMINATE = _MDCCheckboxFoundatio.ANIM_CHECKED_INDETERMINATE,
+          ANIM_INDETERMINATE_CHECKED = _MDCCheckboxFoundatio.ANIM_INDETERMINATE_CHECKED,
+          ANIM_INDETERMINATE_UNCHECKED = _MDCCheckboxFoundatio.ANIM_INDETERMINATE_UNCHECKED;
+
+
+      switch (oldState) {
+        case TRANSITION_STATE_INIT:
+          if (newState === TRANSITION_STATE_UNCHECKED) {
+            return '';
+          }
+        // fallthrough
+        case TRANSITION_STATE_UNCHECKED:
+          return newState === TRANSITION_STATE_CHECKED ? ANIM_UNCHECKED_CHECKED : ANIM_UNCHECKED_INDETERMINATE;
+        case TRANSITION_STATE_CHECKED:
+          return newState === TRANSITION_STATE_UNCHECKED ? ANIM_CHECKED_UNCHECKED : ANIM_CHECKED_INDETERMINATE;
+        // TRANSITION_STATE_INDETERMINATE
+        default:
+          return newState === TRANSITION_STATE_CHECKED ? ANIM_INDETERMINATE_CHECKED : ANIM_INDETERMINATE_UNCHECKED;
+      }
+    }
+
+    /**
+     * @return {!SelectionControlState}
+     * @private
+     */
+
+  }, {
+    key: 'getNativeControl_',
+    value: function getNativeControl_() {
+      return this.adapter_.getNativeControl() || {
+        checked: false,
+        indeterminate: false,
+        disabled: false,
+        value: null
+      };
+    }
+  }]);
+
+  return MDCCheckboxFoundation;
+}(__WEBPACK_IMPORTED_MODULE_0__material_base_foundation__["a" /* default */]);
+
+/**
+ * @param {ObjectPropertyDescriptor|undefined} inputPropDesc
+ * @return {boolean}
+ */
+
+
+/* harmony default export */ __webpack_exports__["a"] = (MDCCheckboxFoundation);
+function validDescriptor(inputPropDesc) {
+  return !!inputPropDesc && typeof inputPropDesc.set === 'function';
+}
+
+/***/ }),
+/* 36 */
+/***/ (function(module, __webpack_exports__, __webpack_require__) {
+
+"use strict";
+/* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, "a", function() { return cssClasses; });
+/* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, "b", function() { return strings; });
+/**
+ * Copyright 2016 Google Inc. All Rights Reserved.
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *      http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+
+var cssClasses = {
+  ROOT: 'mdc-dialog',
+  OPEN: 'mdc-dialog--open',
+  ANIMATING: 'mdc-dialog--animating',
+  BACKDROP: 'mdc-dialog__backdrop',
+  SCROLL_LOCK: 'mdc-dialog-scroll-lock',
+  ACCEPT_BTN: 'mdc-dialog__footer__button--accept',
+  CANCEL_BTN: 'mdc-dialog__footer__button--cancel'
+};
+
+var strings = {
+  OPEN_DIALOG_SELECTOR: '.mdc-dialog--open',
+  DIALOG_SURFACE_SELECTOR: '.mdc-dialog__surface',
+  ACCEPT_SELECTOR: '.mdc-dialog__footer__button--accept',
+  ACCEPT_EVENT: 'MDCDialog:accept',
+  CANCEL_EVENT: 'MDCDialog:cancel'
+};
+
+/***/ }),
+/* 37 */
+/***/ (function(module, __webpack_exports__, __webpack_require__) {
+
+"use strict";
+/* harmony import */ var __WEBPACK_IMPORTED_MODULE_0__material_base__ = __webpack_require__(0);
+/* harmony import */ var __WEBPACK_IMPORTED_MODULE_1__constants__ = __webpack_require__(36);
+var _extends = Object.assign || function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; };
+
+var _createClass = function () { function defineProperties(target, props) { for (var i = 0; i < props.length; i++) { var descriptor = props[i]; descriptor.enumerable = descriptor.enumerable || false; descriptor.configurable = true; if ("value" in descriptor) descriptor.writable = true; Object.defineProperty(target, descriptor.key, descriptor); } } return function (Constructor, protoProps, staticProps) { if (protoProps) defineProperties(Constructor.prototype, protoProps); if (staticProps) defineProperties(Constructor, staticProps); return Constructor; }; }();
+
+function _classCallCheck(instance, Constructor) { if (!(instance instanceof Constructor)) { throw new TypeError("Cannot call a class as a function"); } }
+
+function _possibleConstructorReturn(self, call) { if (!self) { throw new ReferenceError("this hasn't been initialised - super() hasn't been called"); } return call && (typeof call === "object" || typeof call === "function") ? call : self; }
+
+function _inherits(subClass, superClass) { if (typeof superClass !== "function" && superClass !== null) { throw new TypeError("Super expression must either be null or a function, not " + typeof superClass); } subClass.prototype = Object.create(superClass && superClass.prototype, { constructor: { value: subClass, enumerable: false, writable: true, configurable: true } }); if (superClass) Object.setPrototypeOf ? Object.setPrototypeOf(subClass, superClass) : subClass.__proto__ = superClass; }
+
+/**
+ * Copyright 2017 Google Inc. All Rights Reserved.
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *      http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+
+
+
+
+var MDCDialogFoundation = function (_MDCFoundation) {
+  _inherits(MDCDialogFoundation, _MDCFoundation);
+
+  _createClass(MDCDialogFoundation, null, [{
+    key: 'cssClasses',
+    get: function get() {
+      return __WEBPACK_IMPORTED_MODULE_1__constants__["a" /* cssClasses */];
+    }
+  }, {
+    key: 'strings',
+    get: function get() {
+      return __WEBPACK_IMPORTED_MODULE_1__constants__["b" /* strings */];
+    }
+  }, {
+    key: 'defaultAdapter',
+    get: function get() {
+      return {
+        addClass: function addClass() /* className: string */{},
+        removeClass: function removeClass() /* className: string */{},
+        addBodyClass: function addBodyClass() /* className: string */{},
+        removeBodyClass: function removeBodyClass() /* className: string */{},
+        eventTargetHasClass: function eventTargetHasClass() {
+          return (/* target: EventTarget, className: string */ /* boolean */false
+          );
+        },
+        registerInteractionHandler: function registerInteractionHandler() /* evt: string, handler: EventListener */{},
+        deregisterInteractionHandler: function deregisterInteractionHandler() /* evt: string, handler: EventListener */{},
+        registerSurfaceInteractionHandler: function registerSurfaceInteractionHandler() /* evt: string, handler: EventListener */{},
+        deregisterSurfaceInteractionHandler: function deregisterSurfaceInteractionHandler() /* evt: string, handler: EventListener */{},
+        registerDocumentKeydownHandler: function registerDocumentKeydownHandler() /* handler: EventListener */{},
+        deregisterDocumentKeydownHandler: function deregisterDocumentKeydownHandler() /* handler: EventListener */{},
+        registerTransitionEndHandler: function registerTransitionEndHandler() /* handler: EventListener */{},
+        deregisterTransitionEndHandler: function deregisterTransitionEndHandler() /* handler: EventListener */{},
+        notifyAccept: function notifyAccept() {},
+        notifyCancel: function notifyCancel() {},
+        trapFocusOnSurface: function trapFocusOnSurface() {},
+        untrapFocusOnSurface: function untrapFocusOnSurface() {},
+        isDialog: function isDialog() {
+          return (/* el: Element */ /* boolean */false
+          );
+        }
+      };
+    }
+  }]);
+
+  function MDCDialogFoundation(adapter) {
+    _classCallCheck(this, MDCDialogFoundation);
+
+    var _this = _possibleConstructorReturn(this, (MDCDialogFoundation.__proto__ || Object.getPrototypeOf(MDCDialogFoundation)).call(this, _extends(MDCDialogFoundation.defaultAdapter, adapter)));
+
+    _this.isOpen_ = false;
+    _this.componentClickHandler_ = function (evt) {
+      if (_this.adapter_.eventTargetHasClass(evt.target, __WEBPACK_IMPORTED_MODULE_1__constants__["a" /* cssClasses */].BACKDROP)) {
+        _this.cancel(true);
+      }
+    };
+    _this.dialogClickHandler_ = function (evt) {
+      return _this.handleDialogClick_(evt);
+    };
+    _this.documentKeydownHandler_ = function (evt) {
+      if (evt.key && evt.key === 'Escape' || evt.keyCode === 27) {
+        _this.cancel(true);
+      }
+    };
+    _this.transitionEndHandler_ = function (evt) {
+      return _this.handleTransitionEnd_(evt);
+    };
+    return _this;
+  }
+
+  _createClass(MDCDialogFoundation, [{
+    key: 'destroy',
+    value: function destroy() {
+      // Ensure that dialog is cleaned up when destroyed
+      if (this.isOpen_) {
+        this.adapter_.deregisterSurfaceInteractionHandler('click', this.dialogClickHandler_);
+        this.adapter_.deregisterDocumentKeydownHandler(this.documentKeydownHandler_);
+        this.adapter_.deregisterInteractionHandler('click', this.componentClickHandler_);
+        this.adapter_.untrapFocusOnSurface();
+        this.adapter_.deregisterTransitionEndHandler(this.transitionEndHandler_);
+        this.adapter_.removeClass(MDCDialogFoundation.cssClasses.ANIMATING);
+        this.adapter_.removeClass(MDCDialogFoundation.cssClasses.OPEN);
+        this.enableScroll_();
+      }
+    }
+  }, {
+    key: 'open',
+    value: function open() {
+      this.isOpen_ = true;
+      this.disableScroll_();
+      this.adapter_.registerDocumentKeydownHandler(this.documentKeydownHandler_);
+      this.adapter_.registerSurfaceInteractionHandler('click', this.dialogClickHandler_);
+      this.adapter_.registerInteractionHandler('click', this.componentClickHandler_);
+      this.adapter_.registerTransitionEndHandler(this.transitionEndHandler_);
+      this.adapter_.addClass(MDCDialogFoundation.cssClasses.ANIMATING);
+      this.adapter_.addClass(MDCDialogFoundation.cssClasses.OPEN);
+    }
+  }, {
+    key: 'close',
+    value: function close() {
+      this.isOpen_ = false;
+      this.adapter_.deregisterSurfaceInteractionHandler('click', this.dialogClickHandler_);
+      this.adapter_.deregisterDocumentKeydownHandler(this.documentKeydownHandler_);
+      this.adapter_.deregisterInteractionHandler('click', this.componentClickHandler_);
+      this.adapter_.untrapFocusOnSurface();
+      this.adapter_.registerTransitionEndHandler(this.transitionEndHandler_);
+      this.adapter_.addClass(MDCDialogFoundation.cssClasses.ANIMATING);
+      this.adapter_.removeClass(MDCDialogFoundation.cssClasses.OPEN);
+    }
+  }, {
+    key: 'isOpen',
+    value: function isOpen() {
+      return this.isOpen_;
+    }
+  }, {
+    key: 'accept',
+    value: function accept(shouldNotify) {
+      if (shouldNotify) {
+        this.adapter_.notifyAccept();
+      }
+
+      this.close();
+    }
+  }, {
+    key: 'cancel',
+    value: function cancel(shouldNotify) {
+      if (shouldNotify) {
+        this.adapter_.notifyCancel();
+      }
+
+      this.close();
+    }
+  }, {
+    key: 'handleDialogClick_',
+    value: function handleDialogClick_(evt) {
+      var target = evt.target;
+
+      if (this.adapter_.eventTargetHasClass(target, __WEBPACK_IMPORTED_MODULE_1__constants__["a" /* cssClasses */].ACCEPT_BTN)) {
+        this.accept(true);
+      } else if (this.adapter_.eventTargetHasClass(target, __WEBPACK_IMPORTED_MODULE_1__constants__["a" /* cssClasses */].CANCEL_BTN)) {
+        this.cancel(true);
+      }
+    }
+  }, {
+    key: 'handleTransitionEnd_',
+    value: function handleTransitionEnd_(evt) {
+      if (this.adapter_.isDialog(evt.target)) {
+        this.adapter_.deregisterTransitionEndHandler(this.transitionEndHandler_);
+        this.adapter_.removeClass(MDCDialogFoundation.cssClasses.ANIMATING);
+        if (this.isOpen_) {
+          this.adapter_.trapFocusOnSurface();
+        } else {
+          this.enableScroll_();
+        };
+      };
+    }
+  }, {
+    key: 'disableScroll_',
+    value: function disableScroll_() {
+      this.adapter_.addBodyClass(__WEBPACK_IMPORTED_MODULE_1__constants__["a" /* cssClasses */].SCROLL_LOCK);
+    }
+  }, {
+    key: 'enableScroll_',
+    value: function enableScroll_() {
+      this.adapter_.removeBodyClass(__WEBPACK_IMPORTED_MODULE_1__constants__["a" /* cssClasses */].SCROLL_LOCK);
+    }
+  }]);
+
+  return MDCDialogFoundation;
+}(__WEBPACK_IMPORTED_MODULE_0__material_base__["MDCFoundation"]);
+
+/* harmony default export */ __webpack_exports__["a"] = (MDCDialogFoundation);
+
+/***/ }),
+/* 38 */
+/***/ (function(module, __webpack_exports__, __webpack_require__) {
+
+"use strict";
+Object.defineProperty(__webpack_exports__, "__esModule", { value: true });
+/* harmony export (immutable) */ __webpack_exports__["createFocusTrapInstance"] = createFocusTrapInstance;
+/* harmony import */ var __WEBPACK_IMPORTED_MODULE_0_focus_trap__ = __webpack_require__(80);
+/* harmony import */ var __WEBPACK_IMPORTED_MODULE_0_focus_trap___default = __webpack_require__.n(__WEBPACK_IMPORTED_MODULE_0_focus_trap__);
+/**
+ * Copyright 2016 Google Inc. All Rights Reserved.
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *      http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+
+
+
+function createFocusTrapInstance(surfaceEl, acceptButtonEl) {
+  var focusTrapFactory = arguments.length > 2 && arguments[2] !== undefined ? arguments[2] : __WEBPACK_IMPORTED_MODULE_0_focus_trap___default.a;
+
+  return focusTrapFactory(surfaceEl, {
+    initialFocus: acceptButtonEl,
+    clickOutsideDeactivates: true
+  });
+}
+
+/***/ }),
+/* 39 */
+/***/ (function(module, __webpack_exports__, __webpack_require__) {
+
+"use strict";
+/* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, "a", function() { return cssClasses; });
+/* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, "b", function() { return strings; });
+/* harmony import */ var __WEBPACK_IMPORTED_MODULE_0__slidable__ = __webpack_require__(6);
+/**
+ * Copyright 2016 Google Inc. All Rights Reserved.
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *      http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+
+
+
+var cssClasses = {
+  ROOT: 'mdc-persistent-drawer',
+  OPEN: 'mdc-persistent-drawer--open',
+  ANIMATING: 'mdc-persistent-drawer--animating'
+};
+
+var strings = {
+  DRAWER_SELECTOR: '.mdc-persistent-drawer__drawer',
+  FOCUSABLE_ELEMENTS: __WEBPACK_IMPORTED_MODULE_0__slidable__["b" /* FOCUSABLE_ELEMENTS */],
+  OPEN_EVENT: 'MDCPersistentDrawer:open',
+  CLOSE_EVENT: 'MDCPersistentDrawer:close'
+};
+
+/***/ }),
+/* 40 */
+/***/ (function(module, __webpack_exports__, __webpack_require__) {
+
+"use strict";
+/* harmony import */ var __WEBPACK_IMPORTED_MODULE_0__slidable__ = __webpack_require__(6);
+/* harmony import */ var __WEBPACK_IMPORTED_MODULE_1__constants__ = __webpack_require__(39);
+var _extends = Object.assign || function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; };
+
+var _createClass = function () { function defineProperties(target, props) { for (var i = 0; i < props.length; i++) { var descriptor = props[i]; descriptor.enumerable = descriptor.enumerable || false; descriptor.configurable = true; if ("value" in descriptor) descriptor.writable = true; Object.defineProperty(target, descriptor.key, descriptor); } } return function (Constructor, protoProps, staticProps) { if (protoProps) defineProperties(Constructor.prototype, protoProps); if (staticProps) defineProperties(Constructor, staticProps); return Constructor; }; }();
+
+function _classCallCheck(instance, Constructor) { if (!(instance instanceof Constructor)) { throw new TypeError("Cannot call a class as a function"); } }
+
+function _possibleConstructorReturn(self, call) { if (!self) { throw new ReferenceError("this hasn't been initialised - super() hasn't been called"); } return call && (typeof call === "object" || typeof call === "function") ? call : self; }
+
+function _inherits(subClass, superClass) { if (typeof superClass !== "function" && superClass !== null) { throw new TypeError("Super expression must either be null or a function, not " + typeof superClass); } subClass.prototype = Object.create(superClass && superClass.prototype, { constructor: { value: subClass, enumerable: false, writable: true, configurable: true } }); if (superClass) Object.setPrototypeOf ? Object.setPrototypeOf(subClass, superClass) : subClass.__proto__ = superClass; }
+
+/**
+ * Copyright 2016 Google Inc. All Rights Reserved.
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *      http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+
+
+
+
+var MDCPersistentDrawerFoundation = function (_MDCSlidableDrawerFou) {
+  _inherits(MDCPersistentDrawerFoundation, _MDCSlidableDrawerFou);
+
+  _createClass(MDCPersistentDrawerFoundation, null, [{
+    key: 'cssClasses',
+    get: function get() {
+      return __WEBPACK_IMPORTED_MODULE_1__constants__["a" /* cssClasses */];
+    }
+  }, {
+    key: 'strings',
+    get: function get() {
+      return __WEBPACK_IMPORTED_MODULE_1__constants__["b" /* strings */];
+    }
+  }, {
+    key: 'defaultAdapter',
+    get: function get() {
+      return _extends(__WEBPACK_IMPORTED_MODULE_0__slidable__["a" /* MDCSlidableDrawerFoundation */].defaultAdapter, {
+        isDrawer: function isDrawer() {
+          return false;
+        }
+      });
+    }
+  }]);
+
+  function MDCPersistentDrawerFoundation(adapter) {
+    _classCallCheck(this, MDCPersistentDrawerFoundation);
+
+    return _possibleConstructorReturn(this, (MDCPersistentDrawerFoundation.__proto__ || Object.getPrototypeOf(MDCPersistentDrawerFoundation)).call(this, _extends(MDCPersistentDrawerFoundation.defaultAdapter, adapter), MDCPersistentDrawerFoundation.cssClasses.ROOT, MDCPersistentDrawerFoundation.cssClasses.ANIMATING, MDCPersistentDrawerFoundation.cssClasses.OPEN));
+  }
+
+  _createClass(MDCPersistentDrawerFoundation, [{
+    key: 'isRootTransitioningEventTarget_',
+    value: function isRootTransitioningEventTarget_(el) {
+      return this.adapter_.isDrawer(el);
+    }
+  }]);
+
+  return MDCPersistentDrawerFoundation;
+}(__WEBPACK_IMPORTED_MODULE_0__slidable__["a" /* MDCSlidableDrawerFoundation */]);
+
+/* harmony default export */ __webpack_exports__["a"] = (MDCPersistentDrawerFoundation);
+
+/***/ }),
+/* 41 */
+/***/ (function(module, __webpack_exports__, __webpack_require__) {
+
+"use strict";
+/* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, "a", function() { return MDCPersistentDrawer; });
+/* harmony import */ var __WEBPACK_IMPORTED_MODULE_0__material_base__ = __webpack_require__(0);
+/* harmony import */ var __WEBPACK_IMPORTED_MODULE_1__foundation__ = __webpack_require__(40);
+/* harmony import */ var __WEBPACK_IMPORTED_MODULE_2__util__ = __webpack_require__(8);
+/* harmony reexport (binding) */ __webpack_require__.d(__webpack_exports__, "b", function() { return __WEBPACK_IMPORTED_MODULE_1__foundation__["a"]; });
+/* unused harmony reexport util */
+var _createClass = function () { function defineProperties(target, props) { for (var i = 0; i < props.length; i++) { var descriptor = props[i]; descriptor.enumerable = descriptor.enumerable || false; descriptor.configurable = true; if ("value" in descriptor) descriptor.writable = true; Object.defineProperty(target, descriptor.key, descriptor); } } return function (Constructor, protoProps, staticProps) { if (protoProps) defineProperties(Constructor.prototype, protoProps); if (staticProps) defineProperties(Constructor, staticProps); return Constructor; }; }();
+
+function _classCallCheck(instance, Constructor) { if (!(instance instanceof Constructor)) { throw new TypeError("Cannot call a class as a function"); } }
+
+function _possibleConstructorReturn(self, call) { if (!self) { throw new ReferenceError("this hasn't been initialised - super() hasn't been called"); } return call && (typeof call === "object" || typeof call === "function") ? call : self; }
+
+function _inherits(subClass, superClass) { if (typeof superClass !== "function" && superClass !== null) { throw new TypeError("Super expression must either be null or a function, not " + typeof superClass); } subClass.prototype = Object.create(superClass && superClass.prototype, { constructor: { value: subClass, enumerable: false, writable: true, configurable: true } }); if (superClass) Object.setPrototypeOf ? Object.setPrototypeOf(subClass, superClass) : subClass.__proto__ = superClass; }
+
+/**
+ * Copyright 2016 Google Inc. All Rights Reserved.
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *      http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+
+
+
+
+
+
+
+
+var MDCPersistentDrawer = function (_MDCComponent) {
+  _inherits(MDCPersistentDrawer, _MDCComponent);
+
+  function MDCPersistentDrawer() {
+    _classCallCheck(this, MDCPersistentDrawer);
+
+    return _possibleConstructorReturn(this, (MDCPersistentDrawer.__proto__ || Object.getPrototypeOf(MDCPersistentDrawer)).apply(this, arguments));
+  }
+
+  _createClass(MDCPersistentDrawer, [{
+    key: 'getDefaultFoundation',
+    value: function getDefaultFoundation() {
+      var _this2 = this;
+
+      var FOCUSABLE_ELEMENTS = __WEBPACK_IMPORTED_MODULE_1__foundation__["a" /* default */].strings.FOCUSABLE_ELEMENTS;
+
+
+      return new __WEBPACK_IMPORTED_MODULE_1__foundation__["a" /* default */]({
+        addClass: function addClass(className) {
+          return _this2.root_.classList.add(className);
+        },
+        removeClass: function removeClass(className) {
+          return _this2.root_.classList.remove(className);
+        },
+        hasClass: function hasClass(className) {
+          return _this2.root_.classList.contains(className);
+        },
+        hasNecessaryDom: function hasNecessaryDom() {
+          return Boolean(_this2.drawer);
+        },
+        registerInteractionHandler: function registerInteractionHandler(evt, handler) {
+          return _this2.root_.addEventListener(__WEBPACK_IMPORTED_MODULE_2__util__["remapEvent"](evt), handler, __WEBPACK_IMPORTED_MODULE_2__util__["applyPassive"]());
+        },
+        deregisterInteractionHandler: function deregisterInteractionHandler(evt, handler) {
+          return _this2.root_.removeEventListener(__WEBPACK_IMPORTED_MODULE_2__util__["remapEvent"](evt), handler, __WEBPACK_IMPORTED_MODULE_2__util__["applyPassive"]());
+        },
+        registerDrawerInteractionHandler: function registerDrawerInteractionHandler(evt, handler) {
+          return _this2.drawer.addEventListener(__WEBPACK_IMPORTED_MODULE_2__util__["remapEvent"](evt), handler);
+        },
+        deregisterDrawerInteractionHandler: function deregisterDrawerInteractionHandler(evt, handler) {
+          return _this2.drawer.removeEventListener(__WEBPACK_IMPORTED_MODULE_2__util__["remapEvent"](evt), handler);
+        },
+        registerTransitionEndHandler: function registerTransitionEndHandler(handler) {
+          return _this2.root_.addEventListener('transitionend', handler);
+        },
+        deregisterTransitionEndHandler: function deregisterTransitionEndHandler(handler) {
+          return _this2.root_.removeEventListener('transitionend', handler);
+        },
+        registerDocumentKeydownHandler: function registerDocumentKeydownHandler(handler) {
+          return document.addEventListener('keydown', handler);
+        },
+        deregisterDocumentKeydownHandler: function deregisterDocumentKeydownHandler(handler) {
+          return document.removeEventListener('keydown', handler);
+        },
+        getDrawerWidth: function getDrawerWidth() {
+          return _this2.drawer.offsetWidth;
+        },
+        setTranslateX: function setTranslateX(value) {
+          return _this2.drawer.style.setProperty(__WEBPACK_IMPORTED_MODULE_2__util__["getTransformPropertyName"](), value === null ? null : 'translateX(' + value + 'px)');
+        },
+        getFocusableElements: function getFocusableElements() {
+          return _this2.drawer.querySelectorAll(FOCUSABLE_ELEMENTS);
+        },
+        saveElementTabState: function saveElementTabState(el) {
+          return __WEBPACK_IMPORTED_MODULE_2__util__["saveElementTabState"](el);
+        },
+        restoreElementTabState: function restoreElementTabState(el) {
+          return __WEBPACK_IMPORTED_MODULE_2__util__["restoreElementTabState"](el);
+        },
+        makeElementUntabbable: function makeElementUntabbable(el) {
+          return el.setAttribute('tabindex', -1);
+        },
+        notifyOpen: function notifyOpen() {
+          return _this2.emit(__WEBPACK_IMPORTED_MODULE_1__foundation__["a" /* default */].strings.OPEN_EVENT);
+        },
+        notifyClose: function notifyClose() {
+          return _this2.emit(__WEBPACK_IMPORTED_MODULE_1__foundation__["a" /* default */].strings.CLOSE_EVENT);
+        },
+        isRtl: function isRtl() {
+          return getComputedStyle(_this2.root_).getPropertyValue('direction') === 'rtl';
+        },
+        isDrawer: function isDrawer(el) {
+          return el === _this2.drawer;
+        }
+      });
+    }
+  }, {
+    key: 'open',
+    get: function get() {
+      return this.foundation_.isOpen();
+    },
+    set: function set(value) {
+      if (value) {
+        this.foundation_.open();
+      } else {
+        this.foundation_.close();
+      }
+    }
+
+    // Return the drawer element inside the component.
+
+  }, {
+    key: 'drawer',
+    get: function get() {
+      return this.root_.querySelector(__WEBPACK_IMPORTED_MODULE_1__foundation__["a" /* default */].strings.DRAWER_SELECTOR);
+    }
+  }], [{
+    key: 'attachTo',
+    value: function attachTo(root) {
+      return new MDCPersistentDrawer(root);
+    }
+  }]);
+
+  return MDCPersistentDrawer;
+}(__WEBPACK_IMPORTED_MODULE_0__material_base__["MDCComponent"]);
+
+/***/ }),
+/* 42 */
+/***/ (function(module, __webpack_exports__, __webpack_require__) {
+
+"use strict";
+/* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, "a", function() { return FOCUSABLE_ELEMENTS; });
+/**
+ * Copyright 2016 Google Inc. All Rights Reserved.
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *      http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+
+var FOCUSABLE_ELEMENTS = 'a[href], area[href], input:not([disabled]), select:not([disabled]), textarea:not([disabled]), ' + 'button:not([disabled]), iframe, object, embed, [tabindex], [contenteditable]';
+
+/***/ }),
+/* 43 */
+/***/ (function(module, __webpack_exports__, __webpack_require__) {
+
+"use strict";
+/* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, "a", function() { return MDCSlidableDrawerFoundation; });
+/* harmony import */ var __WEBPACK_IMPORTED_MODULE_0__material_base__ = __webpack_require__(0);
+var _extends = Object.assign || function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; };
+
+var _createClass = function () { function defineProperties(target, props) { for (var i = 0; i < props.length; i++) { var descriptor = props[i]; descriptor.enumerable = descriptor.enumerable || false; descriptor.configurable = true; if ("value" in descriptor) descriptor.writable = true; Object.defineProperty(target, descriptor.key, descriptor); } } return function (Constructor, protoProps, staticProps) { if (protoProps) defineProperties(Constructor.prototype, protoProps); if (staticProps) defineProperties(Constructor, staticProps); return Constructor; }; }();
+
+function _classCallCheck(instance, Constructor) { if (!(instance instanceof Constructor)) { throw new TypeError("Cannot call a class as a function"); } }
+
+function _possibleConstructorReturn(self, call) { if (!self) { throw new ReferenceError("this hasn't been initialised - super() hasn't been called"); } return call && (typeof call === "object" || typeof call === "function") ? call : self; }
+
+function _inherits(subClass, superClass) { if (typeof superClass !== "function" && superClass !== null) { throw new TypeError("Super expression must either be null or a function, not " + typeof superClass); } subClass.prototype = Object.create(superClass && superClass.prototype, { constructor: { value: subClass, enumerable: false, writable: true, configurable: true } }); if (superClass) Object.setPrototypeOf ? Object.setPrototypeOf(subClass, superClass) : subClass.__proto__ = superClass; }
+
+/**
+ * Copyright 2016 Google Inc. All Rights Reserved.
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *      http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+
+
+
+var MDCSlidableDrawerFoundation = function (_MDCFoundation) {
+  _inherits(MDCSlidableDrawerFoundation, _MDCFoundation);
+
+  _createClass(MDCSlidableDrawerFoundation, null, [{
+    key: 'defaultAdapter',
+    get: function get() {
+      return {
+        addClass: function addClass() /* className: string */{},
+        removeClass: function removeClass() /* className: string */{},
+        hasClass: function hasClass() /* className: string */{},
+        hasNecessaryDom: function hasNecessaryDom() {
+          return (/* boolean */false
+          );
+        },
+        registerInteractionHandler: function registerInteractionHandler() /* evt: string, handler: EventListener */{},
+        deregisterInteractionHandler: function deregisterInteractionHandler() /* evt: string, handler: EventListener */{},
+        registerDrawerInteractionHandler: function registerDrawerInteractionHandler() /* evt: string, handler: EventListener */{},
+        deregisterDrawerInteractionHandler: function deregisterDrawerInteractionHandler() /* evt: string, handler: EventListener */{},
+        registerTransitionEndHandler: function registerTransitionEndHandler() /* handler: EventListener */{},
+        deregisterTransitionEndHandler: function deregisterTransitionEndHandler() /* handler: EventListener */{},
+        registerDocumentKeydownHandler: function registerDocumentKeydownHandler() /* handler: EventListener */{},
+        deregisterDocumentKeydownHandler: function deregisterDocumentKeydownHandler() /* handler: EventListener */{},
+        setTranslateX: function setTranslateX() /* value: number | null */{},
+        getFocusableElements: function getFocusableElements() /* NodeList */{},
+        saveElementTabState: function saveElementTabState() /* el: Element */{},
+        restoreElementTabState: function restoreElementTabState() /* el: Element */{},
+        makeElementUntabbable: function makeElementUntabbable() /* el: Element */{},
+        notifyOpen: function notifyOpen() {},
+        notifyClose: function notifyClose() {},
+        isRtl: function isRtl() {
+          return (/* boolean */false
+          );
+        },
+        getDrawerWidth: function getDrawerWidth() {
+          return (/* number */0
+          );
+        }
+      };
+    }
+  }]);
+
+  function MDCSlidableDrawerFoundation(adapter, rootCssClass, animatingCssClass, openCssClass) {
+    _classCallCheck(this, MDCSlidableDrawerFoundation);
+
+    var _this = _possibleConstructorReturn(this, (MDCSlidableDrawerFoundation.__proto__ || Object.getPrototypeOf(MDCSlidableDrawerFoundation)).call(this, _extends(MDCSlidableDrawerFoundation.defaultAdapter, adapter)));
+
+    _this.rootCssClass_ = rootCssClass;
+    _this.animatingCssClass_ = animatingCssClass;
+    _this.openCssClass_ = openCssClass;
+
+    _this.transitionEndHandler_ = function (evt) {
+      return _this.handleTransitionEnd_(evt);
+    };
+
+    _this.inert_ = false;
+
+    _this.drawerClickHandler_ = function (evt) {
+      return evt.stopPropagation();
+    };
+    _this.componentTouchStartHandler_ = function (evt) {
+      return _this.handleTouchStart_(evt);
+    };
+    _this.componentTouchMoveHandler_ = function (evt) {
+      return _this.handleTouchMove_(evt);
+    };
+    _this.componentTouchEndHandler_ = function (evt) {
+      return _this.handleTouchEnd_(evt);
+    };
+    _this.documentKeydownHandler_ = function (evt) {
+      if (evt.key && evt.key === 'Escape' || evt.keyCode === 27) {
+        _this.close();
+      }
+    };
+    return _this;
+  }
+
+  _createClass(MDCSlidableDrawerFoundation, [{
+    key: 'init',
+    value: function init() {
+      var ROOT = this.rootCssClass_;
+      var OPEN = this.openCssClass_;
+
+      if (!this.adapter_.hasClass(ROOT)) {
+        throw new Error(ROOT + ' class required in root element.');
+      }
+
+      if (!this.adapter_.hasNecessaryDom()) {
+        throw new Error('Required DOM nodes missing in ' + ROOT + ' component.');
+      }
+
+      if (this.adapter_.hasClass(OPEN)) {
+        this.isOpen_ = true;
+      } else {
+        this.detabinate_();
+        this.isOpen_ = false;
+      }
+
+      this.adapter_.registerDrawerInteractionHandler('click', this.drawerClickHandler_);
+      this.adapter_.registerDrawerInteractionHandler('touchstart', this.componentTouchStartHandler_);
+      this.adapter_.registerInteractionHandler('touchmove', this.componentTouchMoveHandler_);
+      this.adapter_.registerInteractionHandler('touchend', this.componentTouchEndHandler_);
+    }
+  }, {
+    key: 'destroy',
+    value: function destroy() {
+      this.adapter_.deregisterDrawerInteractionHandler('click', this.drawerClickHandler_);
+      this.adapter_.deregisterDrawerInteractionHandler('touchstart', this.componentTouchStartHandler_);
+      this.adapter_.deregisterInteractionHandler('touchmove', this.componentTouchMoveHandler_);
+      this.adapter_.deregisterInteractionHandler('touchend', this.componentTouchEndHandler_);
+      // Deregister the document keydown handler just in case the component is destroyed while the menu is open.
+      this.adapter_.deregisterDocumentKeydownHandler(this.documentKeydownHandler_);
+    }
+  }, {
+    key: 'open',
+    value: function open() {
+      this.adapter_.registerTransitionEndHandler(this.transitionEndHandler_);
+      this.adapter_.registerDocumentKeydownHandler(this.documentKeydownHandler_);
+      this.adapter_.addClass(this.animatingCssClass_);
+      this.adapter_.addClass(this.openCssClass_);
+      this.retabinate_();
+      // Debounce multiple calls
+      if (!this.isOpen_) {
+        this.adapter_.notifyOpen();
+      }
+      this.isOpen_ = true;
+    }
+  }, {
+    key: 'close',
+    value: function close() {
+      this.adapter_.deregisterDocumentKeydownHandler(this.documentKeydownHandler_);
+      this.adapter_.registerTransitionEndHandler(this.transitionEndHandler_);
+      this.adapter_.addClass(this.animatingCssClass_);
+      this.adapter_.removeClass(this.openCssClass_);
+      this.detabinate_();
+      // Debounce multiple calls
+      if (this.isOpen_) {
+        this.adapter_.notifyClose();
+      }
+      this.isOpen_ = false;
+    }
+  }, {
+    key: 'isOpen',
+    value: function isOpen() {
+      return this.isOpen_;
+    }
+
+    /**
+     *  Render all children of the drawer inert when it's closed.
+     */
+
+  }, {
+    key: 'detabinate_',
+    value: function detabinate_() {
+      if (this.inert_) {
+        return;
+      }
+
+      var elements = this.adapter_.getFocusableElements();
+      if (elements) {
+        for (var i = 0; i < elements.length; i++) {
+          this.adapter_.saveElementTabState(elements[i]);
+          this.adapter_.makeElementUntabbable(elements[i]);
+        }
+      }
+
+      this.inert_ = true;
+    }
+
+    /**
+     *  Make all children of the drawer tabbable again when it's open.
+     */
+
+  }, {
+    key: 'retabinate_',
+    value: function retabinate_() {
+      if (!this.inert_) {
+        return;
+      }
+
+      var elements = this.adapter_.getFocusableElements();
+      if (elements) {
+        for (var i = 0; i < elements.length; i++) {
+          this.adapter_.restoreElementTabState(elements[i]);
+        }
+      }
+
+      this.inert_ = false;
+    }
+  }, {
+    key: 'handleTouchStart_',
+    value: function handleTouchStart_(evt) {
+      if (!this.adapter_.hasClass(this.openCssClass_)) {
+        return;
+      }
+      if (evt.pointerType && evt.pointerType !== 'touch') {
+        return;
+      }
+
+      this.direction_ = this.adapter_.isRtl() ? -1 : 1;
+      this.drawerWidth_ = this.adapter_.getDrawerWidth();
+      this.startX_ = evt.touches ? evt.touches[0].pageX : evt.pageX;
+      this.currentX_ = this.startX_;
+
+      this.updateRaf_ = requestAnimationFrame(this.updateDrawer_.bind(this));
+    }
+  }, {
+    key: 'handleTouchMove_',
+    value: function handleTouchMove_(evt) {
+      if (evt.pointerType && evt.pointerType !== 'touch') {
+        return;
+      }
+
+      this.currentX_ = evt.touches ? evt.touches[0].pageX : evt.pageX;
+    }
+  }, {
+    key: 'handleTouchEnd_',
+    value: function handleTouchEnd_(evt) {
+      if (evt.pointerType && evt.pointerType !== 'touch') {
+        return;
+      }
+
+      this.prepareForTouchEnd_();
+
+      // Did the user close the drawer by more than 50%?
+      if (Math.abs(this.newPosition_ / this.drawerWidth_) >= 0.5) {
+        this.close();
+      } else {
+        // Triggering an open here means we'll get a nice animation back to the fully open state.
+        this.open();
+      }
+    }
+  }, {
+    key: 'prepareForTouchEnd_',
+    value: function prepareForTouchEnd_() {
+      cancelAnimationFrame(this.updateRaf_);
+      this.adapter_.setTranslateX(null);
+    }
+  }, {
+    key: 'updateDrawer_',
+    value: function updateDrawer_() {
+      this.updateRaf_ = requestAnimationFrame(this.updateDrawer_.bind(this));
+      this.adapter_.setTranslateX(this.newPosition_);
+    }
+  }, {
+    key: 'isRootTransitioningEventTarget_',
+    value: function isRootTransitioningEventTarget_() {
+      // Classes extending MDCSlidableDrawerFoundation should implement this method to return true or false
+      // if the event target is the root event target currently transitioning.
+      return false;
+    }
+  }, {
+    key: 'handleTransitionEnd_',
+    value: function handleTransitionEnd_(evt) {
+      if (this.isRootTransitioningEventTarget_(evt.target)) {
+        this.adapter_.removeClass(this.animatingCssClass_);
+        this.adapter_.deregisterTransitionEndHandler(this.transitionEndHandler_);
+      }
+    }
+  }, {
+    key: 'newPosition_',
+    get: function get() {
+      var newPos = null;
+
+      if (this.direction_ === 1) {
+        newPos = Math.min(0, this.currentX_ - this.startX_);
+      } else {
+        newPos = Math.max(0, this.currentX_ - this.startX_);
+      }
+
+      return newPos;
+    }
+  }]);
+
+  return MDCSlidableDrawerFoundation;
+}(__WEBPACK_IMPORTED_MODULE_0__material_base__["MDCFoundation"]);
+
+/***/ }),
+/* 44 */
+/***/ (function(module, __webpack_exports__, __webpack_require__) {
+
+"use strict";
+/* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, "a", function() { return cssClasses; });
+/* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, "b", function() { return strings; });
+/* harmony import */ var __WEBPACK_IMPORTED_MODULE_0__slidable__ = __webpack_require__(6);
+/**
+ * Copyright 2016 Google Inc. All Rights Reserved.
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *      http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+
+
+
+var cssClasses = {
+  ROOT: 'mdc-temporary-drawer',
+  OPEN: 'mdc-temporary-drawer--open',
+  ANIMATING: 'mdc-temporary-drawer--animating',
+  SCROLL_LOCK: 'mdc-drawer-scroll-lock'
+};
+
+var strings = {
+  DRAWER_SELECTOR: '.mdc-temporary-drawer__drawer',
+  OPACITY_VAR_NAME: '--mdc-temporary-drawer-opacity',
+  FOCUSABLE_ELEMENTS: __WEBPACK_IMPORTED_MODULE_0__slidable__["b" /* FOCUSABLE_ELEMENTS */],
+  OPEN_EVENT: 'MDCTemporaryDrawer:open',
+  CLOSE_EVENT: 'MDCTemporaryDrawer:close'
+};
+
+/***/ }),
+/* 45 */
+/***/ (function(module, __webpack_exports__, __webpack_require__) {
+
+"use strict";
+/* harmony import */ var __WEBPACK_IMPORTED_MODULE_0__slidable__ = __webpack_require__(6);
+/* harmony import */ var __WEBPACK_IMPORTED_MODULE_1__constants__ = __webpack_require__(44);
+var _extends = Object.assign || function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; };
+
+var _get = function get(object, property, receiver) { if (object === null) object = Function.prototype; var desc = Object.getOwnPropertyDescriptor(object, property); if (desc === undefined) { var parent = Object.getPrototypeOf(object); if (parent === null) { return undefined; } else { return get(parent, property, receiver); } } else if ("value" in desc) { return desc.value; } else { var getter = desc.get; if (getter === undefined) { return undefined; } return getter.call(receiver); } };
+
+var _createClass = function () { function defineProperties(target, props) { for (var i = 0; i < props.length; i++) { var descriptor = props[i]; descriptor.enumerable = descriptor.enumerable || false; descriptor.configurable = true; if ("value" in descriptor) descriptor.writable = true; Object.defineProperty(target, descriptor.key, descriptor); } } return function (Constructor, protoProps, staticProps) { if (protoProps) defineProperties(Constructor.prototype, protoProps); if (staticProps) defineProperties(Constructor, staticProps); return Constructor; }; }();
+
+function _classCallCheck(instance, Constructor) { if (!(instance instanceof Constructor)) { throw new TypeError("Cannot call a class as a function"); } }
+
+function _possibleConstructorReturn(self, call) { if (!self) { throw new ReferenceError("this hasn't been initialised - super() hasn't been called"); } return call && (typeof call === "object" || typeof call === "function") ? call : self; }
+
+function _inherits(subClass, superClass) { if (typeof superClass !== "function" && superClass !== null) { throw new TypeError("Super expression must either be null or a function, not " + typeof superClass); } subClass.prototype = Object.create(superClass && superClass.prototype, { constructor: { value: subClass, enumerable: false, writable: true, configurable: true } }); if (superClass) Object.setPrototypeOf ? Object.setPrototypeOf(subClass, superClass) : subClass.__proto__ = superClass; }
+
+/**
+ * Copyright 2016 Google Inc. All Rights Reserved.
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *      http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+
+
+
+
+var MDCTemporaryDrawerFoundation = function (_MDCSlidableDrawerFou) {
+  _inherits(MDCTemporaryDrawerFoundation, _MDCSlidableDrawerFou);
+
+  _createClass(MDCTemporaryDrawerFoundation, null, [{
+    key: 'cssClasses',
+    get: function get() {
+      return __WEBPACK_IMPORTED_MODULE_1__constants__["a" /* cssClasses */];
+    }
+  }, {
+    key: 'strings',
+    get: function get() {
+      return __WEBPACK_IMPORTED_MODULE_1__constants__["b" /* strings */];
+    }
+  }, {
+    key: 'defaultAdapter',
+    get: function get() {
+      return _extends(__WEBPACK_IMPORTED_MODULE_0__slidable__["a" /* MDCSlidableDrawerFoundation */].defaultAdapter, {
+        addBodyClass: function addBodyClass() /* className: string */{},
+        removeBodyClass: function removeBodyClass() /* className: string */{},
+        isDrawer: function isDrawer() {
+          return false;
+        },
+        updateCssVariable: function updateCssVariable() /* value: string */{}
+      });
+    }
+  }]);
+
+  function MDCTemporaryDrawerFoundation(adapter) {
+    _classCallCheck(this, MDCTemporaryDrawerFoundation);
+
+    var _this = _possibleConstructorReturn(this, (MDCTemporaryDrawerFoundation.__proto__ || Object.getPrototypeOf(MDCTemporaryDrawerFoundation)).call(this, _extends(MDCTemporaryDrawerFoundation.defaultAdapter, adapter), MDCTemporaryDrawerFoundation.cssClasses.ROOT, MDCTemporaryDrawerFoundation.cssClasses.ANIMATING, MDCTemporaryDrawerFoundation.cssClasses.OPEN));
+
+    _this.componentClickHandler_ = function () {
+      return _this.close();
+    };
+    return _this;
+  }
+
+  _createClass(MDCTemporaryDrawerFoundation, [{
+    key: 'init',
+    value: function init() {
+      _get(MDCTemporaryDrawerFoundation.prototype.__proto__ || Object.getPrototypeOf(MDCTemporaryDrawerFoundation.prototype), 'init', this).call(this);
+
+      // Make browser aware of custom property being used in this element.
+      // Workaround for certain types of hard-to-reproduce heisenbugs.
+      this.adapter_.updateCssVariable(0);
+      this.adapter_.registerInteractionHandler('click', this.componentClickHandler_);
+    }
+  }, {
+    key: 'destroy',
+    value: function destroy() {
+      _get(MDCTemporaryDrawerFoundation.prototype.__proto__ || Object.getPrototypeOf(MDCTemporaryDrawerFoundation.prototype), 'destroy', this).call(this);
+
+      this.adapter_.deregisterInteractionHandler('click', this.componentClickHandler_);
+      this.enableScroll_();
+    }
+  }, {
+    key: 'open',
+    value: function open() {
+      this.disableScroll_();
+      // Make sure custom property values are cleared before starting.
+      this.adapter_.updateCssVariable('');
+
+      _get(MDCTemporaryDrawerFoundation.prototype.__proto__ || Object.getPrototypeOf(MDCTemporaryDrawerFoundation.prototype), 'open', this).call(this);
+    }
+  }, {
+    key: 'close',
+    value: function close() {
+      // Make sure custom property values are cleared before making any changes.
+      this.adapter_.updateCssVariable('');
+
+      _get(MDCTemporaryDrawerFoundation.prototype.__proto__ || Object.getPrototypeOf(MDCTemporaryDrawerFoundation.prototype), 'close', this).call(this);
+    }
+  }, {
+    key: 'prepareForTouchEnd_',
+    value: function prepareForTouchEnd_() {
+      _get(MDCTemporaryDrawerFoundation.prototype.__proto__ || Object.getPrototypeOf(MDCTemporaryDrawerFoundation.prototype), 'prepareForTouchEnd_', this).call(this);
+
+      this.adapter_.updateCssVariable('');
+    }
+  }, {
+    key: 'updateDrawer_',
+    value: function updateDrawer_() {
+      _get(MDCTemporaryDrawerFoundation.prototype.__proto__ || Object.getPrototypeOf(MDCTemporaryDrawerFoundation.prototype), 'updateDrawer_', this).call(this);
+
+      var newOpacity = Math.max(0, 1 + this.direction_ * (this.newPosition_ / this.drawerWidth_));
+      this.adapter_.updateCssVariable(newOpacity);
+    }
+  }, {
+    key: 'isRootTransitioningEventTarget_',
+    value: function isRootTransitioningEventTarget_(el) {
+      return this.adapter_.isDrawer(el);
+    }
+  }, {
+    key: 'handleTransitionEnd_',
+    value: function handleTransitionEnd_(evt) {
+      _get(MDCTemporaryDrawerFoundation.prototype.__proto__ || Object.getPrototypeOf(MDCTemporaryDrawerFoundation.prototype), 'handleTransitionEnd_', this).call(this, evt);
+      if (!this.isOpen_) {
+        this.enableScroll_();
+      }
+    }
+  }, {
+    key: 'disableScroll_',
+    value: function disableScroll_() {
+      this.adapter_.addBodyClass(__WEBPACK_IMPORTED_MODULE_1__constants__["a" /* cssClasses */].SCROLL_LOCK);
+    }
+  }, {
+    key: 'enableScroll_',
+    value: function enableScroll_() {
+      this.adapter_.removeBodyClass(__WEBPACK_IMPORTED_MODULE_1__constants__["a" /* cssClasses */].SCROLL_LOCK);
+    }
+  }]);
+
+  return MDCTemporaryDrawerFoundation;
+}(__WEBPACK_IMPORTED_MODULE_0__slidable__["a" /* MDCSlidableDrawerFoundation */]);
+
+/* harmony default export */ __webpack_exports__["a"] = (MDCTemporaryDrawerFoundation);
+
+/***/ }),
+/* 46 */
+/***/ (function(module, __webpack_exports__, __webpack_require__) {
+
+"use strict";
+/* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, "a", function() { return MDCTemporaryDrawer; });
+/* harmony import */ var __WEBPACK_IMPORTED_MODULE_0__material_base__ = __webpack_require__(0);
+/* harmony import */ var __WEBPACK_IMPORTED_MODULE_1__foundation__ = __webpack_require__(45);
+/* harmony import */ var __WEBPACK_IMPORTED_MODULE_2__util__ = __webpack_require__(8);
+/* harmony reexport (binding) */ __webpack_require__.d(__webpack_exports__, "b", function() { return __WEBPACK_IMPORTED_MODULE_1__foundation__["a"]; });
+/* unused harmony reexport util */
+var _createClass = function () { function defineProperties(target, props) { for (var i = 0; i < props.length; i++) { var descriptor = props[i]; descriptor.enumerable = descriptor.enumerable || false; descriptor.configurable = true; if ("value" in descriptor) descriptor.writable = true; Object.defineProperty(target, descriptor.key, descriptor); } } return function (Constructor, protoProps, staticProps) { if (protoProps) defineProperties(Constructor.prototype, protoProps); if (staticProps) defineProperties(Constructor, staticProps); return Constructor; }; }();
+
+function _classCallCheck(instance, Constructor) { if (!(instance instanceof Constructor)) { throw new TypeError("Cannot call a class as a function"); } }
+
+function _possibleConstructorReturn(self, call) { if (!self) { throw new ReferenceError("this hasn't been initialised - super() hasn't been called"); } return call && (typeof call === "object" || typeof call === "function") ? call : self; }
+
+function _inherits(subClass, superClass) { if (typeof superClass !== "function" && superClass !== null) { throw new TypeError("Super expression must either be null or a function, not " + typeof superClass); } subClass.prototype = Object.create(superClass && superClass.prototype, { constructor: { value: subClass, enumerable: false, writable: true, configurable: true } }); if (superClass) Object.setPrototypeOf ? Object.setPrototypeOf(subClass, superClass) : subClass.__proto__ = superClass; }
+
+/**
+ * Copyright 2016 Google Inc. All Rights Reserved.
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *      http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+
+
+
+
+
+
+
+
+var MDCTemporaryDrawer = function (_MDCComponent) {
+  _inherits(MDCTemporaryDrawer, _MDCComponent);
+
+  function MDCTemporaryDrawer() {
+    _classCallCheck(this, MDCTemporaryDrawer);
+
+    return _possibleConstructorReturn(this, (MDCTemporaryDrawer.__proto__ || Object.getPrototypeOf(MDCTemporaryDrawer)).apply(this, arguments));
+  }
+
+  _createClass(MDCTemporaryDrawer, [{
+    key: 'getDefaultFoundation',
+    value: function getDefaultFoundation() {
+      var _this2 = this;
+
+      var _MDCTemporaryDrawerFo = __WEBPACK_IMPORTED_MODULE_1__foundation__["a" /* default */].strings,
+          FOCUSABLE_ELEMENTS = _MDCTemporaryDrawerFo.FOCUSABLE_ELEMENTS,
+          OPACITY_VAR_NAME = _MDCTemporaryDrawerFo.OPACITY_VAR_NAME;
+
+
+      return new __WEBPACK_IMPORTED_MODULE_1__foundation__["a" /* default */]({
+        addClass: function addClass(className) {
+          return _this2.root_.classList.add(className);
+        },
+        removeClass: function removeClass(className) {
+          return _this2.root_.classList.remove(className);
+        },
+        hasClass: function hasClass(className) {
+          return _this2.root_.classList.contains(className);
+        },
+        addBodyClass: function addBodyClass(className) {
+          return document.body.classList.add(className);
+        },
+        removeBodyClass: function removeBodyClass(className) {
+          return document.body.classList.remove(className);
+        },
+        hasNecessaryDom: function hasNecessaryDom() {
+          return Boolean(_this2.drawer);
+        },
+        registerInteractionHandler: function registerInteractionHandler(evt, handler) {
+          return _this2.root_.addEventListener(__WEBPACK_IMPORTED_MODULE_2__util__["remapEvent"](evt), handler, __WEBPACK_IMPORTED_MODULE_2__util__["applyPassive"]());
+        },
+        deregisterInteractionHandler: function deregisterInteractionHandler(evt, handler) {
+          return _this2.root_.removeEventListener(__WEBPACK_IMPORTED_MODULE_2__util__["remapEvent"](evt), handler, __WEBPACK_IMPORTED_MODULE_2__util__["applyPassive"]());
+        },
+        registerDrawerInteractionHandler: function registerDrawerInteractionHandler(evt, handler) {
+          return _this2.drawer.addEventListener(__WEBPACK_IMPORTED_MODULE_2__util__["remapEvent"](evt), handler);
+        },
+        deregisterDrawerInteractionHandler: function deregisterDrawerInteractionHandler(evt, handler) {
+          return _this2.drawer.removeEventListener(__WEBPACK_IMPORTED_MODULE_2__util__["remapEvent"](evt), handler);
+        },
+        registerTransitionEndHandler: function registerTransitionEndHandler(handler) {
+          return _this2.drawer.addEventListener('transitionend', handler);
+        },
+        deregisterTransitionEndHandler: function deregisterTransitionEndHandler(handler) {
+          return _this2.drawer.removeEventListener('transitionend', handler);
+        },
+        registerDocumentKeydownHandler: function registerDocumentKeydownHandler(handler) {
+          return document.addEventListener('keydown', handler);
+        },
+        deregisterDocumentKeydownHandler: function deregisterDocumentKeydownHandler(handler) {
+          return document.removeEventListener('keydown', handler);
+        },
+        getDrawerWidth: function getDrawerWidth() {
+          return _this2.drawer.offsetWidth;
+        },
+        setTranslateX: function setTranslateX(value) {
+          return _this2.drawer.style.setProperty(__WEBPACK_IMPORTED_MODULE_2__util__["getTransformPropertyName"](), value === null ? null : 'translateX(' + value + 'px)');
+        },
+        updateCssVariable: function updateCssVariable(value) {
+          if (__WEBPACK_IMPORTED_MODULE_2__util__["supportsCssCustomProperties"]()) {
+            _this2.root_.style.setProperty(OPACITY_VAR_NAME, value);
+          }
+        },
+        getFocusableElements: function getFocusableElements() {
+          return _this2.drawer.querySelectorAll(FOCUSABLE_ELEMENTS);
+        },
+        saveElementTabState: function saveElementTabState(el) {
+          return __WEBPACK_IMPORTED_MODULE_2__util__["saveElementTabState"](el);
+        },
+        restoreElementTabState: function restoreElementTabState(el) {
+          return __WEBPACK_IMPORTED_MODULE_2__util__["restoreElementTabState"](el);
+        },
+        makeElementUntabbable: function makeElementUntabbable(el) {
+          return el.setAttribute('tabindex', -1);
+        },
+        notifyOpen: function notifyOpen() {
+          return _this2.emit(__WEBPACK_IMPORTED_MODULE_1__foundation__["a" /* default */].strings.OPEN_EVENT);
+        },
+        notifyClose: function notifyClose() {
+          return _this2.emit(__WEBPACK_IMPORTED_MODULE_1__foundation__["a" /* default */].strings.CLOSE_EVENT);
+        },
+        isRtl: function isRtl() {
+          return getComputedStyle(_this2.root_).getPropertyValue('direction') === 'rtl';
+        },
+        isDrawer: function isDrawer(el) {
+          return el === _this2.drawer;
+        }
+      });
+    }
+  }, {
+    key: 'open',
+    get: function get() {
+      return this.foundation_.isOpen();
+    },
+    set: function set(value) {
+      if (value) {
+        this.foundation_.open();
+      } else {
+        this.foundation_.close();
+      }
+    }
+
+    /* Return the drawer element inside the component. */
+
+  }, {
+    key: 'drawer',
+    get: function get() {
+      return this.root_.querySelector(__WEBPACK_IMPORTED_MODULE_1__foundation__["a" /* default */].strings.DRAWER_SELECTOR);
+    }
+  }], [{
+    key: 'attachTo',
+    value: function attachTo(root) {
+      return new MDCTemporaryDrawer(root);
+    }
+  }]);
+
+  return MDCTemporaryDrawer;
+}(__WEBPACK_IMPORTED_MODULE_0__material_base__["MDCComponent"]);
+
+/***/ }),
+/* 47 */
+/***/ (function(module, __webpack_exports__, __webpack_require__) {
+
+"use strict";
+/* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, "a", function() { return cssClasses; });
+/* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, "b", function() { return strings; });
+/**
+ * Copyright 2017 Google Inc. All Rights Reserved.
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *      http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+
+var cssClasses = {
+  ROOT: 'mdc-form-field'
+};
+
+var strings = {
+  LABEL_SELECTOR: '.mdc-form-field > label'
+};
+
+/***/ }),
+/* 48 */
+/***/ (function(module, __webpack_exports__, __webpack_require__) {
+
+"use strict";
+/* harmony import */ var __WEBPACK_IMPORTED_MODULE_0__material_base__ = __webpack_require__(0);
+/* harmony import */ var __WEBPACK_IMPORTED_MODULE_1__constants__ = __webpack_require__(47);
+var _extends = Object.assign || function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; };
+
+var _createClass = function () { function defineProperties(target, props) { for (var i = 0; i < props.length; i++) { var descriptor = props[i]; descriptor.enumerable = descriptor.enumerable || false; descriptor.configurable = true; if ("value" in descriptor) descriptor.writable = true; Object.defineProperty(target, descriptor.key, descriptor); } } return function (Constructor, protoProps, staticProps) { if (protoProps) defineProperties(Constructor.prototype, protoProps); if (staticProps) defineProperties(Constructor, staticProps); return Constructor; }; }();
+
+function _classCallCheck(instance, Constructor) { if (!(instance instanceof Constructor)) { throw new TypeError("Cannot call a class as a function"); } }
+
+function _possibleConstructorReturn(self, call) { if (!self) { throw new ReferenceError("this hasn't been initialised - super() hasn't been called"); } return call && (typeof call === "object" || typeof call === "function") ? call : self; }
+
+function _inherits(subClass, superClass) { if (typeof superClass !== "function" && superClass !== null) { throw new TypeError("Super expression must either be null or a function, not " + typeof superClass); } subClass.prototype = Object.create(superClass && superClass.prototype, { constructor: { value: subClass, enumerable: false, writable: true, configurable: true } }); if (superClass) Object.setPrototypeOf ? Object.setPrototypeOf(subClass, superClass) : subClass.__proto__ = superClass; }
+
+/**
+ * Copyright 2017 Google Inc. All Rights Reserved.
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *      http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+
+
+
+
+var MDCFormFieldFoundation = function (_MDCFoundation) {
+  _inherits(MDCFormFieldFoundation, _MDCFoundation);
+
+  _createClass(MDCFormFieldFoundation, null, [{
+    key: 'cssClasses',
+    get: function get() {
+      return __WEBPACK_IMPORTED_MODULE_1__constants__["a" /* cssClasses */];
+    }
+  }, {
+    key: 'strings',
+    get: function get() {
+      return __WEBPACK_IMPORTED_MODULE_1__constants__["b" /* strings */];
+    }
+  }, {
+    key: 'defaultAdapter',
+    get: function get() {
+      return {
+        registerInteractionHandler: function registerInteractionHandler() /* type: string, handler: EventListener */{},
+        deregisterInteractionHandler: function deregisterInteractionHandler() /* type: string, handler: EventListener */{},
+        activateInputRipple: function activateInputRipple() {},
+        deactivateInputRipple: function deactivateInputRipple() {}
+      };
+    }
+  }]);
+
+  function MDCFormFieldFoundation(adapter) {
+    _classCallCheck(this, MDCFormFieldFoundation);
+
+    var _this = _possibleConstructorReturn(this, (MDCFormFieldFoundation.__proto__ || Object.getPrototypeOf(MDCFormFieldFoundation)).call(this, _extends(MDCFormFieldFoundation.defaultAdapter, adapter)));
+
+    _this.clickHandler_ = function (evt) {
+      return _this.handleClick_(evt);
+    };
+    return _this;
+  }
+
+  _createClass(MDCFormFieldFoundation, [{
+    key: 'init',
+    value: function init() {
+      this.adapter_.registerInteractionHandler('click', this.clickHandler_);
+    }
+  }, {
+    key: 'destroy',
+    value: function destroy() {
+      this.adapter_.deregisterInteractionHandler('click', this.clickHandler_);
+    }
+  }, {
+    key: 'handleClick_',
+    value: function handleClick_() {
+      var _this2 = this;
+
+      this.adapter_.activateInputRipple();
+      requestAnimationFrame(function () {
+        return _this2.adapter_.deactivateInputRipple();
+      });
+    }
+  }]);
+
+  return MDCFormFieldFoundation;
+}(__WEBPACK_IMPORTED_MODULE_0__material_base__["MDCFoundation"]);
+
+/* harmony default export */ __webpack_exports__["a"] = (MDCFormFieldFoundation);
+
+/***/ }),
+/* 49 */
+/***/ (function(module, __webpack_exports__, __webpack_require__) {
+
+"use strict";
+/* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, "a", function() { return strings; });
+/**
+ * Copyright 2016 Google Inc. All Rights Reserved.
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *      http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+var strings = {
+  TILES_SELECTOR: '.mdc-grid-list__tiles',
+  TILE_SELECTOR: '.mdc-grid-tile'
+};
+
+/***/ }),
+/* 50 */
+/***/ (function(module, __webpack_exports__, __webpack_require__) {
+
+"use strict";
+/* harmony import */ var __WEBPACK_IMPORTED_MODULE_0__material_base__ = __webpack_require__(0);
+/* harmony import */ var __WEBPACK_IMPORTED_MODULE_1__constants__ = __webpack_require__(49);
+var _extends = Object.assign || function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; };
+
+var _createClass = function () { function defineProperties(target, props) { for (var i = 0; i < props.length; i++) { var descriptor = props[i]; descriptor.enumerable = descriptor.enumerable || false; descriptor.configurable = true; if ("value" in descriptor) descriptor.writable = true; Object.defineProperty(target, descriptor.key, descriptor); } } return function (Constructor, protoProps, staticProps) { if (protoProps) defineProperties(Constructor.prototype, protoProps); if (staticProps) defineProperties(Constructor, staticProps); return Constructor; }; }();
+
+function _classCallCheck(instance, Constructor) { if (!(instance instanceof Constructor)) { throw new TypeError("Cannot call a class as a function"); } }
+
+function _possibleConstructorReturn(self, call) { if (!self) { throw new ReferenceError("this hasn't been initialised - super() hasn't been called"); } return call && (typeof call === "object" || typeof call === "function") ? call : self; }
+
+function _inherits(subClass, superClass) { if (typeof superClass !== "function" && superClass !== null) { throw new TypeError("Super expression must either be null or a function, not " + typeof superClass); } subClass.prototype = Object.create(superClass && superClass.prototype, { constructor: { value: subClass, enumerable: false, writable: true, configurable: true } }); if (superClass) Object.setPrototypeOf ? Object.setPrototypeOf(subClass, superClass) : subClass.__proto__ = superClass; }
+
+/**
+ * Copyright 2016 Google Inc. All Rights Reserved.
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *      http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+
+
+
+
+var MDCGridListFoundation = function (_MDCFoundation) {
+  _inherits(MDCGridListFoundation, _MDCFoundation);
+
+  _createClass(MDCGridListFoundation, null, [{
+    key: 'strings',
+    get: function get() {
+      return __WEBPACK_IMPORTED_MODULE_1__constants__["a" /* strings */];
+    }
+  }, {
+    key: 'defaultAdapter',
+    get: function get() {
+      return {
+        getOffsetWidth: function getOffsetWidth() {
+          return (/* number */0
+          );
+        },
+        getNumberOfTiles: function getNumberOfTiles() {
+          return (/* number */0
+          );
+        },
+        getOffsetWidthForTileAtIndex: function getOffsetWidthForTileAtIndex() {
+          return (/* index: number */ /* number */0
+          );
+        },
+        setStyleForTilesElement: function setStyleForTilesElement() /* property: string, value: string */{},
+        registerResizeHandler: function registerResizeHandler() /* handler: EventListener */{},
+        deregisterResizeHandler: function deregisterResizeHandler() /* handler: EventListener */{}
+      };
+    }
+  }]);
+
+  function MDCGridListFoundation(adapter) {
+    _classCallCheck(this, MDCGridListFoundation);
+
+    var _this = _possibleConstructorReturn(this, (MDCGridListFoundation.__proto__ || Object.getPrototypeOf(MDCGridListFoundation)).call(this, _extends(MDCGridListFoundation.defaultAdapter, adapter)));
+
+    _this.resizeHandler_ = function () {
+      return _this.alignCenter();
+    };
+    _this.resizeFrame_ = 0;
+    return _this;
+  }
+
+  _createClass(MDCGridListFoundation, [{
+    key: 'init',
+    value: function init() {
+      this.alignCenter();
+      this.adapter_.registerResizeHandler(this.resizeHandler_);
+    }
+  }, {
+    key: 'destroy',
+    value: function destroy() {
+      this.adapter_.deregisterResizeHandler(this.resizeHandler_);
+    }
+  }, {
+    key: 'alignCenter',
+    value: function alignCenter() {
+      var _this2 = this;
+
+      if (this.resizeFrame_ !== 0) {
+        cancelAnimationFrame(this.resizeFrame_);
+      }
+      this.resizeFrame_ = requestAnimationFrame(function () {
+        _this2.alignCenter_();
+        _this2.resizeFrame_ = 0;
+      });
+    }
+  }, {
+    key: 'alignCenter_',
+    value: function alignCenter_() {
+      if (this.adapter_.getNumberOfTiles() == 0) {
+        return;
+      }
+      var gridWidth = this.adapter_.getOffsetWidth();
+      var itemWidth = this.adapter_.getOffsetWidthForTileAtIndex(0);
+      var tilesWidth = itemWidth * Math.floor(gridWidth / itemWidth);
+      this.adapter_.setStyleForTilesElement('width', tilesWidth + 'px');
+    }
+  }]);
+
+  return MDCGridListFoundation;
+}(__WEBPACK_IMPORTED_MODULE_0__material_base__["MDCFoundation"]);
+
+/* harmony default export */ __webpack_exports__["a"] = (MDCGridListFoundation);
+
+/***/ }),
+/* 51 */
+/***/ (function(module, __webpack_exports__, __webpack_require__) {
+
+"use strict";
+/* unused harmony export IconToggleEvent */
+var _createClass = function () { function defineProperties(target, props) { for (var i = 0; i < props.length; i++) { var descriptor = props[i]; descriptor.enumerable = descriptor.enumerable || false; descriptor.configurable = true; if ("value" in descriptor) descriptor.writable = true; Object.defineProperty(target, descriptor.key, descriptor); } } return function (Constructor, protoProps, staticProps) { if (protoProps) defineProperties(Constructor.prototype, protoProps); if (staticProps) defineProperties(Constructor, staticProps); return Constructor; }; }();
+
+function _classCallCheck(instance, Constructor) { if (!(instance instanceof Constructor)) { throw new TypeError("Cannot call a class as a function"); } }
+
+/**
+ * Copyright 2017 Google Inc. All Rights Reserved.
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *      http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+
+/* eslint no-unused-vars: [2, {"args": "none"}] */
+
+/**
+ * Adapter for MDC Icon Toggle. Provides an interface for managing
+ * - classes
+ * - dom
+ * - inner text
+ * - event handlers
+ * - event dispatch
+ *
+ * Additionally, provides type information for the adapter to the Closure
+ * compiler.
+ *
+ * Implement this adapter for your framework of choice to delegate updates to
+ * the component in your framework of choice. See architecture documentation
+ * for more details.
+ * https://github.com/material-components/material-components-web/blob/master/docs/architecture.md
+ *
+ * @record
+ */
+var MDCIconToggleAdapter = function () {
+  function MDCIconToggleAdapter() {
+    _classCallCheck(this, MDCIconToggleAdapter);
+  }
+
+  _createClass(MDCIconToggleAdapter, [{
+    key: "addClass",
+
+    /** @param {string} className */
+    value: function addClass(className) {}
+
+    /** @param {string} className */
+
+  }, {
+    key: "removeClass",
+    value: function removeClass(className) {}
+
+    /**
+     * @param {string} type
+     * @param {!EventListener} handler
+     */
+
+  }, {
+    key: "registerInteractionHandler",
+    value: function registerInteractionHandler(type, handler) {}
+
+    /**
+     * @param {string} type
+     * @param {!EventListener} handler
+     */
+
+  }, {
+    key: "deregisterInteractionHandler",
+    value: function deregisterInteractionHandler(type, handler) {}
+
+    /** @param {string} text */
+
+  }, {
+    key: "setText",
+    value: function setText(text) {}
+
+    /** @return {number} */
+
+  }, {
+    key: "getTabIndex",
+    value: function getTabIndex() {}
+
+    /** @param {number} tabIndex */
+
+  }, {
+    key: "setTabIndex",
+    value: function setTabIndex(tabIndex) {}
+
+    /**
+     * @param {string} name
+     * @return {string}
+     */
+
+  }, {
+    key: "getAttr",
+    value: function getAttr(name) {}
+
+    /**
+     * @param {string} name
+     * @param {string} value
+     */
+
+  }, {
+    key: "setAttr",
+    value: function setAttr(name, value) {}
+
+    /** @param {string} name */
+
+  }, {
+    key: "rmAttr",
+    value: function rmAttr(name) {}
+
+    /** @param {!IconToggleEvent} evtData */
+
+  }, {
+    key: "notifyChange",
+    value: function notifyChange(evtData) {}
+  }]);
+
+  return MDCIconToggleAdapter;
+}();
+
+/**
+ * @typedef {!{
+ *   isOn: boolean,
+ * }}
+ */
+
+
+/* unused harmony default export */ var _unused_webpack_default_export = (MDCIconToggleAdapter);
+var IconToggleEvent = void 0;
+
+/***/ }),
+/* 52 */
+/***/ (function(module, __webpack_exports__, __webpack_require__) {
+
+"use strict";
+/* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, "a", function() { return cssClasses; });
+/* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, "b", function() { return strings; });
+/**
+ * Copyright 2016 Google Inc. All Rights Reserved.
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *      http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+
+/** @enum {string} */
+var cssClasses = {
+  ROOT: 'mdc-icon-toggle',
+  DISABLED: 'mdc-icon-toggle--disabled'
+};
+
+/** @enum {string} */
+var strings = {
+  DATA_TOGGLE_ON: 'data-toggle-on',
+  DATA_TOGGLE_OFF: 'data-toggle-off',
+  ARIA_PRESSED: 'aria-pressed',
+  ARIA_DISABLED: 'aria-disabled',
+  ARIA_LABEL: 'aria-label',
+  CHANGE_EVENT: 'MDCIconToggle:change'
+};
+
+/***/ }),
+/* 53 */
+/***/ (function(module, __webpack_exports__, __webpack_require__) {
+
+"use strict";
+/* unused harmony export KeyboardKey */
+/* harmony import */ var __WEBPACK_IMPORTED_MODULE_0__material_base_foundation__ = __webpack_require__(1);
+/* harmony import */ var __WEBPACK_IMPORTED_MODULE_1__adapter__ = __webpack_require__(51);
+/* harmony import */ var __WEBPACK_IMPORTED_MODULE_2__constants__ = __webpack_require__(52);
+var _extends = Object.assign || function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; };
+
+var _createClass = function () { function defineProperties(target, props) { for (var i = 0; i < props.length; i++) { var descriptor = props[i]; descriptor.enumerable = descriptor.enumerable || false; descriptor.configurable = true; if ("value" in descriptor) descriptor.writable = true; Object.defineProperty(target, descriptor.key, descriptor); } } return function (Constructor, protoProps, staticProps) { if (protoProps) defineProperties(Constructor.prototype, protoProps); if (staticProps) defineProperties(Constructor, staticProps); return Constructor; }; }();
+
+function _classCallCheck(instance, Constructor) { if (!(instance instanceof Constructor)) { throw new TypeError("Cannot call a class as a function"); } }
+
+function _possibleConstructorReturn(self, call) { if (!self) { throw new ReferenceError("this hasn't been initialised - super() hasn't been called"); } return call && (typeof call === "object" || typeof call === "function") ? call : self; }
+
+function _inherits(subClass, superClass) { if (typeof superClass !== "function" && superClass !== null) { throw new TypeError("Super expression must either be null or a function, not " + typeof superClass); } subClass.prototype = Object.create(superClass && superClass.prototype, { constructor: { value: subClass, enumerable: false, writable: true, configurable: true } }); if (superClass) Object.setPrototypeOf ? Object.setPrototypeOf(subClass, superClass) : subClass.__proto__ = superClass; }
+
+/**
+ * Copyright 2016 Google Inc. All Rights Reserved.
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *      http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+
+
+/* eslint-disable no-unused-vars */
+
+
+
+/**
+ * @extends {MDCFoundation<!MDCIconToggleAdapter>}
+ */
+
+var MDCIconToggleFoundation = function (_MDCFoundation) {
+  _inherits(MDCIconToggleFoundation, _MDCFoundation);
+
+  _createClass(MDCIconToggleFoundation, null, [{
+    key: 'cssClasses',
+    get: function get() {
+      return __WEBPACK_IMPORTED_MODULE_2__constants__["a" /* cssClasses */];
+    }
+  }, {
+    key: 'strings',
+    get: function get() {
+      return __WEBPACK_IMPORTED_MODULE_2__constants__["b" /* strings */];
+    }
+  }, {
+    key: 'defaultAdapter',
+    get: function get() {
+      return {
+        addClass: function addClass() /* className: string */{},
+        removeClass: function removeClass() /* className: string */{},
+        registerInteractionHandler: function registerInteractionHandler() /* type: string, handler: EventListener */{},
+        deregisterInteractionHandler: function deregisterInteractionHandler() /* type: string, handler: EventListener */{},
+        setText: function setText() /* text: string */{},
+        getTabIndex: function getTabIndex() {
+          return (/* number */0
+          );
+        },
+        setTabIndex: function setTabIndex() /* tabIndex: number */{},
+        getAttr: function getAttr() {
+          return (/* name: string */ /* string */''
+          );
+        },
+        setAttr: function setAttr() /* name: string, value: string */{},
+        rmAttr: function rmAttr() /* name: string */{},
+        notifyChange: function notifyChange() /* evtData: IconToggleEvent */{}
+      };
+    }
+  }]);
+
+  function MDCIconToggleFoundation(adapter) {
+    _classCallCheck(this, MDCIconToggleFoundation);
+
+    /** @private {boolean} */
+    var _this = _possibleConstructorReturn(this, (MDCIconToggleFoundation.__proto__ || Object.getPrototypeOf(MDCIconToggleFoundation)).call(this, _extends(MDCIconToggleFoundation.defaultAdapter, adapter)));
+
+    _this.on_ = false;
+
+    /** @private {boolean} */
+    _this.disabled_ = false;
+
+    /** @private {number} */
+    _this.savedTabIndex_ = -1;
+
+    /** @private {?IconToggleState} */
+    _this.toggleOnData_ = null;
+
+    /** @private {?IconToggleState} */
+    _this.toggleOffData_ = null;
+
+    _this.clickHandler_ = /** @private {!EventListener} */function () {
+      return _this.toggleFromEvt_();
+    };
+
+    /** @private {boolean} */
+    _this.isHandlingKeydown_ = false;
+
+    _this.keydownHandler_ = /** @private {!EventListener} */function ( /** @type {!KeyboardKey} */evt) {
+      if (isSpace(evt)) {
+        _this.isHandlingKeydown_ = true;
+        return evt.preventDefault();
+      }
+    };
+
+    _this.keyupHandler_ = /** @private {!EventListener} */function ( /** @type {!KeyboardKey} */evt) {
+      if (isSpace(evt)) {
+        _this.isHandlingKeydown_ = false;
+        _this.toggleFromEvt_();
+      }
+    };
+    return _this;
+  }
+
+  _createClass(MDCIconToggleFoundation, [{
+    key: 'init',
+    value: function init() {
+      this.refreshToggleData();
+      this.adapter_.registerInteractionHandler('click', this.clickHandler_);
+      this.adapter_.registerInteractionHandler('keydown', this.keydownHandler_);
+      this.adapter_.registerInteractionHandler('keyup', this.keyupHandler_);
+    }
+  }, {
+    key: 'refreshToggleData',
+    value: function refreshToggleData() {
+      var _MDCIconToggleFoundat = MDCIconToggleFoundation.strings,
+          DATA_TOGGLE_ON = _MDCIconToggleFoundat.DATA_TOGGLE_ON,
+          DATA_TOGGLE_OFF = _MDCIconToggleFoundat.DATA_TOGGLE_OFF;
+
+      this.toggleOnData_ = this.parseJsonDataAttr_(DATA_TOGGLE_ON);
+      this.toggleOffData_ = this.parseJsonDataAttr_(DATA_TOGGLE_OFF);
+    }
+  }, {
+    key: 'destroy',
+    value: function destroy() {
+      this.adapter_.deregisterInteractionHandler('click', this.clickHandler_);
+      this.adapter_.deregisterInteractionHandler('keydown', this.keydownHandler_);
+      this.adapter_.deregisterInteractionHandler('keyup', this.keyupHandler_);
+    }
+
+    /** @private */
+
+  }, {
+    key: 'toggleFromEvt_',
+    value: function toggleFromEvt_() {
+      this.toggle();
+      var isOn = this.on_;
+
+      this.adapter_.notifyChange( /** @type {!IconToggleEvent} */{ isOn: isOn });
+    }
+
+    /** @return {boolean} */
+
+  }, {
+    key: 'isOn',
+    value: function isOn() {
+      return this.on_;
+    }
+
+    /** @param {boolean=} isOn */
+
+  }, {
+    key: 'toggle',
+    value: function toggle() {
+      var isOn = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : !this.on_;
+
+      this.on_ = isOn;
+
+      var _MDCIconToggleFoundat2 = MDCIconToggleFoundation.strings,
+          ARIA_LABEL = _MDCIconToggleFoundat2.ARIA_LABEL,
+          ARIA_PRESSED = _MDCIconToggleFoundat2.ARIA_PRESSED;
+
+
+      if (this.on_) {
+        this.adapter_.setAttr(ARIA_PRESSED, 'true');
+      } else {
+        this.adapter_.setAttr(ARIA_PRESSED, 'false');
+      }
+
+      var _ref = this.on_ ? this.toggleOffData_ : this.toggleOnData_,
+          classToRemove = _ref.cssClass;
+
+      if (classToRemove) {
+        this.adapter_.removeClass(classToRemove);
+      }
+
+      var _ref2 = this.on_ ? this.toggleOnData_ : this.toggleOffData_,
+          content = _ref2.content,
+          label = _ref2.label,
+          cssClass = _ref2.cssClass;
+
+      if (cssClass) {
+        this.adapter_.addClass(cssClass);
+      }
+      if (content) {
+        this.adapter_.setText(content);
+      }
+      if (label) {
+        this.adapter_.setAttr(ARIA_LABEL, label);
+      }
+    }
+
+    /**
+     * @param {string} dataAttr
+     * @return {!IconToggleState}
+     */
+
+  }, {
+    key: 'parseJsonDataAttr_',
+    value: function parseJsonDataAttr_(dataAttr) {
+      var val = this.adapter_.getAttr(dataAttr);
+      if (!val) {
+        return {};
+      }
+      return (/** @type {!IconToggleState} */JSON.parse(val)
+      );
+    }
+
+    /** @return {boolean} */
+
+  }, {
+    key: 'isDisabled',
+    value: function isDisabled() {
+      return this.disabled_;
+    }
+
+    /** @param {boolean} isDisabled */
+
+  }, {
+    key: 'setDisabled',
+    value: function setDisabled(isDisabled) {
+      this.disabled_ = isDisabled;
+
+      var DISABLED = MDCIconToggleFoundation.cssClasses.DISABLED;
+      var ARIA_DISABLED = MDCIconToggleFoundation.strings.ARIA_DISABLED;
+
+
+      if (this.disabled_) {
+        this.savedTabIndex_ = this.adapter_.getTabIndex();
+        this.adapter_.setTabIndex(-1);
+        this.adapter_.setAttr(ARIA_DISABLED, 'true');
+        this.adapter_.addClass(DISABLED);
+      } else {
+        this.adapter_.setTabIndex(this.savedTabIndex_);
+        this.adapter_.rmAttr(ARIA_DISABLED);
+        this.adapter_.removeClass(DISABLED);
+      }
+    }
+
+    /** @return {boolean} */
+
+  }, {
+    key: 'isKeyboardActivated',
+    value: function isKeyboardActivated() {
+      return this.isHandlingKeydown_;
+    }
+  }]);
+
+  return MDCIconToggleFoundation;
+}(__WEBPACK_IMPORTED_MODULE_0__material_base_foundation__["a" /* default */]);
+
+/**
+ * @typedef {!{
+ *   key: string,
+ *   keyCode: number
+ * }}
+ */
+
+
+/* harmony default export */ __webpack_exports__["a"] = (MDCIconToggleFoundation);
+var KeyboardKey = void 0;
+
+/**
+ * @param {!KeyboardKey} keyboardKey
+ * @return {boolean}
+ */
+function isSpace(keyboardKey) {
+  return keyboardKey.key === 'Space' || keyboardKey.keyCode === 32;
+}
+
+/** @record */
+
+var IconToggleState = function IconToggleState() {
+  _classCallCheck(this, IconToggleState);
+};
+
+/**
+ * The aria-label value of the icon toggle, or undefined if there is no aria-label.
+ * @export {string|undefined}
+ */
+
+
+IconToggleState.prototype.label;
+
+/**
+ * The text for the icon toggle, or undefined if there is no text.
+ * @export {string|undefined}
+ */
+IconToggleState.prototype.content;
+
+/**
+ * The CSS class to add to the icon toggle, or undefined if there is no CSS class.
+ * @export {string|undefined}
+ */
+IconToggleState.prototype.cssClass;
+
+/***/ }),
+/* 54 */
+/***/ (function(module, __webpack_exports__, __webpack_require__) {
+
+"use strict";
+/* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, "a", function() { return cssClasses; });
+/* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, "b", function() { return strings; });
+/**
+ * Copyright 2017 Google Inc. All Rights Reserved.
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *      http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+
+var cssClasses = {
+  CLOSED_CLASS: 'mdc-linear-progress--closed',
+  INDETERMINATE_CLASS: 'mdc-linear-progress--indeterminate',
+  REVERSED_CLASS: 'mdc-linear-progress--reversed'
+};
+
+var strings = {
+  PRIMARY_BAR_SELECTOR: '.mdc-linear-progress__primary-bar',
+  BUFFER_SELECTOR: '.mdc-linear-progress__buffer'
+};
+
+/***/ }),
+/* 55 */
+/***/ (function(module, __webpack_exports__, __webpack_require__) {
+
+"use strict";
+/* harmony import */ var __WEBPACK_IMPORTED_MODULE_0__material_base__ = __webpack_require__(0);
+/* harmony import */ var __WEBPACK_IMPORTED_MODULE_1__material_animation__ = __webpack_require__(5);
+/* harmony import */ var __WEBPACK_IMPORTED_MODULE_2__constants__ = __webpack_require__(54);
+var _extends = Object.assign || function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; };
+
+var _createClass = function () { function defineProperties(target, props) { for (var i = 0; i < props.length; i++) { var descriptor = props[i]; descriptor.enumerable = descriptor.enumerable || false; descriptor.configurable = true; if ("value" in descriptor) descriptor.writable = true; Object.defineProperty(target, descriptor.key, descriptor); } } return function (Constructor, protoProps, staticProps) { if (protoProps) defineProperties(Constructor.prototype, protoProps); if (staticProps) defineProperties(Constructor, staticProps); return Constructor; }; }();
+
+function _classCallCheck(instance, Constructor) { if (!(instance instanceof Constructor)) { throw new TypeError("Cannot call a class as a function"); } }
+
+function _possibleConstructorReturn(self, call) { if (!self) { throw new ReferenceError("this hasn't been initialised - super() hasn't been called"); } return call && (typeof call === "object" || typeof call === "function") ? call : self; }
+
+function _inherits(subClass, superClass) { if (typeof superClass !== "function" && superClass !== null) { throw new TypeError("Super expression must either be null or a function, not " + typeof superClass); } subClass.prototype = Object.create(superClass && superClass.prototype, { constructor: { value: subClass, enumerable: false, writable: true, configurable: true } }); if (superClass) Object.setPrototypeOf ? Object.setPrototypeOf(subClass, superClass) : subClass.__proto__ = superClass; }
+
+/**
+ * Copyright 2017 Google Inc. All Rights Reserved.
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *      http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+
+
+
+
+
+
+var MDCLinearProgressFoundation = function (_MDCFoundation) {
+  _inherits(MDCLinearProgressFoundation, _MDCFoundation);
+
+  _createClass(MDCLinearProgressFoundation, null, [{
+    key: 'cssClasses',
+    get: function get() {
+      return __WEBPACK_IMPORTED_MODULE_2__constants__["a" /* cssClasses */];
+    }
+  }, {
+    key: 'strings',
+    get: function get() {
+      return __WEBPACK_IMPORTED_MODULE_2__constants__["b" /* strings */];
+    }
+  }, {
+    key: 'defaultAdapter',
+    get: function get() {
+      return {
+        addClass: function addClass() /* className: string */{},
+        getPrimaryBar: function getPrimaryBar() /* el: Element */{},
+        getBuffer: function getBuffer() /* el: Element */{},
+        hasClass: function hasClass() {
+          return (/* className: string */false
+          );
+        },
+        removeClass: function removeClass() /* className: string */{},
+        setStyle: function setStyle() /* el: Element, styleProperty: string, value: number */{}
+      };
+    }
+  }]);
+
+  function MDCLinearProgressFoundation(adapter) {
+    _classCallCheck(this, MDCLinearProgressFoundation);
+
+    return _possibleConstructorReturn(this, (MDCLinearProgressFoundation.__proto__ || Object.getPrototypeOf(MDCLinearProgressFoundation)).call(this, _extends(MDCLinearProgressFoundation.defaultAdapter, adapter)));
+  }
+
+  _createClass(MDCLinearProgressFoundation, [{
+    key: 'init',
+    value: function init() {
+      this.determinate_ = !this.adapter_.hasClass(__WEBPACK_IMPORTED_MODULE_2__constants__["a" /* cssClasses */].INDETERMINATE_CLASS);
+      this.reverse_ = this.adapter_.hasClass(__WEBPACK_IMPORTED_MODULE_2__constants__["a" /* cssClasses */].REVERSED_CLASS);
+    }
+  }, {
+    key: 'setDeterminate',
+    value: function setDeterminate(isDeterminate) {
+      this.determinate_ = isDeterminate;
+      if (this.determinate_) {
+        this.adapter_.removeClass(__WEBPACK_IMPORTED_MODULE_2__constants__["a" /* cssClasses */].INDETERMINATE_CLASS);
+      } else {
+        this.adapter_.addClass(__WEBPACK_IMPORTED_MODULE_2__constants__["a" /* cssClasses */].INDETERMINATE_CLASS);
+        this.setScale_(this.adapter_.getPrimaryBar(), 1);
+        this.setScale_(this.adapter_.getBuffer(), 1);
+      }
+    }
+  }, {
+    key: 'setProgress',
+    value: function setProgress(value) {
+      if (this.determinate_) {
+        this.setScale_(this.adapter_.getPrimaryBar(), value);
+      }
+    }
+  }, {
+    key: 'setBuffer',
+    value: function setBuffer(value) {
+      if (this.determinate_) {
+        this.setScale_(this.adapter_.getBuffer(), value);
+      }
+    }
+  }, {
+    key: 'setReverse',
+    value: function setReverse(isReversed) {
+      this.reverse_ = isReversed;
+      if (this.reverse_) {
+        this.adapter_.addClass(__WEBPACK_IMPORTED_MODULE_2__constants__["a" /* cssClasses */].REVERSED_CLASS);
+      } else {
+        this.adapter_.removeClass(__WEBPACK_IMPORTED_MODULE_2__constants__["a" /* cssClasses */].REVERSED_CLASS);
+      }
+    }
+  }, {
+    key: 'open',
+    value: function open() {
+      this.adapter_.removeClass(__WEBPACK_IMPORTED_MODULE_2__constants__["a" /* cssClasses */].CLOSED_CLASS);
+    }
+  }, {
+    key: 'close',
+    value: function close() {
+      this.adapter_.addClass(__WEBPACK_IMPORTED_MODULE_2__constants__["a" /* cssClasses */].CLOSED_CLASS);
+    }
+  }, {
+    key: 'setScale_',
+    value: function setScale_(el, scaleValue) {
+      var _this2 = this;
+
+      var value = 'scaleX(' + scaleValue + ')';
+      __WEBPACK_IMPORTED_MODULE_1__material_animation__["c" /* transformStyleProperties */].forEach(function (transformStyleProperty) {
+        _this2.adapter_.setStyle(el, transformStyleProperty, value);
+      });
+    }
+  }]);
+
+  return MDCLinearProgressFoundation;
+}(__WEBPACK_IMPORTED_MODULE_0__material_base__["MDCFoundation"]);
+
+/* harmony default export */ __webpack_exports__["a"] = (MDCLinearProgressFoundation);
+
+/***/ }),
+/* 56 */
+/***/ (function(module, __webpack_exports__, __webpack_require__) {
+
+"use strict";
+var _createClass = function () { function defineProperties(target, props) { for (var i = 0; i < props.length; i++) { var descriptor = props[i]; descriptor.enumerable = descriptor.enumerable || false; descriptor.configurable = true; if ("value" in descriptor) descriptor.writable = true; Object.defineProperty(target, descriptor.key, descriptor); } } return function (Constructor, protoProps, staticProps) { if (protoProps) defineProperties(Constructor.prototype, protoProps); if (staticProps) defineProperties(Constructor, staticProps); return Constructor; }; }();
+
+function _classCallCheck(instance, Constructor) { if (!(instance instanceof Constructor)) { throw new TypeError("Cannot call a class as a function"); } }
+
+/**
+ * Copyright 2016 Google Inc. All Rights Reserved.
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *      http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+
+/* eslint no-unused-vars: [2, {"args": "none"}] */
+
+/**
+ * Adapter for MDC Simple Menu. Provides an interface for managing
+ * - classes
+ * - dom
+ * - focus
+ * - position
+ * - dimensions
+ * - event handlers
+ *
+ * Additionally, provides type information for the adapter to the Closure
+ * compiler.
+ *
+ * Implement this adapter for your framework of choice to delegate updates to
+ * the component in your framework of choice. See architecture documentation
+ * for more details.
+ * https://github.com/material-components/material-components-web/blob/master/docs/architecture.md
+ *
+ * @record
+ */
+var MDCSimpleMenuAdapter = function () {
+  function MDCSimpleMenuAdapter() {
+    _classCallCheck(this, MDCSimpleMenuAdapter);
+  }
+
+  _createClass(MDCSimpleMenuAdapter, [{
+    key: "addClass",
+
+    /** @param {string} className */
+    value: function addClass(className) {}
+
+    /** @param {string} className */
+
+  }, {
+    key: "removeClass",
+    value: function removeClass(className) {}
+
+    /**
+     * @param {string} className
+     * @return {boolean}
+     */
+
+  }, {
+    key: "hasClass",
+    value: function hasClass(className) {}
+
+    /** @return {boolean} */
+
+  }, {
+    key: "hasNecessaryDom",
+    value: function hasNecessaryDom() {}
+
+    /**
+     * @param {EventTarget} target
+     * @param {string} attributeName
+     * @return {string}
+     */
+
+  }, {
+    key: "getAttributeForEventTarget",
+    value: function getAttributeForEventTarget(target, attributeName) {}
+
+    /** @return {{ width: number, height: number }} */
+
+  }, {
+    key: "getInnerDimensions",
+    value: function getInnerDimensions() {}
+
+    /** @return {boolean} */
+
+  }, {
+    key: "hasAnchor",
+    value: function hasAnchor() {}
+
+    /** @return {{width: number, height: number, top: number, right: number, bottom: number, left: number}} */
+
+  }, {
+    key: "getAnchorDimensions",
+    value: function getAnchorDimensions() {}
+
+    /** @return {{ width: number, height: number }} */
+
+  }, {
+    key: "getWindowDimensions",
+    value: function getWindowDimensions() {}
+
+    /**
+     * @param {number} x
+     * @param {number} y
+     */
+
+  }, {
+    key: "setScale",
+    value: function setScale(x, y) {}
+
+    /**
+     * @param {number} x
+     * @param {number} y
+     */
+
+  }, {
+    key: "setInnerScale",
+    value: function setInnerScale(x, y) {}
+
+    /** @return {number} */
+
+  }, {
+    key: "getNumberOfItems",
+    value: function getNumberOfItems() {}
+
+    /**
+     * @param {string} type
+     * @param {function(!Event)} handler
+     */
+
+  }, {
+    key: "registerInteractionHandler",
+    value: function registerInteractionHandler(type, handler) {}
+
+    /**
+     * @param {string} type
+     * @param {function(!Event)} handler
+     */
+
+  }, {
+    key: "deregisterInteractionHandler",
+    value: function deregisterInteractionHandler(type, handler) {}
+
+    /** @param {function(!Event)} handler */
+
+  }, {
+    key: "registerBodyClickHandler",
+    value: function registerBodyClickHandler(handler) {}
+
+    /** @param {function(!Event)} handler */
+
+  }, {
+    key: "deregisterBodyClickHandler",
+    value: function deregisterBodyClickHandler(handler) {}
+
+    /**
+     * @param {number} index
+     * @return {{top: number, height: number}}
+     */
+
+  }, {
+    key: "getYParamsForItemAtIndex",
+    value: function getYParamsForItemAtIndex(index) {}
+
+    /**
+     * @param {number} index
+     * @param {string|null} value
+     */
+
+  }, {
+    key: "setTransitionDelayForItemAtIndex",
+    value: function setTransitionDelayForItemAtIndex(index, value) {}
+
+    /**
+     * @param {EventTarget} target
+     * @return {number}
+     */
+
+  }, {
+    key: "getIndexForEventTarget",
+    value: function getIndexForEventTarget(target) {}
+
+    /** @param {{index: number}} evtData */
+
+  }, {
+    key: "notifySelected",
+    value: function notifySelected(evtData) {}
+  }, {
+    key: "notifyCancel",
+    value: function notifyCancel() {}
+  }, {
+    key: "saveFocus",
+    value: function saveFocus() {}
+  }, {
+    key: "restoreFocus",
+    value: function restoreFocus() {}
+
+    /** @return {boolean} */
+
+  }, {
+    key: "isFocused",
+    value: function isFocused() {}
+  }, {
+    key: "focus",
+    value: function focus() {}
+
+    /** @return {number} */
+
+  }, {
+    key: "getFocusedItemIndex",
+    value: function getFocusedItemIndex() /* number */{}
+
+    /** @param {number} index */
+
+  }, {
+    key: "focusItemAtIndex",
+    value: function focusItemAtIndex(index) {}
+
+    /** @return {boolean} */
+
+  }, {
+    key: "isRtl",
+    value: function isRtl() {}
+
+    /** @param {string} origin */
+
+  }, {
+    key: "setTransformOrigin",
+    value: function setTransformOrigin(origin) {}
+
+    /** @param {{
+    *   top: (string|undefined),
+    *   right: (string|undefined),
+    *   bottom: (string|undefined),
+    *   left: (string|undefined)
+    * }} position */
+
+  }, {
+    key: "setPosition",
+    value: function setPosition(position) {}
+
+    /** @return {number} */
+
+  }, {
+    key: "getAccurateTime",
+    value: function getAccurateTime() {}
+  }]);
+
+  return MDCSimpleMenuAdapter;
+}();
+
+/* unused harmony default export */ var _unused_webpack_default_export = (MDCSimpleMenuAdapter);
+
+/***/ }),
+/* 57 */
+/***/ (function(module, __webpack_exports__, __webpack_require__) {
+
+"use strict";
+/* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, "a", function() { return cssClasses; });
+/* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, "b", function() { return strings; });
+/* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, "c", function() { return numbers; });
+/**
+ * Copyright 2016 Google Inc. All Rights Reserved.
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *      http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+
+/** @enum {string} */
+var cssClasses = {
+  ROOT: 'mdc-simple-menu',
+  OPEN: 'mdc-simple-menu--open',
+  ANIMATING: 'mdc-simple-menu--animating',
+  TOP_RIGHT: 'mdc-simple-menu--open-from-top-right',
+  BOTTOM_LEFT: 'mdc-simple-menu--open-from-bottom-left',
+  BOTTOM_RIGHT: 'mdc-simple-menu--open-from-bottom-right'
+};
+
+/** @enum {string} */
+var strings = {
+  ITEMS_SELECTOR: '.mdc-simple-menu__items',
+  SELECTED_EVENT: 'MDCSimpleMenu:selected',
+  CANCEL_EVENT: 'MDCSimpleMenu:cancel',
+  ARIA_DISABLED_ATTR: 'aria-disabled'
+};
+
+/** @enum {number} */
+var numbers = {
+  // Amount of time to wait before triggering a selected event on the menu. Note that this time
+  // will most likely be bumped up once interactive lists are supported to allow for the ripple to
+  // animate before closing the menu
+  SELECTED_TRIGGER_DELAY: 50,
+  // Total duration of the menu animation.
+  TRANSITION_DURATION_MS: 300,
+  // The menu starts its open animation with the X axis at this time value (0 - 1).
+  TRANSITION_SCALE_ADJUSTMENT_X: 0.5,
+  // The time value the menu waits until the animation starts on the Y axis (0 - 1).
+  TRANSITION_SCALE_ADJUSTMENT_Y: 0.2,
+  // The cubic bezier control points for the animation (cubic-bezier(0, 0, 0.2, 1)).
+  TRANSITION_X1: 0,
+  TRANSITION_Y1: 0,
+  TRANSITION_X2: 0.2,
+  TRANSITION_Y2: 1
+};
+
+/***/ }),
+/* 58 */
+/***/ (function(module, __webpack_exports__, __webpack_require__) {
+
+"use strict";
+/* harmony import */ var __WEBPACK_IMPORTED_MODULE_0__material_base_foundation__ = __webpack_require__(1);
+/* harmony import */ var __WEBPACK_IMPORTED_MODULE_1__adapter__ = __webpack_require__(56);
+/* harmony import */ var __WEBPACK_IMPORTED_MODULE_2__constants__ = __webpack_require__(57);
+/* harmony import */ var __WEBPACK_IMPORTED_MODULE_3__util__ = __webpack_require__(9);
+var _extends = Object.assign || function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; };
+
+var _createClass = function () { function defineProperties(target, props) { for (var i = 0; i < props.length; i++) { var descriptor = props[i]; descriptor.enumerable = descriptor.enumerable || false; descriptor.configurable = true; if ("value" in descriptor) descriptor.writable = true; Object.defineProperty(target, descriptor.key, descriptor); } } return function (Constructor, protoProps, staticProps) { if (protoProps) defineProperties(Constructor.prototype, protoProps); if (staticProps) defineProperties(Constructor, staticProps); return Constructor; }; }();
+
+function _defineProperty(obj, key, value) { if (key in obj) { Object.defineProperty(obj, key, { value: value, enumerable: true, configurable: true, writable: true }); } else { obj[key] = value; } return obj; }
+
+function _classCallCheck(instance, Constructor) { if (!(instance instanceof Constructor)) { throw new TypeError("Cannot call a class as a function"); } }
+
+function _possibleConstructorReturn(self, call) { if (!self) { throw new ReferenceError("this hasn't been initialised - super() hasn't been called"); } return call && (typeof call === "object" || typeof call === "function") ? call : self; }
+
+function _inherits(subClass, superClass) { if (typeof superClass !== "function" && superClass !== null) { throw new TypeError("Super expression must either be null or a function, not " + typeof superClass); } subClass.prototype = Object.create(superClass && superClass.prototype, { constructor: { value: subClass, enumerable: false, writable: true, configurable: true } }); if (superClass) Object.setPrototypeOf ? Object.setPrototypeOf(subClass, superClass) : subClass.__proto__ = superClass; }
+
+/**
+ * Copyright 2016 Google Inc. All Rights Reserved.
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *      http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+
+
+
+
+
+
+/**
+ * @extends {MDCFoundation<!MDCSimpleMenuAdapter>}
+ */
+
+var MDCSimpleMenuFoundation = function (_MDCFoundation) {
+  _inherits(MDCSimpleMenuFoundation, _MDCFoundation);
+
+  _createClass(MDCSimpleMenuFoundation, null, [{
+    key: 'cssClasses',
+
+    /** @return enum{cssClasses} */
+    get: function get() {
+      return __WEBPACK_IMPORTED_MODULE_2__constants__["a" /* cssClasses */];
+    }
+
+    /** @return enum{strings} */
+
+  }, {
+    key: 'strings',
+    get: function get() {
+      return __WEBPACK_IMPORTED_MODULE_2__constants__["b" /* strings */];
+    }
+
+    /** @return enum{numbers} */
+
+  }, {
+    key: 'numbers',
+    get: function get() {
+      return __WEBPACK_IMPORTED_MODULE_2__constants__["c" /* numbers */];
+    }
+
+    /**
+     * {@see MDCSimpleMenuAdapter} for typing information on parameters and return
+     * types.
+     * @return {!MDCSimpleMenuAdapter}
+     */
+
+  }, {
+    key: 'defaultAdapter',
+    get: function get() {
+      return (/** @type {!MDCSimpleMenuAdapter} */{
+          addClass: function addClass() {},
+          removeClass: function removeClass() {},
+          hasClass: function hasClass() {
+            return false;
+          },
+          hasNecessaryDom: function hasNecessaryDom() {
+            return false;
+          },
+          getAttributeForEventTarget: function getAttributeForEventTarget() {},
+          getInnerDimensions: function getInnerDimensions() {
+            return {};
+          },
+          hasAnchor: function hasAnchor() {
+            return false;
+          },
+          getAnchorDimensions: function getAnchorDimensions() {
+            return {};
+          },
+          getWindowDimensions: function getWindowDimensions() {
+            return {};
+          },
+          setScale: function setScale() {},
+          setInnerScale: function setInnerScale() {},
+          getNumberOfItems: function getNumberOfItems() {
+            return 0;
+          },
+          registerInteractionHandler: function registerInteractionHandler() {},
+          deregisterInteractionHandler: function deregisterInteractionHandler() {},
+          registerBodyClickHandler: function registerBodyClickHandler() {},
+          deregisterBodyClickHandler: function deregisterBodyClickHandler() {},
+          getYParamsForItemAtIndex: function getYParamsForItemAtIndex() {
+            return {};
+          },
+          setTransitionDelayForItemAtIndex: function setTransitionDelayForItemAtIndex() {},
+          getIndexForEventTarget: function getIndexForEventTarget() {
+            return 0;
+          },
+          notifySelected: function notifySelected() {},
+          notifyCancel: function notifyCancel() {},
+          saveFocus: function saveFocus() {},
+          restoreFocus: function restoreFocus() {},
+          isFocused: function isFocused() {
+            return false;
+          },
+          focus: function focus() {},
+          getFocusedItemIndex: function getFocusedItemIndex() {
+            return -1;
+          },
+          focusItemAtIndex: function focusItemAtIndex() {},
+          isRtl: function isRtl() {
+            return false;
+          },
+          setTransformOrigin: function setTransformOrigin() {},
+          setPosition: function setPosition() {},
+          getAccurateTime: function getAccurateTime() {
+            return 0;
+          }
+        }
+      );
+    }
+
+    /** @param {!MDCSimpleMenuAdapter} adapter */
+
+  }]);
+
+  function MDCSimpleMenuFoundation(adapter) {
+    _classCallCheck(this, MDCSimpleMenuFoundation);
+
+    /** @private {function(!Event)} */
+    var _this = _possibleConstructorReturn(this, (MDCSimpleMenuFoundation.__proto__ || Object.getPrototypeOf(MDCSimpleMenuFoundation)).call(this, _extends(MDCSimpleMenuFoundation.defaultAdapter, adapter)));
+
+    _this.clickHandler_ = function (evt) {
+      return _this.handlePossibleSelected_(evt);
+    };
+    /** @private {function(!Event)} */
+    _this.keydownHandler_ = function (evt) {
+      return _this.handleKeyboardDown_(evt);
+    };
+    /** @private {function(!Event)} */
+    _this.keyupHandler_ = function (evt) {
+      return _this.handleKeyboardUp_(evt);
+    };
+    /** @private {function(!Event)} */
+    _this.documentClickHandler_ = function (evt) {
+      _this.adapter_.notifyCancel();
+      _this.close(evt);
+    };
+    /** @private {boolean} */
+    _this.isOpen_ = false;
+    /** @private {number} */
+    _this.startScaleX_ = 0;
+    /** @private {number} */
+    _this.startScaleY_ = 0;
+    /** @private {number} */
+    _this.targetScale_ = 1;
+    /** @private {number} */
+    _this.scaleX_ = 0;
+    /** @private {number} */
+    _this.scaleY_ = 0;
+    /** @private {boolean} */
+    _this.running_ = false;
+    /** @private {number} */
+    _this.selectedTriggerTimerId_ = 0;
+    /** @private {number} */
+    _this.animationRequestId_ = 0;
+    /** @private {!{ width: number, height: number }} */
+    _this.dimensions_;
+    /** @private {number} */
+    _this.startTime_;
+    /** @private {number} */
+    _this.itemHeight_;
+    return _this;
+  }
+
+  _createClass(MDCSimpleMenuFoundation, [{
+    key: 'init',
+    value: function init() {
+      var _MDCSimpleMenuFoundat = MDCSimpleMenuFoundation.cssClasses,
+          ROOT = _MDCSimpleMenuFoundat.ROOT,
+          OPEN = _MDCSimpleMenuFoundat.OPEN;
+
+
+      if (!this.adapter_.hasClass(ROOT)) {
+        throw new Error(ROOT + ' class required in root element.');
+      }
+
+      if (!this.adapter_.hasNecessaryDom()) {
+        throw new Error('Required DOM nodes missing in ' + ROOT + ' component.');
+      }
+
+      if (this.adapter_.hasClass(OPEN)) {
+        this.isOpen_ = true;
+      }
+
+      this.adapter_.registerInteractionHandler('click', this.clickHandler_);
+      this.adapter_.registerInteractionHandler('keyup', this.keyupHandler_);
+      this.adapter_.registerInteractionHandler('keydown', this.keydownHandler_);
+    }
+  }, {
+    key: 'destroy',
+    value: function destroy() {
+      clearTimeout(this.selectedTriggerTimerId_);
+      // Cancel any currently running animations.
+      cancelAnimationFrame(this.animationRequestId_);
+      this.adapter_.deregisterInteractionHandler('click', this.clickHandler_);
+      this.adapter_.deregisterInteractionHandler('keyup', this.keyupHandler_);
+      this.adapter_.deregisterInteractionHandler('keydown', this.keydownHandler_);
+      this.adapter_.deregisterBodyClickHandler(this.documentClickHandler_);
+    }
+
+    /**
+     * Calculates transition delays for individual menu items, so that they fade in one at a time.
+     * @private
+     */
+
+  }, {
+    key: 'applyTransitionDelays_',
+    value: function applyTransitionDelays_() {
+      var _MDCSimpleMenuFoundat2 = MDCSimpleMenuFoundation.cssClasses,
+          BOTTOM_LEFT = _MDCSimpleMenuFoundat2.BOTTOM_LEFT,
+          BOTTOM_RIGHT = _MDCSimpleMenuFoundat2.BOTTOM_RIGHT;
+
+      var numItems = this.adapter_.getNumberOfItems();
+      var height = this.dimensions_.height;
+
+      var transitionDuration = MDCSimpleMenuFoundation.numbers.TRANSITION_DURATION_MS / 1000;
+      var start = MDCSimpleMenuFoundation.numbers.TRANSITION_SCALE_ADJUSTMENT_Y;
+
+      for (var index = 0; index < numItems; index++) {
+        var _adapter_$getYParamsF = this.adapter_.getYParamsForItemAtIndex(index),
+            itemTop = _adapter_$getYParamsF.top,
+            itemHeight = _adapter_$getYParamsF.height;
+
+        this.itemHeight_ = itemHeight;
+        var itemDelayFraction = itemTop / height;
+        if (this.adapter_.hasClass(BOTTOM_LEFT) || this.adapter_.hasClass(BOTTOM_RIGHT)) {
+          itemDelayFraction = (height - itemTop - itemHeight) / height;
+        }
+        var itemDelay = (start + itemDelayFraction * (1 - start)) * transitionDuration;
+        // Use toFixed() here to normalize CSS unit precision across browsers
+        this.adapter_.setTransitionDelayForItemAtIndex(index, itemDelay.toFixed(3) + 's');
+      }
+    }
+
+    /**
+     * Removes transition delays from menu items.
+     * @private
+     */
+
+  }, {
+    key: 'removeTransitionDelays_',
+    value: function removeTransitionDelays_() {
+      var numItems = this.adapter_.getNumberOfItems();
+      for (var i = 0; i < numItems; i++) {
+        this.adapter_.setTransitionDelayForItemAtIndex(i, null);
+      }
+    }
+
+    /**
+     * Animates menu opening or closing.
+     * @private
+     */
+
+  }, {
+    key: 'animationLoop_',
+    value: function animationLoop_() {
+      var _this2 = this;
+
+      var time = this.adapter_.getAccurateTime();
+      var _MDCSimpleMenuFoundat3 = MDCSimpleMenuFoundation.numbers,
+          TRANSITION_DURATION_MS = _MDCSimpleMenuFoundat3.TRANSITION_DURATION_MS,
+          TRANSITION_X1 = _MDCSimpleMenuFoundat3.TRANSITION_X1,
+          TRANSITION_Y1 = _MDCSimpleMenuFoundat3.TRANSITION_Y1,
+          TRANSITION_X2 = _MDCSimpleMenuFoundat3.TRANSITION_X2,
+          TRANSITION_Y2 = _MDCSimpleMenuFoundat3.TRANSITION_Y2,
+          TRANSITION_SCALE_ADJUSTMENT_X = _MDCSimpleMenuFoundat3.TRANSITION_SCALE_ADJUSTMENT_X,
+          TRANSITION_SCALE_ADJUSTMENT_Y = _MDCSimpleMenuFoundat3.TRANSITION_SCALE_ADJUSTMENT_Y;
+
+      var currentTime = __webpack_require__.i(__WEBPACK_IMPORTED_MODULE_3__util__["clamp"])((time - this.startTime_) / TRANSITION_DURATION_MS);
+
+      // Animate X axis very slowly, so that only the Y axis animation is visible during fade-out.
+      var currentTimeX = __webpack_require__.i(__WEBPACK_IMPORTED_MODULE_3__util__["clamp"])((currentTime - TRANSITION_SCALE_ADJUSTMENT_X) / (1 - TRANSITION_SCALE_ADJUSTMENT_X));
+      // No time-shifting on the Y axis when closing.
+      var currentTimeY = currentTime;
+
+      var startScaleY = this.startScaleY_;
+      if (this.targetScale_ === 1) {
+        // Start with the menu at the height of a single item.
+        if (this.itemHeight_) {
+          startScaleY = Math.max(this.itemHeight_ / this.dimensions_.height, startScaleY);
+        }
+        // X axis moves faster, so time-shift forward.
+        currentTimeX = __webpack_require__.i(__WEBPACK_IMPORTED_MODULE_3__util__["clamp"])(currentTime + TRANSITION_SCALE_ADJUSTMENT_X);
+        // Y axis moves slower, so time-shift backwards and adjust speed by the difference.
+        currentTimeY = __webpack_require__.i(__WEBPACK_IMPORTED_MODULE_3__util__["clamp"])((currentTime - TRANSITION_SCALE_ADJUSTMENT_Y) / (1 - TRANSITION_SCALE_ADJUSTMENT_Y));
+      }
+
+      // Apply cubic bezier easing independently to each axis.
+      var easeX = __webpack_require__.i(__WEBPACK_IMPORTED_MODULE_3__util__["bezierProgress"])(currentTimeX, TRANSITION_X1, TRANSITION_Y1, TRANSITION_X2, TRANSITION_Y2);
+      var easeY = __webpack_require__.i(__WEBPACK_IMPORTED_MODULE_3__util__["bezierProgress"])(currentTimeY, TRANSITION_X1, TRANSITION_Y1, TRANSITION_X2, TRANSITION_Y2);
+
+      // Calculate the scales to apply to the outer container and inner container.
+      this.scaleX_ = this.startScaleX_ + (this.targetScale_ - this.startScaleX_) * easeX;
+      var invScaleX = 1 / (this.scaleX_ === 0 ? 1 : this.scaleX_);
+      this.scaleY_ = startScaleY + (this.targetScale_ - startScaleY) * easeY;
+      var invScaleY = 1 / (this.scaleY_ === 0 ? 1 : this.scaleY_);
+
+      // Apply scales.
+      this.adapter_.setScale(this.scaleX_, this.scaleY_);
+      this.adapter_.setInnerScale(invScaleX, invScaleY);
+
+      // Stop animation when we've covered the entire 0 - 1 range of time.
+      if (currentTime < 1) {
+        this.animationRequestId_ = requestAnimationFrame(function () {
+          return _this2.animationLoop_();
+        });
+      } else {
+        this.animationRequestId_ = 0;
+        this.running_ = false;
+        this.adapter_.removeClass(MDCSimpleMenuFoundation.cssClasses.ANIMATING);
+      }
+    }
+
+    /**
+     * Starts the open or close animation.
+     * @private
+     */
+
+  }, {
+    key: 'animateMenu_',
+    value: function animateMenu_() {
+      var _this3 = this;
+
+      this.startTime_ = this.adapter_.getAccurateTime();
+      this.startScaleX_ = this.scaleX_;
+      this.startScaleY_ = this.scaleY_;
+
+      this.targetScale_ = this.isOpen_ ? 1 : 0;
+
+      if (!this.running_) {
+        this.running_ = true;
+        this.animationRequestId_ = requestAnimationFrame(function () {
+          return _this3.animationLoop_();
+        });
+      }
+    }
+
+    /**
+     * @param {?number} focusIndex
+     * @private
+     */
+
+  }, {
+    key: 'focusOnOpen_',
+    value: function focusOnOpen_(focusIndex) {
+      if (focusIndex === null) {
+        // First, try focusing the menu.
+        this.adapter_.focus();
+        // If that doesn't work, focus first item instead.
+        if (!this.adapter_.isFocused()) {
+          this.adapter_.focusItemAtIndex(0);
+        }
+      } else {
+        this.adapter_.focusItemAtIndex(focusIndex);
+      }
+    }
+
+    /**
+     * Handle keys that we want to repeat on hold (tab and arrows).
+     * @param {!Event} evt
+     * @return {boolean}
+     * @private
+     */
+
+  }, {
+    key: 'handleKeyboardDown_',
+    value: function handleKeyboardDown_(evt) {
+      // Do nothing if Alt, Ctrl or Meta are pressed.
+      if (evt.altKey || evt.ctrlKey || evt.metaKey) {
+        return true;
+      }
+
+      var keyCode = evt.keyCode,
+          key = evt.key,
+          shiftKey = evt.shiftKey;
+
+      var isTab = key === 'Tab' || keyCode === 9;
+      var isArrowUp = key === 'ArrowUp' || keyCode === 38;
+      var isArrowDown = key === 'ArrowDown' || keyCode === 40;
+      var isSpace = key === 'Space' || keyCode === 32;
+
+      var focusedItemIndex = this.adapter_.getFocusedItemIndex();
+      var lastItemIndex = this.adapter_.getNumberOfItems() - 1;
+
+      if (shiftKey && isTab && focusedItemIndex === 0) {
+        this.adapter_.focusItemAtIndex(lastItemIndex);
+        evt.preventDefault();
+        return false;
+      }
+
+      if (!shiftKey && isTab && focusedItemIndex === lastItemIndex) {
+        this.adapter_.focusItemAtIndex(0);
+        evt.preventDefault();
+        return false;
+      }
+
+      // Ensure Arrow{Up,Down} and space do not cause inadvertent scrolling
+      if (isArrowUp || isArrowDown || isSpace) {
+        evt.preventDefault();
+      }
+
+      if (isArrowUp) {
+        if (focusedItemIndex === 0 || this.adapter_.isFocused()) {
+          this.adapter_.focusItemAtIndex(lastItemIndex);
+        } else {
+          this.adapter_.focusItemAtIndex(focusedItemIndex - 1);
+        }
+      } else if (isArrowDown) {
+        if (focusedItemIndex === lastItemIndex || this.adapter_.isFocused()) {
+          this.adapter_.focusItemAtIndex(0);
+        } else {
+          this.adapter_.focusItemAtIndex(focusedItemIndex + 1);
+        }
+      }
+
+      return true;
+    }
+
+    /**
+     * Handle keys that we don't want to repeat on hold (Enter, Space, Escape).
+     * @param {!Event} evt
+     * @return {boolean}
+     * @private
+     */
+
+  }, {
+    key: 'handleKeyboardUp_',
+    value: function handleKeyboardUp_(evt) {
+      // Do nothing if Alt, Ctrl or Meta are pressed.
+      if (evt.altKey || evt.ctrlKey || evt.metaKey) {
+        return true;
+      }
+
+      var keyCode = evt.keyCode,
+          key = evt.key;
+
+      var isEnter = key === 'Enter' || keyCode === 13;
+      var isSpace = key === 'Space' || keyCode === 32;
+      var isEscape = key === 'Escape' || keyCode === 27;
+
+      if (isEnter || isSpace) {
+        this.handlePossibleSelected_(evt);
+      }
+
+      if (isEscape) {
+        this.adapter_.notifyCancel();
+        this.close();
+      }
+
+      return true;
+    }
+
+    /**
+     * @param {!Event} evt
+     * @private
+     */
+
+  }, {
+    key: 'handlePossibleSelected_',
+    value: function handlePossibleSelected_(evt) {
+      var _this4 = this;
+
+      if (this.adapter_.getAttributeForEventTarget(evt.target, __WEBPACK_IMPORTED_MODULE_2__constants__["b" /* strings */].ARIA_DISABLED_ATTR) === 'true') {
+        return;
+      }
+      var targetIndex = this.adapter_.getIndexForEventTarget(evt.target);
+      if (targetIndex < 0) {
+        return;
+      }
+      // Debounce multiple selections
+      if (this.selectedTriggerTimerId_) {
+        return;
+      }
+      this.selectedTriggerTimerId_ = setTimeout(function () {
+        _this4.selectedTriggerTimerId_ = 0;
+        _this4.close();
+        _this4.adapter_.notifySelected({ index: targetIndex });
+      }, __WEBPACK_IMPORTED_MODULE_2__constants__["c" /* numbers */].SELECTED_TRIGGER_DELAY);
+    }
+
+    /** @private */
+
+  }, {
+    key: 'autoPosition_',
+    value: function autoPosition_() {
+      var _position;
+
+      if (!this.adapter_.hasAnchor()) {
+        return;
+      }
+
+      // Defaults: open from the top left.
+      var vertical = 'top';
+      var horizontal = 'left';
+
+      var anchor = this.adapter_.getAnchorDimensions();
+      var windowDimensions = this.adapter_.getWindowDimensions();
+
+      var topOverflow = anchor.top + this.dimensions_.height - windowDimensions.height;
+      var bottomOverflow = this.dimensions_.height - anchor.bottom;
+      var extendsBeyondTopBounds = topOverflow > 0;
+
+      if (extendsBeyondTopBounds) {
+        if (bottomOverflow < topOverflow) {
+          vertical = 'bottom';
+        }
+      }
+
+      var leftOverflow = anchor.left + this.dimensions_.width - windowDimensions.width;
+      var rightOverflow = this.dimensions_.width - anchor.right;
+      var extendsBeyondLeftBounds = leftOverflow > 0;
+      var extendsBeyondRightBounds = rightOverflow > 0;
+
+      if (this.adapter_.isRtl()) {
+        // In RTL, we prefer to open from the right.
+        horizontal = 'right';
+        if (extendsBeyondRightBounds && leftOverflow < rightOverflow) {
+          horizontal = 'left';
+        }
+      } else if (extendsBeyondLeftBounds && rightOverflow < leftOverflow) {
+        horizontal = 'right';
+      }
+
+      var position = (_position = {}, _defineProperty(_position, horizontal, '0'), _defineProperty(_position, vertical, '0'), _position);
+
+      this.adapter_.setTransformOrigin(vertical + ' ' + horizontal);
+      this.adapter_.setPosition(position);
+    }
+
+    /**
+     * Open the menu.
+     * @param {{focusIndex: ?number}=} options
+     */
+
+  }, {
+    key: 'open',
+    value: function open() {
+      var _this5 = this;
+
+      var _ref = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : {},
+          _ref$focusIndex = _ref.focusIndex,
+          focusIndex = _ref$focusIndex === undefined ? null : _ref$focusIndex;
+
+      this.adapter_.saveFocus();
+      this.adapter_.addClass(MDCSimpleMenuFoundation.cssClasses.ANIMATING);
+      this.animationRequestId_ = requestAnimationFrame(function () {
+        _this5.dimensions_ = _this5.adapter_.getInnerDimensions();
+        _this5.applyTransitionDelays_();
+        _this5.autoPosition_();
+        _this5.animateMenu_();
+        _this5.adapter_.addClass(MDCSimpleMenuFoundation.cssClasses.OPEN);
+        _this5.focusOnOpen_(focusIndex);
+        _this5.adapter_.registerBodyClickHandler(_this5.documentClickHandler_);
+      });
+      this.isOpen_ = true;
+    }
+
+    /**
+     * Closes the menu.
+     * @param {Event=} evt
+     */
+
+  }, {
+    key: 'close',
+    value: function close() {
+      var _this6 = this;
+
+      var evt = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : null;
+
+      var targetIsDisabled = evt ? this.adapter_.getAttributeForEventTarget(evt.target, __WEBPACK_IMPORTED_MODULE_2__constants__["b" /* strings */].ARIA_DISABLED_ATTR) === 'true' : false;
+
+      if (targetIsDisabled) {
+        return;
+      }
+
+      this.adapter_.deregisterBodyClickHandler(this.documentClickHandler_);
+      this.adapter_.addClass(MDCSimpleMenuFoundation.cssClasses.ANIMATING);
+      requestAnimationFrame(function () {
+        _this6.removeTransitionDelays_();
+        _this6.animateMenu_();
+        _this6.adapter_.removeClass(MDCSimpleMenuFoundation.cssClasses.OPEN);
+      });
+      this.isOpen_ = false;
+      this.adapter_.restoreFocus();
+    }
+
+    /** @return {boolean} */
+
+  }, {
+    key: 'isOpen',
+    value: function isOpen() {
+      return this.isOpen_;
+    }
+  }]);
+
+  return MDCSimpleMenuFoundation;
+}(__WEBPACK_IMPORTED_MODULE_0__material_base_foundation__["a" /* default */]);
+
+/* harmony default export */ __webpack_exports__["a"] = (MDCSimpleMenuFoundation);
+
+/***/ }),
+/* 59 */
+/***/ (function(module, __webpack_exports__, __webpack_require__) {
+
+"use strict";
+/* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, "a", function() { return MDCSimpleMenu; });
+/* harmony import */ var __WEBPACK_IMPORTED_MODULE_0__material_base_component__ = __webpack_require__(2);
+/* harmony import */ var __WEBPACK_IMPORTED_MODULE_1__foundation__ = __webpack_require__(58);
+/* harmony import */ var __WEBPACK_IMPORTED_MODULE_2__util__ = __webpack_require__(9);
+/* harmony reexport (binding) */ __webpack_require__.d(__webpack_exports__, "b", function() { return __WEBPACK_IMPORTED_MODULE_1__foundation__["a"]; });
+var _createClass = function () { function defineProperties(target, props) { for (var i = 0; i < props.length; i++) { var descriptor = props[i]; descriptor.enumerable = descriptor.enumerable || false; descriptor.configurable = true; if ("value" in descriptor) descriptor.writable = true; Object.defineProperty(target, descriptor.key, descriptor); } } return function (Constructor, protoProps, staticProps) { if (protoProps) defineProperties(Constructor.prototype, protoProps); if (staticProps) defineProperties(Constructor, staticProps); return Constructor; }; }();
+
+function _classCallCheck(instance, Constructor) { if (!(instance instanceof Constructor)) { throw new TypeError("Cannot call a class as a function"); } }
+
+function _possibleConstructorReturn(self, call) { if (!self) { throw new ReferenceError("this hasn't been initialised - super() hasn't been called"); } return call && (typeof call === "object" || typeof call === "function") ? call : self; }
+
+function _inherits(subClass, superClass) { if (typeof superClass !== "function" && superClass !== null) { throw new TypeError("Super expression must either be null or a function, not " + typeof superClass); } subClass.prototype = Object.create(superClass && superClass.prototype, { constructor: { value: subClass, enumerable: false, writable: true, configurable: true } }); if (superClass) Object.setPrototypeOf ? Object.setPrototypeOf(subClass, superClass) : subClass.__proto__ = superClass; }
+
+/**
+ * Copyright 2016 Google Inc. All Rights Reserved.
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *      http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+
+
+
+
+
+
+
+/**
+ * @extends MDCComponent<!MDCSimpleMenuFoundation>
+ */
+var MDCSimpleMenu = function (_MDCComponent) {
+  _inherits(MDCSimpleMenu, _MDCComponent);
+
+  /** @param {...?} args */
+  function MDCSimpleMenu() {
+    var _ref;
+
+    _classCallCheck(this, MDCSimpleMenu);
+
+    for (var _len = arguments.length, args = Array(_len), _key = 0; _key < _len; _key++) {
+      args[_key] = arguments[_key];
+    }
+
+    /** @private {!Element} */
+    var _this = _possibleConstructorReturn(this, (_ref = MDCSimpleMenu.__proto__ || Object.getPrototypeOf(MDCSimpleMenu)).call.apply(_ref, [this].concat(args)));
+
+    _this.previousFocus_;
+    return _this;
+  }
+
+  /**
+   * @param {!Element} root
+   * @return {!MDCSimpleMenu}
+   */
+
+
+  _createClass(MDCSimpleMenu, [{
+    key: 'show',
+
+
+    /** @param {{focusIndex: ?number}=} options */
+    value: function show() {
+      var _ref2 = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : {},
+          _ref2$focusIndex = _ref2.focusIndex,
+          focusIndex = _ref2$focusIndex === undefined ? null : _ref2$focusIndex;
+
+      this.foundation_.open({ focusIndex: focusIndex });
+    }
+  }, {
+    key: 'hide',
+    value: function hide() {
+      this.foundation_.close();
+    }
+
+    /**
+     * Return the item container element inside the component.
+     * @return {?Element}
+     */
+
+  }, {
+    key: 'getDefaultFoundation',
+
+
+    /** @return {!MDCSimpleMenuFoundation} */
+    value: function getDefaultFoundation() {
+      var _this2 = this;
+
+      return new __WEBPACK_IMPORTED_MODULE_1__foundation__["a" /* default */]({
+        addClass: function addClass(className) {
+          return _this2.root_.classList.add(className);
+        },
+        removeClass: function removeClass(className) {
+          return _this2.root_.classList.remove(className);
+        },
+        hasClass: function hasClass(className) {
+          return _this2.root_.classList.contains(className);
+        },
+        hasNecessaryDom: function hasNecessaryDom() {
+          return Boolean(_this2.itemsContainer_);
+        },
+        getAttributeForEventTarget: function getAttributeForEventTarget(target, attributeName) {
+          return target.getAttribute(attributeName);
+        },
+        getInnerDimensions: function getInnerDimensions() {
+          var itemsContainer = _this2.itemsContainer_;
+
+          return { width: itemsContainer.offsetWidth, height: itemsContainer.offsetHeight };
+        },
+        hasAnchor: function hasAnchor() {
+          return _this2.root_.parentElement && _this2.root_.parentElement.classList.contains('mdc-menu-anchor');
+        },
+        getAnchorDimensions: function getAnchorDimensions() {
+          return _this2.root_.parentElement.getBoundingClientRect();
+        },
+        getWindowDimensions: function getWindowDimensions() {
+          return { width: window.innerWidth, height: window.innerHeight };
+        },
+        setScale: function setScale(x, y) {
+          _this2.root_.style[__webpack_require__.i(__WEBPACK_IMPORTED_MODULE_2__util__["getTransformPropertyName"])(window)] = 'scale(' + x + ', ' + y + ')';
+        },
+        setInnerScale: function setInnerScale(x, y) {
+          _this2.itemsContainer_.style[__webpack_require__.i(__WEBPACK_IMPORTED_MODULE_2__util__["getTransformPropertyName"])(window)] = 'scale(' + x + ', ' + y + ')';
+        },
+        getNumberOfItems: function getNumberOfItems() {
+          return _this2.items.length;
+        },
+        registerInteractionHandler: function registerInteractionHandler(type, handler) {
+          return _this2.root_.addEventListener(type, handler);
+        },
+        deregisterInteractionHandler: function deregisterInteractionHandler(type, handler) {
+          return _this2.root_.removeEventListener(type, handler);
+        },
+        registerBodyClickHandler: function registerBodyClickHandler(handler) {
+          return document.body.addEventListener('click', handler);
+        },
+        deregisterBodyClickHandler: function deregisterBodyClickHandler(handler) {
+          return document.body.removeEventListener('click', handler);
+        },
+        getYParamsForItemAtIndex: function getYParamsForItemAtIndex(index) {
+          var _items$index = _this2.items[index],
+              top = _items$index.offsetTop,
+              height = _items$index.offsetHeight;
+
+          return { top: top, height: height };
+        },
+        setTransitionDelayForItemAtIndex: function setTransitionDelayForItemAtIndex(index, value) {
+          return _this2.items[index].style.setProperty('transition-delay', value);
+        },
+        getIndexForEventTarget: function getIndexForEventTarget(target) {
+          return _this2.items.indexOf(target);
+        },
+        notifySelected: function notifySelected(evtData) {
+          return _this2.emit(__WEBPACK_IMPORTED_MODULE_1__foundation__["a" /* default */].strings.SELECTED_EVENT, {
+            index: evtData.index,
+            item: _this2.items[evtData.index]
+          });
+        },
+        notifyCancel: function notifyCancel() {
+          return _this2.emit(__WEBPACK_IMPORTED_MODULE_1__foundation__["a" /* default */].strings.CANCEL_EVENT, {});
+        },
+        saveFocus: function saveFocus() {
+          _this2.previousFocus_ = document.activeElement;
+        },
+        restoreFocus: function restoreFocus() {
+          if (_this2.previousFocus_) {
+            _this2.previousFocus_.focus();
+          }
+        },
+        isFocused: function isFocused() {
+          return document.activeElement === _this2.root_;
+        },
+        focus: function focus() {
+          return _this2.root_.focus();
+        },
+        getFocusedItemIndex: function getFocusedItemIndex() {
+          return _this2.items.indexOf(document.activeElement);
+        },
+        focusItemAtIndex: function focusItemAtIndex(index) {
+          return _this2.items[index].focus();
+        },
+        isRtl: function isRtl() {
+          return getComputedStyle(_this2.root_).getPropertyValue('direction') === 'rtl';
+        },
+        setTransformOrigin: function setTransformOrigin(origin) {
+          _this2.root_.style[__webpack_require__.i(__WEBPACK_IMPORTED_MODULE_2__util__["getTransformPropertyName"])(window) + '-origin'] = origin;
+        },
+        setPosition: function setPosition(position) {
+          _this2.root_.style.left = 'left' in position ? position.left : null;
+          _this2.root_.style.right = 'right' in position ? position.right : null;
+          _this2.root_.style.top = 'top' in position ? position.top : null;
+          _this2.root_.style.bottom = 'bottom' in position ? position.bottom : null;
+        },
+        getAccurateTime: function getAccurateTime() {
+          return window.performance.now();
+        }
+      });
+    }
+  }, {
+    key: 'open',
+
+
+    /** @return {boolean} */
+    get: function get() {
+      return this.foundation_.isOpen();
+    }
+
+    /** @param {boolean} value */
+    ,
+    set: function set(value) {
+      if (value) {
+        this.foundation_.open();
+      } else {
+        this.foundation_.close();
+      }
+    }
+  }, {
+    key: 'itemsContainer_',
+    get: function get() {
+      return this.root_.querySelector(__WEBPACK_IMPORTED_MODULE_1__foundation__["a" /* default */].strings.ITEMS_SELECTOR);
+    }
+
+    /**
+     * Return the items within the menu. Note that this only contains the set of elements within
+     * the items container that are proper list items, and not supplemental / presentational DOM
+     * elements.
+     * @return {!Array<!Element>}
+     */
+
+  }, {
+    key: 'items',
+    get: function get() {
+      var itemsContainer = this.itemsContainer_;
+
+      return [].slice.call(itemsContainer.querySelectorAll('.mdc-list-item[role]'));
+    }
+  }], [{
+    key: 'attachTo',
+    value: function attachTo(root) {
+      return new MDCSimpleMenu(root);
+    }
+  }]);
+
+  return MDCSimpleMenu;
+}(__WEBPACK_IMPORTED_MODULE_0__material_base_component__["a" /* default */]);
+
+/***/ }),
+/* 60 */
+/***/ (function(module, __webpack_exports__, __webpack_require__) {
+
+"use strict";
+/* harmony import */ var __WEBPACK_IMPORTED_MODULE_0__material_base_selection_control__ = __webpack_require__(4);
+var _createClass = function () { function defineProperties(target, props) { for (var i = 0; i < props.length; i++) { var descriptor = props[i]; descriptor.enumerable = descriptor.enumerable || false; descriptor.configurable = true; if ("value" in descriptor) descriptor.writable = true; Object.defineProperty(target, descriptor.key, descriptor); } } return function (Constructor, protoProps, staticProps) { if (protoProps) defineProperties(Constructor.prototype, protoProps); if (staticProps) defineProperties(Constructor, staticProps); return Constructor; }; }();
+
+function _classCallCheck(instance, Constructor) { if (!(instance instanceof Constructor)) { throw new TypeError("Cannot call a class as a function"); } }
+
+/**
+ * Copyright 2016 Google Inc. All Rights Reserved.
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *      http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+
+/* eslint-disable no-unused-vars */
+
+
+/* eslint no-unused-vars: [2, {"args": "none"}] */
+
+/**
+ * Adapter for MDC Radio. Provides an interface for managing
+ * - classes
+ * - dom
+ *
+ * Additionally, provides type information for the adapter to the Closure
+ * compiler.
+ *
+ * Implement this adapter for your framework of choice to delegate updates to
+ * the component in your framework of choice. See architecture documentation
+ * for more details.
+ * https://github.com/material-components/material-components-web/blob/master/docs/architecture.md
+ *
+ * @record
+ */
+
+var MDCRadioAdapter = function () {
+  function MDCRadioAdapter() {
+    _classCallCheck(this, MDCRadioAdapter);
+  }
+
+  _createClass(MDCRadioAdapter, [{
+    key: 'addClass',
+
+    /** @param {string} className */
+    value: function addClass(className) {}
+
+    /** @param {string} className */
+
+  }, {
+    key: 'removeClass',
+    value: function removeClass(className) {}
+
+    /** @return {!SelectionControlState} */
+
+  }, {
+    key: 'getNativeControl',
+    value: function getNativeControl() {}
+  }]);
+
+  return MDCRadioAdapter;
+}();
+
+/* unused harmony default export */ var _unused_webpack_default_export = (MDCRadioAdapter);
+
+/***/ }),
+/* 61 */
+/***/ (function(module, __webpack_exports__, __webpack_require__) {
+
+"use strict";
+/* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, "b", function() { return strings; });
+/* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, "a", function() { return cssClasses; });
+/**
+ * Copyright 2016 Google Inc. All Rights Reserved.
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *      http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+
+/** @enum {string} */
+var strings = {
+  NATIVE_CONTROL_SELECTOR: '.mdc-radio__native-control'
+};
+
+/** @enum {string} */
+var cssClasses = {
+  ROOT: 'mdc-radio',
+  DISABLED: 'mdc-radio--disabled'
+};
+
+/***/ }),
+/* 62 */
+/***/ (function(module, __webpack_exports__, __webpack_require__) {
+
+"use strict";
+/* harmony import */ var __WEBPACK_IMPORTED_MODULE_0__material_base_foundation__ = __webpack_require__(1);
+/* harmony import */ var __WEBPACK_IMPORTED_MODULE_1__material_base_selection_control__ = __webpack_require__(4);
+/* harmony import */ var __WEBPACK_IMPORTED_MODULE_2__adapter__ = __webpack_require__(60);
+/* harmony import */ var __WEBPACK_IMPORTED_MODULE_3__constants__ = __webpack_require__(61);
+var _createClass = function () { function defineProperties(target, props) { for (var i = 0; i < props.length; i++) { var descriptor = props[i]; descriptor.enumerable = descriptor.enumerable || false; descriptor.configurable = true; if ("value" in descriptor) descriptor.writable = true; Object.defineProperty(target, descriptor.key, descriptor); } } return function (Constructor, protoProps, staticProps) { if (protoProps) defineProperties(Constructor.prototype, protoProps); if (staticProps) defineProperties(Constructor, staticProps); return Constructor; }; }();
+
+function _classCallCheck(instance, Constructor) { if (!(instance instanceof Constructor)) { throw new TypeError("Cannot call a class as a function"); } }
+
+function _possibleConstructorReturn(self, call) { if (!self) { throw new ReferenceError("this hasn't been initialised - super() hasn't been called"); } return call && (typeof call === "object" || typeof call === "function") ? call : self; }
+
+function _inherits(subClass, superClass) { if (typeof superClass !== "function" && superClass !== null) { throw new TypeError("Super expression must either be null or a function, not " + typeof superClass); } subClass.prototype = Object.create(superClass && superClass.prototype, { constructor: { value: subClass, enumerable: false, writable: true, configurable: true } }); if (superClass) Object.setPrototypeOf ? Object.setPrototypeOf(subClass, superClass) : subClass.__proto__ = superClass; }
+
+/**
+ * Copyright 2016 Google Inc. All Rights Reserved.
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *      http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+
+
+/* eslint-disable no-unused-vars */
+
+
+/* eslint-enable no-unused-vars */
+
+
+/**
+ * @extends {MDCFoundation<!MDCRadioAdapter>}
+ */
+
+var MDCRadioFoundation = function (_MDCFoundation) {
+  _inherits(MDCRadioFoundation, _MDCFoundation);
+
+  function MDCRadioFoundation() {
+    _classCallCheck(this, MDCRadioFoundation);
+
+    return _possibleConstructorReturn(this, (MDCRadioFoundation.__proto__ || Object.getPrototypeOf(MDCRadioFoundation)).apply(this, arguments));
+  }
+
+  _createClass(MDCRadioFoundation, [{
+    key: 'isChecked',
+
+
+    /** @return {boolean} */
+    value: function isChecked() {
+      return this.getNativeControl_().checked;
+    }
+
+    /** @param {boolean} checked */
+
+  }, {
+    key: 'setChecked',
+    value: function setChecked(checked) {
+      this.getNativeControl_().checked = checked;
+    }
+
+    /** @return {boolean} */
+
+  }, {
+    key: 'isDisabled',
+    value: function isDisabled() {
+      return this.getNativeControl_().disabled;
+    }
+
+    /** @param {boolean} disabled */
+
+  }, {
+    key: 'setDisabled',
+    value: function setDisabled(disabled) {
+      var DISABLED = MDCRadioFoundation.cssClasses.DISABLED;
+
+      this.getNativeControl_().disabled = disabled;
+      if (disabled) {
+        this.adapter_.addClass(DISABLED);
+      } else {
+        this.adapter_.removeClass(DISABLED);
+      }
+    }
+
+    /** @return {?string} */
+
+  }, {
+    key: 'getValue',
+    value: function getValue() {
+      return this.getNativeControl_().value;
+    }
+
+    /** @param {?string} value */
+
+  }, {
+    key: 'setValue',
+    value: function setValue(value) {
+      this.getNativeControl_().value = value;
+    }
+
+    /**
+     * @return {!SelectionControlState}
+     * @private
+     */
+
+  }, {
+    key: 'getNativeControl_',
+    value: function getNativeControl_() {
+      return this.adapter_.getNativeControl() || {
+        checked: false,
+        disabled: false,
+        value: null
+      };
+    }
+  }], [{
+    key: 'cssClasses',
+
+    /** @return enum {cssClasses} */
+    get: function get() {
+      return __WEBPACK_IMPORTED_MODULE_3__constants__["a" /* cssClasses */];
+    }
+
+    /** @return enum {strings} */
+
+  }, {
+    key: 'strings',
+    get: function get() {
+      return __WEBPACK_IMPORTED_MODULE_3__constants__["b" /* strings */];
+    }
+
+    /** @return {!MDCRadioAdapter} */
+
+  }, {
+    key: 'defaultAdapter',
+    get: function get() {
+      return (/** @type {!MDCRadioAdapter} */{
+          addClass: function addClass() /* className: string */{},
+          removeClass: function removeClass() /* className: string */{},
+          getNativeControl: function getNativeControl() /* !SelectionControlState */{}
+        }
+      );
+    }
+  }]);
+
+  return MDCRadioFoundation;
+}(__WEBPACK_IMPORTED_MODULE_0__material_base_foundation__["a" /* default */]);
+
+/* harmony default export */ __webpack_exports__["a"] = (MDCRadioFoundation);
+
+/***/ }),
+/* 63 */
+/***/ (function(module, __webpack_exports__, __webpack_require__) {
+
+"use strict";
+/* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, "a", function() { return cssClasses; });
+/* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, "b", function() { return strings; });
+/* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, "c", function() { return numbers; });
+/**
+ * Copyright 2016 Google Inc. All Rights Reserved.
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *      http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+
+var cssClasses = {
+  // Ripple is a special case where the "root" component is really a "mixin" of sorts,
+  // given that it's an 'upgrade' to an existing component. That being said it is the root
+  // CSS class that all other CSS classes derive from.
+  ROOT: 'mdc-ripple-upgraded',
+  UNBOUNDED: 'mdc-ripple-upgraded--unbounded',
+  BG_FOCUSED: 'mdc-ripple-upgraded--background-focused',
+  BG_ACTIVE_FILL: 'mdc-ripple-upgraded--background-active-fill',
+  FG_ACTIVATION: 'mdc-ripple-upgraded--foreground-activation',
+  FG_DEACTIVATION: 'mdc-ripple-upgraded--foreground-deactivation'
+};
+
+var strings = {
+  VAR_SURFACE_WIDTH: '--mdc-ripple-surface-width',
+  VAR_SURFACE_HEIGHT: '--mdc-ripple-surface-height',
+  VAR_FG_SIZE: '--mdc-ripple-fg-size',
+  VAR_LEFT: '--mdc-ripple-left',
+  VAR_TOP: '--mdc-ripple-top',
+  VAR_FG_SCALE: '--mdc-ripple-fg-scale',
+  VAR_FG_TRANSLATE_START: '--mdc-ripple-fg-translate-start',
+  VAR_FG_TRANSLATE_END: '--mdc-ripple-fg-translate-end'
+};
+
+var numbers = {
+  PADDING: 10,
+  INITIAL_ORIGIN_SCALE: 0.6,
+  DEACTIVATION_TIMEOUT_MS: 300,
+  FG_DEACTIVATION_MS: 83
+};
+
+/***/ }),
+/* 64 */
+/***/ (function(module, __webpack_exports__, __webpack_require__) {
+
+"use strict";
+/* harmony import */ var __WEBPACK_IMPORTED_MODULE_0__material_base_foundation__ = __webpack_require__(1);
+/* harmony import */ var __WEBPACK_IMPORTED_MODULE_1__adapter__ = __webpack_require__(10);
+/* harmony import */ var __WEBPACK_IMPORTED_MODULE_2__constants__ = __webpack_require__(63);
+/* harmony import */ var __WEBPACK_IMPORTED_MODULE_3__util__ = __webpack_require__(11);
+var _extends = Object.assign || function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; };
+
+var _createClass = function () { function defineProperties(target, props) { for (var i = 0; i < props.length; i++) { var descriptor = props[i]; descriptor.enumerable = descriptor.enumerable || false; descriptor.configurable = true; if ("value" in descriptor) descriptor.writable = true; Object.defineProperty(target, descriptor.key, descriptor); } } return function (Constructor, protoProps, staticProps) { if (protoProps) defineProperties(Constructor.prototype, protoProps); if (staticProps) defineProperties(Constructor, staticProps); return Constructor; }; }();
+
+function _classCallCheck(instance, Constructor) { if (!(instance instanceof Constructor)) { throw new TypeError("Cannot call a class as a function"); } }
+
+function _possibleConstructorReturn(self, call) { if (!self) { throw new ReferenceError("this hasn't been initialised - super() hasn't been called"); } return call && (typeof call === "object" || typeof call === "function") ? call : self; }
+
+function _inherits(subClass, superClass) { if (typeof superClass !== "function" && superClass !== null) { throw new TypeError("Super expression must either be null or a function, not " + typeof superClass); } subClass.prototype = Object.create(superClass && superClass.prototype, { constructor: { value: subClass, enumerable: false, writable: true, configurable: true } }); if (superClass) Object.setPrototypeOf ? Object.setPrototypeOf(subClass, superClass) : subClass.__proto__ = superClass; }
+
+/**
+ * Copyright 2016 Google Inc. All Rights Reserved.
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *      http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+
+
+
+
+
+
+/**
+ * @typedef {!{
+ *   isActivated: (boolean|undefined),
+ *   hasDeactivationUXRun: (boolean|undefined),
+ *   wasActivatedByPointer: (boolean|undefined),
+ *   wasElementMadeActive: (boolean|undefined),
+ *   activationStartTime: (number|undefined),
+ *   activationEvent: Event,
+ *   isProgrammatic: (boolean|undefined)
+ * }}
+ */
+var ActivationStateType = void 0;
+
+/**
+ * @typedef {!{
+ *   activate: (string|undefined),
+ *   deactivate: (string|undefined),
+ *   focus: (string|undefined),
+ *   blur: (string|undefined)
+ * }}
+ */
+var ListenerInfoType = void 0;
+
+/**
+ * @typedef {!{
+ *   activate: function(!Event),
+ *   deactivate: function(!Event),
+ *   focus: function(),
+ *   blur: function()
+ * }}
+ */
+var ListenersType = void 0;
+
+/**
+ * @typedef {!{
+ *   x: number,
+ *   y: number
+ * }}
+ */
+var PointType = void 0;
+
+/**
+ * @enum {string}
+ */
+var DEACTIVATION_ACTIVATION_PAIRS = {
+  mouseup: 'mousedown',
+  pointerup: 'pointerdown',
+  touchend: 'touchstart',
+  keyup: 'keydown',
+  blur: 'focus'
+};
+
+/**
+ * @extends {MDCFoundation<!MDCRippleAdapter>}
+ */
+
+var MDCRippleFoundation = function (_MDCFoundation) {
+  _inherits(MDCRippleFoundation, _MDCFoundation);
+
+  _createClass(MDCRippleFoundation, [{
+    key: 'isSupported_',
+
+
+    /**
+     * We compute this property so that we are not querying information about the client
+     * until the point in time where the foundation requests it. This prevents scenarios where
+     * client-side feature-detection may happen too early, such as when components are rendered on the server
+     * and then initialized at mount time on the client.
+     * @return {boolean}
+     */
+    get: function get() {
+      return this.adapter_.browserSupportsCssVars();
+    }
+  }], [{
+    key: 'cssClasses',
+    get: function get() {
+      return __WEBPACK_IMPORTED_MODULE_2__constants__["a" /* cssClasses */];
+    }
+  }, {
+    key: 'strings',
+    get: function get() {
+      return __WEBPACK_IMPORTED_MODULE_2__constants__["b" /* strings */];
+    }
+  }, {
+    key: 'numbers',
+    get: function get() {
+      return __WEBPACK_IMPORTED_MODULE_2__constants__["c" /* numbers */];
+    }
+  }, {
+    key: 'defaultAdapter',
+    get: function get() {
+      return {
+        browserSupportsCssVars: function browserSupportsCssVars() /* boolean - cached */{},
+        isUnbounded: function isUnbounded() /* boolean */{},
+        isSurfaceActive: function isSurfaceActive() /* boolean */{},
+        isSurfaceDisabled: function isSurfaceDisabled() /* boolean */{},
+        addClass: function addClass() /* className: string */{},
+        removeClass: function removeClass() /* className: string */{},
+        registerInteractionHandler: function registerInteractionHandler() /* evtType: string, handler: EventListener */{},
+        deregisterInteractionHandler: function deregisterInteractionHandler() /* evtType: string, handler: EventListener */{},
+        registerResizeHandler: function registerResizeHandler() /* handler: EventListener */{},
+        deregisterResizeHandler: function deregisterResizeHandler() /* handler: EventListener */{},
+        updateCssVariable: function updateCssVariable() /* varName: string, value: string */{},
+        computeBoundingRect: function computeBoundingRect() /* ClientRect */{},
+        getWindowPageOffset: function getWindowPageOffset() /* {x: number, y: number} */{}
+      };
+    }
+  }]);
+
+  function MDCRippleFoundation(adapter) {
+    _classCallCheck(this, MDCRippleFoundation);
+
+    /** @private {number} */
+    var _this = _possibleConstructorReturn(this, (MDCRippleFoundation.__proto__ || Object.getPrototypeOf(MDCRippleFoundation)).call(this, _extends(MDCRippleFoundation.defaultAdapter, adapter)));
+
+    _this.layoutFrame_ = 0;
+
+    /** @private {!ClientRect} */
+    _this.frame_ = /** @type {!ClientRect} */{ width: 0, height: 0 };
+
+    /** @private {!ActivationStateType} */
+    _this.activationState_ = _this.defaultActivationState_();
+
+    /** @private {number} */
+    _this.xfDuration_ = 0;
+
+    /** @private {number} */
+    _this.initialSize_ = 0;
+
+    /** @private {number} */
+    _this.maxRadius_ = 0;
+
+    /** @private {!Array<{ListenerInfoType}>} */
+    _this.listenerInfos_ = [{ activate: 'touchstart', deactivate: 'touchend' }, { activate: 'pointerdown', deactivate: 'pointerup' }, { activate: 'mousedown', deactivate: 'mouseup' }, { activate: 'keydown', deactivate: 'keyup' }, { focus: 'focus', blur: 'blur' }];
+
+    /** @private {!ListenersType} */
+    _this.listeners_ = {
+      activate: function activate(e) {
+        return _this.activate_(e);
+      },
+      deactivate: function deactivate(e) {
+        return _this.deactivate_(e);
+      },
+      focus: function focus() {
+        return requestAnimationFrame(function () {
+          return _this.adapter_.addClass(MDCRippleFoundation.cssClasses.BG_FOCUSED);
+        });
+      },
+      blur: function blur() {
+        return requestAnimationFrame(function () {
+          return _this.adapter_.removeClass(MDCRippleFoundation.cssClasses.BG_FOCUSED);
+        });
+      }
+    };
+
+    /** @private {!Function} */
+    _this.resizeHandler_ = function () {
+      return _this.layout();
+    };
+
+    /** @private {!{left: number, top:number}} */
+    _this.unboundedCoords_ = {
+      left: 0,
+      top: 0
+    };
+
+    /** @private {number} */
+    _this.fgScale_ = 0;
+
+    /** @private {number} */
+    _this.activationTimer_ = 0;
+
+    /** @private {number} */
+    _this.fgDeactivationRemovalTimer_ = 0;
+
+    /** @private {boolean} */
+    _this.activationAnimationHasEnded_ = false;
+
+    /** @private {!Function} */
+    _this.activationTimerCallback_ = function () {
+      _this.activationAnimationHasEnded_ = true;
+      _this.runDeactivationUXLogicIfReady_();
+    };
+    return _this;
+  }
+
+  /**
+   * @return {!ActivationStateType}
+   */
+
+
+  _createClass(MDCRippleFoundation, [{
+    key: 'defaultActivationState_',
+    value: function defaultActivationState_() {
+      return {
+        isActivated: false,
+        hasDeactivationUXRun: false,
+        wasActivatedByPointer: false,
+        wasElementMadeActive: false,
+        activationStartTime: 0,
+        activationEvent: null,
+        isProgrammatic: false
+      };
+    }
+  }, {
+    key: 'init',
+    value: function init() {
+      var _this2 = this;
+
+      if (!this.isSupported_) {
+        return;
+      }
+      this.addEventListeners_();
+
+      var _MDCRippleFoundation$ = MDCRippleFoundation.cssClasses,
+          ROOT = _MDCRippleFoundation$.ROOT,
+          UNBOUNDED = _MDCRippleFoundation$.UNBOUNDED;
+
+      requestAnimationFrame(function () {
+        _this2.adapter_.addClass(ROOT);
+        if (_this2.adapter_.isUnbounded()) {
+          _this2.adapter_.addClass(UNBOUNDED);
+        }
+        _this2.layoutInternal_();
+      });
+    }
+
+    /** @private */
+
+  }, {
+    key: 'addEventListeners_',
+    value: function addEventListeners_() {
+      var _this3 = this;
+
+      this.listenerInfos_.forEach(function (info) {
+        Object.keys(info).forEach(function (k) {
+          _this3.adapter_.registerInteractionHandler(info[k], _this3.listeners_[k]);
+        });
+      });
+      this.adapter_.registerResizeHandler(this.resizeHandler_);
+    }
+
+    /**
+     * @param {Event} e
+     * @private
+     */
+
+  }, {
+    key: 'activate_',
+    value: function activate_(e) {
+      var _this4 = this;
+
+      if (this.adapter_.isSurfaceDisabled()) {
+        return;
+      }
+
+      var activationState = this.activationState_;
+
+      if (activationState.isActivated) {
+        return;
+      }
+
+      activationState.isActivated = true;
+      activationState.isProgrammatic = e === null;
+      activationState.activationEvent = e;
+      activationState.wasActivatedByPointer = activationState.isProgrammatic ? false : e.type === 'mousedown' || e.type === 'touchstart' || e.type === 'pointerdown';
+      activationState.activationStartTime = Date.now();
+
+      requestAnimationFrame(function () {
+        // This needs to be wrapped in an rAF call b/c web browsers
+        // report active states inconsistently when they're called within
+        // event handling code:
+        // - https://bugs.chromium.org/p/chromium/issues/detail?id=635971
+        // - https://bugzilla.mozilla.org/show_bug.cgi?id=1293741
+        activationState.wasElementMadeActive = e && e.type === 'keydown' ? _this4.adapter_.isSurfaceActive() : true;
+        if (activationState.wasElementMadeActive) {
+          _this4.animateActivation_();
+        } else {
+          // Reset activation state immediately if element was not made active.
+          _this4.activationState_ = _this4.defaultActivationState_();
+        }
+      });
+    }
+  }, {
+    key: 'activate',
+    value: function activate() {
+      this.activate_(null);
+    }
+
+    /** @private */
+
+  }, {
+    key: 'animateActivation_',
+    value: function animateActivation_() {
+      var _this5 = this;
+
+      var _MDCRippleFoundation$2 = MDCRippleFoundation.strings,
+          VAR_FG_TRANSLATE_START = _MDCRippleFoundation$2.VAR_FG_TRANSLATE_START,
+          VAR_FG_TRANSLATE_END = _MDCRippleFoundation$2.VAR_FG_TRANSLATE_END;
+      var _MDCRippleFoundation$3 = MDCRippleFoundation.cssClasses,
+          BG_ACTIVE_FILL = _MDCRippleFoundation$3.BG_ACTIVE_FILL,
+          FG_DEACTIVATION = _MDCRippleFoundation$3.FG_DEACTIVATION,
+          FG_ACTIVATION = _MDCRippleFoundation$3.FG_ACTIVATION;
+      var DEACTIVATION_TIMEOUT_MS = MDCRippleFoundation.numbers.DEACTIVATION_TIMEOUT_MS;
+
+
+      var translateStart = '';
+      var translateEnd = '';
+
+      if (!this.adapter_.isUnbounded()) {
+        var _getFgTranslationCoor = this.getFgTranslationCoordinates_(),
+            startPoint = _getFgTranslationCoor.startPoint,
+            endPoint = _getFgTranslationCoor.endPoint;
+
+        translateStart = startPoint.x + 'px, ' + startPoint.y + 'px';
+        translateEnd = endPoint.x + 'px, ' + endPoint.y + 'px';
+      }
+
+      this.adapter_.updateCssVariable(VAR_FG_TRANSLATE_START, translateStart);
+      this.adapter_.updateCssVariable(VAR_FG_TRANSLATE_END, translateEnd);
+      // Cancel any ongoing activation/deactivation animations
+      clearTimeout(this.activationTimer_);
+      clearTimeout(this.fgDeactivationRemovalTimer_);
+      this.rmBoundedActivationClasses_();
+      this.adapter_.removeClass(FG_DEACTIVATION);
+
+      // Force layout in order to re-trigger the animation.
+      this.adapter_.computeBoundingRect();
+      this.adapter_.addClass(BG_ACTIVE_FILL);
+      this.adapter_.addClass(FG_ACTIVATION);
+      this.activationTimer_ = setTimeout(function () {
+        return _this5.activationTimerCallback_();
+      }, DEACTIVATION_TIMEOUT_MS);
+    }
+
+    /**
+     * @private
+     * @return {{startPoint: PointType, endPoint: PointType}}
+     */
+
+  }, {
+    key: 'getFgTranslationCoordinates_',
+    value: function getFgTranslationCoordinates_() {
+      var activationState = this.activationState_;
+      var activationEvent = activationState.activationEvent,
+          wasActivatedByPointer = activationState.wasActivatedByPointer;
+
+
+      var startPoint = void 0;
+      if (wasActivatedByPointer) {
+        startPoint = __webpack_require__.i(__WEBPACK_IMPORTED_MODULE_3__util__["getNormalizedEventCoords"])(
+        /** @type {!Event} */activationEvent, this.adapter_.getWindowPageOffset(), this.adapter_.computeBoundingRect());
+      } else {
+        startPoint = {
+          x: this.frame_.width / 2,
+          y: this.frame_.height / 2
+        };
+      }
+      // Center the element around the start point.
+      startPoint = {
+        x: startPoint.x - this.initialSize_ / 2,
+        y: startPoint.y - this.initialSize_ / 2
+      };
+
+      var endPoint = {
+        x: this.frame_.width / 2 - this.initialSize_ / 2,
+        y: this.frame_.height / 2 - this.initialSize_ / 2
+      };
+
+      return { startPoint: startPoint, endPoint: endPoint };
+    }
+
+    /** @private */
+
+  }, {
+    key: 'runDeactivationUXLogicIfReady_',
+    value: function runDeactivationUXLogicIfReady_() {
+      var _this6 = this;
+
+      var FG_DEACTIVATION = MDCRippleFoundation.cssClasses.FG_DEACTIVATION;
+      var _activationState_ = this.activationState_,
+          hasDeactivationUXRun = _activationState_.hasDeactivationUXRun,
+          isActivated = _activationState_.isActivated;
+
+      var activationHasEnded = hasDeactivationUXRun || !isActivated;
+      if (activationHasEnded && this.activationAnimationHasEnded_) {
+        this.rmBoundedActivationClasses_();
+        this.adapter_.addClass(FG_DEACTIVATION);
+        this.fgDeactivationRemovalTimer_ = setTimeout(function () {
+          _this6.adapter_.removeClass(FG_DEACTIVATION);
+        }, __WEBPACK_IMPORTED_MODULE_2__constants__["c" /* numbers */].FG_DEACTIVATION_MS);
+      }
+    }
+
+    /** @private */
+
+  }, {
+    key: 'rmBoundedActivationClasses_',
+    value: function rmBoundedActivationClasses_() {
+      var _MDCRippleFoundation$4 = MDCRippleFoundation.cssClasses,
+          BG_ACTIVE_FILL = _MDCRippleFoundation$4.BG_ACTIVE_FILL,
+          FG_ACTIVATION = _MDCRippleFoundation$4.FG_ACTIVATION;
+
+      this.adapter_.removeClass(BG_ACTIVE_FILL);
+      this.adapter_.removeClass(FG_ACTIVATION);
+      this.activationAnimationHasEnded_ = false;
+      this.adapter_.computeBoundingRect();
+    }
+
+    /**
+     * @param {Event} e
+     * @private
+     */
+
+  }, {
+    key: 'deactivate_',
+    value: function deactivate_(e) {
+      var _this7 = this;
+
+      var activationState = this.activationState_;
+      // This can happen in scenarios such as when you have a keyup event that blurs the element.
+
+      if (!activationState.isActivated) {
+        return;
+      }
+      // Programmatic deactivation.
+      if (activationState.isProgrammatic) {
+        var evtObject = null;
+        var _state = /** @type {!ActivationStateType} */_extends({}, activationState);
+        requestAnimationFrame(function () {
+          return _this7.animateDeactivation_(evtObject, _state);
+        });
+        this.activationState_ = this.defaultActivationState_();
+        return;
+      }
+
+      var actualActivationType = DEACTIVATION_ACTIVATION_PAIRS[e.type];
+      var expectedActivationType = activationState.activationEvent.type;
+      // NOTE: Pointer events are tricky - https://patrickhlauke.github.io/touch/tests/results/
+      // Essentially, what we need to do here is decouple the deactivation UX from the actual
+      // deactivation state itself. This way, touch/pointer events in sequence do not trample one
+      // another.
+      var needsDeactivationUX = actualActivationType === expectedActivationType;
+      var needsActualDeactivation = needsDeactivationUX;
+      if (activationState.wasActivatedByPointer) {
+        needsActualDeactivation = e.type === 'mouseup';
+      }
+
+      var state = /** @type {!ActivationStateType} */_extends({}, activationState);
+      requestAnimationFrame(function () {
+        if (needsDeactivationUX) {
+          _this7.activationState_.hasDeactivationUXRun = true;
+          _this7.animateDeactivation_(e, state);
+        }
+
+        if (needsActualDeactivation) {
+          _this7.activationState_ = _this7.defaultActivationState_();
+        }
+      });
+    }
+  }, {
+    key: 'deactivate',
+    value: function deactivate() {
+      this.deactivate_(null);
+    }
+
+    /**
+     * @param {Event} e
+     * @param {!ActivationStateType} options
+     * @private
+     */
+
+  }, {
+    key: 'animateDeactivation_',
+    value: function animateDeactivation_(e, _ref) {
+      var wasActivatedByPointer = _ref.wasActivatedByPointer,
+          wasElementMadeActive = _ref.wasElementMadeActive;
+      var BG_FOCUSED = MDCRippleFoundation.cssClasses.BG_FOCUSED;
+
+      if (wasActivatedByPointer || wasElementMadeActive) {
+        // Remove class left over by element being focused
+        this.adapter_.removeClass(BG_FOCUSED);
+        this.runDeactivationUXLogicIfReady_();
+      }
+    }
+  }, {
+    key: 'destroy',
+    value: function destroy() {
+      var _this8 = this;
+
+      if (!this.isSupported_) {
+        return;
+      }
+      this.removeEventListeners_();
+
+      var _MDCRippleFoundation$5 = MDCRippleFoundation.cssClasses,
+          ROOT = _MDCRippleFoundation$5.ROOT,
+          UNBOUNDED = _MDCRippleFoundation$5.UNBOUNDED;
+
+      requestAnimationFrame(function () {
+        _this8.adapter_.removeClass(ROOT);
+        _this8.adapter_.removeClass(UNBOUNDED);
+        _this8.removeCssVars_();
+      });
+    }
+
+    /** @private */
+
+  }, {
+    key: 'removeEventListeners_',
+    value: function removeEventListeners_() {
+      var _this9 = this;
+
+      this.listenerInfos_.forEach(function (info) {
+        Object.keys(info).forEach(function (k) {
+          _this9.adapter_.deregisterInteractionHandler(info[k], _this9.listeners_[k]);
+        });
+      });
+      this.adapter_.deregisterResizeHandler(this.resizeHandler_);
+    }
+
+    /** @private */
+
+  }, {
+    key: 'removeCssVars_',
+    value: function removeCssVars_() {
+      var _this10 = this;
+
+      var strings = MDCRippleFoundation.strings;
+
+      Object.keys(strings).forEach(function (k) {
+        if (k.indexOf('VAR_') === 0) {
+          _this10.adapter_.updateCssVariable(strings[k], null);
+        }
+      });
+    }
+  }, {
+    key: 'layout',
+    value: function layout() {
+      var _this11 = this;
+
+      if (this.layoutFrame_) {
+        cancelAnimationFrame(this.layoutFrame_);
+      }
+      this.layoutFrame_ = requestAnimationFrame(function () {
+        _this11.layoutInternal_();
+        _this11.layoutFrame_ = 0;
+      });
+    }
+
+    /** @private */
+
+  }, {
+    key: 'layoutInternal_',
+    value: function layoutInternal_() {
+      this.frame_ = this.adapter_.computeBoundingRect();
+
+      var maxDim = Math.max(this.frame_.height, this.frame_.width);
+      var surfaceDiameter = Math.sqrt(Math.pow(this.frame_.width, 2) + Math.pow(this.frame_.height, 2));
+
+      // 60% of the largest dimension of the surface
+      this.initialSize_ = maxDim * MDCRippleFoundation.numbers.INITIAL_ORIGIN_SCALE;
+
+      // Diameter of the surface + 10px
+      this.maxRadius_ = surfaceDiameter + MDCRippleFoundation.numbers.PADDING;
+      this.fgScale_ = this.maxRadius_ / this.initialSize_;
+      this.xfDuration_ = 1000 * Math.sqrt(this.maxRadius_ / 1024);
+      this.updateLayoutCssVars_();
+    }
+
+    /** @private */
+
+  }, {
+    key: 'updateLayoutCssVars_',
+    value: function updateLayoutCssVars_() {
+      var _MDCRippleFoundation$6 = MDCRippleFoundation.strings,
+          VAR_SURFACE_WIDTH = _MDCRippleFoundation$6.VAR_SURFACE_WIDTH,
+          VAR_SURFACE_HEIGHT = _MDCRippleFoundation$6.VAR_SURFACE_HEIGHT,
+          VAR_FG_SIZE = _MDCRippleFoundation$6.VAR_FG_SIZE,
+          VAR_LEFT = _MDCRippleFoundation$6.VAR_LEFT,
+          VAR_TOP = _MDCRippleFoundation$6.VAR_TOP,
+          VAR_FG_SCALE = _MDCRippleFoundation$6.VAR_FG_SCALE;
+
+
+      this.adapter_.updateCssVariable(VAR_SURFACE_WIDTH, this.frame_.width + 'px');
+      this.adapter_.updateCssVariable(VAR_SURFACE_HEIGHT, this.frame_.height + 'px');
+      this.adapter_.updateCssVariable(VAR_FG_SIZE, this.initialSize_ + 'px');
+      this.adapter_.updateCssVariable(VAR_FG_SCALE, this.fgScale_);
+
+      if (this.adapter_.isUnbounded()) {
+        this.unboundedCoords_ = {
+          left: Math.round(this.frame_.width / 2 - this.initialSize_ / 2),
+          top: Math.round(this.frame_.height / 2 - this.initialSize_ / 2)
+        };
+
+        this.adapter_.updateCssVariable(VAR_LEFT, this.unboundedCoords_.left + 'px');
+        this.adapter_.updateCssVariable(VAR_TOP, this.unboundedCoords_.top + 'px');
+      }
+    }
+  }]);
+
+  return MDCRippleFoundation;
+}(__WEBPACK_IMPORTED_MODULE_0__material_base_foundation__["a" /* default */]);
+
+/* harmony default export */ __webpack_exports__["a"] = (MDCRippleFoundation);
+
+/***/ }),
+/* 65 */
+/***/ (function(module, __webpack_exports__, __webpack_require__) {
+
+"use strict";
+/* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, "a", function() { return cssClasses; });
+/* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, "b", function() { return strings; });
+/**
+ * Copyright 2016 Google Inc. All Rights Reserved.
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *      http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+var cssClasses = {
+  ROOT: 'mdc-select',
+  OPEN: 'mdc-select--open',
+  DISABLED: 'mdc-select--disabled'
+};
+
+var strings = {
+  CHANGE_EVENT: 'MDCSelect:change'
+};
+
+/***/ }),
+/* 66 */
+/***/ (function(module, __webpack_exports__, __webpack_require__) {
+
+"use strict";
+/* harmony import */ var __WEBPACK_IMPORTED_MODULE_0__material_base__ = __webpack_require__(0);
+/* harmony import */ var __WEBPACK_IMPORTED_MODULE_1__constants__ = __webpack_require__(65);
+/* harmony import */ var __WEBPACK_IMPORTED_MODULE_2__material_menu__ = __webpack_require__(7);
+var _extends = Object.assign || function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; };
+
+var _createClass = function () { function defineProperties(target, props) { for (var i = 0; i < props.length; i++) { var descriptor = props[i]; descriptor.enumerable = descriptor.enumerable || false; descriptor.configurable = true; if ("value" in descriptor) descriptor.writable = true; Object.defineProperty(target, descriptor.key, descriptor); } } return function (Constructor, protoProps, staticProps) { if (protoProps) defineProperties(Constructor.prototype, protoProps); if (staticProps) defineProperties(Constructor, staticProps); return Constructor; }; }();
+
+function _classCallCheck(instance, Constructor) { if (!(instance instanceof Constructor)) { throw new TypeError("Cannot call a class as a function"); } }
+
+function _possibleConstructorReturn(self, call) { if (!self) { throw new ReferenceError("this hasn't been initialised - super() hasn't been called"); } return call && (typeof call === "object" || typeof call === "function") ? call : self; }
+
+function _inherits(subClass, superClass) { if (typeof superClass !== "function" && superClass !== null) { throw new TypeError("Super expression must either be null or a function, not " + typeof superClass); } subClass.prototype = Object.create(superClass && superClass.prototype, { constructor: { value: subClass, enumerable: false, writable: true, configurable: true } }); if (superClass) Object.setPrototypeOf ? Object.setPrototypeOf(subClass, superClass) : subClass.__proto__ = superClass; }
+
+/**
+ * Copyright 2016 Google Inc. All Rights Reserved.
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *      http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+
+
+
+
+
+var OPENER_KEYS = [{ key: 'ArrowUp', keyCode: 38, forType: 'keydown' }, { key: 'ArrowDown', keyCode: 40, forType: 'keydown' }, { key: 'Space', keyCode: 32, forType: 'keyup' }];
+
+var MDCSelectFoundation = function (_MDCFoundation) {
+  _inherits(MDCSelectFoundation, _MDCFoundation);
+
+  _createClass(MDCSelectFoundation, null, [{
+    key: 'cssClasses',
+    get: function get() {
+      return __WEBPACK_IMPORTED_MODULE_1__constants__["a" /* cssClasses */];
+    }
+  }, {
+    key: 'strings',
+    get: function get() {
+      return __WEBPACK_IMPORTED_MODULE_1__constants__["b" /* strings */];
+    }
+  }, {
+    key: 'defaultAdapter',
+    get: function get() {
+      return {
+        addClass: function addClass() /* className: string */{},
+        removeClass: function removeClass() /* className: string */{},
+        setAttr: function setAttr() /* attr: string, value: string */{},
+        rmAttr: function rmAttr() /* attr: string */{},
+        computeBoundingRect: function computeBoundingRect() {
+          return (/* {left: number, top: number} */{ left: 0, top: 0 }
+          );
+        },
+        registerInteractionHandler: function registerInteractionHandler() /* type: string, handler: EventListener */{},
+        deregisterInteractionHandler: function deregisterInteractionHandler() /* type: string, handler: EventListener */{},
+        focus: function focus() {},
+        makeTabbable: function makeTabbable() {},
+        makeUntabbable: function makeUntabbable() {},
+        getComputedStyleValue: function getComputedStyleValue() {
+          return (/* propertyName: string */ /* string */''
+          );
+        },
+        setStyle: function setStyle() /* propertyName: string, value: string */{},
+        create2dRenderingContext: function create2dRenderingContext() {
+          return (/* {font: string, measureText: (string) => {width: number}} */{
+              font: '',
+              measureText: function measureText() {
+                return { width: 0 };
+              }
+            }
+          );
+        },
+        setMenuElStyle: function setMenuElStyle() /* propertyName: string, value: string */{},
+        setMenuElAttr: function setMenuElAttr() /* attr: string, value: string */{},
+        rmMenuElAttr: function rmMenuElAttr() /* attr: string */{},
+        getMenuElOffsetHeight: function getMenuElOffsetHeight() {
+          return (/* number */0
+          );
+        },
+        openMenu: function openMenu() /* focusIndex: number */{},
+        isMenuOpen: function isMenuOpen() {
+          return (/* boolean */false
+          );
+        },
+        setSelectedTextContent: function setSelectedTextContent() /* textContent: string */{},
+        getNumberOfOptions: function getNumberOfOptions() {
+          return (/* number */0
+          );
+        },
+        getTextForOptionAtIndex: function getTextForOptionAtIndex() {
+          return (/* index: number */ /* string */''
+          );
+        },
+        getValueForOptionAtIndex: function getValueForOptionAtIndex() {
+          return (/* index: number */ /* string */''
+          );
+        },
+        setAttrForOptionAtIndex: function setAttrForOptionAtIndex() /* index: number, attr: string, value: string */{},
+        rmAttrForOptionAtIndex: function rmAttrForOptionAtIndex() /* index: number, attr: string */{},
+        getOffsetTopForOptionAtIndex: function getOffsetTopForOptionAtIndex() {
+          return (/* index: number */ /* number */0
+          );
+        },
+        registerMenuInteractionHandler: function registerMenuInteractionHandler() /* type: string, handler: EventListener */{},
+        deregisterMenuInteractionHandler: function deregisterMenuInteractionHandler() /* type: string, handler: EventListener */{},
+        notifyChange: function notifyChange() {},
+        getWindowInnerHeight: function getWindowInnerHeight() {
+          return (/* number */0
+          );
+        }
+      };
+    }
+  }]);
+
+  function MDCSelectFoundation(adapter) {
+    _classCallCheck(this, MDCSelectFoundation);
+
+    var _this = _possibleConstructorReturn(this, (MDCSelectFoundation.__proto__ || Object.getPrototypeOf(MDCSelectFoundation)).call(this, _extends(MDCSelectFoundation.defaultAdapter, adapter)));
+
+    _this.ctx_ = null;
+    _this.selectedIndex_ = -1;
+    _this.disabled_ = false;
+    _this.displayHandler_ = function (evt) {
+      evt.preventDefault();
+      if (!_this.adapter_.isMenuOpen()) {
+        _this.open_();
+      }
+    };
+    _this.displayViaKeyboardHandler_ = function (evt) {
+      return _this.handleDisplayViaKeyboard_(evt);
+    };
+    _this.selectionHandler_ = function (_ref) {
+      var detail = _ref.detail;
+      var index = detail.index;
+
+      _this.close_();
+      if (index !== _this.selectedIndex_) {
+        _this.setSelectedIndex(index);
+        _this.adapter_.notifyChange();
+      }
+    };
+    _this.cancelHandler_ = function () {
+      _this.close_();
+    };
+    return _this;
+  }
+
+  _createClass(MDCSelectFoundation, [{
+    key: 'init',
+    value: function init() {
+      this.ctx_ = this.adapter_.create2dRenderingContext();
+      this.adapter_.registerInteractionHandler('click', this.displayHandler_);
+      this.adapter_.registerInteractionHandler('keydown', this.displayViaKeyboardHandler_);
+      this.adapter_.registerInteractionHandler('keyup', this.displayViaKeyboardHandler_);
+      this.adapter_.registerMenuInteractionHandler(__WEBPACK_IMPORTED_MODULE_2__material_menu__["MDCSimpleMenuFoundation"].strings.SELECTED_EVENT, this.selectionHandler_);
+      this.adapter_.registerMenuInteractionHandler(__WEBPACK_IMPORTED_MODULE_2__material_menu__["MDCSimpleMenuFoundation"].strings.CANCEL_EVENT, this.cancelHandler_);
+      this.resize();
+    }
+  }, {
+    key: 'destroy',
+    value: function destroy() {
+      // Drop reference to context object to prevent potential leaks
+      this.ctx_ = null;
+      this.adapter_.deregisterInteractionHandler('click', this.displayHandler_);
+      this.adapter_.deregisterInteractionHandler('keydown', this.displayViaKeyboardHandler_);
+      this.adapter_.deregisterInteractionHandler('keyup', this.displayViaKeyboardHandler_);
+      this.adapter_.deregisterMenuInteractionHandler(__WEBPACK_IMPORTED_MODULE_2__material_menu__["MDCSimpleMenuFoundation"].strings.SELECTED_EVENT, this.selectionHandler_);
+      this.adapter_.deregisterMenuInteractionHandler(__WEBPACK_IMPORTED_MODULE_2__material_menu__["MDCSimpleMenuFoundation"].strings.CANCEL_EVENT, this.cancelHandler_);
+    }
+  }, {
+    key: 'getValue',
+    value: function getValue() {
+      return this.selectedIndex_ >= 0 ? this.adapter_.getValueForOptionAtIndex(this.selectedIndex_) : '';
+    }
+  }, {
+    key: 'getSelectedIndex',
+    value: function getSelectedIndex() {
+      return this.selectedIndex_;
+    }
+  }, {
+    key: 'setSelectedIndex',
+    value: function setSelectedIndex(index) {
+      var prevSelectedIndex = this.selectedIndex_;
+      if (prevSelectedIndex >= 0) {
+        this.adapter_.rmAttrForOptionAtIndex(this.selectedIndex_, 'aria-selected');
+      }
+
+      this.selectedIndex_ = index >= 0 && index < this.adapter_.getNumberOfOptions() ? index : -1;
+      var selectedTextContent = '';
+      if (this.selectedIndex_ >= 0) {
+        selectedTextContent = this.adapter_.getTextForOptionAtIndex(this.selectedIndex_).trim();
+        this.adapter_.setAttrForOptionAtIndex(this.selectedIndex_, 'aria-selected', 'true');
+      }
+      this.adapter_.setSelectedTextContent(selectedTextContent);
+    }
+  }, {
+    key: 'isDisabled',
+    value: function isDisabled() {
+      return this.disabled_;
+    }
+  }, {
+    key: 'setDisabled',
+    value: function setDisabled(disabled) {
+      var DISABLED = MDCSelectFoundation.cssClasses.DISABLED;
+
+      this.disabled_ = disabled;
+      if (this.disabled_) {
+        this.adapter_.addClass(DISABLED);
+        this.adapter_.setAttr('aria-disabled', 'true');
+        this.adapter_.makeUntabbable();
+      } else {
+        this.adapter_.removeClass(DISABLED);
+        this.adapter_.rmAttr('aria-disabled');
+        this.adapter_.makeTabbable();
+      }
+    }
+  }, {
+    key: 'resize',
+    value: function resize() {
+      var font = this.adapter_.getComputedStyleValue('font');
+      var letterSpacing = parseFloat(this.adapter_.getComputedStyleValue('letter-spacing'));
+      if (font) {
+        this.ctx_.font = font;
+      } else {
+        var primaryFontFamily = this.adapter_.getComputedStyleValue('font-family').split(',')[0];
+        var fontSize = this.adapter_.getComputedStyleValue('font-size');
+        this.ctx_.font = fontSize + ' ' + primaryFontFamily;
+      }
+
+      var maxTextLength = 0;
+      for (var i = 0, l = this.adapter_.getNumberOfOptions(); i < l; i++) {
+        var txt = this.adapter_.getTextForOptionAtIndex(i).trim();
+
+        var _ctx_$measureText = this.ctx_.measureText(txt),
+            width = _ctx_$measureText.width;
+
+        var addedSpace = letterSpacing * txt.length;
+        maxTextLength = Math.max(maxTextLength, Math.ceil(width + addedSpace));
+      }
+      this.adapter_.setStyle('width', maxTextLength + 'px');
+    }
+  }, {
+    key: 'open_',
+    value: function open_() {
+      var OPEN = MDCSelectFoundation.cssClasses.OPEN;
+
+      var focusIndex = this.selectedIndex_ < 0 ? 0 : this.selectedIndex_;
+
+      this.setMenuStylesForOpenAtIndex_(focusIndex);
+      this.adapter_.addClass(OPEN);
+      this.adapter_.openMenu(focusIndex);
+    }
+  }, {
+    key: 'setMenuStylesForOpenAtIndex_',
+    value: function setMenuStylesForOpenAtIndex_(index) {
+      var innerHeight = this.adapter_.getWindowInnerHeight();
+
+      var _adapter_$computeBoun = this.adapter_.computeBoundingRect(),
+          left = _adapter_$computeBoun.left,
+          top = _adapter_$computeBoun.top;
+
+      this.adapter_.setMenuElAttr('aria-hidden', 'true');
+      this.adapter_.setMenuElStyle('display', 'block');
+      var menuHeight = this.adapter_.getMenuElOffsetHeight();
+      var itemOffsetTop = this.adapter_.getOffsetTopForOptionAtIndex(index);
+      this.adapter_.setMenuElStyle('display', '');
+      this.adapter_.rmMenuElAttr('aria-hidden');
+
+      var adjustedTop = top - itemOffsetTop;
+      var overflowsTop = adjustedTop < 0;
+      var overflowsBottom = adjustedTop + menuHeight > innerHeight;
+      if (overflowsTop) {
+        adjustedTop = 0;
+      } else if (overflowsBottom) {
+        adjustedTop = Math.max(0, innerHeight - menuHeight);
+      };
+
+      this.adapter_.setMenuElStyle('left', left + 'px');
+      this.adapter_.setMenuElStyle('top', adjustedTop + 'px');
+      this.adapter_.setMenuElStyle('transform-origin', 'center ' + itemOffsetTop + 'px');
+    }
+  }, {
+    key: 'close_',
+    value: function close_() {
+      var OPEN = MDCSelectFoundation.cssClasses.OPEN;
+
+      this.adapter_.removeClass(OPEN);
+      this.adapter_.focus();
+    }
+  }, {
+    key: 'handleDisplayViaKeyboard_',
+    value: function handleDisplayViaKeyboard_(evt) {
+      // We use a hard-coded 2 instead of Event.AT_TARGET to avoid having to reference a browser
+      // global.
+      var EVENT_PHASE_AT_TARGET = 2;
+      if (evt.eventPhase !== EVENT_PHASE_AT_TARGET) {
+        return;
+      }
+
+      // Prevent pressing space down from scrolling the page
+      var isSpaceDown = evt.type === 'keydown' && (evt.key === 'Space' || evt.keyCode === 32);
+      if (isSpaceDown) {
+        evt.preventDefault();
+      }
+
+      var isOpenerKey = OPENER_KEYS.some(function (_ref2) {
+        var key = _ref2.key,
+            keyCode = _ref2.keyCode,
+            forType = _ref2.forType;
+
+        return evt.type === forType && (evt.key === key || evt.keyCode === keyCode);
+      });
+      if (isOpenerKey) {
+        this.displayHandler_(evt);
+      }
+    }
+  }]);
+
+  return MDCSelectFoundation;
+}(__WEBPACK_IMPORTED_MODULE_0__material_base__["MDCFoundation"]);
+
+/* harmony default export */ __webpack_exports__["a"] = (MDCSelectFoundation);
+
+/***/ }),
+/* 67 */
+/***/ (function(module, __webpack_exports__, __webpack_require__) {
+
+"use strict";
+/* harmony import */ var __WEBPACK_IMPORTED_MODULE_0__constants__ = __webpack_require__(12);
+/* harmony import */ var __WEBPACK_IMPORTED_MODULE_1__material_animation__ = __webpack_require__(5);
+/* harmony import */ var __WEBPACK_IMPORTED_MODULE_2__material_base_foundation__ = __webpack_require__(1);
+var _extends = Object.assign || function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; };
+
+var _createClass = function () { function defineProperties(target, props) { for (var i = 0; i < props.length; i++) { var descriptor = props[i]; descriptor.enumerable = descriptor.enumerable || false; descriptor.configurable = true; if ("value" in descriptor) descriptor.writable = true; Object.defineProperty(target, descriptor.key, descriptor); } } return function (Constructor, protoProps, staticProps) { if (protoProps) defineProperties(Constructor.prototype, protoProps); if (staticProps) defineProperties(Constructor, staticProps); return Constructor; }; }();
+
+function _classCallCheck(instance, Constructor) { if (!(instance instanceof Constructor)) { throw new TypeError("Cannot call a class as a function"); } }
+
+function _possibleConstructorReturn(self, call) { if (!self) { throw new ReferenceError("this hasn't been initialised - super() hasn't been called"); } return call && (typeof call === "object" || typeof call === "function") ? call : self; }
+
+function _inherits(subClass, superClass) { if (typeof superClass !== "function" && superClass !== null) { throw new TypeError("Super expression must either be null or a function, not " + typeof superClass); } subClass.prototype = Object.create(superClass && superClass.prototype, { constructor: { value: subClass, enumerable: false, writable: true, configurable: true } }); if (superClass) Object.setPrototypeOf ? Object.setPrototypeOf(subClass, superClass) : subClass.__proto__ = superClass; }
+
+/**
+ * Copyright 2017 Google Inc. All Rights Reserved.
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ *you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ * http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+
+
+
+
+
+
+var KEY_IDS = {
+  ARROW_LEFT: 'ArrowLeft',
+  ARROW_RIGHT: 'ArrowRight',
+  ARROW_UP: 'ArrowUp',
+  ARROW_DOWN: 'ArrowDown',
+  HOME: 'Home',
+  END: 'End',
+  PAGE_UP: 'PageUp',
+  PAGE_DOWN: 'PageDown'
+};
+
+var MDCSliderFoundation = function (_MDCFoundation) {
+  _inherits(MDCSliderFoundation, _MDCFoundation);
+
+  _createClass(MDCSliderFoundation, null, [{
+    key: 'cssClasses',
+    get: function get() {
+      return __WEBPACK_IMPORTED_MODULE_0__constants__["b" /* cssClasses */];
+    }
+  }, {
+    key: 'strings',
+    get: function get() {
+      return __WEBPACK_IMPORTED_MODULE_0__constants__["a" /* strings */];
+    }
+  }, {
+    key: 'numbers',
+    get: function get() {
+      return __WEBPACK_IMPORTED_MODULE_0__constants__["c" /* numbers */];
+    }
+  }, {
+    key: 'defaultAdapter',
+    get: function get() {
+      return {
+        hasClass: function hasClass() {
+          return (/* className: string */ /* boolean */false
+          );
+        },
+        addClass: function addClass() /* className: string */{},
+        removeClass: function removeClass() /* className: string */{},
+        getAttribute: function getAttribute() {
+          return (/* name: string */ /* string|null */null
+          );
+        },
+        setAttribute: function setAttribute() /* name: string, value: string */{},
+        removeAttribute: function removeAttribute() /* name: string */{},
+        computeBoundingRect: function computeBoundingRect() {
+          return (/* ClientRect */{
+              top: 0, right: 0, bottom: 0, left: 0, width: 0, height: 0
+            }
+          );
+        },
+        getTabIndex: function getTabIndex() {
+          return (/* number */0
+          );
+        },
+        registerInteractionHandler: function registerInteractionHandler() /* type: string, handler: EventListener */{},
+        deregisterInteractionHandler: function deregisterInteractionHandler() /* type: string, handler: EventListener */{},
+        registerThumbContainerInteractionHandler: function registerThumbContainerInteractionHandler() /* type: string, handler: EventListener */{},
+        deregisterThumbContainerInteractionHandler: function deregisterThumbContainerInteractionHandler() /* type: string, handler: EventListener */{},
+        registerBodyInteractionHandler: function registerBodyInteractionHandler() /* type: string, handler: EventListener */{},
+        deregisterBodyInteractionHandler: function deregisterBodyInteractionHandler() /* type: string, handler: EventListener */{},
+        registerResizeHandler: function registerResizeHandler() /* handler: EventListener */{},
+        deregisterResizeHandler: function deregisterResizeHandler() /* handler: EventListener */{},
+        notifyInput: function notifyInput() {},
+        notifyChange: function notifyChange() {},
+        setThumbContainerStyleProperty: function setThumbContainerStyleProperty() /* propertyName: string, value: string */{},
+        setTrackStyleProperty: function setTrackStyleProperty() /* propertyName: string, value: string */{},
+        setMarkerValue: function setMarkerValue() /* value: number */{},
+        appendTrackMarkers: function appendTrackMarkers() /* numMarkers: number */{},
+        removeTrackMarkers: function removeTrackMarkers() {},
+        setLastTrackMarkersStyleProperty: function setLastTrackMarkersStyleProperty() /* propertyName: string, value: string */{},
+        isRTL: function isRTL() {
+          return (/* boolean */false
+          );
+        }
+      };
+    }
+  }]);
+
+  function MDCSliderFoundation() {
+    var adapter = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : {};
+
+    _classCallCheck(this, MDCSliderFoundation);
+
+    var _this = _possibleConstructorReturn(this, (MDCSliderFoundation.__proto__ || Object.getPrototypeOf(MDCSliderFoundation)).call(this, _extends(MDCSliderFoundation.defaultAdapter, adapter)));
+
+    _this.rect_ = null;
+    // We set this to NaN since we want it to be a number, but we can't use '0' or '-1'
+    // because those could be valid tabindices set by the client code.
+    _this.savedTabIndex_ = NaN;
+    _this.off_ = false;
+    _this.active_ = false;
+    _this.inTransit_ = false;
+    _this.isDiscrete_ = false;
+    _this.hasTrackMarker_ = false;
+    _this.handlingThumbTargetEvt_ = false;
+    _this.min_ = 0;
+    _this.max_ = 100;
+    _this.step_ = 0;
+    _this.value_ = 0;
+    _this.disabled_ = false;
+    _this.preventFocusState_ = false;
+    _this.updateUIFrame_ = 0;
+    _this.thumbContainerPointerHandler_ = function () {
+      _this.handlingThumbTargetEvt_ = true;
+    };
+    _this.mousedownHandler_ = _this.createDownHandler_('mousemove', 'mouseup');
+    _this.pointerdownHandler_ = _this.createDownHandler_('pointermove', 'pointerup');
+    _this.touchstartHandler_ = _this.createDownHandler_('touchmove', 'touchend', function (_ref) {
+      var targetTouches = _ref.targetTouches;
+      return targetTouches[0].pageX;
+    });
+    _this.keydownHandler_ = function (evt) {
+      return _this.handleKeydown_(evt);
+    };
+    _this.focusHandler_ = function () {
+      return _this.handleFocus_();
+    };
+    _this.blurHandler_ = function () {
+      return _this.handleBlur_();
+    };
+    _this.resizeHandler_ = function () {
+      return _this.layout();
+    };
+    return _this;
+  }
+
+  _createClass(MDCSliderFoundation, [{
+    key: 'init',
+    value: function init() {
+      var _this2 = this;
+
+      this.isDiscrete_ = this.adapter_.hasClass(__WEBPACK_IMPORTED_MODULE_0__constants__["b" /* cssClasses */].IS_DISCRETE);
+      this.hasTrackMarker_ = this.adapter_.hasClass(__WEBPACK_IMPORTED_MODULE_0__constants__["b" /* cssClasses */].HAS_TRACK_MARKER);
+      this.adapter_.registerInteractionHandler('mousedown', this.mousedownHandler_);
+      this.adapter_.registerInteractionHandler('pointerdown', this.pointerdownHandler_);
+      this.adapter_.registerInteractionHandler('touchstart', this.touchstartHandler_);
+      this.adapter_.registerInteractionHandler('keydown', this.keydownHandler_);
+      this.adapter_.registerInteractionHandler('focus', this.focusHandler_);
+      this.adapter_.registerInteractionHandler('blur', this.blurHandler_);
+      ['mousedown', 'pointerdown', 'touchstart'].forEach(function (evtName) {
+        _this2.adapter_.registerThumbContainerInteractionHandler(evtName, _this2.thumbContainerPointerHandler_);
+      });
+      this.adapter_.registerResizeHandler(this.resizeHandler_);
+      this.layout();
+      // At last step, provide a reasonable default value to discrete slider
+      if (this.isDiscrete_ && this.getStep() == 0) {
+        this.setStep(1);
+      }
+    }
+  }, {
+    key: 'destroy',
+    value: function destroy() {
+      var _this3 = this;
+
+      this.adapter_.deregisterInteractionHandler('mousedown', this.mousedownHandler_);
+      this.adapter_.deregisterInteractionHandler('pointerdown', this.mousedownHandler_);
+      this.adapter_.deregisterInteractionHandler('touchstart', this.mousedownHandler_);
+      this.adapter_.deregisterInteractionHandler('keydown', this.keydownHandler_);
+      this.adapter_.deregisterInteractionHandler('focus', this.focusHandler_);
+      this.adapter_.deregisterInteractionHandler('blur', this.blurHandler_);
+      ['mousedown', 'pointerdown', 'touchstart'].forEach(function (evtName) {
+        _this3.adapter_.deregisterThumbContainerInteractionHandler(evtName, _this3.thumbContainerPointerHandler_);
+      });
+      this.adapter_.deregisterResizeHandler(this.resizeHandler_);
+    }
+  }, {
+    key: 'setupTrackMarker',
+    value: function setupTrackMarker() {
+      if (this.isDiscrete_ && this.hasTrackMarker_ && this.getStep() != 0) {
+        var min = this.getMin();
+        var max = this.getMax();
+        var step = this.getStep();
+        var numMarkers = (max - min) / step;
+
+        // In case distance between max & min is indivisible to step,
+        // we place the secondary to last marker proportionally at where thumb
+        // could reach and place the last marker at max value
+        var indivisible = Math.ceil(numMarkers) !== numMarkers;
+        if (indivisible) {
+          numMarkers = Math.ceil(numMarkers);
+        }
+
+        this.adapter_.removeTrackMarkers();
+        this.adapter_.appendTrackMarkers(numMarkers);
+
+        if (indivisible) {
+          var lastStepRatio = (max - numMarkers * step) / step + 1;
+          var flex = __webpack_require__.i(__WEBPACK_IMPORTED_MODULE_1__material_animation__["a" /* getCorrectPropertyName */])(window, 'flex');
+          this.adapter_.setLastTrackMarkersStyleProperty(flex, lastStepRatio);
+        }
+      }
+    }
+  }, {
+    key: 'layout',
+    value: function layout() {
+      this.rect_ = this.adapter_.computeBoundingRect();
+      this.updateUIForCurrentValue_();
+    }
+  }, {
+    key: 'getValue',
+    value: function getValue() {
+      return this.value_;
+    }
+  }, {
+    key: 'setValue',
+    value: function setValue(value) {
+      this.setValue_(value, false);
+    }
+  }, {
+    key: 'getMax',
+    value: function getMax() {
+      return this.max_;
+    }
+  }, {
+    key: 'setMax',
+    value: function setMax(max) {
+      if (max < this.min_) {
+        throw new Error('Cannot set max to be less than the slider\'s minimum value');
+      }
+      this.max_ = max;
+      this.setValue_(this.value_, false, true);
+      this.adapter_.setAttribute(__WEBPACK_IMPORTED_MODULE_0__constants__["a" /* strings */].ARIA_VALUEMAX, String(this.max_));
+      this.setupTrackMarker();
+    }
+  }, {
+    key: 'getMin',
+    value: function getMin() {
+      return this.min_;
+    }
+  }, {
+    key: 'setMin',
+    value: function setMin(min) {
+      if (min > this.max_) {
+        throw new Error('Cannot set min to be greater than the slider\'s maximum value');
+      }
+      this.min_ = min;
+      this.setValue_(this.value_, false, true);
+      this.adapter_.setAttribute(__WEBPACK_IMPORTED_MODULE_0__constants__["a" /* strings */].ARIA_VALUEMIN, String(this.min_));
+      this.setupTrackMarker();
+    }
+  }, {
+    key: 'getStep',
+    value: function getStep() {
+      return this.step_;
+    }
+  }, {
+    key: 'setStep',
+    value: function setStep(step) {
+      if (step < 0) {
+        throw new Error('Step cannot be set to a negative number');
+      }
+      if (this.isDiscrete_ && (typeof step !== 'number' || step < 1)) {
+        step = 1;
+      }
+      this.step_ = step;
+      this.setValue_(this.value_, false, true);
+      this.setupTrackMarker();
+    }
+  }, {
+    key: 'isDisabled',
+    value: function isDisabled() {
+      return this.disabled_;
+    }
+  }, {
+    key: 'setDisabled',
+    value: function setDisabled(disabled) {
+      this.disabled_ = disabled;
+      this.toggleClass_(__WEBPACK_IMPORTED_MODULE_0__constants__["b" /* cssClasses */].DISABLED, this.disabled_);
+      if (this.disabled_) {
+        this.savedTabIndex_ = this.adapter_.getTabIndex();
+        this.adapter_.setAttribute(__WEBPACK_IMPORTED_MODULE_0__constants__["a" /* strings */].ARIA_DISABLED, 'true');
+        this.adapter_.removeAttribute('tabindex');
+      } else {
+        this.adapter_.removeAttribute(__WEBPACK_IMPORTED_MODULE_0__constants__["a" /* strings */].ARIA_DISABLED);
+        if (!isNaN(this.savedTabIndex_)) {
+          this.adapter_.setAttribute('tabindex', String(this.savedTabIndex_));
+        }
+      }
+    }
+  }, {
+    key: 'createDownHandler_',
+    value: function createDownHandler_(moveEvt, upEvt) {
+      var _this4 = this;
+
+      var getPageX = arguments.length > 2 && arguments[2] !== undefined ? arguments[2] : function (_ref2) {
+        var pageX = _ref2.pageX;
+        return pageX;
+      };
+
+      var moveHandler = function moveHandler(evt) {
+        evt.preventDefault();
+        _this4.setValueFromEvt_(evt, getPageX);
+      };
+
+      var upHandler = function upHandler() {
+        _this4.setActive_(false);
+        _this4.adapter_.deregisterBodyInteractionHandler(moveEvt, moveHandler);
+        _this4.adapter_.deregisterBodyInteractionHandler(upEvt, upHandler);
+        _this4.adapter_.notifyChange();
+      };
+
+      var downHandler = function downHandler(evt) {
+        if (_this4.disabled_) {
+          return;
+        }
+
+        _this4.preventFocusState_ = true;
+        _this4.setInTransit_(!_this4.handlingThumbTargetEvt_);
+        _this4.handlingThumbTargetEvt_ = false;
+
+        _this4.setActive_(true);
+
+        _this4.adapter_.registerBodyInteractionHandler(moveEvt, moveHandler);
+        _this4.adapter_.registerBodyInteractionHandler(upEvt, upHandler);
+        _this4.setValueFromEvt_(evt, getPageX);
+      };
+
+      return downHandler;
+    }
+  }, {
+    key: 'setValueFromEvt_',
+    value: function setValueFromEvt_(evt, getPageX) {
+      var pageX = getPageX(evt);
+      var value = this.computeValueFromPageX_(pageX);
+      this.setValue_(value, true);
+    }
+  }, {
+    key: 'computeValueFromPageX_',
+    value: function computeValueFromPageX_(pageX) {
+      var max = this.max_,
+          min = this.min_;
+
+      var xPos = pageX - this.rect_.left;
+      var pctComplete = xPos / this.rect_.width;
+      if (this.adapter_.isRTL()) {
+        pctComplete = 1 - pctComplete;
+      }
+      // Fit the percentage complete between the range [min,max]
+      // by remapping from [0, 1] to [min, min+(max-min)].
+      return min + pctComplete * (max - min);
+    }
+  }, {
+    key: 'handleKeydown_',
+    value: function handleKeydown_(evt) {
+      var keyId = this.getKeyId_(evt);
+      var value = this.getValueForKeyId_(keyId);
+      if (isNaN(value)) {
+        return;
+      }
+
+      // Prevent page from scrolling due to key presses that would normally scroll the page
+      evt.preventDefault();
+      this.adapter_.addClass(__WEBPACK_IMPORTED_MODULE_0__constants__["b" /* cssClasses */].FOCUS);
+      this.setValue_(value, true);
+      this.adapter_.notifyChange();
+    }
+  }, {
+    key: 'getKeyId_',
+    value: function getKeyId_(kbdEvt) {
+      switch (kbdEvt.key || kbdEvt.keyCode) {
+        case KEY_IDS.ARROW_LEFT:
+        case 37:
+          return KEY_IDS.ARROW_LEFT;
+        case KEY_IDS.ARROW_RIGHT:
+        case 39:
+          return KEY_IDS.ARROW_RIGHT;
+        case KEY_IDS.ARROW_UP:
+        case 38:
+          return KEY_IDS.ARROW_UP;
+        case KEY_IDS.ARROW_DOWN:
+        case 40:
+          return KEY_IDS.ARROW_DOWN;
+        case KEY_IDS.HOME:
+        case 36:
+          return KEY_IDS.HOME;
+        case KEY_IDS.END:
+        case 35:
+          return KEY_IDS.END;
+        case KEY_IDS.PAGE_UP:
+        case 33:
+          return KEY_IDS.PAGE_UP;
+        case KEY_IDS.PAGE_DOWN:
+        case 34:
+          return KEY_IDS.PAGE_DOWN;
+        default:
+          // Doesn't matter
+          return '';
+      }
+    }
+  }, {
+    key: 'getValueForKeyId_',
+    value: function getValueForKeyId_(keyId) {
+      var max = this.max_,
+          min = this.min_,
+          step = this.step_;
+
+      var delta = step || (max - min) / 100;
+      var valueNeedsToBeFlipped = this.adapter_.isRTL() && (keyId === KEY_IDS.ARROW_LEFT || keyId === KEY_IDS.ARROW_RIGHT);
+      if (valueNeedsToBeFlipped) {
+        delta = -delta;
+      }
+
+      switch (keyId) {
+        case KEY_IDS.ARROW_LEFT:
+        case KEY_IDS.ARROW_DOWN:
+          return this.value_ - delta;
+        case KEY_IDS.ARROW_RIGHT:
+        case KEY_IDS.ARROW_UP:
+          return this.value_ + delta;
+        case KEY_IDS.HOME:
+          return this.min_;
+        case KEY_IDS.END:
+          return this.max_;
+        case KEY_IDS.PAGE_UP:
+          return this.value_ + delta * __WEBPACK_IMPORTED_MODULE_0__constants__["c" /* numbers */].PAGE_FACTOR;
+        case KEY_IDS.PAGE_DOWN:
+          return this.value_ - delta * __WEBPACK_IMPORTED_MODULE_0__constants__["c" /* numbers */].PAGE_FACTOR;
+        default:
+          return NaN;
+      }
+    }
+  }, {
+    key: 'handleFocus_',
+    value: function handleFocus_() {
+      if (this.preventFocusState_) {
+        return;
+      }
+      this.adapter_.addClass(__WEBPACK_IMPORTED_MODULE_0__constants__["b" /* cssClasses */].FOCUS);
+    }
+  }, {
+    key: 'handleBlur_',
+    value: function handleBlur_() {
+      this.preventFocusState_ = false;
+      this.adapter_.removeClass(__WEBPACK_IMPORTED_MODULE_0__constants__["b" /* cssClasses */].FOCUS);
+    }
+  }, {
+    key: 'setValue_',
+    value: function setValue_(value, shouldFireInput) {
+      var force = arguments.length > 2 && arguments[2] !== undefined ? arguments[2] : false;
+
+      if (value === this.value_ && !force) {
+        return;
+      }
+
+      var min = this.min_,
+          max = this.max_;
+
+      var valueSetToBoundary = value === min || value === max;
+      if (this.step_ && !valueSetToBoundary) {
+        value = this.quantize_(value);
+      }
+      if (value < min) {
+        value = min;
+      } else if (value > max) {
+        value = max;
+      }
+      this.value_ = value;
+      this.adapter_.setAttribute(__WEBPACK_IMPORTED_MODULE_0__constants__["a" /* strings */].ARIA_VALUENOW, String(this.value_));
+      this.updateUIForCurrentValue_();
+
+      if (shouldFireInput) {
+        this.adapter_.notifyInput();
+        if (this.isDiscrete_) {
+          this.adapter_.setMarkerValue(value);
+        }
+      }
+    }
+  }, {
+    key: 'quantize_',
+    value: function quantize_(value) {
+      var numSteps = Math.round(value / this.step_);
+      var quantizedVal = numSteps * this.step_;
+      return quantizedVal;
+    }
+  }, {
+    key: 'updateUIForCurrentValue_',
+    value: function updateUIForCurrentValue_() {
+      var _this5 = this;
+
+      var max = this.max_,
+          min = this.min_,
+          value = this.value_;
+
+      var pctComplete = (value - min) / (max - min);
+      var translatePx = pctComplete * this.rect_.width;
+      if (this.adapter_.isRTL()) {
+        translatePx = this.rect_.width - translatePx;
+      }
+
+      var transformProp = __webpack_require__.i(__WEBPACK_IMPORTED_MODULE_1__material_animation__["a" /* getCorrectPropertyName */])(window, 'transform');
+      var transitionendEvtName = __webpack_require__.i(__WEBPACK_IMPORTED_MODULE_1__material_animation__["b" /* getCorrectEventName */])(window, 'transitionend');
+
+      if (this.inTransit_) {
+        var onTransitionEnd = function onTransitionEnd() {
+          _this5.setInTransit_(false);
+          _this5.adapter_.deregisterThumbContainerInteractionHandler(transitionendEvtName, onTransitionEnd);
+        };
+        this.adapter_.registerThumbContainerInteractionHandler(transitionendEvtName, onTransitionEnd);
+      }
+
+      this.updateUIFrame_ = requestAnimationFrame(function () {
+        _this5.setOff_(pctComplete === 0);
+        // NOTE(traviskaufman): It would be nice to use calc() here,
+        // but IE cannot handle calcs in transforms correctly.
+        // See: https://goo.gl/NC2itk
+        // Also note that the -50% offset is used to center the slider thumb.
+        _this5.adapter_.setThumbContainerStyleProperty(transformProp, 'translateX(' + translatePx + 'px) translateX(-50%)');
+        _this5.adapter_.setTrackStyleProperty(transformProp, 'scaleX(' + pctComplete + ')');
+      });
+    }
+  }, {
+    key: 'setOff_',
+    value: function setOff_(off) {
+      this.off_ = off;
+      this.toggleClass_(__WEBPACK_IMPORTED_MODULE_0__constants__["b" /* cssClasses */].OFF, this.off_);
+    }
+  }, {
+    key: 'setActive_',
+    value: function setActive_(active) {
+      this.active_ = active;
+      this.toggleClass_(__WEBPACK_IMPORTED_MODULE_0__constants__["b" /* cssClasses */].ACTIVE, this.active_);
+    }
+  }, {
+    key: 'setInTransit_',
+    value: function setInTransit_(inTransit) {
+      this.inTransit_ = inTransit;
+      this.toggleClass_(__WEBPACK_IMPORTED_MODULE_0__constants__["b" /* cssClasses */].IN_TRANSIT, this.inTransit_);
+    }
+  }, {
+    key: 'toggleClass_',
+    value: function toggleClass_(className, shouldBePresent) {
+      if (shouldBePresent) {
+        this.adapter_.addClass(className);
+      } else {
+        this.adapter_.removeClass(className);
+      }
+    }
+  }]);
+
+  return MDCSliderFoundation;
+}(__WEBPACK_IMPORTED_MODULE_2__material_base_foundation__["a" /* default */]);
+
+/* harmony default export */ __webpack_exports__["a"] = (MDCSliderFoundation);
+
+/***/ }),
+/* 68 */
+/***/ (function(module, __webpack_exports__, __webpack_require__) {
+
+"use strict";
+/* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, "a", function() { return cssClasses; });
+/* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, "b", function() { return strings; });
+/* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, "c", function() { return numbers; });
+/**
+ * Copyright 2016 Google Inc. All Rights Reserved.
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *      http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+var cssClasses = {
+  ROOT: 'mdc-snackbar',
+  TEXT: 'mdc-snackbar__text',
+  ACTION_WRAPPER: 'mdc-snackbar__action-wrapper',
+  ACTION_BUTTON: 'mdc-snackbar__action-button',
+  ACTIVE: 'mdc-snackbar--active',
+  MULTILINE: 'mdc-snackbar--multiline',
+  ACTION_ON_BOTTOM: 'mdc-snackbar--action-on-bottom'
+};
+
+var strings = {
+  TEXT_SELECTOR: '.mdc-snackbar__text',
+  ACTION_WRAPPER_SELECTOR: '.mdc-snackbar__action-wrapper',
+  ACTION_BUTTON_SELECTOR: '.mdc-snackbar__action-button'
+};
+
+var numbers = {
+  MESSAGE_TIMEOUT: 2750
+};
+
+/***/ }),
+/* 69 */
+/***/ (function(module, __webpack_exports__, __webpack_require__) {
+
+"use strict";
+/* harmony import */ var __WEBPACK_IMPORTED_MODULE_0__material_base__ = __webpack_require__(0);
+/* harmony import */ var __WEBPACK_IMPORTED_MODULE_1__constants__ = __webpack_require__(68);
+var _extends = Object.assign || function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; };
+
+var _createClass = function () { function defineProperties(target, props) { for (var i = 0; i < props.length; i++) { var descriptor = props[i]; descriptor.enumerable = descriptor.enumerable || false; descriptor.configurable = true; if ("value" in descriptor) descriptor.writable = true; Object.defineProperty(target, descriptor.key, descriptor); } } return function (Constructor, protoProps, staticProps) { if (protoProps) defineProperties(Constructor.prototype, protoProps); if (staticProps) defineProperties(Constructor, staticProps); return Constructor; }; }();
+
+function _classCallCheck(instance, Constructor) { if (!(instance instanceof Constructor)) { throw new TypeError("Cannot call a class as a function"); } }
+
+function _possibleConstructorReturn(self, call) { if (!self) { throw new ReferenceError("this hasn't been initialised - super() hasn't been called"); } return call && (typeof call === "object" || typeof call === "function") ? call : self; }
+
+function _inherits(subClass, superClass) { if (typeof superClass !== "function" && superClass !== null) { throw new TypeError("Super expression must either be null or a function, not " + typeof superClass); } subClass.prototype = Object.create(superClass && superClass.prototype, { constructor: { value: subClass, enumerable: false, writable: true, configurable: true } }); if (superClass) Object.setPrototypeOf ? Object.setPrototypeOf(subClass, superClass) : subClass.__proto__ = superClass; }
+
+/**
+ * Copyright 2016 Google Inc. All Rights Reserved.
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *      http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+
+
+
+
+var MDCSnackbarFoundation = function (_MDCFoundation) {
+  _inherits(MDCSnackbarFoundation, _MDCFoundation);
+
+  _createClass(MDCSnackbarFoundation, [{
+    key: 'active',
+    get: function get() {
+      return this.active_;
+    }
+  }], [{
+    key: 'cssClasses',
+    get: function get() {
+      return __WEBPACK_IMPORTED_MODULE_1__constants__["a" /* cssClasses */];
+    }
+  }, {
+    key: 'strings',
+    get: function get() {
+      return __WEBPACK_IMPORTED_MODULE_1__constants__["b" /* strings */];
+    }
+  }, {
+    key: 'defaultAdapter',
+    get: function get() {
+      return {
+        addClass: function addClass() /* className: string */{},
+        removeClass: function removeClass() /* className: string */{},
+        setAriaHidden: function setAriaHidden() {},
+        unsetAriaHidden: function unsetAriaHidden() {},
+        setActionAriaHidden: function setActionAriaHidden() {},
+        unsetActionAriaHidden: function unsetActionAriaHidden() {},
+        setActionText: function setActionText() /* actionText: string */{},
+        setMessageText: function setMessageText() /* message: string */{},
+        setFocus: function setFocus() {},
+        visibilityIsHidden: function visibilityIsHidden() {
+          return (/* boolean */false
+          );
+        },
+        registerCapturedBlurHandler: function registerCapturedBlurHandler() /* handler: EventListener */{},
+        deregisterCapturedBlurHandler: function deregisterCapturedBlurHandler() /* handler: EventListener */{},
+        registerVisibilityChangeHandler: function registerVisibilityChangeHandler() /* handler: EventListener */{},
+        deregisterVisibilityChangeHandler: function deregisterVisibilityChangeHandler() /* handler: EventListener */{},
+        registerCapturedInteractionHandler: function registerCapturedInteractionHandler() /* evtType: string, handler: EventListener */{},
+        deregisterCapturedInteractionHandler: function deregisterCapturedInteractionHandler() /* evtType: string, handler: EventListener */{},
+        registerActionClickHandler: function registerActionClickHandler() /* handler: EventListener */{},
+        deregisterActionClickHandler: function deregisterActionClickHandler() /* handler: EventListener */{},
+        registerTransitionEndHandler: function registerTransitionEndHandler() /* handler: EventListener */{},
+        deregisterTransitionEndHandler: function deregisterTransitionEndHandler() /* handler: EventListener */{}
+      };
+    }
+  }]);
+
+  function MDCSnackbarFoundation(adapter) {
+    _classCallCheck(this, MDCSnackbarFoundation);
+
+    var _this = _possibleConstructorReturn(this, (MDCSnackbarFoundation.__proto__ || Object.getPrototypeOf(MDCSnackbarFoundation)).call(this, _extends(MDCSnackbarFoundation.defaultAdapter, adapter)));
+
+    _this.active_ = false;
+    _this.actionWasClicked_ = false;
+    _this.dismissOnAction_ = true;
+    _this.firstFocus_ = true;
+    _this.pointerDownRecognized_ = false;
+    _this.snackbarHasFocus_ = false;
+    _this.snackbarData_ = null;
+    _this.queue_ = [];
+    _this.actionClickHandler_ = function () {
+      _this.actionWasClicked_ = true;
+      _this.invokeAction_();
+    };
+    _this.visibilitychangeHandler_ = function () {
+      clearTimeout(_this.timeoutId_);
+      _this.snackbarHasFocus_ = true;
+
+      if (!_this.adapter_.visibilityIsHidden()) {
+        setTimeout(_this.cleanup_.bind(_this), _this.snackbarData_.timeout || __WEBPACK_IMPORTED_MODULE_1__constants__["c" /* numbers */].MESSAGE_TIMEOUT);
+      }
+    };
+    _this.interactionHandler_ = function (evt) {
+      if (evt.type == 'touchstart' || evt.type == 'mousedown') {
+        _this.pointerDownRecognized_ = true;
+      }
+      _this.handlePossibleTabKeyboardFocus_(evt);
+
+      if (evt.type == 'focus') {
+        _this.pointerDownRecognized_ = false;
+      }
+    };
+    _this.blurHandler_ = function () {
+      clearTimeout(_this.timeoutId_);
+      _this.snackbarHasFocus_ = false;
+      _this.timeoutId_ = setTimeout(_this.cleanup_.bind(_this), _this.snackbarData_.timeout || __WEBPACK_IMPORTED_MODULE_1__constants__["c" /* numbers */].MESSAGE_TIMEOUT);
+    };
+    return _this;
+  }
+
+  _createClass(MDCSnackbarFoundation, [{
+    key: 'init',
+    value: function init() {
+      this.adapter_.registerActionClickHandler(this.actionClickHandler_);
+      this.adapter_.setAriaHidden();
+      this.adapter_.setActionAriaHidden();
+    }
+  }, {
+    key: 'destroy',
+    value: function destroy() {
+      var _this2 = this;
+
+      this.adapter_.deregisterActionClickHandler(this.actionClickHandler_);
+      this.adapter_.deregisterCapturedBlurHandler(this.blurHandler_);
+      this.adapter_.deregisterVisibilityChangeHandler(this.visibilitychangeHandler_);
+      ['touchstart', 'mousedown', 'focus'].forEach(function (evtType) {
+        _this2.adapter_.deregisterCapturedInteractionHandler(evtType, _this2.interactionHandler_);
+      });
+    }
+  }, {
+    key: 'dismissesOnAction',
+    value: function dismissesOnAction() {
+      return this.dismissOnAction_;
+    }
+  }, {
+    key: 'setDismissOnAction',
+    value: function setDismissOnAction(dismissOnAction) {
+      this.dismissOnAction_ = !!dismissOnAction;
+    }
+  }, {
+    key: 'show',
+    value: function show(data) {
+      var _this3 = this;
+
+      clearTimeout(this.timeoutId_);
+      this.snackbarData_ = data;
+      this.firstFocus_ = true;
+      this.adapter_.registerVisibilityChangeHandler(this.visibilitychangeHandler_);
+      this.adapter_.registerCapturedBlurHandler(this.blurHandler_);
+      ['touchstart', 'mousedown', 'focus'].forEach(function (evtType) {
+        _this3.adapter_.registerCapturedInteractionHandler(evtType, _this3.interactionHandler_);
+      });
+
+      if (!this.snackbarData_) {
+        throw new Error('Please provide a data object with at least a message to display.');
+      }
+      if (!this.snackbarData_.message) {
+        throw new Error('Please provide a message to be displayed.');
+      }
+      if (this.snackbarData_.actionHandler && !this.snackbarData_.actionText) {
+        throw new Error('Please provide action text with the handler.');
+      }
+      if (this.active) {
+        this.queue_.push(this.snackbarData_);
+      }
+
+      var ACTIVE = __WEBPACK_IMPORTED_MODULE_1__constants__["a" /* cssClasses */].ACTIVE,
+          MULTILINE = __WEBPACK_IMPORTED_MODULE_1__constants__["a" /* cssClasses */].MULTILINE,
+          ACTION_ON_BOTTOM = __WEBPACK_IMPORTED_MODULE_1__constants__["a" /* cssClasses */].ACTION_ON_BOTTOM;
+
+
+      this.adapter_.setMessageText(this.snackbarData_.message);
+
+      if (this.snackbarData_.multiline) {
+        this.adapter_.addClass(MULTILINE);
+        if (this.snackbarData_.actionOnBottom) {
+          this.adapter_.addClass(ACTION_ON_BOTTOM);
+        }
+      }
+
+      if (this.snackbarData_.actionHandler) {
+        this.adapter_.setActionText(this.snackbarData_.actionText);
+        this.actionHandler_ = this.snackbarData_.actionHandler;
+        this.setActionHidden_(false);
+      } else {
+        this.setActionHidden_(true);
+        this.actionHandler_ = null;
+        this.adapter_.setActionText(null);
+      }
+
+      this.active_ = true;
+      this.adapter_.addClass(ACTIVE);
+      this.adapter_.unsetAriaHidden();
+
+      this.timeoutId_ = setTimeout(this.cleanup_.bind(this), this.snackbarData_.timeout || __WEBPACK_IMPORTED_MODULE_1__constants__["c" /* numbers */].MESSAGE_TIMEOUT);
+    }
+  }, {
+    key: 'handlePossibleTabKeyboardFocus_',
+    value: function handlePossibleTabKeyboardFocus_() {
+      var hijackFocus = this.firstFocus_ && !this.pointerDownRecognized_;
+
+      if (hijackFocus) {
+        this.setFocusOnAction_();
+      }
+
+      this.firstFocus_ = false;
+    }
+  }, {
+    key: 'setFocusOnAction_',
+    value: function setFocusOnAction_() {
+      this.adapter_.setFocus();
+      this.snackbarHasFocus_ = true;
+      this.firstFocus_ = false;
+    }
+  }, {
+    key: 'invokeAction_',
+    value: function invokeAction_() {
+      try {
+        if (!this.actionHandler_) {
+          return;
+        }
+
+        this.actionHandler_();
+      } finally {
+        if (this.dismissOnAction_) {
+          this.cleanup_();
+        }
+      }
+    }
+  }, {
+    key: 'cleanup_',
+    value: function cleanup_() {
+      var _this4 = this;
+
+      var allowDismissal = !this.snackbarHasFocus_ || this.actionWasClicked_;
+
+      if (allowDismissal) {
+        var ACTIVE = __WEBPACK_IMPORTED_MODULE_1__constants__["a" /* cssClasses */].ACTIVE,
+            MULTILINE = __WEBPACK_IMPORTED_MODULE_1__constants__["a" /* cssClasses */].MULTILINE,
+            ACTION_ON_BOTTOM = __WEBPACK_IMPORTED_MODULE_1__constants__["a" /* cssClasses */].ACTION_ON_BOTTOM;
+
+
+        this.adapter_.removeClass(ACTIVE);
+
+        var handler = function handler() {
+          clearTimeout(_this4.timeoutId_);
+          _this4.adapter_.deregisterTransitionEndHandler(handler);
+          _this4.adapter_.removeClass(MULTILINE);
+          _this4.adapter_.removeClass(ACTION_ON_BOTTOM);
+          _this4.setActionHidden_(true);
+          _this4.adapter_.setAriaHidden();
+          _this4.active_ = false;
+          _this4.snackbarHasFocus_ = false;
+          _this4.showNext_();
+        };
+
+        this.adapter_.registerTransitionEndHandler(handler);
+      }
+    }
+  }, {
+    key: 'showNext_',
+    value: function showNext_() {
+      if (!this.queue_.length) {
+        return;
+      }
+      this.show(this.queue_.shift());
+    }
+  }, {
+    key: 'setActionHidden_',
+    value: function setActionHidden_(isHidden) {
+      if (isHidden) {
+        this.adapter_.setActionAriaHidden();
+      } else {
+        this.adapter_.unsetActionAriaHidden();
+      }
+    }
+  }]);
+
+  return MDCSnackbarFoundation;
+}(__WEBPACK_IMPORTED_MODULE_0__material_base__["MDCFoundation"]);
+
+/* harmony default export */ __webpack_exports__["a"] = (MDCSnackbarFoundation);
+
+/***/ }),
+/* 70 */
+/***/ (function(module, __webpack_exports__, __webpack_require__) {
+
+"use strict";
+/* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, "a", function() { return cssClasses; });
+/* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, "b", function() { return strings; });
+/**
+ * Copyright 2017 Google Inc. All Rights Reserved.
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *      http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+
+var cssClasses = {
+  INDICATOR_FORWARD: 'mdc-tab-bar-scroller__indicator--forward',
+  INDICATOR_BACK: 'mdc-tab-bar-scroller__indicator--back',
+  INDICATOR_ENABLED: 'mdc-tab-bar-scroller__indicator--enabled',
+  TAB: 'mdc-tab'
+};
+
+var strings = {
+  FRAME_SELECTOR: '.mdc-tab-bar-scroller__scroll-frame',
+  TABS_SELECTOR: '.mdc-tab-bar-scroller__scroll-frame__tabs',
+  TAB_SELECTOR: '.mdc-tab',
+  INDICATOR_FORWARD_SELECTOR: '.mdc-tab-bar-scroller__indicator--forward',
+  INDICATOR_BACK_SELECTOR: '.mdc-tab-bar-scroller__indicator--back'
+};
+
+/***/ }),
+/* 71 */
+/***/ (function(module, __webpack_exports__, __webpack_require__) {
+
+"use strict";
+/* harmony import */ var __WEBPACK_IMPORTED_MODULE_0__material_base_foundation__ = __webpack_require__(1);
+/* harmony import */ var __WEBPACK_IMPORTED_MODULE_1__constants__ = __webpack_require__(70);
+var _extends = Object.assign || function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; };
+
+var _createClass = function () { function defineProperties(target, props) { for (var i = 0; i < props.length; i++) { var descriptor = props[i]; descriptor.enumerable = descriptor.enumerable || false; descriptor.configurable = true; if ("value" in descriptor) descriptor.writable = true; Object.defineProperty(target, descriptor.key, descriptor); } } return function (Constructor, protoProps, staticProps) { if (protoProps) defineProperties(Constructor.prototype, protoProps); if (staticProps) defineProperties(Constructor, staticProps); return Constructor; }; }();
+
+function _classCallCheck(instance, Constructor) { if (!(instance instanceof Constructor)) { throw new TypeError("Cannot call a class as a function"); } }
+
+function _possibleConstructorReturn(self, call) { if (!self) { throw new ReferenceError("this hasn't been initialised - super() hasn't been called"); } return call && (typeof call === "object" || typeof call === "function") ? call : self; }
+
+function _inherits(subClass, superClass) { if (typeof superClass !== "function" && superClass !== null) { throw new TypeError("Super expression must either be null or a function, not " + typeof superClass); } subClass.prototype = Object.create(superClass && superClass.prototype, { constructor: { value: subClass, enumerable: false, writable: true, configurable: true } }); if (superClass) Object.setPrototypeOf ? Object.setPrototypeOf(subClass, superClass) : subClass.__proto__ = superClass; }
+
+/**
+ * Copyright 2017 Google Inc. All Rights Reserved.
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *      http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+
+
+
+
+
+var MDCTabBarScrollerFoundation = function (_MDCFoundation) {
+  _inherits(MDCTabBarScrollerFoundation, _MDCFoundation);
+
+  _createClass(MDCTabBarScrollerFoundation, null, [{
+    key: 'cssClasses',
+    get: function get() {
+      return __WEBPACK_IMPORTED_MODULE_1__constants__["a" /* cssClasses */];
+    }
+  }, {
+    key: 'strings',
+    get: function get() {
+      return __WEBPACK_IMPORTED_MODULE_1__constants__["b" /* strings */];
+    }
+  }, {
+    key: 'defaultAdapter',
+    get: function get() {
+      return {
+        addClass: function addClass() /* className: string */{},
+        removeClass: function removeClass() /* className: string */{},
+        eventTargetHasClass: function eventTargetHasClass() {
+          return (/* target: EventTarget, className: string */ /* boolean */false
+          );
+        },
+        addClassToForwardIndicator: function addClassToForwardIndicator() /* className: string */{},
+        removeClassFromForwardIndicator: function removeClassFromForwardIndicator() /* className: string */{},
+        addClassToBackIndicator: function addClassToBackIndicator() /* className: string */{},
+        removeClassFromBackIndicator: function removeClassFromBackIndicator() /* className: string */{},
+        isRTL: function isRTL() {
+          return (/* boolean */false
+          );
+        },
+        registerBackIndicatorClickHandler: function registerBackIndicatorClickHandler() /* handler: EventListener */{},
+        deregisterBackIndicatorClickHandler: function deregisterBackIndicatorClickHandler() /* handler: EventListener */{},
+        registerForwardIndicatorClickHandler: function registerForwardIndicatorClickHandler() /* handler: EventListener */{},
+        deregisterForwardIndicatorClickHandler: function deregisterForwardIndicatorClickHandler() /* handler: EventListener */{},
+        registerCapturedInteractionHandler: function registerCapturedInteractionHandler() /* evt: string, handler: EventListener */{},
+        deregisterCapturedInteractionHandler: function deregisterCapturedInteractionHandler() /* evt: string, handler: EventListener */{},
+        registerWindowResizeHandler: function registerWindowResizeHandler() /* handler: EventListener */{},
+        deregisterWindowResizeHandler: function deregisterWindowResizeHandler() /* handler: EventListener */{},
+        getNumberOfTabs: function getNumberOfTabs() {
+          return (/* number */0
+          );
+        },
+        getComputedWidthForTabAtIndex: function getComputedWidthForTabAtIndex() {
+          return (/* number */0
+          );
+        },
+        getComputedLeftForTabAtIndex: function getComputedLeftForTabAtIndex() {
+          return (/* number */0
+          );
+        },
+        getOffsetWidthForScrollFrame: function getOffsetWidthForScrollFrame() {
+          return (/* number */0
+          );
+        },
+        getScrollLeftForScrollFrame: function getScrollLeftForScrollFrame() {
+          return (/* number */0
+          );
+        },
+        setScrollLeftForScrollFrame: function setScrollLeftForScrollFrame() /* scrollLeftAmount: number */{},
+        getOffsetWidthForTabBar: function getOffsetWidthForTabBar() {
+          return (/* number */0
+          );
+        },
+        setTransformStyleForTabBar: function setTransformStyleForTabBar() /* value: string */{},
+        getOffsetLeftForEventTarget: function getOffsetLeftForEventTarget() {
+          return (/* target: EventTarget */ /* number */0
+          );
+        },
+        getOffsetWidthForEventTarget: function getOffsetWidthForEventTarget() {
+          return (/* target: EventTarget */ /* number */0
+          );
+        }
+      };
+    }
+  }]);
+
+  function MDCTabBarScrollerFoundation(adapter) {
+    _classCallCheck(this, MDCTabBarScrollerFoundation);
+
+    var _this = _possibleConstructorReturn(this, (MDCTabBarScrollerFoundation.__proto__ || Object.getPrototypeOf(MDCTabBarScrollerFoundation)).call(this, _extends(MDCTabBarScrollerFoundation.defaultAdapter, adapter)));
+
+    _this.pointerDownRecognized_ = false;
+    _this.currentTranslateOffset_ = 0;
+    _this.focusedTarget_ = null;
+    _this.layoutFrame_ = 0;
+    _this.scrollFrameScrollLeft_ = 0;
+    _this.forwardIndicatorClickHandler_ = function (evt) {
+      return _this.scrollForward(evt);
+    };
+    _this.backIndicatorClickHandler_ = function (evt) {
+      return _this.scrollBack(evt);
+    };
+    _this.resizeHandler_ = function () {
+      return _this.layout();
+    };
+    _this.interactionHandler_ = function (evt) {
+      if (evt.type == 'touchstart' || evt.type == 'mousedown') {
+        _this.pointerDownRecognized_ = true;
+      }
+      _this.handlePossibleTabKeyboardFocus_(evt);
+
+      if (evt.type == 'focus') {
+        _this.pointerDownRecognized_ = false;
+      }
+    };
+    return _this;
+  }
+
+  _createClass(MDCTabBarScrollerFoundation, [{
+    key: 'init',
+    value: function init() {
+      var _this2 = this;
+
+      this.adapter_.registerBackIndicatorClickHandler(this.backIndicatorClickHandler_);
+      this.adapter_.registerForwardIndicatorClickHandler(this.forwardIndicatorClickHandler_);
+      this.adapter_.registerWindowResizeHandler(this.resizeHandler_);
+      ['touchstart', 'mousedown', 'focus'].forEach(function (evtType) {
+        _this2.adapter_.registerCapturedInteractionHandler(evtType, _this2.interactionHandler_);
+      });
+      this.layout();
+    }
+  }, {
+    key: 'destroy',
+    value: function destroy() {
+      var _this3 = this;
+
+      this.adapter_.deregisterBackIndicatorClickHandler(this.backIndicatorClickHandler_);
+      this.adapter_.deregisterForwardIndicatorClickHandler(this.forwardIndicatorClickHandler_);
+      this.adapter_.deregisterWindowResizeHandler(this.resizeHandler_);
+      ['touchstart', 'mousedown', 'focus'].forEach(function (evtType) {
+        _this3.adapter_.deregisterCapturedInteractionHandler(evtType, _this3.interactionHandler_);
+      });
+    }
+  }, {
+    key: 'scrollBack',
+    value: function scrollBack() {
+      var evt = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : null;
+
+      if (evt) {
+        evt.preventDefault();
+      }
+
+      var tabWidthAccumulator = 0;
+      var scrollTargetIndex = 0;
+
+      for (var i = this.adapter_.getNumberOfTabs() - 1; i > 0; i--) {
+        var tabOffsetLeft = this.adapter_.getComputedLeftForTabAtIndex(i);
+        var tabBarWidthLessTabOffsetLeft = this.adapter_.getOffsetWidthForTabBar() - tabOffsetLeft;
+
+        var tabIsNotOccluded = tabOffsetLeft > this.currentTranslateOffset_;
+        if (this.isRTL_()) {
+          tabIsNotOccluded = tabBarWidthLessTabOffsetLeft > this.currentTranslateOffset_;
+        }
+
+        if (tabIsNotOccluded) {
+          continue;
+        }
+
+        tabWidthAccumulator += this.adapter_.getComputedWidthForTabAtIndex(i);
+
+        var scrollTargetDetermined = tabWidthAccumulator > this.adapter_.getOffsetWidthForScrollFrame();
+        if (scrollTargetDetermined) {
+          scrollTargetIndex = this.isRTL_() ? i + 1 : i;
+          break;
+        }
+      }
+
+      this.scrollToTabAtIndex_(scrollTargetIndex);
+    }
+  }, {
+    key: 'scrollForward',
+    value: function scrollForward() {
+      var evt = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : null;
+
+      if (evt) {
+        evt.preventDefault();
+      }
+
+      var scrollFrameOffsetWidth = this.adapter_.getOffsetWidthForScrollFrame() + this.currentTranslateOffset_;
+      var scrollTargetIndex = 0;
+
+      for (var i = 0; i < this.adapter_.getNumberOfTabs(); i++) {
+        var tabOffsetLeftAndWidth = this.adapter_.getComputedLeftForTabAtIndex(i) + this.adapter_.getComputedWidthForTabAtIndex(i);
+        var scrollTargetDetermined = tabOffsetLeftAndWidth > scrollFrameOffsetWidth;
+
+        if (this.isRTL_()) {
+          var frameOffsetAndTabWidth = scrollFrameOffsetWidth - this.adapter_.getComputedWidthForTabAtIndex(i);
+          var _tabOffsetLeftAndWidth = this.adapter_.getComputedLeftForTabAtIndex(i) + this.adapter_.getComputedWidthForTabAtIndex(i);
+          var tabRightOffset = this.adapter_.getOffsetWidthForTabBar() - _tabOffsetLeftAndWidth;
+
+          scrollTargetDetermined = tabRightOffset > frameOffsetAndTabWidth;
+        }
+
+        if (scrollTargetDetermined) {
+          scrollTargetIndex = i;
+          break;
+        }
+      }
+
+      this.scrollToTabAtIndex_(scrollTargetIndex);
+    }
+  }, {
+    key: 'layout',
+    value: function layout() {
+      var _this4 = this;
+
+      cancelAnimationFrame(this.layoutFrame_);
+      this.scrollFrameScrollLeft_ = this.adapter_.getScrollLeftForScrollFrame();
+      this.layoutFrame_ = requestAnimationFrame(function () {
+        return _this4.layout_();
+      });
+    }
+  }, {
+    key: 'isRTL_',
+    value: function isRTL_() {
+      return this.adapter_.isRTL();
+    }
+  }, {
+    key: 'handlePossibleTabKeyboardFocus_',
+    value: function handlePossibleTabKeyboardFocus_(evt) {
+      if (!this.adapter_.eventTargetHasClass(evt.target, __WEBPACK_IMPORTED_MODULE_1__constants__["a" /* cssClasses */].TAB) || this.pointerDownRecognized_) {
+        return;
+      }
+
+      var resetAmt = this.isRTL_() ? this.scrollFrameScrollLeft_ : 0;
+      this.adapter_.setScrollLeftForScrollFrame(resetAmt);
+
+      this.focusedTarget_ = evt.target;
+      var scrollFrameWidth = this.adapter_.getOffsetWidthForScrollFrame();
+      var tabBarWidth = this.adapter_.getOffsetWidthForTabBar();
+      var leftEdge = this.adapter_.getOffsetLeftForEventTarget(this.focusedTarget_);
+      var rightEdge = leftEdge + this.adapter_.getOffsetWidthForEventTarget(this.focusedTarget_);
+
+      var shouldScrollBack = rightEdge <= this.currentTranslateOffset_;
+      var shouldScrollForward = rightEdge > this.currentTranslateOffset_ + scrollFrameWidth;
+
+      if (this.isRTL_()) {
+        var normalizedLeftOffset = tabBarWidth - leftEdge;
+        shouldScrollBack = leftEdge >= tabBarWidth - this.currentTranslateOffset_;
+        shouldScrollForward = normalizedLeftOffset > scrollFrameWidth + this.currentTranslateOffset_;
+      }
+
+      if (shouldScrollForward) {
+        this.scrollForward();
+      } else if (shouldScrollBack) {
+        this.scrollBack();
+      }
+
+      this.pointerDownRecognized_ = false;
+    }
+  }, {
+    key: 'layout_',
+    value: function layout_() {
+      var frameWidth = this.adapter_.getOffsetWidthForScrollFrame();
+      var isOverflowing = this.adapter_.getOffsetWidthForTabBar() > frameWidth;
+
+      if (!isOverflowing) {
+        this.currentTranslateOffset_ = 0;
+      }
+
+      this.shiftFrame_();
+      this.updateIndicatorEnabledStates_();
+    }
+  }, {
+    key: 'scrollToTabAtIndex_',
+    value: function scrollToTabAtIndex_(index) {
+      var _this5 = this;
+
+      var scrollTargetOffsetLeft = this.adapter_.getComputedLeftForTabAtIndex(index);
+      var scrollTargetOffsetWidth = this.adapter_.getComputedWidthForTabAtIndex(index);
+
+      this.currentTranslateOffset_ = this.normalizeForRTL_(scrollTargetOffsetLeft, scrollTargetOffsetWidth);
+
+      requestAnimationFrame(function () {
+        return _this5.shiftFrame_();
+      });
+    }
+  }, {
+    key: 'normalizeForRTL_',
+    value: function normalizeForRTL_(left, width) {
+      return this.isRTL_() ? this.adapter_.getOffsetWidthForTabBar() - (left + width) : left;
+    }
+  }, {
+    key: 'shiftFrame_',
+    value: function shiftFrame_() {
+      var shiftAmount = this.isRTL_() ? this.currentTranslateOffset_ : -this.currentTranslateOffset_;
+
+      this.adapter_.setTransformStyleForTabBar('translateX(' + shiftAmount + 'px)');
+      this.updateIndicatorEnabledStates_();
+    }
+  }, {
+    key: 'updateIndicatorEnabledStates_',
+    value: function updateIndicatorEnabledStates_() {
+      var INDICATOR_ENABLED = __WEBPACK_IMPORTED_MODULE_1__constants__["a" /* cssClasses */].INDICATOR_ENABLED;
+
+      if (this.currentTranslateOffset_ === 0) {
+        this.adapter_.removeClassFromBackIndicator(INDICATOR_ENABLED);
+      } else {
+        this.adapter_.addClassToBackIndicator(INDICATOR_ENABLED);
+      }
+
+      var remainingTabBarWidth = this.adapter_.getOffsetWidthForTabBar() - this.currentTranslateOffset_;
+      if (remainingTabBarWidth > this.adapter_.getOffsetWidthForScrollFrame()) {
+        this.adapter_.addClassToForwardIndicator(INDICATOR_ENABLED);
+      } else {
+        this.adapter_.removeClassFromForwardIndicator(INDICATOR_ENABLED);
+      }
+    }
+  }]);
+
+  return MDCTabBarScrollerFoundation;
+}(__WEBPACK_IMPORTED_MODULE_0__material_base_foundation__["a" /* default */]);
+
+/* harmony default export */ __webpack_exports__["a"] = (MDCTabBarScrollerFoundation);
+
+/***/ }),
+/* 72 */
+/***/ (function(module, __webpack_exports__, __webpack_require__) {
+
+"use strict";
+/* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, "b", function() { return MDCTabBarScroller; });
+/* harmony import */ var __WEBPACK_IMPORTED_MODULE_0__material_animation__ = __webpack_require__(5);
+/* harmony import */ var __WEBPACK_IMPORTED_MODULE_1__material_base_component__ = __webpack_require__(2);
+/* harmony import */ var __WEBPACK_IMPORTED_MODULE_2__tab_bar__ = __webpack_require__(13);
+/* harmony import */ var __WEBPACK_IMPORTED_MODULE_3__foundation__ = __webpack_require__(71);
+/* harmony reexport (binding) */ __webpack_require__.d(__webpack_exports__, "a", function() { return __WEBPACK_IMPORTED_MODULE_3__foundation__["a"]; });
+var _createClass = function () { function defineProperties(target, props) { for (var i = 0; i < props.length; i++) { var descriptor = props[i]; descriptor.enumerable = descriptor.enumerable || false; descriptor.configurable = true; if ("value" in descriptor) descriptor.writable = true; Object.defineProperty(target, descriptor.key, descriptor); } } return function (Constructor, protoProps, staticProps) { if (protoProps) defineProperties(Constructor.prototype, protoProps); if (staticProps) defineProperties(Constructor, staticProps); return Constructor; }; }();
+
+function _classCallCheck(instance, Constructor) { if (!(instance instanceof Constructor)) { throw new TypeError("Cannot call a class as a function"); } }
+
+function _possibleConstructorReturn(self, call) { if (!self) { throw new ReferenceError("this hasn't been initialised - super() hasn't been called"); } return call && (typeof call === "object" || typeof call === "function") ? call : self; }
+
+function _inherits(subClass, superClass) { if (typeof superClass !== "function" && superClass !== null) { throw new TypeError("Super expression must either be null or a function, not " + typeof superClass); } subClass.prototype = Object.create(superClass && superClass.prototype, { constructor: { value: subClass, enumerable: false, writable: true, configurable: true } }); if (superClass) Object.setPrototypeOf ? Object.setPrototypeOf(subClass, superClass) : subClass.__proto__ = superClass; }
+
+/**
+ * Copyright 2017 Google Inc. All Rights Reserved.
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *      http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+
+
+
+
+
+
+
+
+
+var MDCTabBarScroller = function (_MDCComponent) {
+  _inherits(MDCTabBarScroller, _MDCComponent);
+
+  function MDCTabBarScroller() {
+    _classCallCheck(this, MDCTabBarScroller);
+
+    return _possibleConstructorReturn(this, (MDCTabBarScroller.__proto__ || Object.getPrototypeOf(MDCTabBarScroller)).apply(this, arguments));
+  }
+
+  _createClass(MDCTabBarScroller, [{
+    key: 'initialize',
+    value: function initialize() {
+      var tabBarFactory = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : function (root) {
+        return new __WEBPACK_IMPORTED_MODULE_2__tab_bar__["b" /* MDCTabBar */](root);
+      };
+
+      this.scrollFrame_ = this.root_.querySelector(__WEBPACK_IMPORTED_MODULE_3__foundation__["a" /* default */].strings.FRAME_SELECTOR);
+      this.tabBarEl_ = this.root_.querySelector(__WEBPACK_IMPORTED_MODULE_3__foundation__["a" /* default */].strings.TABS_SELECTOR);
+      this.forwardIndicator_ = this.root_.querySelector(__WEBPACK_IMPORTED_MODULE_3__foundation__["a" /* default */].strings.INDICATOR_FORWARD_SELECTOR);
+      this.backIndicator_ = this.root_.querySelector(__WEBPACK_IMPORTED_MODULE_3__foundation__["a" /* default */].strings.INDICATOR_BACK_SELECTOR);
+      this.tabBar_ = tabBarFactory(this.tabBarEl_);
+    }
+  }, {
+    key: 'getDefaultFoundation',
+    value: function getDefaultFoundation() {
+      var _this2 = this;
+
+      return new __WEBPACK_IMPORTED_MODULE_3__foundation__["a" /* default */]({
+        addClass: function addClass(className) {
+          return _this2.root_.classList.add(className);
+        },
+        removeClass: function removeClass(className) {
+          return _this2.root_.classList.remove(className);
+        },
+        eventTargetHasClass: function eventTargetHasClass(target, className) {
+          return target.classList.contains(className);
+        },
+        addClassToForwardIndicator: function addClassToForwardIndicator(className) {
+          return _this2.forwardIndicator_.classList.add(className);
+        },
+        removeClassFromForwardIndicator: function removeClassFromForwardIndicator(className) {
+          return _this2.forwardIndicator_.classList.remove(className);
+        },
+        addClassToBackIndicator: function addClassToBackIndicator(className) {
+          return _this2.backIndicator_.classList.add(className);
+        },
+        removeClassFromBackIndicator: function removeClassFromBackIndicator(className) {
+          return _this2.backIndicator_.classList.remove(className);
+        },
+        isRTL: function isRTL() {
+          return getComputedStyle(_this2.root_).getPropertyValue('direction') === 'rtl';
+        },
+        registerBackIndicatorClickHandler: function registerBackIndicatorClickHandler(handler) {
+          return _this2.backIndicator_.addEventListener('click', handler);
+        },
+        deregisterBackIndicatorClickHandler: function deregisterBackIndicatorClickHandler(handler) {
+          return _this2.backIndicator_.removeEventListener('click', handler);
+        },
+        registerForwardIndicatorClickHandler: function registerForwardIndicatorClickHandler(handler) {
+          return _this2.forwardIndicator_.addEventListener('click', handler);
+        },
+        deregisterForwardIndicatorClickHandler: function deregisterForwardIndicatorClickHandler(handler) {
+          return _this2.forwardIndicator_.removeEventListener('click', handler);
+        },
+        registerCapturedInteractionHandler: function registerCapturedInteractionHandler(evt, handler) {
+          return _this2.root_.addEventListener(evt, handler, true);
+        },
+        deregisterCapturedInteractionHandler: function deregisterCapturedInteractionHandler(evt, handler) {
+          return _this2.root_.removeEventListener(evt, handler, true);
+        },
+        registerWindowResizeHandler: function registerWindowResizeHandler(handler) {
+          return window.addEventListener('resize', handler);
+        },
+        deregisterWindowResizeHandler: function deregisterWindowResizeHandler(handler) {
+          return window.removeEventListener('resize', handler);
+        },
+        getNumberOfTabs: function getNumberOfTabs() {
+          return _this2.tabBar.tabs.length;
+        },
+        getComputedWidthForTabAtIndex: function getComputedWidthForTabAtIndex(index) {
+          return _this2.tabBar.tabs[index].computedWidth;
+        },
+        getComputedLeftForTabAtIndex: function getComputedLeftForTabAtIndex(index) {
+          return _this2.tabBar.tabs[index].computedLeft;
+        },
+        getOffsetWidthForScrollFrame: function getOffsetWidthForScrollFrame() {
+          return _this2.scrollFrame_.offsetWidth;
+        },
+        getScrollLeftForScrollFrame: function getScrollLeftForScrollFrame() {
+          return _this2.scrollFrame_.scrollLeft;
+        },
+        setScrollLeftForScrollFrame: function setScrollLeftForScrollFrame(scrollLeftAmount) {
+          return _this2.scrollFrame_.scrollLeft = scrollLeftAmount;
+        },
+        getOffsetWidthForTabBar: function getOffsetWidthForTabBar() {
+          return _this2.tabBarEl_.offsetWidth;
+        },
+        setTransformStyleForTabBar: function setTransformStyleForTabBar(value) {
+          _this2.tabBarEl_.style.setProperty(__webpack_require__.i(__WEBPACK_IMPORTED_MODULE_0__material_animation__["a" /* getCorrectPropertyName */])(window, 'transform'), value);
+        },
+        getOffsetLeftForEventTarget: function getOffsetLeftForEventTarget(target) {
+          return target.offsetLeft;
+        },
+        getOffsetWidthForEventTarget: function getOffsetWidthForEventTarget(target) {
+          return target.offsetWidth;
+        }
+      });
+    }
+  }, {
+    key: 'layout',
+    value: function layout() {
+      this.foundation_.layout();
+    }
+  }, {
+    key: 'tabBar',
+    get: function get() {
+      return this.tabBar_;
+    }
+  }], [{
+    key: 'attachTo',
+    value: function attachTo(root) {
+      return new MDCTabBarScroller(root);
+    }
+  }]);
+
+  return MDCTabBarScroller;
+}(__WEBPACK_IMPORTED_MODULE_1__material_base_component__["a" /* default */]);
+
+/***/ }),
+/* 73 */
+/***/ (function(module, __webpack_exports__, __webpack_require__) {
+
+"use strict";
+/* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, "a", function() { return cssClasses; });
+/* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, "b", function() { return strings; });
+/**
+ * Copyright 2017 Google Inc. All Rights Reserved.
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *      http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+
+var cssClasses = {
+  UPGRADED: 'mdc-tab-bar-upgraded'
+};
+
+var strings = {
+  TAB_SELECTOR: '.mdc-tab',
+  INDICATOR_SELECTOR: '.mdc-tab-bar__indicator',
+  CHANGE_EVENT: 'MDCTabBar:change'
+};
+
+/***/ }),
+/* 74 */
+/***/ (function(module, __webpack_exports__, __webpack_require__) {
+
+"use strict";
+/* harmony import */ var __WEBPACK_IMPORTED_MODULE_0__material_base_foundation__ = __webpack_require__(1);
+/* harmony import */ var __WEBPACK_IMPORTED_MODULE_1__material_animation__ = __webpack_require__(5);
+/* harmony import */ var __WEBPACK_IMPORTED_MODULE_2__constants__ = __webpack_require__(73);
+var _extends = Object.assign || function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; };
+
+var _createClass = function () { function defineProperties(target, props) { for (var i = 0; i < props.length; i++) { var descriptor = props[i]; descriptor.enumerable = descriptor.enumerable || false; descriptor.configurable = true; if ("value" in descriptor) descriptor.writable = true; Object.defineProperty(target, descriptor.key, descriptor); } } return function (Constructor, protoProps, staticProps) { if (protoProps) defineProperties(Constructor.prototype, protoProps); if (staticProps) defineProperties(Constructor, staticProps); return Constructor; }; }();
+
+function _classCallCheck(instance, Constructor) { if (!(instance instanceof Constructor)) { throw new TypeError("Cannot call a class as a function"); } }
+
+function _possibleConstructorReturn(self, call) { if (!self) { throw new ReferenceError("this hasn't been initialised - super() hasn't been called"); } return call && (typeof call === "object" || typeof call === "function") ? call : self; }
+
+function _inherits(subClass, superClass) { if (typeof superClass !== "function" && superClass !== null) { throw new TypeError("Super expression must either be null or a function, not " + typeof superClass); } subClass.prototype = Object.create(superClass && superClass.prototype, { constructor: { value: subClass, enumerable: false, writable: true, configurable: true } }); if (superClass) Object.setPrototypeOf ? Object.setPrototypeOf(subClass, superClass) : subClass.__proto__ = superClass; }
+
+/**
+ * Copyright 2017 Google Inc. All Rights Reserved.
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *      http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+
+
+
+
+
+
+var MDCTabBarFoundation = function (_MDCFoundation) {
+  _inherits(MDCTabBarFoundation, _MDCFoundation);
+
+  _createClass(MDCTabBarFoundation, null, [{
+    key: 'cssClasses',
+    get: function get() {
+      return __WEBPACK_IMPORTED_MODULE_2__constants__["a" /* cssClasses */];
+    }
+  }, {
+    key: 'strings',
+    get: function get() {
+      return __WEBPACK_IMPORTED_MODULE_2__constants__["b" /* strings */];
+    }
+  }, {
+    key: 'defaultAdapter',
+    get: function get() {
+      return {
+        addClass: function addClass() /* className: string */{},
+        removeClass: function removeClass() /* className: string */{},
+        bindOnMDCTabSelectedEvent: function bindOnMDCTabSelectedEvent() {},
+        unbindOnMDCTabSelectedEvent: function unbindOnMDCTabSelectedEvent() {},
+        registerResizeHandler: function registerResizeHandler() /* handler: EventListener */{},
+        deregisterResizeHandler: function deregisterResizeHandler() /* handler: EventListener */{},
+        getOffsetWidth: function getOffsetWidth() {
+          return (/* number */0
+          );
+        },
+        setStyleForIndicator: function setStyleForIndicator() /* propertyName: string, value: string */{},
+        getOffsetWidthForIndicator: function getOffsetWidthForIndicator() {
+          return (/* number */0
+          );
+        },
+        notifyChange: function notifyChange() /* evtData: {activeTabIndex: number} */{},
+        getNumberOfTabs: function getNumberOfTabs() {
+          return (/* number */0
+          );
+        },
+        isTabActiveAtIndex: function isTabActiveAtIndex() {
+          return (/* index: number */ /* boolean */false
+          );
+        },
+        setTabActiveAtIndex: function setTabActiveAtIndex() /* index: number, isActive: true */{},
+        isDefaultPreventedOnClickForTabAtIndex: function isDefaultPreventedOnClickForTabAtIndex() {
+          return (/* index: number */ /* boolean */false
+          );
+        },
+        setPreventDefaultOnClickForTabAtIndex: function setPreventDefaultOnClickForTabAtIndex() /* index: number, preventDefaultOnClick: boolean */{},
+        measureTabAtIndex: function measureTabAtIndex() /* index: number */{},
+        getComputedWidthForTabAtIndex: function getComputedWidthForTabAtIndex() {
+          return (/* index: number */ /* number */0
+          );
+        },
+        getComputedLeftForTabAtIndex: function getComputedLeftForTabAtIndex() {
+          return (/* index: number */ /* number */0
+          );
+        }
+      };
+    }
+  }]);
+
+  function MDCTabBarFoundation(adapter) {
+    _classCallCheck(this, MDCTabBarFoundation);
+
+    var _this = _possibleConstructorReturn(this, (MDCTabBarFoundation.__proto__ || Object.getPrototypeOf(MDCTabBarFoundation)).call(this, _extends(MDCTabBarFoundation.defaultAdapter, adapter)));
+
+    _this.isIndicatorShown_ = false;
+    _this.computedWidth_ = 0;
+    _this.computedLeft_ = 0;
+    _this.activeTabIndex_ = 0;
+    _this.layoutFrame_ = 0;
+    _this.resizeHandler_ = function () {
+      return _this.layout();
+    };
+    return _this;
+  }
+
+  _createClass(MDCTabBarFoundation, [{
+    key: 'init',
+    value: function init() {
+      this.adapter_.addClass(__WEBPACK_IMPORTED_MODULE_2__constants__["a" /* cssClasses */].UPGRADED);
+      this.adapter_.bindOnMDCTabSelectedEvent();
+      this.adapter_.registerResizeHandler(this.resizeHandler_);
+      var activeTabIndex = this.findActiveTabIndex_();
+      if (activeTabIndex >= 0) {
+        this.activeTabIndex_ = activeTabIndex;
+      }
+      this.layout();
+    }
+  }, {
+    key: 'destroy',
+    value: function destroy() {
+      this.adapter_.removeClass(__WEBPACK_IMPORTED_MODULE_2__constants__["a" /* cssClasses */].UPGRADED);
+      this.adapter_.unbindOnMDCTabSelectedEvent();
+      this.adapter_.deregisterResizeHandler(this.resizeHandler_);
+    }
+  }, {
+    key: 'layoutInternal_',
+    value: function layoutInternal_() {
+      var _this2 = this;
+
+      this.forEachTabIndex_(function (index) {
+        return _this2.adapter_.measureTabAtIndex(index);
+      });
+      this.computedWidth_ = this.adapter_.getOffsetWidth();
+      this.layoutIndicator_();
+    }
+  }, {
+    key: 'layoutIndicator_',
+    value: function layoutIndicator_() {
+      var isIndicatorFirstRender = !this.isIndicatorShown_;
+
+      // Ensure that indicator appears in the right position immediately for correct first render.
+      if (isIndicatorFirstRender) {
+        this.adapter_.setStyleForIndicator('transition', 'none');
+      }
+
+      var translateAmtForActiveTabLeft = this.adapter_.getComputedLeftForTabAtIndex(this.activeTabIndex_);
+      var scaleAmtForActiveTabWidth = this.adapter_.getComputedWidthForTabAtIndex(this.activeTabIndex_) / this.adapter_.getOffsetWidth();
+
+      var transformValue = 'translateX(' + translateAmtForActiveTabLeft + 'px) scale(' + scaleAmtForActiveTabWidth + ', 1)';
+      this.adapter_.setStyleForIndicator(__webpack_require__.i(__WEBPACK_IMPORTED_MODULE_1__material_animation__["a" /* getCorrectPropertyName */])(window, 'transform'), transformValue);
+
+      if (isIndicatorFirstRender) {
+        // Force layout so that transform styles to take effect.
+        this.adapter_.getOffsetWidthForIndicator();
+        this.adapter_.setStyleForIndicator('transition', '');
+        this.adapter_.setStyleForIndicator('visibility', 'visible');
+        this.isIndicatorShown_ = true;
+      }
+    }
+  }, {
+    key: 'findActiveTabIndex_',
+    value: function findActiveTabIndex_() {
+      var _this3 = this;
+
+      var activeTabIndex = -1;
+      this.forEachTabIndex_(function (index) {
+        if (_this3.adapter_.isTabActiveAtIndex(index)) {
+          activeTabIndex = index;
+          return true;
+        }
+      });
+      return activeTabIndex;
+    }
+  }, {
+    key: 'forEachTabIndex_',
+    value: function forEachTabIndex_(iterator) {
+      var numTabs = this.adapter_.getNumberOfTabs();
+      for (var index = 0; index < numTabs; index++) {
+        var shouldBreak = iterator(index);
+        if (shouldBreak) {
+          break;
+        }
+      }
+    }
+  }, {
+    key: 'layout',
+    value: function layout() {
+      var _this4 = this;
+
+      if (this.layoutFrame_) {
+        cancelAnimationFrame(this.layoutFrame_);
+      }
+
+      this.layoutFrame_ = requestAnimationFrame(function () {
+        _this4.layoutInternal_();
+        _this4.layoutFrame_ = 0;
+      });
+    }
+  }, {
+    key: 'switchToTabAtIndex',
+    value: function switchToTabAtIndex(index, shouldNotify) {
+      var _this5 = this;
+
+      if (index === this.activeTabIndex_) {
+        return;
+      }
+
+      if (index < 0 || index >= this.adapter_.getNumberOfTabs()) {
+        throw new Error('Out of bounds index specified for tab: ' + index);
+      }
+
+      var prevActiveTabIndex = this.activeTabIndex_;
+      this.activeTabIndex_ = index;
+      requestAnimationFrame(function () {
+        if (prevActiveTabIndex >= 0) {
+          _this5.adapter_.setTabActiveAtIndex(prevActiveTabIndex, false);
+        }
+        _this5.adapter_.setTabActiveAtIndex(_this5.activeTabIndex_, true);
+        _this5.layoutIndicator_();
+        if (shouldNotify) {
+          _this5.adapter_.notifyChange({ activeTabIndex: _this5.activeTabIndex_ });
+        }
+      });
+    }
+  }, {
+    key: 'getActiveTabIndex',
+    value: function getActiveTabIndex() {
+      return this.findActiveTabIndex_();
+    }
+  }]);
+
+  return MDCTabBarFoundation;
+}(__WEBPACK_IMPORTED_MODULE_0__material_base_foundation__["a" /* default */]);
+
+/* harmony default export */ __webpack_exports__["a"] = (MDCTabBarFoundation);
+
+/***/ }),
+/* 75 */
+/***/ (function(module, __webpack_exports__, __webpack_require__) {
+
+"use strict";
+/* harmony import */ var __WEBPACK_IMPORTED_MODULE_0__material_base_foundation__ = __webpack_require__(1);
+/* harmony import */ var __WEBPACK_IMPORTED_MODULE_1__constants__ = __webpack_require__(14);
+var _extends = Object.assign || function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; };
+
+var _createClass = function () { function defineProperties(target, props) { for (var i = 0; i < props.length; i++) { var descriptor = props[i]; descriptor.enumerable = descriptor.enumerable || false; descriptor.configurable = true; if ("value" in descriptor) descriptor.writable = true; Object.defineProperty(target, descriptor.key, descriptor); } } return function (Constructor, protoProps, staticProps) { if (protoProps) defineProperties(Constructor.prototype, protoProps); if (staticProps) defineProperties(Constructor, staticProps); return Constructor; }; }();
+
+function _classCallCheck(instance, Constructor) { if (!(instance instanceof Constructor)) { throw new TypeError("Cannot call a class as a function"); } }
+
+function _possibleConstructorReturn(self, call) { if (!self) { throw new ReferenceError("this hasn't been initialised - super() hasn't been called"); } return call && (typeof call === "object" || typeof call === "function") ? call : self; }
+
+function _inherits(subClass, superClass) { if (typeof superClass !== "function" && superClass !== null) { throw new TypeError("Super expression must either be null or a function, not " + typeof superClass); } subClass.prototype = Object.create(superClass && superClass.prototype, { constructor: { value: subClass, enumerable: false, writable: true, configurable: true } }); if (superClass) Object.setPrototypeOf ? Object.setPrototypeOf(subClass, superClass) : subClass.__proto__ = superClass; }
+
+/**
+ * Copyright 2017 Google Inc. All Rights Reserved.
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *      http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+
+
+
+
+var MDCTabFoundation = function (_MDCFoundation) {
+  _inherits(MDCTabFoundation, _MDCFoundation);
+
+  _createClass(MDCTabFoundation, null, [{
+    key: 'cssClasses',
+    get: function get() {
+      return __WEBPACK_IMPORTED_MODULE_1__constants__["a" /* cssClasses */];
+    }
+  }, {
+    key: 'strings',
+    get: function get() {
+      return __WEBPACK_IMPORTED_MODULE_1__constants__["b" /* strings */];
+    }
+  }, {
+    key: 'defaultAdapter',
+    get: function get() {
+      return {
+        addClass: function addClass() /* className: string */{},
+        removeClass: function removeClass() /* className: string */{},
+        registerInteractionHandler: function registerInteractionHandler() /* type: string, handler: EventListener */{},
+        deregisterInteractionHandler: function deregisterInteractionHandler() /* type: string, handler: EventListener */{},
+        getOffsetWidth: function getOffsetWidth() {
+          return (/* number */0
+          );
+        },
+        getOffsetLeft: function getOffsetLeft() {
+          return (/* number */0
+          );
+        },
+        notifySelected: function notifySelected() {}
+      };
+    }
+  }]);
+
+  function MDCTabFoundation() {
+    var adapter = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : {};
+
+    _classCallCheck(this, MDCTabFoundation);
+
+    var _this = _possibleConstructorReturn(this, (MDCTabFoundation.__proto__ || Object.getPrototypeOf(MDCTabFoundation)).call(this, _extends(MDCTabFoundation.defaultAdapter, adapter)));
+
+    _this.computedWidth_ = 0;
+    _this.computedLeft_ = 0;
+    _this.isActive_ = false;
+    _this.preventDefaultOnClick_ = false;
+
+    _this.clickHandler_ = function (evt) {
+      if (_this.preventDefaultOnClick_) {
+        evt.preventDefault();
+      }
+      _this.adapter_.notifySelected();
+    };
+
+    _this.keydownHandler_ = function (evt) {
+      if (evt.key && evt.key === 'Enter' || evt.keyCode === 13) {
+        _this.adapter_.notifySelected();
+      }
+    };
+    return _this;
+  }
+
+  _createClass(MDCTabFoundation, [{
+    key: 'init',
+    value: function init() {
+      this.adapter_.registerInteractionHandler('click', this.clickHandler_);
+      this.adapter_.registerInteractionHandler('keydown', this.keydownHandler_);
+    }
+  }, {
+    key: 'destroy',
+    value: function destroy() {
+      this.adapter_.deregisterInteractionHandler('click', this.clickHandler_);
+      this.adapter_.deregisterInteractionHandler('keydown', this.keydownHandler_);
+    }
+  }, {
+    key: 'getComputedWidth',
+    value: function getComputedWidth() {
+      return this.computedWidth_;
+    }
+  }, {
+    key: 'getComputedLeft',
+    value: function getComputedLeft() {
+      return this.computedLeft_;
+    }
+  }, {
+    key: 'isActive',
+    value: function isActive() {
+      return this.isActive_;
+    }
+  }, {
+    key: 'setActive',
+    value: function setActive(isActive) {
+      this.isActive_ = isActive;
+      if (this.isActive_) {
+        this.adapter_.addClass(__WEBPACK_IMPORTED_MODULE_1__constants__["a" /* cssClasses */].ACTIVE);
+      } else {
+        this.adapter_.removeClass(__WEBPACK_IMPORTED_MODULE_1__constants__["a" /* cssClasses */].ACTIVE);
+      }
+    }
+  }, {
+    key: 'preventsDefaultOnClick',
+    value: function preventsDefaultOnClick() {
+      return this.preventDefaultOnClick_;
+    }
+  }, {
+    key: 'setPreventDefaultOnClick',
+    value: function setPreventDefaultOnClick(preventDefaultOnClick) {
+      this.preventDefaultOnClick_ = preventDefaultOnClick;
+    }
+  }, {
+    key: 'measureSelf',
+    value: function measureSelf() {
+      this.computedWidth_ = this.adapter_.getOffsetWidth();
+      this.computedLeft_ = this.adapter_.getOffsetLeft();
+    }
+  }]);
+
+  return MDCTabFoundation;
+}(__WEBPACK_IMPORTED_MODULE_0__material_base_foundation__["a" /* default */]);
+
+/* harmony default export */ __webpack_exports__["a"] = (MDCTabFoundation);
+
+/***/ }),
+/* 76 */
+/***/ (function(module, __webpack_exports__, __webpack_require__) {
+
+"use strict";
+/* harmony import */ var __WEBPACK_IMPORTED_MODULE_0__material_base__ = __webpack_require__(0);
+/* harmony import */ var __WEBPACK_IMPORTED_MODULE_1__constants__ = __webpack_require__(16);
+var _extends = Object.assign || function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; };
+
+var _createClass = function () { function defineProperties(target, props) { for (var i = 0; i < props.length; i++) { var descriptor = props[i]; descriptor.enumerable = descriptor.enumerable || false; descriptor.configurable = true; if ("value" in descriptor) descriptor.writable = true; Object.defineProperty(target, descriptor.key, descriptor); } } return function (Constructor, protoProps, staticProps) { if (protoProps) defineProperties(Constructor.prototype, protoProps); if (staticProps) defineProperties(Constructor, staticProps); return Constructor; }; }();
+
+function _classCallCheck(instance, Constructor) { if (!(instance instanceof Constructor)) { throw new TypeError("Cannot call a class as a function"); } }
+
+function _possibleConstructorReturn(self, call) { if (!self) { throw new ReferenceError("this hasn't been initialised - super() hasn't been called"); } return call && (typeof call === "object" || typeof call === "function") ? call : self; }
+
+function _inherits(subClass, superClass) { if (typeof superClass !== "function" && superClass !== null) { throw new TypeError("Super expression must either be null or a function, not " + typeof superClass); } subClass.prototype = Object.create(superClass && superClass.prototype, { constructor: { value: subClass, enumerable: false, writable: true, configurable: true } }); if (superClass) Object.setPrototypeOf ? Object.setPrototypeOf(subClass, superClass) : subClass.__proto__ = superClass; }
+
+/**
+ * Copyright 2016 Google Inc. All Rights Reserved.
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *      http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+
+
+
+
+var MDCTextfieldFoundation = function (_MDCFoundation) {
+  _inherits(MDCTextfieldFoundation, _MDCFoundation);
+
+  _createClass(MDCTextfieldFoundation, null, [{
+    key: 'cssClasses',
+    get: function get() {
+      return __WEBPACK_IMPORTED_MODULE_1__constants__["b" /* cssClasses */];
+    }
+  }, {
+    key: 'strings',
+    get: function get() {
+      return __WEBPACK_IMPORTED_MODULE_1__constants__["a" /* strings */];
+    }
+  }, {
+    key: 'defaultAdapter',
+    get: function get() {
+      return {
+        addClass: function addClass() /* className: string */{},
+        removeClass: function removeClass() /* className: string */{},
+        addClassToLabel: function addClassToLabel() /* className: string */{},
+        removeClassFromLabel: function removeClassFromLabel() /* className: string */{},
+        addClassToHelptext: function addClassToHelptext() /* className: string */{},
+        removeClassFromHelptext: function removeClassFromHelptext() /* className: string */{},
+        helptextHasClass: function helptextHasClass() {
+          return (/* className: string */ /* boolean */false
+          );
+        },
+        registerInputFocusHandler: function registerInputFocusHandler() /* handler: EventListener */{},
+        deregisterInputFocusHandler: function deregisterInputFocusHandler() /* handler: EventListener */{},
+        registerInputBlurHandler: function registerInputBlurHandler() /* handler: EventListener */{},
+        deregisterInputBlurHandler: function deregisterInputBlurHandler() /* handler: EventListener */{},
+        registerInputInputHandler: function registerInputInputHandler() /* handler: EventListener */{},
+        deregisterInputInputHandler: function deregisterInputInputHandler() /* handler: EventListener */{},
+        registerInputKeydownHandler: function registerInputKeydownHandler() /* handler: EventListener */{},
+        deregisterInputKeydownHandler: function deregisterInputKeydownHandler() /* handler: EventListener */{},
+        setHelptextAttr: function setHelptextAttr() /* name: string, value: string */{},
+        removeHelptextAttr: function removeHelptextAttr() /* name: string */{},
+        getNativeInput: function getNativeInput() {
+          return (/* HTMLInputElement */{}
+          );
+        }
+      };
+    }
+  }]);
+
+  function MDCTextfieldFoundation() {
+    var adapter = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : {};
+
+    _classCallCheck(this, MDCTextfieldFoundation);
+
+    var _this = _possibleConstructorReturn(this, (MDCTextfieldFoundation.__proto__ || Object.getPrototypeOf(MDCTextfieldFoundation)).call(this, _extends(MDCTextfieldFoundation.defaultAdapter, adapter)));
+
+    _this.receivedUserInput_ = false;
+    _this.inputFocusHandler_ = function () {
+      return _this.activateFocus_();
+    };
+    _this.inputBlurHandler_ = function () {
+      return _this.deactivateFocus_();
+    };
+    _this.inputInputHandler_ = function () {
+      return _this.autoCompleteFocus_();
+    };
+    _this.inputKeydownHandler_ = function () {
+      return _this.receivedUserInput_ = true;
+    };
+    return _this;
+  }
+
+  _createClass(MDCTextfieldFoundation, [{
+    key: 'init',
+    value: function init() {
+      this.adapter_.addClass(MDCTextfieldFoundation.cssClasses.UPGRADED);
+      this.adapter_.registerInputFocusHandler(this.inputFocusHandler_);
+      this.adapter_.registerInputBlurHandler(this.inputBlurHandler_);
+      this.adapter_.registerInputInputHandler(this.inputInputHandler_);
+      this.adapter_.registerInputKeydownHandler(this.inputKeydownHandler_);
+
+      // Ensure label does not collide with any pre-filled value.
+      if (this.getNativeInput_().value) {
+        this.adapter_.addClassToLabel(MDCTextfieldFoundation.cssClasses.LABEL_FLOAT_ABOVE);
+      }
+    }
+  }, {
+    key: 'destroy',
+    value: function destroy() {
+      this.adapter_.removeClass(MDCTextfieldFoundation.cssClasses.UPGRADED);
+      this.adapter_.deregisterInputFocusHandler(this.inputFocusHandler_);
+      this.adapter_.deregisterInputBlurHandler(this.inputBlurHandler_);
+      this.adapter_.deregisterInputInputHandler(this.inputInputHandler_);
+      this.adapter_.deregisterInputKeydownHandler(this.inputKeydownHandler_);
+    }
+  }, {
+    key: 'activateFocus_',
+    value: function activateFocus_() {
+      var _MDCTextfieldFoundati = MDCTextfieldFoundation.cssClasses,
+          FOCUSED = _MDCTextfieldFoundati.FOCUSED,
+          LABEL_FLOAT_ABOVE = _MDCTextfieldFoundati.LABEL_FLOAT_ABOVE;
+
+      this.adapter_.addClass(FOCUSED);
+      this.adapter_.addClassToLabel(LABEL_FLOAT_ABOVE);
+      this.showHelptext_();
+    }
+  }, {
+    key: 'autoCompleteFocus_',
+    value: function autoCompleteFocus_() {
+      if (!this.receivedUserInput_) {
+        this.activateFocus_();
+      }
+    }
+  }, {
+    key: 'showHelptext_',
+    value: function showHelptext_() {
+      var ARIA_HIDDEN = MDCTextfieldFoundation.strings.ARIA_HIDDEN;
+
+      this.adapter_.removeHelptextAttr(ARIA_HIDDEN);
+    }
+  }, {
+    key: 'deactivateFocus_',
+    value: function deactivateFocus_() {
+      var _MDCTextfieldFoundati2 = MDCTextfieldFoundation.cssClasses,
+          FOCUSED = _MDCTextfieldFoundati2.FOCUSED,
+          INVALID = _MDCTextfieldFoundati2.INVALID,
+          LABEL_FLOAT_ABOVE = _MDCTextfieldFoundati2.LABEL_FLOAT_ABOVE;
+
+      var input = this.getNativeInput_();
+      var isValid = input.checkValidity();
+
+      this.adapter_.removeClass(FOCUSED);
+      if (!input.value && !this.isBadInput_()) {
+        this.adapter_.removeClassFromLabel(LABEL_FLOAT_ABOVE);
+        this.receivedUserInput_ = false;
+      }
+      if (isValid) {
+        this.adapter_.removeClass(INVALID);
+      } else {
+        this.adapter_.addClass(INVALID);
+      }
+      this.updateHelptextOnDeactivation_(isValid);
+    }
+  }, {
+    key: 'updateHelptextOnDeactivation_',
+    value: function updateHelptextOnDeactivation_(isValid) {
+      var _MDCTextfieldFoundati3 = MDCTextfieldFoundation.cssClasses,
+          HELPTEXT_PERSISTENT = _MDCTextfieldFoundati3.HELPTEXT_PERSISTENT,
+          HELPTEXT_VALIDATION_MSG = _MDCTextfieldFoundati3.HELPTEXT_VALIDATION_MSG;
+      var ROLE = MDCTextfieldFoundation.strings.ROLE;
+
+      var helptextIsPersistent = this.adapter_.helptextHasClass(HELPTEXT_PERSISTENT);
+      var helptextIsValidationMsg = this.adapter_.helptextHasClass(HELPTEXT_VALIDATION_MSG);
+      var validationMsgNeedsDisplay = helptextIsValidationMsg && !isValid;
+
+      if (validationMsgNeedsDisplay) {
+        this.adapter_.setHelptextAttr(ROLE, 'alert');
+      } else {
+        this.adapter_.removeHelptextAttr(ROLE);
+      }
+
+      if (helptextIsPersistent || validationMsgNeedsDisplay) {
+        return;
+      }
+      this.hideHelptext_();
+    }
+  }, {
+    key: 'hideHelptext_',
+    value: function hideHelptext_() {
+      var ARIA_HIDDEN = MDCTextfieldFoundation.strings.ARIA_HIDDEN;
+
+      this.adapter_.setHelptextAttr(ARIA_HIDDEN, 'true');
+    }
+  }, {
+    key: 'isBadInput_',
+    value: function isBadInput_() {
+      var input = this.getNativeInput_();
+      return input.validity ? input.validity.badInput : input.badInput;
+    }
+  }, {
+    key: 'isDisabled',
+    value: function isDisabled() {
+      return this.getNativeInput_().disabled;
+    }
+  }, {
+    key: 'setDisabled',
+    value: function setDisabled(disabled) {
+      var DISABLED = MDCTextfieldFoundation.cssClasses.DISABLED;
+
+      this.getNativeInput_().disabled = disabled;
+      if (disabled) {
+        this.adapter_.addClass(DISABLED);
+      } else {
+        this.adapter_.removeClass(DISABLED);
+      }
+    }
+  }, {
+    key: 'getNativeInput_',
+    value: function getNativeInput_() {
+      return this.adapter_.getNativeInput() || {
+        checkValidity: function checkValidity() {
+          return true;
+        },
+        value: '',
+        disabled: false,
+        badInput: false
+      };
+    }
+  }]);
+
+  return MDCTextfieldFoundation;
+}(__WEBPACK_IMPORTED_MODULE_0__material_base__["MDCFoundation"]);
+
+/* harmony default export */ __webpack_exports__["a"] = (MDCTextfieldFoundation);
+
+/***/ }),
+/* 77 */
+/***/ (function(module, __webpack_exports__, __webpack_require__) {
+
+"use strict";
+/* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, "a", function() { return cssClasses; });
+/* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, "b", function() { return strings; });
+/* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, "c", function() { return numbers; });
+/**
+ * Copyright 2017 Google Inc. All Rights Reserved.
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *      http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+
+var cssClasses = {
+  FIXED: 'mdc-toolbar--fixed',
+  FIXED_LASTROW: 'mdc-toolbar--fixed-lastrow-only',
+  FIXED_AT_LAST_ROW: 'mdc-toolbar--fixed-at-last-row',
+  TOOLBAR_ROW_FLEXIBLE: 'mdc-toolbar--flexible',
+  FLEXIBLE_DEFAULT_BEHAVIOR: 'mdc-toolbar--flexible-default-behavior',
+  FLEXIBLE_MAX: 'mdc-toolbar--flexible-space-maximized',
+  FLEXIBLE_MIN: 'mdc-toolbar--flexible-space-minimized'
+};
+
+var strings = {
+  TITLE_SELECTOR: '.mdc-toolbar__title',
+  FIRST_ROW_SELECTOR: '.mdc-toolbar__row:first-child',
+  CHANGE_EVENT: 'MDCToolbar:change'
+};
+
+var numbers = {
+  MAX_TITLE_SIZE: 2.125,
+  MIN_TITLE_SIZE: 1.25,
+  TOOLBAR_ROW_HEIGHT: 64,
+  TOOLBAR_ROW_MOBILE_HEIGHT: 56,
+  TOOLBAR_MOBILE_BREAKPOINT: 600
+};
+
+/***/ }),
+/* 78 */
+/***/ (function(module, __webpack_exports__, __webpack_require__) {
+
+"use strict";
+/* harmony import */ var __WEBPACK_IMPORTED_MODULE_0__material_base_foundation__ = __webpack_require__(1);
+/* harmony import */ var __WEBPACK_IMPORTED_MODULE_1__constants__ = __webpack_require__(77);
+var _extends = Object.assign || function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; };
+
+var _createClass = function () { function defineProperties(target, props) { for (var i = 0; i < props.length; i++) { var descriptor = props[i]; descriptor.enumerable = descriptor.enumerable || false; descriptor.configurable = true; if ("value" in descriptor) descriptor.writable = true; Object.defineProperty(target, descriptor.key, descriptor); } } return function (Constructor, protoProps, staticProps) { if (protoProps) defineProperties(Constructor.prototype, protoProps); if (staticProps) defineProperties(Constructor, staticProps); return Constructor; }; }();
+
+function _classCallCheck(instance, Constructor) { if (!(instance instanceof Constructor)) { throw new TypeError("Cannot call a class as a function"); } }
+
+function _possibleConstructorReturn(self, call) { if (!self) { throw new ReferenceError("this hasn't been initialised - super() hasn't been called"); } return call && (typeof call === "object" || typeof call === "function") ? call : self; }
+
+function _inherits(subClass, superClass) { if (typeof superClass !== "function" && superClass !== null) { throw new TypeError("Super expression must either be null or a function, not " + typeof superClass); } subClass.prototype = Object.create(superClass && superClass.prototype, { constructor: { value: subClass, enumerable: false, writable: true, configurable: true } }); if (superClass) Object.setPrototypeOf ? Object.setPrototypeOf(subClass, superClass) : subClass.__proto__ = superClass; }
+
+/**
+ * Copyright 2017 Google Inc. All Rights Reserved.
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *      http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+
+
+
+var MDCToolbarFoundation = function (_MDCFoundation) {
+  _inherits(MDCToolbarFoundation, _MDCFoundation);
+
+  _createClass(MDCToolbarFoundation, null, [{
+    key: 'cssClasses',
+    get: function get() {
+      return __WEBPACK_IMPORTED_MODULE_1__constants__["a" /* cssClasses */];
+    }
+  }, {
+    key: 'strings',
+    get: function get() {
+      return __WEBPACK_IMPORTED_MODULE_1__constants__["b" /* strings */];
+    }
+  }, {
+    key: 'numbers',
+    get: function get() {
+      return __WEBPACK_IMPORTED_MODULE_1__constants__["c" /* numbers */];
+    }
+  }, {
+    key: 'defaultAdapter',
+    get: function get() {
+      return {
+        hasClass: function hasClass() {
+          return (/* className: string */ /* boolean */false
+          );
+        },
+        addClass: function addClass() /* className: string */{},
+        removeClass: function removeClass() /* className: string */{},
+        registerScrollHandler: function registerScrollHandler() /* handler: EventListener */{},
+        deregisterScrollHandler: function deregisterScrollHandler() /* handler: EventListener */{},
+        registerResizeHandler: function registerResizeHandler() /* handler: EventListener */{},
+        deregisterResizeHandler: function deregisterResizeHandler() /* handler: EventListener */{},
+        getViewportWidth: function getViewportWidth() {
+          return (/* number */0
+          );
+        },
+        getViewportScrollY: function getViewportScrollY() {
+          return (/* number */0
+          );
+        },
+        getOffsetHeight: function getOffsetHeight() {
+          return (/* number */0
+          );
+        },
+        getFirstRowElementOffsetHeight: function getFirstRowElementOffsetHeight() {
+          return (/* number */0
+          );
+        },
+        notifyChange: function notifyChange() /* evtData: {flexibleExpansionRatio: number} */{},
+        setStyle: function setStyle() /* property: string, value: string */{},
+        setStyleForTitleElement: function setStyleForTitleElement() /* property: string, value: string */{},
+        setStyleForFlexibleRowElement: function setStyleForFlexibleRowElement() /* property: string, value: string */{},
+        setStyleForFixedAdjustElement: function setStyleForFixedAdjustElement() /* property: string, value: string */{}
+      };
+    }
+  }]);
+
+  function MDCToolbarFoundation(adapter) {
+    _classCallCheck(this, MDCToolbarFoundation);
+
+    var _this = _possibleConstructorReturn(this, (MDCToolbarFoundation.__proto__ || Object.getPrototypeOf(MDCToolbarFoundation)).call(this, _extends(MDCToolbarFoundation.defaultAdapter, adapter)));
+
+    _this.resizeHandler_ = function () {
+      return _this.checkRowHeight_();
+    };
+    _this.scrollHandler_ = function () {
+      return _this.updateToolbarStyles_();
+    };
+    _this.checkRowHeightFrame_ = 0;
+    _this.scrollFrame_ = 0;
+    _this.executedLastChange_ = false;
+
+    _this.calculations_ = {
+      toolbarRowHeight: 0,
+      // Calculated Height ratio. We use ratio to calculate corresponding heights in resize event.
+      toolbarRatio: 0, // The ratio of toolbar height to row height
+      flexibleExpansionRatio: 0, // The ratio of flexible space height to row height
+      maxTranslateYRatio: 0, // The ratio of max toolbar move up distance to row height
+      scrollThresholdRatio: 0, // The ratio of max scrollTop that we should listen to to row height
+      // Derived Heights based on the above key ratios.
+      toolbarHeight: 0,
+      flexibleExpansionHeight: 0, // Flexible row minus toolbar height (derived)
+      maxTranslateYDistance: 0, // When toolbar only fix last row (derived)
+      scrollThreshold: 0
+    };
+    // Toolbar fixed behavior
+    // If toolbar is fixed
+    _this.fixed_ = false;
+    // If fixed is targeted only at the last row
+    _this.fixedLastrow_ = false;
+    // Toolbar flexible behavior
+    // If the first row is flexible
+    _this.hasFlexibleRow_ = false;
+    // If use the default behavior
+    _this.useFlexDefaultBehavior_ = false;
+    return _this;
+  }
+
+  _createClass(MDCToolbarFoundation, [{
+    key: 'init',
+    value: function init() {
+      this.fixed_ = this.adapter_.hasClass(MDCToolbarFoundation.cssClasses.FIXED);
+      this.fixedLastrow_ = this.adapter_.hasClass(MDCToolbarFoundation.cssClasses.FIXED_LASTROW) & this.fixed_;
+      this.hasFlexibleRow_ = this.adapter_.hasClass(MDCToolbarFoundation.cssClasses.TOOLBAR_ROW_FLEXIBLE);
+      if (this.hasFlexibleRow_) {
+        this.useFlexDefaultBehavior_ = this.adapter_.hasClass(MDCToolbarFoundation.cssClasses.FLEXIBLE_DEFAULT_BEHAVIOR);
+      }
+      this.initKeyRatio_();
+      this.setKeyHeights_();
+      this.adapter_.registerResizeHandler(this.resizeHandler_);
+      this.adapter_.registerScrollHandler(this.scrollHandler_);
+    }
+  }, {
+    key: 'destroy',
+    value: function destroy() {
+      this.adapter_.deregisterResizeHandler(this.resizeHandler_);
+      this.adapter_.deregisterScrollHandler(this.scrollHandler_);
+    }
+  }, {
+    key: 'updateAdjustElementStyles',
+    value: function updateAdjustElementStyles() {
+      if (this.fixed_) {
+        this.adapter_.setStyleForFixedAdjustElement('margin-top', this.calculations_.toolbarHeight + 'px');
+      }
+    }
+  }, {
+    key: 'getFlexibleExpansionRatio_',
+    value: function getFlexibleExpansionRatio_(scrollTop) {
+      // To prevent division by zero when there is no flexibleExpansionHeight
+      var delta = 0.0001;
+      return Math.max(0, 1 - scrollTop / (this.calculations_.flexibleExpansionHeight + delta));
+    }
+  }, {
+    key: 'checkRowHeight_',
+    value: function checkRowHeight_() {
+      var _this2 = this;
+
+      cancelAnimationFrame(this.checkRowHeightFrame_);
+      this.checkRowHeightFrame_ = requestAnimationFrame(function () {
+        return _this2.setKeyHeights_();
+      });
+    }
+  }, {
+    key: 'setKeyHeights_',
+    value: function setKeyHeights_() {
+      var newToolbarRowHeight = this.getRowHeight_();
+      if (newToolbarRowHeight !== this.calculations_.toolbarRowHeight) {
+        this.calculations_.toolbarRowHeight = newToolbarRowHeight;
+        this.calculations_.toolbarHeight = this.calculations_.toolbarRatio * this.calculations_.toolbarRowHeight;
+        this.calculations_.flexibleExpansionHeight = this.calculations_.flexibleExpansionRatio * this.calculations_.toolbarRowHeight;
+        this.calculations_.maxTranslateYDistance = this.calculations_.maxTranslateYRatio * this.calculations_.toolbarRowHeight;
+        this.calculations_.scrollThreshold = this.calculations_.scrollThresholdRatio * this.calculations_.toolbarRowHeight;
+        this.updateAdjustElementStyles();
+        this.updateToolbarStyles_();
+      }
+    }
+  }, {
+    key: 'updateToolbarStyles_',
+    value: function updateToolbarStyles_() {
+      var _this3 = this;
+
+      cancelAnimationFrame(this.scrollFrame_);
+      this.scrollFrame_ = requestAnimationFrame(function () {
+        var scrollTop = _this3.adapter_.getViewportScrollY();
+        var hasScrolledOutOfThreshold = _this3.scrolledOutOfThreshold_(scrollTop);
+
+        if (hasScrolledOutOfThreshold && _this3.executedLastChange_) {
+          return;
+        }
+
+        var flexibleExpansionRatio = _this3.getFlexibleExpansionRatio_(scrollTop);
+
+        _this3.updateToolbarFlexibleState_(flexibleExpansionRatio);
+        if (_this3.fixedLastrow_) {
+          _this3.updateToolbarFixedState_(scrollTop);
+        }
+        if (_this3.hasFlexibleRow_) {
+          _this3.updateFlexibleRowElementStyles_(flexibleExpansionRatio);
+        }
+        _this3.executedLastChange_ = hasScrolledOutOfThreshold;
+        _this3.adapter_.notifyChange({ flexibleExpansionRatio: flexibleExpansionRatio });
+      });
+    }
+  }, {
+    key: 'scrolledOutOfThreshold_',
+    value: function scrolledOutOfThreshold_(scrollTop) {
+      return scrollTop > this.calculations_.scrollThreshold;
+    }
+  }, {
+    key: 'initKeyRatio_',
+    value: function initKeyRatio_() {
+      var toolbarRowHeight = this.getRowHeight_();
+      var firstRowMaxRatio = this.adapter_.getFirstRowElementOffsetHeight() / toolbarRowHeight;
+      this.calculations_.toolbarRatio = this.adapter_.getOffsetHeight() / toolbarRowHeight;
+      this.calculations_.flexibleExpansionRatio = firstRowMaxRatio - 1;
+      this.calculations_.maxTranslateYRatio = this.fixedLastrow_ ? this.calculations_.toolbarRatio - firstRowMaxRatio : 0;
+      this.calculations_.scrollThresholdRatio = (this.fixedLastrow_ ? this.calculations_.toolbarRatio : firstRowMaxRatio) - 1;
+    }
+  }, {
+    key: 'getRowHeight_',
+    value: function getRowHeight_() {
+      var breakpoint = MDCToolbarFoundation.numbers.TOOLBAR_MOBILE_BREAKPOINT;
+      return this.adapter_.getViewportWidth() < breakpoint ? MDCToolbarFoundation.numbers.TOOLBAR_ROW_MOBILE_HEIGHT : MDCToolbarFoundation.numbers.TOOLBAR_ROW_HEIGHT;
+    }
+  }, {
+    key: 'updateToolbarFlexibleState_',
+    value: function updateToolbarFlexibleState_(flexibleExpansionRatio) {
+      this.adapter_.removeClass(MDCToolbarFoundation.cssClasses.FLEXIBLE_MAX);
+      this.adapter_.removeClass(MDCToolbarFoundation.cssClasses.FLEXIBLE_MIN);
+      if (flexibleExpansionRatio === 1) {
+        this.adapter_.addClass(MDCToolbarFoundation.cssClasses.FLEXIBLE_MAX);
+      } else if (flexibleExpansionRatio === 0) {
+        this.adapter_.addClass(MDCToolbarFoundation.cssClasses.FLEXIBLE_MIN);
+      }
+    }
+  }, {
+    key: 'updateToolbarFixedState_',
+    value: function updateToolbarFixedState_(scrollTop) {
+      var translateDistance = Math.max(0, Math.min(scrollTop - this.calculations_.flexibleExpansionHeight, this.calculations_.maxTranslateYDistance));
+      this.adapter_.setStyle('transform', 'translateY(' + -translateDistance + 'px)');
+
+      if (translateDistance === this.calculations_.maxTranslateYDistance) {
+        this.adapter_.addClass(MDCToolbarFoundation.cssClasses.FIXED_AT_LAST_ROW);
+      } else {
+        this.adapter_.removeClass(MDCToolbarFoundation.cssClasses.FIXED_AT_LAST_ROW);
+      }
+    }
+  }, {
+    key: 'updateFlexibleRowElementStyles_',
+    value: function updateFlexibleRowElementStyles_(flexibleExpansionRatio) {
+      if (this.fixed_) {
+        var height = this.calculations_.flexibleExpansionHeight * flexibleExpansionRatio;
+        this.adapter_.setStyleForFlexibleRowElement('height', height + this.calculations_.toolbarRowHeight + 'px');
+      }
+      if (this.useFlexDefaultBehavior_) {
+        this.updateElementStylesDefaultBehavior_(flexibleExpansionRatio);
+      }
+    }
+  }, {
+    key: 'updateElementStylesDefaultBehavior_',
+    value: function updateElementStylesDefaultBehavior_(flexibleExpansionRatio) {
+      var maxTitleSize = MDCToolbarFoundation.numbers.MAX_TITLE_SIZE;
+      var minTitleSize = MDCToolbarFoundation.numbers.MIN_TITLE_SIZE;
+      var currentTitleSize = (maxTitleSize - minTitleSize) * flexibleExpansionRatio + minTitleSize;
+
+      this.adapter_.setStyleForTitleElement('font-size', currentTitleSize + 'rem');
+    }
+  }]);
+
+  return MDCToolbarFoundation;
+}(__WEBPACK_IMPORTED_MODULE_0__material_base_foundation__["a" /* default */]);
+
+/* harmony default export */ __webpack_exports__["a"] = (MDCToolbarFoundation);
+
+/***/ }),
+/* 79 */
+/***/ (function(module, __webpack_exports__, __webpack_require__) {
+
+"use strict";
+Object.defineProperty(__webpack_exports__, "__esModule", { value: true });
+/* harmony export (immutable) */ __webpack_exports__["applyPassive"] = applyPassive;
+/**
+ * Copyright 2016 Google Inc. All Rights Reserved.
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *      http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+
+var supportsPassive_ = void 0;
+
+// Determine whether the current browser supports passive event listeners, and if so, use them.
+function applyPassive() {
+  var globalObj = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : window;
+  var forceRefresh = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : false;
+
+  if (supportsPassive_ === undefined || forceRefresh) {
+    var isSupported = false;
+    try {
+      globalObj.document.addEventListener('test', null, { get passive() {
+          isSupported = true;
+        } });
+    } catch (e) {}
+
+    supportsPassive_ = isSupported;
+  }
+
+  return supportsPassive_ ? { passive: true } : false;
+}
+
+/***/ }),
+/* 80 */
+/***/ (function(module, exports, __webpack_require__) {
+
+var tabbable = __webpack_require__(81);
+
+var listeningFocusTrap = null;
+
+function focusTrap(element, userOptions) {
+  var tabbableNodes = [];
+  var nodeFocusedBeforeActivation = null;
+  var active = false;
+  var paused = false;
+
+  var container = (typeof element === 'string')
+    ? document.querySelector(element)
+    : element;
+
+  var config = userOptions || {};
+  config.returnFocusOnDeactivate = (userOptions && userOptions.returnFocusOnDeactivate !== undefined)
+    ? userOptions.returnFocusOnDeactivate
+    : true;
+  config.escapeDeactivates = (userOptions && userOptions.escapeDeactivates !== undefined)
+    ? userOptions.escapeDeactivates
+    : true;
+
+  var trap = {
+    activate: activate,
+    deactivate: deactivate,
+    pause: pause,
+    unpause: unpause,
+  };
+
+  return trap;
+
+  function activate(activateOptions) {
+    if (active) return;
+
+    var defaultedActivateOptions = {
+      onActivate: (activateOptions && activateOptions.onActivate !== undefined)
+        ? activateOptions.onActivate
+        : config.onActivate,
+    };
+
+    active = true;
+    paused = false;
+    nodeFocusedBeforeActivation = document.activeElement;
+
+    if (defaultedActivateOptions.onActivate) {
+      defaultedActivateOptions.onActivate();
+    }
+
+    addListeners();
+    return trap;
+  }
+
+  function deactivate(deactivateOptions) {
+    if (!active) return;
+
+    var defaultedDeactivateOptions = {
+      returnFocus: (deactivateOptions && deactivateOptions.returnFocus !== undefined)
+        ? deactivateOptions.returnFocus
+        : config.returnFocusOnDeactivate,
+      onDeactivate: (deactivateOptions && deactivateOptions.onDeactivate !== undefined)
+        ? deactivateOptions.onDeactivate
+        : config.onDeactivate,
+    };
+
+    removeListeners();
+
+    if (defaultedDeactivateOptions.onDeactivate) {
+      defaultedDeactivateOptions.onDeactivate();
+    }
+
+    if (defaultedDeactivateOptions.returnFocus) {
+      setTimeout(function () {
+        tryFocus(nodeFocusedBeforeActivation);
+      }, 0);
+    }
+
+    active = false;
+    paused = false;
+    return this;
+  }
+
+  function pause() {
+    if (paused || !active) return;
+    paused = true;
+    removeListeners();
+  }
+
+  function unpause() {
+    if (!paused || !active) return;
+    paused = false;
+    addListeners();
+  }
+
+  function addListeners() {
+    if (!active) return;
+
+    // There can be only one listening focus trap at a time
+    if (listeningFocusTrap) {
+      listeningFocusTrap.pause();
+    }
+    listeningFocusTrap = trap;
+
+    updateTabbableNodes();
+    tryFocus(firstFocusNode());
+    document.addEventListener('focus', checkFocus, true);
+    document.addEventListener('click', checkClick, true);
+    document.addEventListener('mousedown', checkPointerDown, true);
+    document.addEventListener('touchstart', checkPointerDown, true);
+    document.addEventListener('keydown', checkKey, true);
+
+    return trap;
+  }
+
+  function removeListeners() {
+    if (!active || listeningFocusTrap !== trap) return;
+
+    document.removeEventListener('focus', checkFocus, true);
+    document.removeEventListener('click', checkClick, true);
+    document.removeEventListener('mousedown', checkPointerDown, true);
+    document.removeEventListener('touchstart', checkPointerDown, true);
+    document.removeEventListener('keydown', checkKey, true);
+
+    listeningFocusTrap = null;
+
+    return trap;
+  }
+
+  function getNodeForOption(optionName) {
+    var optionValue = config[optionName];
+    var node = optionValue;
+    if (!optionValue) {
+      return null;
+    }
+    if (typeof optionValue === 'string') {
+      node = document.querySelector(optionValue);
+      if (!node) {
+        throw new Error('`' + optionName + '` refers to no known node');
+      }
+    }
+    if (typeof optionValue === 'function') {
+      node = optionValue();
+      if (!node) {
+        throw new Error('`' + optionName + '` did not return a node');
+      }
+    }
+    return node;
+  }
+
+  function firstFocusNode() {
+    var node;
+    if (getNodeForOption('initialFocus') !== null) {
+      node = getNodeForOption('initialFocus');
+    } else if (container.contains(document.activeElement)) {
+      node = document.activeElement;
+    } else {
+      node = tabbableNodes[0] || getNodeForOption('fallbackFocus');
+    }
+
+    if (!node) {
+      throw new Error('You can\'t have a focus-trap without at least one focusable element');
+    }
+
+    return node;
+  }
+
+  // This needs to be done on mousedown and touchstart instead of click
+  // so that it precedes the focus event
+  function checkPointerDown(e) {
+    if (config.clickOutsideDeactivates && !container.contains(e.target)) {
+      deactivate({ returnFocus: false });
+    }
+  }
+
+  function checkClick(e) {
+    if (config.clickOutsideDeactivates) return;
+    if (container.contains(e.target)) return;
+    e.preventDefault();
+    e.stopImmediatePropagation();
+  }
+
+  function checkFocus(e) {
+    if (container.contains(e.target)) return;
+    e.preventDefault();
+    e.stopImmediatePropagation();
+    // Checking for a blur method here resolves a Firefox issue (#15)
+    if (typeof e.target.blur === 'function') e.target.blur();
+  }
+
+  function checkKey(e) {
+    if (e.key === 'Tab' || e.keyCode === 9) {
+      handleTab(e);
+    }
+
+    if (config.escapeDeactivates !== false && isEscapeEvent(e)) {
+      deactivate();
+    }
+  }
+
+  function handleTab(e) {
+    e.preventDefault();
+    updateTabbableNodes();
+    var currentFocusIndex = tabbableNodes.indexOf(e.target);
+    var lastTabbableNode = tabbableNodes[tabbableNodes.length - 1];
+    var firstTabbableNode = tabbableNodes[0];
+
+    if (e.shiftKey) {
+      if (e.target === firstTabbableNode || tabbableNodes.indexOf(e.target) === -1) {
+        return tryFocus(lastTabbableNode);
+      }
+      return tryFocus(tabbableNodes[currentFocusIndex - 1]);
+    }
+
+    if (e.target === lastTabbableNode) return tryFocus(firstTabbableNode);
+
+    tryFocus(tabbableNodes[currentFocusIndex + 1]);
+  }
+
+  function updateTabbableNodes() {
+    tabbableNodes = tabbable(container);
+  }
+}
+
+function isEscapeEvent(e) {
+  return e.key === 'Escape' || e.key === 'Esc' || e.keyCode === 27;
+}
+
+function tryFocus(node) {
+  if (!node || !node.focus) return;
+  node.focus();
+  if (node.tagName.toLowerCase() === 'input') {
+    node.select();
+  }
+}
+
+module.exports = focusTrap;
+
+
+/***/ }),
+/* 81 */
+/***/ (function(module, exports) {
+
+module.exports = function(el) {
+  var basicTabbables = [];
+  var orderedTabbables = [];
+
+  // A node is "available" if
+  // - it's computed style
+  var isUnavailable = createIsUnavailable();
+
+  var candidateSelectors = [
+    'input',
+    'select',
+    'a[href]',
+    'textarea',
+    'button',
+    '[tabindex]',
+  ];
+
+  var candidates = el.querySelectorAll(candidateSelectors);
+
+  var candidate, candidateIndex;
+  for (var i = 0, l = candidates.length; i < l; i++) {
+    candidate = candidates[i];
+    candidateIndex = parseInt(candidate.getAttribute('tabindex'), 10) || candidate.tabIndex;
+
+    if (
+      candidateIndex < 0
+      || (candidate.tagName === 'INPUT' && candidate.type === 'hidden')
+      || candidate.disabled
+      || isUnavailable(candidate)
+    ) {
+      continue;
+    }
+
+    if (candidateIndex === 0) {
+      basicTabbables.push(candidate);
+    } else {
+      orderedTabbables.push({
+        tabIndex: candidateIndex,
+        node: candidate,
+      });
+    }
+  }
+
+  var tabbableNodes = orderedTabbables
+    .sort(function(a, b) {
+      return a.tabIndex - b.tabIndex;
+    })
+    .map(function(a) {
+      return a.node
+    });
+
+  Array.prototype.push.apply(tabbableNodes, basicTabbables);
+
+  return tabbableNodes;
+}
+
+function createIsUnavailable() {
+  // Node cache must be refreshed on every check, in case
+  // the content of the element has changed
+  var isOffCache = [];
+
+  // "off" means `display: none;`, as opposed to "hidden",
+  // which means `visibility: hidden;`. getComputedStyle
+  // accurately reflects visiblity in context but not
+  // "off" state, so we need to recursively check parents.
+
+  function isOff(node, nodeComputedStyle) {
+    if (node === document.documentElement) return false;
+
+    // Find the cached node (Array.prototype.find not available in IE9)
+    for (var i = 0, length = isOffCache.length; i < length; i++) {
+      if (isOffCache[i][0] === node) return isOffCache[i][1];
+    }
+
+    nodeComputedStyle = nodeComputedStyle || window.getComputedStyle(node);
+
+    var result = false;
+
+    if (nodeComputedStyle.display === 'none') {
+      result = true;
+    } else if (node.parentNode) {
+      result = isOff(node.parentNode);
+    }
+
+    isOffCache.push([node, result]);
+
+    return result;
+  }
+
+  return function isUnavailable(node) {
+    if (node === document.documentElement) return false;
+
+    var computedStyle = window.getComputedStyle(node);
+
+    if (isOff(node, computedStyle)) return true;
+
+    return computedStyle.visibility === 'hidden';
+  }
+}
+
+
+/***/ })
+/******/ ]);
+});

+ 20 - 0
support/client/lib/vwf/view/lib/mdc/dist/mdc.animation.css

@@ -0,0 +1,20 @@
+/*!
+ Material Components for the web
+ Copyright (c) 2017 Google Inc.
+ License: Apache-2.0
+*/
+.mdc-animation-deceleration-curve {
+  -webkit-animation-timing-function: cubic-bezier(0, 0, 0.2, 1);
+          animation-timing-function: cubic-bezier(0, 0, 0.2, 1); }
+
+.mdc-animation-standard-curve {
+  -webkit-animation-timing-function: cubic-bezier(0.4, 0, 0.2, 1);
+          animation-timing-function: cubic-bezier(0.4, 0, 0.2, 1); }
+
+.mdc-animation-acceleration-curve {
+  -webkit-animation-timing-function: cubic-bezier(0.4, 0, 1, 1);
+          animation-timing-function: cubic-bezier(0.4, 0, 1, 1); }
+
+.mdc-animation-sharp-curve {
+  -webkit-animation-timing-function: cubic-bezier(0.4, 0, 0.6, 1);
+          animation-timing-function: cubic-bezier(0.4, 0, 0.6, 1); }

+ 82 - 0
support/client/lib/vwf/view/lib/mdc/dist/mdc.animation.css-entry

@@ -0,0 +1,82 @@
+/*!
+ Material Components for the web
+ Copyright (c) 2017 Google Inc.
+ License: Apache-2.0
+*/
+/******/ (function(modules) { // webpackBootstrap
+/******/ 	// The module cache
+/******/ 	var installedModules = {};
+/******/
+/******/ 	// The require function
+/******/ 	function __webpack_require__(moduleId) {
+/******/
+/******/ 		// Check if module is in cache
+/******/ 		if(installedModules[moduleId]) {
+/******/ 			return installedModules[moduleId].exports;
+/******/ 		}
+/******/ 		// Create a new module (and put it into the cache)
+/******/ 		var module = installedModules[moduleId] = {
+/******/ 			i: moduleId,
+/******/ 			l: false,
+/******/ 			exports: {}
+/******/ 		};
+/******/
+/******/ 		// Execute the module function
+/******/ 		modules[moduleId].call(module.exports, module, module.exports, __webpack_require__);
+/******/
+/******/ 		// Flag the module as loaded
+/******/ 		module.l = true;
+/******/
+/******/ 		// Return the exports of the module
+/******/ 		return module.exports;
+/******/ 	}
+/******/
+/******/
+/******/ 	// expose the modules object (__webpack_modules__)
+/******/ 	__webpack_require__.m = modules;
+/******/
+/******/ 	// expose the module cache
+/******/ 	__webpack_require__.c = installedModules;
+/******/
+/******/ 	// identity function for calling harmony imports with the correct context
+/******/ 	__webpack_require__.i = function(value) { return value; };
+/******/
+/******/ 	// define getter function for harmony exports
+/******/ 	__webpack_require__.d = function(exports, name, getter) {
+/******/ 		if(!__webpack_require__.o(exports, name)) {
+/******/ 			Object.defineProperty(exports, name, {
+/******/ 				configurable: false,
+/******/ 				enumerable: true,
+/******/ 				get: getter
+/******/ 			});
+/******/ 		}
+/******/ 	};
+/******/
+/******/ 	// getDefaultExport function for compatibility with non-harmony modules
+/******/ 	__webpack_require__.n = function(module) {
+/******/ 		var getter = module && module.__esModule ?
+/******/ 			function getDefault() { return module['default']; } :
+/******/ 			function getModuleExports() { return module; };
+/******/ 		__webpack_require__.d(getter, 'a', getter);
+/******/ 		return getter;
+/******/ 	};
+/******/
+/******/ 	// Object.prototype.hasOwnProperty.call
+/******/ 	__webpack_require__.o = function(object, property) { return Object.prototype.hasOwnProperty.call(object, property); };
+/******/
+/******/ 	// __webpack_public_path__
+/******/ 	__webpack_require__.p = "/assets/";
+/******/
+/******/ 	// Load entry module and return exports
+/******/ 	return __webpack_require__(__webpack_require__.s = 1);
+/******/ })
+/************************************************************************/
+/******/ ([
+/* 0 */,
+/* 1 */
+/***/ (function(module, exports) {
+
+// removed by extract-text-webpack-plugin
+
+/***/ })
+/******/ ]);

+ 243 - 0
support/client/lib/vwf/view/lib/mdc/dist/mdc.animation.js

@@ -0,0 +1,243 @@
+/*!
+ Material Components for the web
+ Copyright (c) 2017 Google Inc.
+ License: Apache-2.0
+*/
+(function webpackUniversalModuleDefinition(root, factory) {
+	if(typeof exports === 'object' && typeof module === 'object')
+		module.exports = factory();
+	else if(typeof define === 'function' && define.amd)
+		define([], factory);
+	else if(typeof exports === 'object')
+		exports["animation"] = factory();
+	else
+		root["mdc"] = root["mdc"] || {}, root["mdc"]["animation"] = factory();
+})(this, function() {
+return /******/ (function(modules) { // webpackBootstrap
+/******/ 	// The module cache
+/******/ 	var installedModules = {};
+/******/
+/******/ 	// The require function
+/******/ 	function __webpack_require__(moduleId) {
+/******/
+/******/ 		// Check if module is in cache
+/******/ 		if(installedModules[moduleId]) {
+/******/ 			return installedModules[moduleId].exports;
+/******/ 		}
+/******/ 		// Create a new module (and put it into the cache)
+/******/ 		var module = installedModules[moduleId] = {
+/******/ 			i: moduleId,
+/******/ 			l: false,
+/******/ 			exports: {}
+/******/ 		};
+/******/
+/******/ 		// Execute the module function
+/******/ 		modules[moduleId].call(module.exports, module, module.exports, __webpack_require__);
+/******/
+/******/ 		// Flag the module as loaded
+/******/ 		module.l = true;
+/******/
+/******/ 		// Return the exports of the module
+/******/ 		return module.exports;
+/******/ 	}
+/******/
+/******/
+/******/ 	// expose the modules object (__webpack_modules__)
+/******/ 	__webpack_require__.m = modules;
+/******/
+/******/ 	// expose the module cache
+/******/ 	__webpack_require__.c = installedModules;
+/******/
+/******/ 	// identity function for calling harmony imports with the correct context
+/******/ 	__webpack_require__.i = function(value) { return value; };
+/******/
+/******/ 	// define getter function for harmony exports
+/******/ 	__webpack_require__.d = function(exports, name, getter) {
+/******/ 		if(!__webpack_require__.o(exports, name)) {
+/******/ 			Object.defineProperty(exports, name, {
+/******/ 				configurable: false,
+/******/ 				enumerable: true,
+/******/ 				get: getter
+/******/ 			});
+/******/ 		}
+/******/ 	};
+/******/
+/******/ 	// getDefaultExport function for compatibility with non-harmony modules
+/******/ 	__webpack_require__.n = function(module) {
+/******/ 		var getter = module && module.__esModule ?
+/******/ 			function getDefault() { return module['default']; } :
+/******/ 			function getModuleExports() { return module; };
+/******/ 		__webpack_require__.d(getter, 'a', getter);
+/******/ 		return getter;
+/******/ 	};
+/******/
+/******/ 	// Object.prototype.hasOwnProperty.call
+/******/ 	__webpack_require__.o = function(object, property) { return Object.prototype.hasOwnProperty.call(object, property); };
+/******/
+/******/ 	// __webpack_public_path__
+/******/ 	__webpack_require__.p = "/assets/";
+/******/
+/******/ 	// Load entry module and return exports
+/******/ 	return __webpack_require__(__webpack_require__.s = 81);
+/******/ })
+/************************************************************************/
+/******/ ({
+
+/***/ 81:
+/***/ (function(module, exports, __webpack_require__) {
+
+module.exports = __webpack_require__(9);
+
+
+/***/ }),
+
+/***/ 9:
+/***/ (function(module, __webpack_exports__, __webpack_require__) {
+
+"use strict";
+Object.defineProperty(__webpack_exports__, "__esModule", { value: true });
+/* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, "transformStyleProperties", function() { return transformStyleProperties; });
+/* harmony export (immutable) */ __webpack_exports__["getCorrectEventName"] = getCorrectEventName;
+/* harmony export (immutable) */ __webpack_exports__["getCorrectPropertyName"] = getCorrectPropertyName;
+/**
+ * Copyright 2016 Google Inc. All Rights Reserved.
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *      http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+
+/**
+ * @typedef {{
+ *   noPrefix: string,
+ *   webkitPrefix: string
+ * }}
+ */
+var VendorPropertyMapType = void 0;
+
+/** @const {Object<string, !VendorPropertyMapType>} */
+var eventTypeMap = {
+  'animationstart': {
+    noPrefix: 'animationstart',
+    webkitPrefix: 'webkitAnimationStart',
+    styleProperty: 'animation'
+  },
+  'animationend': {
+    noPrefix: 'animationend',
+    webkitPrefix: 'webkitAnimationEnd',
+    styleProperty: 'animation'
+  },
+  'animationiteration': {
+    noPrefix: 'animationiteration',
+    webkitPrefix: 'webkitAnimationIteration',
+    styleProperty: 'animation'
+  },
+  'transitionend': {
+    noPrefix: 'transitionend',
+    webkitPrefix: 'webkitTransitionEnd',
+    styleProperty: 'transition'
+  }
+};
+
+/** @const {Object<string, !VendorPropertyMapType>} */
+var cssPropertyMap = {
+  'animation': {
+    noPrefix: 'animation',
+    webkitPrefix: '-webkit-animation'
+  },
+  'transform': {
+    noPrefix: 'transform',
+    webkitPrefix: '-webkit-transform'
+  },
+  'transition': {
+    noPrefix: 'transition',
+    webkitPrefix: '-webkit-transition'
+  }
+};
+
+/**
+ * @param {!Object} windowObj
+ * @return {boolean}
+ */
+function hasProperShape(windowObj) {
+  return windowObj['document'] !== undefined && typeof windowObj['document']['createElement'] === 'function';
+}
+
+/**
+ * @param {string} eventType
+ * @return {boolean}
+ */
+function eventFoundInMaps(eventType) {
+  return eventType in eventTypeMap || eventType in cssPropertyMap;
+}
+
+/**
+ * @param {string} eventType
+ * @param {!Object<string, !VendorPropertyMapType>} map
+ * @param {!Element} el
+ * @return {string}
+ */
+function getJavaScriptEventName(eventType, map, el) {
+  return map[eventType].styleProperty in el.style ? map[eventType].noPrefix : map[eventType].webkitPrefix;
+}
+
+/**
+ * Helper function to determine browser prefix for CSS3 animation events
+ * and property names.
+ * @param {!Object} windowObj
+ * @param {string} eventType
+ * @return {string}
+ */
+function getAnimationName(windowObj, eventType) {
+  if (!hasProperShape(windowObj) || !eventFoundInMaps(eventType)) {
+    return eventType;
+  }
+
+  var map = /** @type {!Object<string, !VendorPropertyMapType>} */eventType in eventTypeMap ? eventTypeMap : cssPropertyMap;
+  var el = windowObj['document']['createElement']('div');
+  var eventName = '';
+
+  if (map === eventTypeMap) {
+    eventName = getJavaScriptEventName(eventType, map, el);
+  } else {
+    eventName = map[eventType].noPrefix in el.style ? map[eventType].noPrefix : map[eventType].webkitPrefix;
+  }
+
+  return eventName;
+}
+
+// Public functions to access getAnimationName() for JavaScript events or CSS
+// property names.
+
+var transformStyleProperties = ['transform', 'WebkitTransform', 'MozTransform', 'OTransform', 'MSTransform'];
+
+/**
+ * @param {!Object} windowObj
+ * @param {string} eventType
+ * @return {string}
+ */
+function getCorrectEventName(windowObj, eventType) {
+  return getAnimationName(windowObj, eventType);
+}
+
+/**
+ * @param {!Object} windowObj
+ * @param {string} eventType
+ * @return {string}
+ */
+function getCorrectPropertyName(windowObj, eventType) {
+  return getAnimationName(windowObj, eventType);
+}
+
+/***/ })
+
+/******/ });
+});

+ 178 - 0
support/client/lib/vwf/view/lib/mdc/dist/mdc.autoInit.js

@@ -0,0 +1,178 @@
+/*!
+ Material Components for the web
+ Copyright (c) 2017 Google Inc.
+ License: Apache-2.0
+*/
+(function webpackUniversalModuleDefinition(root, factory) {
+	if(typeof exports === 'object' && typeof module === 'object')
+		module.exports = factory();
+	else if(typeof define === 'function' && define.amd)
+		define([], factory);
+	else if(typeof exports === 'object')
+		exports["autoInit"] = factory();
+	else
+		root["mdc"] = root["mdc"] || {}, root["mdc"]["autoInit"] = factory();
+})(this, function() {
+return /******/ (function(modules) { // webpackBootstrap
+/******/ 	// The module cache
+/******/ 	var installedModules = {};
+/******/
+/******/ 	// The require function
+/******/ 	function __webpack_require__(moduleId) {
+/******/
+/******/ 		// Check if module is in cache
+/******/ 		if(installedModules[moduleId]) {
+/******/ 			return installedModules[moduleId].exports;
+/******/ 		}
+/******/ 		// Create a new module (and put it into the cache)
+/******/ 		var module = installedModules[moduleId] = {
+/******/ 			i: moduleId,
+/******/ 			l: false,
+/******/ 			exports: {}
+/******/ 		};
+/******/
+/******/ 		// Execute the module function
+/******/ 		modules[moduleId].call(module.exports, module, module.exports, __webpack_require__);
+/******/
+/******/ 		// Flag the module as loaded
+/******/ 		module.l = true;
+/******/
+/******/ 		// Return the exports of the module
+/******/ 		return module.exports;
+/******/ 	}
+/******/
+/******/
+/******/ 	// expose the modules object (__webpack_modules__)
+/******/ 	__webpack_require__.m = modules;
+/******/
+/******/ 	// expose the module cache
+/******/ 	__webpack_require__.c = installedModules;
+/******/
+/******/ 	// identity function for calling harmony imports with the correct context
+/******/ 	__webpack_require__.i = function(value) { return value; };
+/******/
+/******/ 	// define getter function for harmony exports
+/******/ 	__webpack_require__.d = function(exports, name, getter) {
+/******/ 		if(!__webpack_require__.o(exports, name)) {
+/******/ 			Object.defineProperty(exports, name, {
+/******/ 				configurable: false,
+/******/ 				enumerable: true,
+/******/ 				get: getter
+/******/ 			});
+/******/ 		}
+/******/ 	};
+/******/
+/******/ 	// getDefaultExport function for compatibility with non-harmony modules
+/******/ 	__webpack_require__.n = function(module) {
+/******/ 		var getter = module && module.__esModule ?
+/******/ 			function getDefault() { return module['default']; } :
+/******/ 			function getModuleExports() { return module; };
+/******/ 		__webpack_require__.d(getter, 'a', getter);
+/******/ 		return getter;
+/******/ 	};
+/******/
+/******/ 	// Object.prototype.hasOwnProperty.call
+/******/ 	__webpack_require__.o = function(object, property) { return Object.prototype.hasOwnProperty.call(object, property); };
+/******/
+/******/ 	// __webpack_public_path__
+/******/ 	__webpack_require__.p = "/assets/";
+/******/
+/******/ 	// Load entry module and return exports
+/******/ 	return __webpack_require__(__webpack_require__.s = 82);
+/******/ })
+/************************************************************************/
+/******/ ({
+
+/***/ 23:
+/***/ (function(module, __webpack_exports__, __webpack_require__) {
+
+"use strict";
+Object.defineProperty(__webpack_exports__, "__esModule", { value: true });
+/* harmony export (immutable) */ __webpack_exports__["default"] = mdcAutoInit;
+/**
+ * Copyright 2016 Google Inc. All Rights Reserved.
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *      http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+
+var registry = Object.create(null);
+
+var CONSOLE_WARN = console.warn.bind(console);
+
+/**
+ * Auto-initializes all mdc components on a page.
+ */
+function mdcAutoInit() {
+  var root = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : document;
+  var warn = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : CONSOLE_WARN;
+
+  var nodes = root.querySelectorAll('[data-mdc-auto-init]');
+  for (var i = 0, node; node = nodes[i]; i++) {
+    var ctorName = node.dataset.mdcAutoInit;
+    if (!ctorName) {
+      throw new Error('(mdc-auto-init) Constructor name must be given.');
+    }
+
+    var Ctor = registry[ctorName];
+    if (typeof Ctor !== 'function') {
+      throw new Error('(mdc-auto-init) Could not find constructor in registry for ' + ctorName);
+    }
+
+    if (node[ctorName]) {
+      warn('(mdc-auto-init) Component already initialized for ' + node + '. Skipping...');
+      continue;
+    }
+
+    // TODO: Should we make an eslint rule for an attachTo() static method?
+    var component = Ctor.attachTo(node);
+    Object.defineProperty(node, ctorName, {
+      value: component,
+      writable: false,
+      enumerable: false,
+      configurable: true
+    });
+  }
+}
+
+mdcAutoInit.register = function (componentName, Ctor) {
+  var warn = arguments.length > 2 && arguments[2] !== undefined ? arguments[2] : CONSOLE_WARN;
+
+  if (typeof Ctor !== 'function') {
+    throw new Error('(mdc-auto-init) Invalid Ctor value ' + Ctor + '. Expected function');
+  }
+  if (registry[componentName]) {
+    warn('(mdc-auto-init) Overriding registration for ' + componentName + ' with ' + Ctor + '. ' + ('Was: ' + registry[componentName]));
+  }
+  registry[componentName] = Ctor;
+};
+
+mdcAutoInit.deregister = function (componentName) {
+  delete registry[componentName];
+};
+
+mdcAutoInit.deregisterAll = function () {
+  Object.keys(registry).forEach(this.deregister, this);
+};
+
+/***/ }),
+
+/***/ 82:
+/***/ (function(module, exports, __webpack_require__) {
+
+module.exports = __webpack_require__(23);
+
+
+/***/ })
+
+/******/ });
+});

+ 438 - 0
support/client/lib/vwf/view/lib/mdc/dist/mdc.base.js

@@ -0,0 +1,438 @@
+/*!
+ Material Components for the web
+ Copyright (c) 2017 Google Inc.
+ License: Apache-2.0
+*/
+(function webpackUniversalModuleDefinition(root, factory) {
+	if(typeof exports === 'object' && typeof module === 'object')
+		module.exports = factory();
+	else if(typeof define === 'function' && define.amd)
+		define([], factory);
+	else if(typeof exports === 'object')
+		exports["base"] = factory();
+	else
+		root["mdc"] = root["mdc"] || {}, root["mdc"]["base"] = factory();
+})(this, function() {
+return /******/ (function(modules) { // webpackBootstrap
+/******/ 	// The module cache
+/******/ 	var installedModules = {};
+/******/
+/******/ 	// The require function
+/******/ 	function __webpack_require__(moduleId) {
+/******/
+/******/ 		// Check if module is in cache
+/******/ 		if(installedModules[moduleId]) {
+/******/ 			return installedModules[moduleId].exports;
+/******/ 		}
+/******/ 		// Create a new module (and put it into the cache)
+/******/ 		var module = installedModules[moduleId] = {
+/******/ 			i: moduleId,
+/******/ 			l: false,
+/******/ 			exports: {}
+/******/ 		};
+/******/
+/******/ 		// Execute the module function
+/******/ 		modules[moduleId].call(module.exports, module, module.exports, __webpack_require__);
+/******/
+/******/ 		// Flag the module as loaded
+/******/ 		module.l = true;
+/******/
+/******/ 		// Return the exports of the module
+/******/ 		return module.exports;
+/******/ 	}
+/******/
+/******/
+/******/ 	// expose the modules object (__webpack_modules__)
+/******/ 	__webpack_require__.m = modules;
+/******/
+/******/ 	// expose the module cache
+/******/ 	__webpack_require__.c = installedModules;
+/******/
+/******/ 	// identity function for calling harmony imports with the correct context
+/******/ 	__webpack_require__.i = function(value) { return value; };
+/******/
+/******/ 	// define getter function for harmony exports
+/******/ 	__webpack_require__.d = function(exports, name, getter) {
+/******/ 		if(!__webpack_require__.o(exports, name)) {
+/******/ 			Object.defineProperty(exports, name, {
+/******/ 				configurable: false,
+/******/ 				enumerable: true,
+/******/ 				get: getter
+/******/ 			});
+/******/ 		}
+/******/ 	};
+/******/
+/******/ 	// getDefaultExport function for compatibility with non-harmony modules
+/******/ 	__webpack_require__.n = function(module) {
+/******/ 		var getter = module && module.__esModule ?
+/******/ 			function getDefault() { return module['default']; } :
+/******/ 			function getModuleExports() { return module; };
+/******/ 		__webpack_require__.d(getter, 'a', getter);
+/******/ 		return getter;
+/******/ 	};
+/******/
+/******/ 	// Object.prototype.hasOwnProperty.call
+/******/ 	__webpack_require__.o = function(object, property) { return Object.prototype.hasOwnProperty.call(object, property); };
+/******/
+/******/ 	// __webpack_public_path__
+/******/ 	__webpack_require__.p = "/assets/";
+/******/
+/******/ 	// Load entry module and return exports
+/******/ 	return __webpack_require__(__webpack_require__.s = 83);
+/******/ })
+/************************************************************************/
+/******/ ({
+
+/***/ 0:
+/***/ (function(module, __webpack_exports__, __webpack_require__) {
+
+"use strict";
+var _createClass = function () { function defineProperties(target, props) { for (var i = 0; i < props.length; i++) { var descriptor = props[i]; descriptor.enumerable = descriptor.enumerable || false; descriptor.configurable = true; if ("value" in descriptor) descriptor.writable = true; Object.defineProperty(target, descriptor.key, descriptor); } } return function (Constructor, protoProps, staticProps) { if (protoProps) defineProperties(Constructor.prototype, protoProps); if (staticProps) defineProperties(Constructor, staticProps); return Constructor; }; }();
+
+function _classCallCheck(instance, Constructor) { if (!(instance instanceof Constructor)) { throw new TypeError("Cannot call a class as a function"); } }
+
+/**
+ * Copyright 2016 Google Inc.
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *   http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+
+/**
+ * @template A
+ */
+var MDCFoundation = function () {
+  _createClass(MDCFoundation, null, [{
+    key: "cssClasses",
+
+    /** @return enum{cssClasses} */
+    get: function get() {
+      // Classes extending MDCFoundation should implement this method to return an object which exports every
+      // CSS class the foundation class needs as a property. e.g. {ACTIVE: 'mdc-component--active'}
+      return {};
+    }
+
+    /** @return enum{strings} */
+
+  }, {
+    key: "strings",
+    get: function get() {
+      // Classes extending MDCFoundation should implement this method to return an object which exports all
+      // semantic strings as constants. e.g. {ARIA_ROLE: 'tablist'}
+      return {};
+    }
+
+    /** @return enum{numbers} */
+
+  }, {
+    key: "numbers",
+    get: function get() {
+      // Classes extending MDCFoundation should implement this method to return an object which exports all
+      // of its semantic numbers as constants. e.g. {ANIMATION_DELAY_MS: 350}
+      return {};
+    }
+
+    /** @return {!Object} */
+
+  }, {
+    key: "defaultAdapter",
+    get: function get() {
+      // Classes extending MDCFoundation may choose to implement this getter in order to provide a convenient
+      // way of viewing the necessary methods of an adapter. In the future, this could also be used for adapter
+      // validation.
+      return {};
+    }
+
+    /**
+     * @param {A=} adapter
+     */
+
+  }]);
+
+  function MDCFoundation() {
+    var adapter = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : {};
+
+    _classCallCheck(this, MDCFoundation);
+
+    /** @protected {!A} */
+    this.adapter_ = adapter;
+  }
+
+  _createClass(MDCFoundation, [{
+    key: "init",
+    value: function init() {
+      // Subclasses should override this method to perform initialization routines (registering events, etc.)
+    }
+  }, {
+    key: "destroy",
+    value: function destroy() {
+      // Subclasses should override this method to perform de-initialization routines (de-registering events, etc.)
+    }
+  }]);
+
+  return MDCFoundation;
+}();
+
+/* harmony default export */ __webpack_exports__["a"] = (MDCFoundation);
+
+/***/ }),
+
+/***/ 1:
+/***/ (function(module, __webpack_exports__, __webpack_require__) {
+
+"use strict";
+/* harmony import */ var __WEBPACK_IMPORTED_MODULE_0__foundation__ = __webpack_require__(0);
+var _createClass = function () { function defineProperties(target, props) { for (var i = 0; i < props.length; i++) { var descriptor = props[i]; descriptor.enumerable = descriptor.enumerable || false; descriptor.configurable = true; if ("value" in descriptor) descriptor.writable = true; Object.defineProperty(target, descriptor.key, descriptor); } } return function (Constructor, protoProps, staticProps) { if (protoProps) defineProperties(Constructor.prototype, protoProps); if (staticProps) defineProperties(Constructor, staticProps); return Constructor; }; }();
+
+function _classCallCheck(instance, Constructor) { if (!(instance instanceof Constructor)) { throw new TypeError("Cannot call a class as a function"); } }
+
+/**
+ * Copyright 2016 Google Inc.
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *   http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+
+
+
+/**
+ * @template F
+ */
+
+var MDCComponent = function () {
+  _createClass(MDCComponent, null, [{
+    key: 'attachTo',
+
+    /**
+     * @param {!Element} root
+     * @return {!MDCComponent}
+     */
+    value: function attachTo(root) {
+      // Subclasses which extend MDCBase should provide an attachTo() method that takes a root element and
+      // returns an instantiated component with its root set to that element. Also note that in the cases of
+      // subclasses, an explicit foundation class will not have to be passed in; it will simply be initialized
+      // from getDefaultFoundation().
+      return new MDCComponent(root, new __WEBPACK_IMPORTED_MODULE_0__foundation__["a" /* default */]());
+    }
+
+    /**
+     * @param {!Element} root
+     * @param {F=} foundation
+     * @param {...?} args
+     */
+
+  }]);
+
+  function MDCComponent(root) {
+    var foundation = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : undefined;
+
+    _classCallCheck(this, MDCComponent);
+
+    /** @protected {!Element} */
+    this.root_ = root;
+
+    for (var _len = arguments.length, args = Array(_len > 2 ? _len - 2 : 0), _key = 2; _key < _len; _key++) {
+      args[_key - 2] = arguments[_key];
+    }
+
+    this.initialize.apply(this, args);
+    // Note that we initialize foundation here and not within the constructor's default param so that
+    // this.root_ is defined and can be used within the foundation class.
+    /** @protected {!F} */
+    this.foundation_ = foundation === undefined ? this.getDefaultFoundation() : foundation;
+    this.foundation_.init();
+    this.initialSyncWithDOM();
+  }
+
+  _createClass(MDCComponent, [{
+    key: 'initialize',
+    value: function initialize() /* ...args */{}
+    // Subclasses can override this to do any additional setup work that would be considered part of a
+    // "constructor". Essentially, it is a hook into the parent constructor before the foundation is
+    // initialized. Any additional arguments besides root and foundation will be passed in here.
+
+
+    /**
+     * @return {!F} foundation
+     */
+
+  }, {
+    key: 'getDefaultFoundation',
+    value: function getDefaultFoundation() {
+      // Subclasses must override this method to return a properly configured foundation class for the
+      // component.
+      throw new Error('Subclasses must override getDefaultFoundation to return a properly configured ' + 'foundation class');
+    }
+  }, {
+    key: 'initialSyncWithDOM',
+    value: function initialSyncWithDOM() {
+      // Subclasses should override this method if they need to perform work to synchronize with a host DOM
+      // object. An example of this would be a form control wrapper that needs to synchronize its internal state
+      // to some property or attribute of the host DOM. Please note: this is *not* the place to perform DOM
+      // reads/writes that would cause layout / paint, as this is called synchronously from within the constructor.
+    }
+  }, {
+    key: 'destroy',
+    value: function destroy() {
+      // Subclasses may implement this method to release any resources / deregister any listeners they have
+      // attached. An example of this might be deregistering a resize event from the window object.
+      this.foundation_.destroy();
+    }
+
+    /**
+     * Wrapper method to add an event listener to the component's root element. This is most useful when
+     * listening for custom events.
+     * @param {string} evtType
+     * @param {!Function} handler
+     */
+
+  }, {
+    key: 'listen',
+    value: function listen(evtType, handler) {
+      this.root_.addEventListener(evtType, handler);
+    }
+
+    /**
+     * Wrapper method to remove an event listener to the component's root element. This is most useful when
+     * unlistening for custom events.
+     * @param {string} evtType
+     * @param {!Function} handler
+     */
+
+  }, {
+    key: 'unlisten',
+    value: function unlisten(evtType, handler) {
+      this.root_.removeEventListener(evtType, handler);
+    }
+
+    /**
+     * Fires a cross-browser-compatible custom event from the component root of the given type,
+     * with the given data.
+     * @param {string} evtType
+     * @param {!Object} evtData
+     * @param {boolean=} shouldBubble
+     */
+
+  }, {
+    key: 'emit',
+    value: function emit(evtType, evtData) {
+      var shouldBubble = arguments.length > 2 && arguments[2] !== undefined ? arguments[2] : false;
+
+      var evt = void 0;
+      if (typeof CustomEvent === 'function') {
+        evt = new CustomEvent(evtType, {
+          detail: evtData,
+          bubbles: shouldBubble
+        });
+      } else {
+        evt = document.createEvent('CustomEvent');
+        evt.initCustomEvent(evtType, shouldBubble, false, evtData);
+      }
+
+      this.root_.dispatchEvent(evt);
+    }
+  }]);
+
+  return MDCComponent;
+}();
+
+/* harmony default export */ __webpack_exports__["a"] = (MDCComponent);
+
+/***/ }),
+
+/***/ 2:
+/***/ (function(module, __webpack_exports__, __webpack_require__) {
+
+"use strict";
+Object.defineProperty(__webpack_exports__, "__esModule", { value: true });
+/* harmony import */ var __WEBPACK_IMPORTED_MODULE_0__foundation__ = __webpack_require__(0);
+/* harmony import */ var __WEBPACK_IMPORTED_MODULE_1__component__ = __webpack_require__(1);
+/* harmony import */ var __WEBPACK_IMPORTED_MODULE_2__selection_control__ = __webpack_require__(3);
+/* harmony reexport (binding) */ __webpack_require__.d(__webpack_exports__, "MDCFoundation", function() { return __WEBPACK_IMPORTED_MODULE_0__foundation__["a"]; });
+/* harmony reexport (binding) */ __webpack_require__.d(__webpack_exports__, "MDCComponent", function() { return __WEBPACK_IMPORTED_MODULE_1__component__["a"]; });
+/* harmony reexport (binding) */ __webpack_require__.d(__webpack_exports__, "SelectionControlState", function() { return __WEBPACK_IMPORTED_MODULE_2__selection_control__["a"]; });
+/**
+ * Copyright 2016 Google Inc.
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *   http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+
+
+
+
+
+
+
+/***/ }),
+
+/***/ 3:
+/***/ (function(module, __webpack_exports__, __webpack_require__) {
+
+"use strict";
+/* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, "a", function() { return SelectionControlState; });
+/**
+ * Copyright 2017 Google Inc. All Rights Reserved.
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *      http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+
+/**
+ * @typedef {!{
+ *   checked: boolean,
+ *   indeterminate: boolean,
+ *   disabled: boolean,
+ *   value: ?string
+ * }}
+ */
+var SelectionControlState = void 0;
+
+/***/ }),
+
+/***/ 83:
+/***/ (function(module, exports, __webpack_require__) {
+
+module.exports = __webpack_require__(2);
+
+
+/***/ })
+
+/******/ });
+});

+ 1059 - 0
support/client/lib/vwf/view/lib/mdc/dist/mdc.button.css

@@ -0,0 +1,1059 @@
+/*!
+ Material Components for the web
+ Copyright (c) 2017 Google Inc.
+ License: Apache-2.0
+*/
+/**
+ * The css property used for elevation. In most cases this should not be changed. It is exposed
+ * as a variable for abstraction / easy use when needing to reference the property directly, for
+ * example in a `will-change` rule.
+ */
+/**
+ * The default duration value for elevation transitions.
+ */
+/**
+ * The default easing value for elevation transitions.
+ */
+/**
+ * Applies the correct css rules to an element to give it the elevation specified by $z-value.
+ * The $z-value must be between 0 and 24.
+ */
+/**
+ * Returns a string that can be used as the value for a `transition` property for elevation.
+ * Calling this function directly is useful in situations where a component needs to transition
+ * more than one property.
+ *
+ * ```scss
+ * .foo {
+ *   transition: mdc-elevation-transition-rule(), opacity 100ms ease;
+ *   will-change: $mdc-elevation-property, opacity;
+ * }
+ * ```
+ */
+/**
+ * Applies the correct css rules needed to have an element transition between elevations.
+ * This mixin should be applied to elements whose elevation values will change depending on their
+ * context (e.g. when active or disabled).
+ */
+/*
+  Precomputed linear color channel values, for use in contrast calculations.
+  See https://www.w3.org/TR/WCAG20-TECHS/G17.html#G17-tests
+
+  Algorithm, for c in 0 to 255:
+  f(c) {
+    c = c / 255;
+    return c < 0.03928 ? c / 12.92 : Math.pow((c + 0.055) / 1.055, 2.4);
+  }
+
+  This lookup table is needed since there is no `pow` in SASS.
+*/
+/**
+ * Calculate the luminance for a color.
+ * See https://www.w3.org/TR/WCAG20-TECHS/G17.html#G17-tests
+ */
+/**
+ * Calculate the contrast ratio between two colors.
+ * See https://www.w3.org/TR/WCAG20-TECHS/G17.html#G17-tests
+ */
+/**
+ * Determine whether to use dark or light text on top of given color.
+ * Returns "dark" for dark text and "light" for light text.
+ */
+/*
+  Main theme colors.
+  If you're a user customizing your color scheme in SASS, these are probably the only variables you need to change.
+*/
+/* Indigo 500 */
+/* Pink A200 */
+/* White */
+/* Which set of text colors to use for each main theme color (light or dark) */
+/* Text colors according to light vs dark and text type */
+/* Primary text colors for each of the theme colors */
+/** MDC Ripple keyframes are split into their own file so that _mixins.scss can rely on them. */
+@-webkit-keyframes mdc-ripple-fg-radius-in {
+  from {
+    -webkit-transform: translate(var(--mdc-ripple-fg-translate-start, 0)) scale(1);
+            transform: translate(var(--mdc-ripple-fg-translate-start, 0)) scale(1);
+    -webkit-animation-timing-function: cubic-bezier(0.4, 0, 0.2, 1);
+            animation-timing-function: cubic-bezier(0.4, 0, 0.2, 1); }
+  to {
+    -webkit-transform: translate(var(--mdc-ripple-fg-translate-end, 0)) scale(var(--mdc-ripple-fg-scale, 1));
+            transform: translate(var(--mdc-ripple-fg-translate-end, 0)) scale(var(--mdc-ripple-fg-scale, 1)); } }
+@keyframes mdc-ripple-fg-radius-in {
+  from {
+    -webkit-transform: translate(var(--mdc-ripple-fg-translate-start, 0)) scale(1);
+            transform: translate(var(--mdc-ripple-fg-translate-start, 0)) scale(1);
+    -webkit-animation-timing-function: cubic-bezier(0.4, 0, 0.2, 1);
+            animation-timing-function: cubic-bezier(0.4, 0, 0.2, 1); }
+  to {
+    -webkit-transform: translate(var(--mdc-ripple-fg-translate-end, 0)) scale(var(--mdc-ripple-fg-scale, 1));
+            transform: translate(var(--mdc-ripple-fg-translate-end, 0)) scale(var(--mdc-ripple-fg-scale, 1)); } }
+
+@-webkit-keyframes mdc-ripple-fg-opacity-in {
+  from {
+    opacity: 0;
+    -webkit-animation-timing-function: linear;
+            animation-timing-function: linear; }
+  to {
+    opacity: 1; } }
+
+@keyframes mdc-ripple-fg-opacity-in {
+  from {
+    opacity: 0;
+    -webkit-animation-timing-function: linear;
+            animation-timing-function: linear; }
+  to {
+    opacity: 1; } }
+
+@-webkit-keyframes mdc-ripple-fg-opacity-out {
+  from {
+    opacity: 1;
+    -webkit-animation-timing-function: linear;
+            animation-timing-function: linear; }
+  to {
+    opacity: 0; } }
+
+@keyframes mdc-ripple-fg-opacity-out {
+  from {
+    opacity: 1;
+    -webkit-animation-timing-function: linear;
+            animation-timing-function: linear; }
+  to {
+    opacity: 0; } }
+
+/*
+  Precomputed linear color channel values, for use in contrast calculations.
+  See https://www.w3.org/TR/WCAG20-TECHS/G17.html#G17-tests
+
+  Algorithm, for c in 0 to 255:
+  f(c) {
+    c = c / 255;
+    return c < 0.03928 ? c / 12.92 : Math.pow((c + 0.055) / 1.055, 2.4);
+  }
+
+  This lookup table is needed since there is no `pow` in SASS.
+*/
+/**
+ * Calculate the luminance for a color.
+ * See https://www.w3.org/TR/WCAG20-TECHS/G17.html#G17-tests
+ */
+/**
+ * Calculate the contrast ratio between two colors.
+ * See https://www.w3.org/TR/WCAG20-TECHS/G17.html#G17-tests
+ */
+/**
+ * Determine whether to use dark or light text on top of given color.
+ * Returns "dark" for dark text and "light" for light text.
+ */
+/*
+  Main theme colors.
+  If you're a user customizing your color scheme in SASS, these are probably the only variables you need to change.
+*/
+/* Indigo 500 */
+/* Pink A200 */
+/* White */
+/* Which set of text colors to use for each main theme color (light or dark) */
+/* Text colors according to light vs dark and text type */
+/* Primary text colors for each of the theme colors */
+/**
+ * Applies the correct theme color style to the specified property.
+ * $property is typically color or background-color, but can be any CSS property that accepts color values.
+ * $style should be one of the map keys in $mdc-theme-property-values (_variables.scss).
+ */
+/**
+ * Creates a rule to be used in MDC-Web components for dark theming, and applies the provided contents.
+ * Should provide the $root-selector option if applied to anything other than the root selector.
+ * When used with a modifier class, provide a second argument of `true` for the $compound parameter
+ * to specify that this should be attached as a compound class.
+ *
+ * Usage example:
+ *
+ * ```scss
+ * .mdc-foo {
+ *   color: black;
+ *
+ *   @include mdc-theme-dark {
+ *     color: white;
+ *   }
+ *
+ *   &__bar {
+ *     background: black;
+ *
+ *     @include mdc-theme-dark(".mdc-foo") {
+ *       background: white;
+ *     }
+ *   }
+ * }
+ *
+ * .mdc-foo--disabled {
+ *   opacity: .38;
+ *
+ *   @include mdc-theme-dark(".mdc-foo", true) {
+ *     opacity: .5;
+ *   }
+ * }
+ * ```
+ */
+/* TODO(sgomes): Figure out what to do about desktop font sizes. */
+/* TODO(sgomes): Figure out what to do about i18n and i18n font sizes. */
+.mdc-button {
+  --mdc-ripple-surface-width: 0;
+  --mdc-ripple-surface-height: 0;
+  --mdc-ripple-fg-size: 0;
+  --mdc-ripple-left: 0;
+  --mdc-ripple-top: 0;
+  --mdc-ripple-fg-scale: 1;
+  --mdc-ripple-fg-translate-end: 0;
+  --mdc-ripple-fg-translate-start: 0;
+  will-change: transform, opacity;
+  -webkit-tap-highlight-color: transparent;
+  /* @alternate */
+  color: rgba(0, 0, 0, 0.87);
+  color: var(--mdc-theme-text-primary-on-light, rgba(0, 0, 0, 0.87));
+  font-family: Roboto, sans-serif;
+  -moz-osx-font-smoothing: grayscale;
+  -webkit-font-smoothing: antialiased;
+  display: inline-block;
+  position: relative;
+  min-width: 64px;
+  height: 36px;
+  padding: 0 16px;
+  border: none;
+  border-radius: 2px;
+  outline: none;
+  background: transparent;
+  font-size: 14px;
+  font-weight: 500;
+  letter-spacing: .04em;
+  line-height: 36px;
+  text-align: center;
+  text-decoration: none;
+  text-transform: uppercase;
+  overflow: hidden;
+  vertical-align: middle;
+  -webkit-user-select: none;
+     -moz-user-select: none;
+      -ms-user-select: none;
+          user-select: none;
+  -webkit-box-sizing: border-box;
+          box-sizing: border-box;
+  -webkit-appearance: none; }
+  .mdc-button:not(.mdc-ripple-upgraded):hover::before, .mdc-button:not(.mdc-ripple-upgraded):focus::before, .mdc-button:not(.mdc-ripple-upgraded):active::after {
+    -webkit-transition-duration: 85ms;
+            transition-duration: 85ms;
+    opacity: .6; }
+  .mdc-button::before {
+    background-color: rgba(0, 0, 0, 0.06);
+    position: absolute;
+    top: calc(50% - 100%);
+    left: calc(50% - 100%);
+    width: 200%;
+    height: 200%;
+    -webkit-transition: opacity 250ms linear;
+    transition: opacity 250ms linear;
+    border-radius: 50%;
+    opacity: 0;
+    pointer-events: none;
+    content: ""; }
+  .mdc-button.mdc-ripple-upgraded::before {
+    top: calc(50% - 100%);
+    left: calc(50% - 100%);
+    width: 200%;
+    height: 200%;
+    /* @alternate */
+    -webkit-transform: scale(0);
+            transform: scale(0);
+    -webkit-transform: scale(var(--mdc-ripple-fg-scale, 0));
+            transform: scale(var(--mdc-ripple-fg-scale, 0)); }
+  .mdc-button.mdc-ripple-upgraded--background-focused::before {
+    opacity: .99999; }
+  .mdc-button.mdc-ripple-upgraded--background-active-fill::before {
+    -webkit-transition-duration: 120ms;
+            transition-duration: 120ms;
+    opacity: 1; }
+  .mdc-button.mdc-ripple-upgraded--unbounded::before {
+    /* @alternate */
+    top: calc(50% - 50%);
+    top: var(--mdc-ripple-top, calc(50% - 50%));
+    /* @alternate */
+    left: calc(50% - 50%);
+    left: var(--mdc-ripple-left, calc(50% - 50%));
+    /* @alternate */
+    width: 100%;
+    width: var(--mdc-ripple-fg-size, 100%);
+    /* @alternate */
+    height: 100%;
+    height: var(--mdc-ripple-fg-size, 100%);
+    /* @alternate */
+    -webkit-transform: scale(0);
+            transform: scale(0);
+    -webkit-transform: scale(var(--mdc-ripple-fg-scale, 0));
+            transform: scale(var(--mdc-ripple-fg-scale, 0)); }
+  .mdc-button::after {
+    background-color: rgba(0, 0, 0, 0.06);
+    position: absolute;
+    top: calc(50% - 100%);
+    left: calc(50% - 100%);
+    width: 200%;
+    height: 200%;
+    -webkit-transition: opacity 250ms linear;
+    transition: opacity 250ms linear;
+    border-radius: 50%;
+    opacity: 0;
+    pointer-events: none;
+    content: ""; }
+  .mdc-button.mdc-ripple-upgraded::after {
+    top: 0;
+    left: 0;
+    /* @alternate */
+    width: 100%;
+    width: var(--mdc-ripple-fg-size, 100%);
+    /* @alternate */
+    height: 100%;
+    height: var(--mdc-ripple-fg-size, 100%);
+    -webkit-transform: scale(0);
+            transform: scale(0);
+    -webkit-transform-origin: center center;
+            transform-origin: center center;
+    opacity: 0; }
+  .mdc-button:not(.mdc-ripple-upgraded--unbounded)::after {
+    -webkit-transform-origin: center center;
+            transform-origin: center center; }
+  .mdc-button.mdc-ripple-upgraded--unbounded::after {
+    /* @alternate */
+    top: 0;
+    top: var(--mdc-ripple-top, 0);
+    /* @alternate */
+    left: 0;
+    left: var(--mdc-ripple-left, 0);
+    /* @alternate */
+    width: 100%;
+    width: var(--mdc-ripple-fg-size, 100%);
+    /* @alternate */
+    height: 100%;
+    height: var(--mdc-ripple-fg-size, 100%);
+    -webkit-transform: scale(0);
+            transform: scale(0);
+    -webkit-transform-origin: center center;
+            transform-origin: center center; }
+  .mdc-button.mdc-ripple-upgraded--foreground-activation::after {
+    -webkit-animation: 300ms mdc-ripple-fg-radius-in forwards, 83ms mdc-ripple-fg-opacity-in forwards;
+            animation: 300ms mdc-ripple-fg-radius-in forwards, 83ms mdc-ripple-fg-opacity-in forwards; }
+  .mdc-button.mdc-ripple-upgraded--foreground-deactivation::after {
+    -webkit-transform: translate(var(--mdc-ripple-fg-translate-end, 0)) scale(var(--mdc-ripple-fg-scale, 1));
+            transform: translate(var(--mdc-ripple-fg-translate-end, 0)) scale(var(--mdc-ripple-fg-scale, 1));
+    -webkit-animation: 83ms mdc-ripple-fg-opacity-out;
+            animation: 83ms mdc-ripple-fg-opacity-out; }
+  .mdc-button:not(.mdc-ripple-upgraded) {
+    -webkit-tap-highlight-color: rgba(0, 0, 0, 0.18); }
+  .mdc-button--theme-dark,
+  .mdc-theme--dark .mdc-button {
+    --mdc-ripple-surface-width: 0;
+    --mdc-ripple-surface-height: 0;
+    --mdc-ripple-fg-size: 0;
+    --mdc-ripple-left: 0;
+    --mdc-ripple-top: 0;
+    --mdc-ripple-fg-scale: 1;
+    --mdc-ripple-fg-translate-end: 0;
+    --mdc-ripple-fg-translate-start: 0;
+    will-change: transform, opacity;
+    -webkit-tap-highlight-color: transparent;
+    /* @alternate */
+    color: white;
+    color: var(--mdc-theme-text-primary-on-dark, white); }
+    .mdc-button--theme-dark:not(.mdc-ripple-upgraded):hover::before, .mdc-button--theme-dark:not(.mdc-ripple-upgraded):focus::before, .mdc-button--theme-dark:not(.mdc-ripple-upgraded):active::after,
+    .mdc-theme--dark .mdc-button:not(.mdc-ripple-upgraded):hover::before,
+    .mdc-theme--dark .mdc-button:not(.mdc-ripple-upgraded):focus::before,
+    .mdc-theme--dark .mdc-button:not(.mdc-ripple-upgraded):active::after {
+      -webkit-transition-duration: 85ms;
+              transition-duration: 85ms;
+      opacity: .6; }
+    .mdc-button--theme-dark::before,
+    .mdc-theme--dark .mdc-button::before {
+      background-color: rgba(255, 255, 255, 0.14);
+      position: absolute;
+      top: calc(50% - 100%);
+      left: calc(50% - 100%);
+      width: 200%;
+      height: 200%;
+      -webkit-transition: opacity 250ms linear;
+      transition: opacity 250ms linear;
+      border-radius: 50%;
+      opacity: 0;
+      pointer-events: none;
+      content: ""; }
+    .mdc-button--theme-dark.mdc-ripple-upgraded::before,
+    .mdc-theme--dark .mdc-button.mdc-ripple-upgraded::before {
+      top: calc(50% - 100%);
+      left: calc(50% - 100%);
+      width: 200%;
+      height: 200%;
+      /* @alternate */
+      -webkit-transform: scale(0);
+              transform: scale(0);
+      -webkit-transform: scale(var(--mdc-ripple-fg-scale, 0));
+              transform: scale(var(--mdc-ripple-fg-scale, 0)); }
+    .mdc-button--theme-dark.mdc-ripple-upgraded--background-focused::before,
+    .mdc-theme--dark .mdc-button.mdc-ripple-upgraded--background-focused::before {
+      opacity: .99999; }
+    .mdc-button--theme-dark.mdc-ripple-upgraded--background-active-fill::before,
+    .mdc-theme--dark .mdc-button.mdc-ripple-upgraded--background-active-fill::before {
+      -webkit-transition-duration: 120ms;
+              transition-duration: 120ms;
+      opacity: 1; }
+    .mdc-button--theme-dark.mdc-ripple-upgraded--unbounded::before,
+    .mdc-theme--dark .mdc-button.mdc-ripple-upgraded--unbounded::before {
+      /* @alternate */
+      top: calc(50% - 50%);
+      top: var(--mdc-ripple-top, calc(50% - 50%));
+      /* @alternate */
+      left: calc(50% - 50%);
+      left: var(--mdc-ripple-left, calc(50% - 50%));
+      /* @alternate */
+      width: 100%;
+      width: var(--mdc-ripple-fg-size, 100%);
+      /* @alternate */
+      height: 100%;
+      height: var(--mdc-ripple-fg-size, 100%);
+      /* @alternate */
+      -webkit-transform: scale(0);
+              transform: scale(0);
+      -webkit-transform: scale(var(--mdc-ripple-fg-scale, 0));
+              transform: scale(var(--mdc-ripple-fg-scale, 0)); }
+    .mdc-button--theme-dark::after,
+    .mdc-theme--dark .mdc-button::after {
+      background-color: rgba(255, 255, 255, 0.14);
+      position: absolute;
+      top: calc(50% - 100%);
+      left: calc(50% - 100%);
+      width: 200%;
+      height: 200%;
+      -webkit-transition: opacity 250ms linear;
+      transition: opacity 250ms linear;
+      border-radius: 50%;
+      opacity: 0;
+      pointer-events: none;
+      content: ""; }
+    .mdc-button--theme-dark.mdc-ripple-upgraded::after,
+    .mdc-theme--dark .mdc-button.mdc-ripple-upgraded::after {
+      top: 0;
+      left: 0;
+      /* @alternate */
+      width: 100%;
+      width: var(--mdc-ripple-fg-size, 100%);
+      /* @alternate */
+      height: 100%;
+      height: var(--mdc-ripple-fg-size, 100%);
+      -webkit-transform: scale(0);
+              transform: scale(0);
+      -webkit-transform-origin: center center;
+              transform-origin: center center;
+      opacity: 0; }
+    .mdc-button--theme-dark:not(.mdc-ripple-upgraded--unbounded)::after,
+    .mdc-theme--dark .mdc-button:not(.mdc-ripple-upgraded--unbounded)::after {
+      -webkit-transform-origin: center center;
+              transform-origin: center center; }
+    .mdc-button--theme-dark.mdc-ripple-upgraded--unbounded::after,
+    .mdc-theme--dark .mdc-button.mdc-ripple-upgraded--unbounded::after {
+      /* @alternate */
+      top: 0;
+      top: var(--mdc-ripple-top, 0);
+      /* @alternate */
+      left: 0;
+      left: var(--mdc-ripple-left, 0);
+      /* @alternate */
+      width: 100%;
+      width: var(--mdc-ripple-fg-size, 100%);
+      /* @alternate */
+      height: 100%;
+      height: var(--mdc-ripple-fg-size, 100%);
+      -webkit-transform: scale(0);
+              transform: scale(0);
+      -webkit-transform-origin: center center;
+              transform-origin: center center; }
+    .mdc-button--theme-dark.mdc-ripple-upgraded--foreground-activation::after,
+    .mdc-theme--dark .mdc-button.mdc-ripple-upgraded--foreground-activation::after {
+      -webkit-animation: 300ms mdc-ripple-fg-radius-in forwards, 83ms mdc-ripple-fg-opacity-in forwards;
+              animation: 300ms mdc-ripple-fg-radius-in forwards, 83ms mdc-ripple-fg-opacity-in forwards; }
+    .mdc-button--theme-dark.mdc-ripple-upgraded--foreground-deactivation::after,
+    .mdc-theme--dark .mdc-button.mdc-ripple-upgraded--foreground-deactivation::after {
+      -webkit-transform: translate(var(--mdc-ripple-fg-translate-end, 0)) scale(var(--mdc-ripple-fg-scale, 1));
+              transform: translate(var(--mdc-ripple-fg-translate-end, 0)) scale(var(--mdc-ripple-fg-scale, 1));
+      -webkit-animation: 83ms mdc-ripple-fg-opacity-out;
+              animation: 83ms mdc-ripple-fg-opacity-out; }
+    .mdc-button--theme-dark:not(.mdc-ripple-upgraded),
+    .mdc-theme--dark .mdc-button:not(.mdc-ripple-upgraded) {
+      -webkit-tap-highlight-color: rgba(255, 255, 255, 0.18); }
+  .mdc-button.mdc-button--primary {
+    --mdc-ripple-surface-width: 0;
+    --mdc-ripple-surface-height: 0;
+    --mdc-ripple-fg-size: 0;
+    --mdc-ripple-left: 0;
+    --mdc-ripple-top: 0;
+    --mdc-ripple-fg-scale: 1;
+    --mdc-ripple-fg-translate-end: 0;
+    --mdc-ripple-fg-translate-start: 0;
+    will-change: transform, opacity;
+    -webkit-tap-highlight-color: transparent; }
+    .mdc-button.mdc-button--primary:not(.mdc-ripple-upgraded):hover::before, .mdc-button.mdc-button--primary:not(.mdc-ripple-upgraded):focus::before, .mdc-button.mdc-button--primary:not(.mdc-ripple-upgraded):active::after {
+      -webkit-transition-duration: 85ms;
+              transition-duration: 85ms;
+      opacity: .6; }
+    .mdc-button.mdc-button--primary::before {
+      /* @alternate */
+      background-color: rgba(63, 81, 181, 0.12);
+      position: absolute;
+      top: calc(50% - 100%);
+      left: calc(50% - 100%);
+      width: 200%;
+      height: 200%;
+      -webkit-transition: opacity 250ms linear;
+      transition: opacity 250ms linear;
+      border-radius: 50%;
+      opacity: 0;
+      pointer-events: none;
+      content: ""; }
+      @supports (background-color: color(green a(10%))) {
+        .mdc-button.mdc-button--primary::before {
+          background-color: color(var(--mdc-theme-primary, #3f51b5) a(12%)); } }
+    .mdc-button.mdc-button--primary.mdc-ripple-upgraded::before {
+      top: calc(50% - 100%);
+      left: calc(50% - 100%);
+      width: 200%;
+      height: 200%;
+      /* @alternate */
+      -webkit-transform: scale(0);
+              transform: scale(0);
+      -webkit-transform: scale(var(--mdc-ripple-fg-scale, 0));
+              transform: scale(var(--mdc-ripple-fg-scale, 0)); }
+    .mdc-button.mdc-button--primary.mdc-ripple-upgraded--background-focused::before {
+      opacity: .99999; }
+    .mdc-button.mdc-button--primary.mdc-ripple-upgraded--background-active-fill::before {
+      -webkit-transition-duration: 120ms;
+              transition-duration: 120ms;
+      opacity: 1; }
+    .mdc-button.mdc-button--primary.mdc-ripple-upgraded--unbounded::before {
+      /* @alternate */
+      top: calc(50% - 50%);
+      top: var(--mdc-ripple-top, calc(50% - 50%));
+      /* @alternate */
+      left: calc(50% - 50%);
+      left: var(--mdc-ripple-left, calc(50% - 50%));
+      /* @alternate */
+      width: 100%;
+      width: var(--mdc-ripple-fg-size, 100%);
+      /* @alternate */
+      height: 100%;
+      height: var(--mdc-ripple-fg-size, 100%);
+      /* @alternate */
+      -webkit-transform: scale(0);
+              transform: scale(0);
+      -webkit-transform: scale(var(--mdc-ripple-fg-scale, 0));
+              transform: scale(var(--mdc-ripple-fg-scale, 0)); }
+    .mdc-button.mdc-button--primary::after {
+      /* @alternate */
+      background-color: rgba(63, 81, 181, 0.12);
+      position: absolute;
+      top: calc(50% - 100%);
+      left: calc(50% - 100%);
+      width: 200%;
+      height: 200%;
+      -webkit-transition: opacity 250ms linear;
+      transition: opacity 250ms linear;
+      border-radius: 50%;
+      opacity: 0;
+      pointer-events: none;
+      content: ""; }
+      @supports (background-color: color(green a(10%))) {
+        .mdc-button.mdc-button--primary::after {
+          background-color: color(var(--mdc-theme-primary, #3f51b5) a(12%)); } }
+    .mdc-button.mdc-button--primary.mdc-ripple-upgraded::after {
+      top: 0;
+      left: 0;
+      /* @alternate */
+      width: 100%;
+      width: var(--mdc-ripple-fg-size, 100%);
+      /* @alternate */
+      height: 100%;
+      height: var(--mdc-ripple-fg-size, 100%);
+      -webkit-transform: scale(0);
+              transform: scale(0);
+      -webkit-transform-origin: center center;
+              transform-origin: center center;
+      opacity: 0; }
+    .mdc-button.mdc-button--primary:not(.mdc-ripple-upgraded--unbounded)::after {
+      -webkit-transform-origin: center center;
+              transform-origin: center center; }
+    .mdc-button.mdc-button--primary.mdc-ripple-upgraded--unbounded::after {
+      /* @alternate */
+      top: 0;
+      top: var(--mdc-ripple-top, 0);
+      /* @alternate */
+      left: 0;
+      left: var(--mdc-ripple-left, 0);
+      /* @alternate */
+      width: 100%;
+      width: var(--mdc-ripple-fg-size, 100%);
+      /* @alternate */
+      height: 100%;
+      height: var(--mdc-ripple-fg-size, 100%);
+      -webkit-transform: scale(0);
+              transform: scale(0);
+      -webkit-transform-origin: center center;
+              transform-origin: center center; }
+    .mdc-button.mdc-button--primary.mdc-ripple-upgraded--foreground-activation::after {
+      -webkit-animation: 300ms mdc-ripple-fg-radius-in forwards, 83ms mdc-ripple-fg-opacity-in forwards;
+              animation: 300ms mdc-ripple-fg-radius-in forwards, 83ms mdc-ripple-fg-opacity-in forwards; }
+    .mdc-button.mdc-button--primary.mdc-ripple-upgraded--foreground-deactivation::after {
+      -webkit-transform: translate(var(--mdc-ripple-fg-translate-end, 0)) scale(var(--mdc-ripple-fg-scale, 1));
+              transform: translate(var(--mdc-ripple-fg-translate-end, 0)) scale(var(--mdc-ripple-fg-scale, 1));
+      -webkit-animation: 83ms mdc-ripple-fg-opacity-out;
+              animation: 83ms mdc-ripple-fg-opacity-out; }
+  .mdc-button.mdc-button--accent {
+    --mdc-ripple-surface-width: 0;
+    --mdc-ripple-surface-height: 0;
+    --mdc-ripple-fg-size: 0;
+    --mdc-ripple-left: 0;
+    --mdc-ripple-top: 0;
+    --mdc-ripple-fg-scale: 1;
+    --mdc-ripple-fg-translate-end: 0;
+    --mdc-ripple-fg-translate-start: 0;
+    will-change: transform, opacity;
+    -webkit-tap-highlight-color: transparent; }
+    .mdc-button.mdc-button--accent:not(.mdc-ripple-upgraded):hover::before, .mdc-button.mdc-button--accent:not(.mdc-ripple-upgraded):focus::before, .mdc-button.mdc-button--accent:not(.mdc-ripple-upgraded):active::after {
+      -webkit-transition-duration: 85ms;
+              transition-duration: 85ms;
+      opacity: .6; }
+    .mdc-button.mdc-button--accent::before {
+      /* @alternate */
+      background-color: rgba(255, 64, 129, 0.12);
+      position: absolute;
+      top: calc(50% - 100%);
+      left: calc(50% - 100%);
+      width: 200%;
+      height: 200%;
+      -webkit-transition: opacity 250ms linear;
+      transition: opacity 250ms linear;
+      border-radius: 50%;
+      opacity: 0;
+      pointer-events: none;
+      content: ""; }
+      @supports (background-color: color(green a(10%))) {
+        .mdc-button.mdc-button--accent::before {
+          background-color: color(var(--mdc-theme-accent, #ff4081) a(12%)); } }
+    .mdc-button.mdc-button--accent.mdc-ripple-upgraded::before {
+      top: calc(50% - 100%);
+      left: calc(50% - 100%);
+      width: 200%;
+      height: 200%;
+      /* @alternate */
+      -webkit-transform: scale(0);
+              transform: scale(0);
+      -webkit-transform: scale(var(--mdc-ripple-fg-scale, 0));
+              transform: scale(var(--mdc-ripple-fg-scale, 0)); }
+    .mdc-button.mdc-button--accent.mdc-ripple-upgraded--background-focused::before {
+      opacity: .99999; }
+    .mdc-button.mdc-button--accent.mdc-ripple-upgraded--background-active-fill::before {
+      -webkit-transition-duration: 120ms;
+              transition-duration: 120ms;
+      opacity: 1; }
+    .mdc-button.mdc-button--accent.mdc-ripple-upgraded--unbounded::before {
+      /* @alternate */
+      top: calc(50% - 50%);
+      top: var(--mdc-ripple-top, calc(50% - 50%));
+      /* @alternate */
+      left: calc(50% - 50%);
+      left: var(--mdc-ripple-left, calc(50% - 50%));
+      /* @alternate */
+      width: 100%;
+      width: var(--mdc-ripple-fg-size, 100%);
+      /* @alternate */
+      height: 100%;
+      height: var(--mdc-ripple-fg-size, 100%);
+      /* @alternate */
+      -webkit-transform: scale(0);
+              transform: scale(0);
+      -webkit-transform: scale(var(--mdc-ripple-fg-scale, 0));
+              transform: scale(var(--mdc-ripple-fg-scale, 0)); }
+    .mdc-button.mdc-button--accent::after {
+      /* @alternate */
+      background-color: rgba(255, 64, 129, 0.12);
+      position: absolute;
+      top: calc(50% - 100%);
+      left: calc(50% - 100%);
+      width: 200%;
+      height: 200%;
+      -webkit-transition: opacity 250ms linear;
+      transition: opacity 250ms linear;
+      border-radius: 50%;
+      opacity: 0;
+      pointer-events: none;
+      content: ""; }
+      @supports (background-color: color(green a(10%))) {
+        .mdc-button.mdc-button--accent::after {
+          background-color: color(var(--mdc-theme-accent, #ff4081) a(12%)); } }
+    .mdc-button.mdc-button--accent.mdc-ripple-upgraded::after {
+      top: 0;
+      left: 0;
+      /* @alternate */
+      width: 100%;
+      width: var(--mdc-ripple-fg-size, 100%);
+      /* @alternate */
+      height: 100%;
+      height: var(--mdc-ripple-fg-size, 100%);
+      -webkit-transform: scale(0);
+              transform: scale(0);
+      -webkit-transform-origin: center center;
+              transform-origin: center center;
+      opacity: 0; }
+    .mdc-button.mdc-button--accent:not(.mdc-ripple-upgraded--unbounded)::after {
+      -webkit-transform-origin: center center;
+              transform-origin: center center; }
+    .mdc-button.mdc-button--accent.mdc-ripple-upgraded--unbounded::after {
+      /* @alternate */
+      top: 0;
+      top: var(--mdc-ripple-top, 0);
+      /* @alternate */
+      left: 0;
+      left: var(--mdc-ripple-left, 0);
+      /* @alternate */
+      width: 100%;
+      width: var(--mdc-ripple-fg-size, 100%);
+      /* @alternate */
+      height: 100%;
+      height: var(--mdc-ripple-fg-size, 100%);
+      -webkit-transform: scale(0);
+              transform: scale(0);
+      -webkit-transform-origin: center center;
+              transform-origin: center center; }
+    .mdc-button.mdc-button--accent.mdc-ripple-upgraded--foreground-activation::after {
+      -webkit-animation: 300ms mdc-ripple-fg-radius-in forwards, 83ms mdc-ripple-fg-opacity-in forwards;
+              animation: 300ms mdc-ripple-fg-radius-in forwards, 83ms mdc-ripple-fg-opacity-in forwards; }
+    .mdc-button.mdc-button--accent.mdc-ripple-upgraded--foreground-deactivation::after {
+      -webkit-transform: translate(var(--mdc-ripple-fg-translate-end, 0)) scale(var(--mdc-ripple-fg-scale, 1));
+              transform: translate(var(--mdc-ripple-fg-translate-end, 0)) scale(var(--mdc-ripple-fg-scale, 1));
+      -webkit-animation: 83ms mdc-ripple-fg-opacity-out;
+              animation: 83ms mdc-ripple-fg-opacity-out; }
+  .mdc-button:active {
+    outline: none; }
+  .mdc-button:hover {
+    cursor: pointer; }
+  .mdc-button::-moz-focus-inner {
+    padding: 0;
+    border: 0; }
+  .mdc-button--dense {
+    height: 32px;
+    font-size: .8125rem;
+    line-height: 32px; }
+  .mdc-button--raised {
+    -webkit-box-shadow: 0px 3px 1px -2px rgba(0, 0, 0, 0.2), 0px 2px 2px 0px rgba(0, 0, 0, 0.14), 0px 1px 5px 0px rgba(0, 0, 0, 0.12);
+            box-shadow: 0px 3px 1px -2px rgba(0, 0, 0, 0.2), 0px 2px 2px 0px rgba(0, 0, 0, 0.14), 0px 1px 5px 0px rgba(0, 0, 0, 0.12);
+    -webkit-transition: -webkit-box-shadow 280ms cubic-bezier(0.4, 0, 0.2, 1);
+    transition: -webkit-box-shadow 280ms cubic-bezier(0.4, 0, 0.2, 1);
+    transition: box-shadow 280ms cubic-bezier(0.4, 0, 0.2, 1);
+    transition: box-shadow 280ms cubic-bezier(0.4, 0, 0.2, 1), -webkit-box-shadow 280ms cubic-bezier(0.4, 0, 0.2, 1);
+    will-change: box-shadow;
+    min-width: 88px; }
+    .mdc-button--raised:active {
+      -webkit-box-shadow: 0px 5px 5px -3px rgba(0, 0, 0, 0.2), 0px 8px 10px 1px rgba(0, 0, 0, 0.14), 0px 3px 14px 2px rgba(0, 0, 0, 0.12);
+              box-shadow: 0px 5px 5px -3px rgba(0, 0, 0, 0.2), 0px 8px 10px 1px rgba(0, 0, 0, 0.14), 0px 3px 14px 2px rgba(0, 0, 0, 0.12); }
+    .mdc-button--raised.mdc-button--primary {
+      --mdc-ripple-surface-width: 0;
+      --mdc-ripple-surface-height: 0;
+      --mdc-ripple-fg-size: 0;
+      --mdc-ripple-left: 0;
+      --mdc-ripple-top: 0;
+      --mdc-ripple-fg-scale: 1;
+      --mdc-ripple-fg-translate-end: 0;
+      --mdc-ripple-fg-translate-start: 0;
+      will-change: transform, opacity;
+      -webkit-tap-highlight-color: transparent; }
+      .mdc-button--raised.mdc-button--primary:not(.mdc-ripple-upgraded):hover::before, .mdc-button--raised.mdc-button--primary:not(.mdc-ripple-upgraded):focus::before, .mdc-button--raised.mdc-button--primary:not(.mdc-ripple-upgraded):active::after {
+        -webkit-transition-duration: 85ms;
+                transition-duration: 85ms;
+        opacity: .6; }
+      .mdc-button--raised.mdc-button--primary::before {
+        background-color: rgba(255, 255, 255, 0.14);
+        position: absolute;
+        top: calc(50% - 100%);
+        left: calc(50% - 100%);
+        width: 200%;
+        height: 200%;
+        -webkit-transition: opacity 250ms linear;
+        transition: opacity 250ms linear;
+        border-radius: 50%;
+        opacity: 0;
+        pointer-events: none;
+        content: ""; }
+      .mdc-button--raised.mdc-button--primary.mdc-ripple-upgraded::before {
+        top: calc(50% - 100%);
+        left: calc(50% - 100%);
+        width: 200%;
+        height: 200%;
+        /* @alternate */
+        -webkit-transform: scale(0);
+                transform: scale(0);
+        -webkit-transform: scale(var(--mdc-ripple-fg-scale, 0));
+                transform: scale(var(--mdc-ripple-fg-scale, 0)); }
+      .mdc-button--raised.mdc-button--primary.mdc-ripple-upgraded--background-focused::before {
+        opacity: .99999; }
+      .mdc-button--raised.mdc-button--primary.mdc-ripple-upgraded--background-active-fill::before {
+        -webkit-transition-duration: 120ms;
+                transition-duration: 120ms;
+        opacity: 1; }
+      .mdc-button--raised.mdc-button--primary.mdc-ripple-upgraded--unbounded::before {
+        /* @alternate */
+        top: calc(50% - 50%);
+        top: var(--mdc-ripple-top, calc(50% - 50%));
+        /* @alternate */
+        left: calc(50% - 50%);
+        left: var(--mdc-ripple-left, calc(50% - 50%));
+        /* @alternate */
+        width: 100%;
+        width: var(--mdc-ripple-fg-size, 100%);
+        /* @alternate */
+        height: 100%;
+        height: var(--mdc-ripple-fg-size, 100%);
+        /* @alternate */
+        -webkit-transform: scale(0);
+                transform: scale(0);
+        -webkit-transform: scale(var(--mdc-ripple-fg-scale, 0));
+                transform: scale(var(--mdc-ripple-fg-scale, 0)); }
+      .mdc-button--raised.mdc-button--primary::after {
+        background-color: rgba(255, 255, 255, 0.14);
+        position: absolute;
+        top: calc(50% - 100%);
+        left: calc(50% - 100%);
+        width: 200%;
+        height: 200%;
+        -webkit-transition: opacity 250ms linear;
+        transition: opacity 250ms linear;
+        border-radius: 50%;
+        opacity: 0;
+        pointer-events: none;
+        content: ""; }
+      .mdc-button--raised.mdc-button--primary.mdc-ripple-upgraded::after {
+        top: 0;
+        left: 0;
+        /* @alternate */
+        width: 100%;
+        width: var(--mdc-ripple-fg-size, 100%);
+        /* @alternate */
+        height: 100%;
+        height: var(--mdc-ripple-fg-size, 100%);
+        -webkit-transform: scale(0);
+                transform: scale(0);
+        -webkit-transform-origin: center center;
+                transform-origin: center center;
+        opacity: 0; }
+      .mdc-button--raised.mdc-button--primary:not(.mdc-ripple-upgraded--unbounded)::after {
+        -webkit-transform-origin: center center;
+                transform-origin: center center; }
+      .mdc-button--raised.mdc-button--primary.mdc-ripple-upgraded--unbounded::after {
+        /* @alternate */
+        top: 0;
+        top: var(--mdc-ripple-top, 0);
+        /* @alternate */
+        left: 0;
+        left: var(--mdc-ripple-left, 0);
+        /* @alternate */
+        width: 100%;
+        width: var(--mdc-ripple-fg-size, 100%);
+        /* @alternate */
+        height: 100%;
+        height: var(--mdc-ripple-fg-size, 100%);
+        -webkit-transform: scale(0);
+                transform: scale(0);
+        -webkit-transform-origin: center center;
+                transform-origin: center center; }
+      .mdc-button--raised.mdc-button--primary.mdc-ripple-upgraded--foreground-activation::after {
+        -webkit-animation: 300ms mdc-ripple-fg-radius-in forwards, 83ms mdc-ripple-fg-opacity-in forwards;
+                animation: 300ms mdc-ripple-fg-radius-in forwards, 83ms mdc-ripple-fg-opacity-in forwards; }
+      .mdc-button--raised.mdc-button--primary.mdc-ripple-upgraded--foreground-deactivation::after {
+        -webkit-transform: translate(var(--mdc-ripple-fg-translate-end, 0)) scale(var(--mdc-ripple-fg-scale, 1));
+                transform: translate(var(--mdc-ripple-fg-translate-end, 0)) scale(var(--mdc-ripple-fg-scale, 1));
+        -webkit-animation: 83ms mdc-ripple-fg-opacity-out;
+                animation: 83ms mdc-ripple-fg-opacity-out; }
+    .mdc-button--raised.mdc-button--accent {
+      --mdc-ripple-surface-width: 0;
+      --mdc-ripple-surface-height: 0;
+      --mdc-ripple-fg-size: 0;
+      --mdc-ripple-left: 0;
+      --mdc-ripple-top: 0;
+      --mdc-ripple-fg-scale: 1;
+      --mdc-ripple-fg-translate-end: 0;
+      --mdc-ripple-fg-translate-start: 0;
+      will-change: transform, opacity;
+      -webkit-tap-highlight-color: transparent; }
+      .mdc-button--raised.mdc-button--accent:not(.mdc-ripple-upgraded):hover::before, .mdc-button--raised.mdc-button--accent:not(.mdc-ripple-upgraded):focus::before, .mdc-button--raised.mdc-button--accent:not(.mdc-ripple-upgraded):active::after {
+        -webkit-transition-duration: 85ms;
+                transition-duration: 85ms;
+        opacity: .6; }
+      .mdc-button--raised.mdc-button--accent::before {
+        background-color: rgba(255, 255, 255, 0.14);
+        position: absolute;
+        top: calc(50% - 100%);
+        left: calc(50% - 100%);
+        width: 200%;
+        height: 200%;
+        -webkit-transition: opacity 250ms linear;
+        transition: opacity 250ms linear;
+        border-radius: 50%;
+        opacity: 0;
+        pointer-events: none;
+        content: ""; }
+      .mdc-button--raised.mdc-button--accent.mdc-ripple-upgraded::before {
+        top: calc(50% - 100%);
+        left: calc(50% - 100%);
+        width: 200%;
+        height: 200%;
+        /* @alternate */
+        -webkit-transform: scale(0);
+                transform: scale(0);
+        -webkit-transform: scale(var(--mdc-ripple-fg-scale, 0));
+                transform: scale(var(--mdc-ripple-fg-scale, 0)); }
+      .mdc-button--raised.mdc-button--accent.mdc-ripple-upgraded--background-focused::before {
+        opacity: .99999; }
+      .mdc-button--raised.mdc-button--accent.mdc-ripple-upgraded--background-active-fill::before {
+        -webkit-transition-duration: 120ms;
+                transition-duration: 120ms;
+        opacity: 1; }
+      .mdc-button--raised.mdc-button--accent.mdc-ripple-upgraded--unbounded::before {
+        /* @alternate */
+        top: calc(50% - 50%);
+        top: var(--mdc-ripple-top, calc(50% - 50%));
+        /* @alternate */
+        left: calc(50% - 50%);
+        left: var(--mdc-ripple-left, calc(50% - 50%));
+        /* @alternate */
+        width: 100%;
+        width: var(--mdc-ripple-fg-size, 100%);
+        /* @alternate */
+        height: 100%;
+        height: var(--mdc-ripple-fg-size, 100%);
+        /* @alternate */
+        -webkit-transform: scale(0);
+                transform: scale(0);
+        -webkit-transform: scale(var(--mdc-ripple-fg-scale, 0));
+                transform: scale(var(--mdc-ripple-fg-scale, 0)); }
+      .mdc-button--raised.mdc-button--accent::after {
+        background-color: rgba(255, 255, 255, 0.14);
+        position: absolute;
+        top: calc(50% - 100%);
+        left: calc(50% - 100%);
+        width: 200%;
+        height: 200%;
+        -webkit-transition: opacity 250ms linear;
+        transition: opacity 250ms linear;
+        border-radius: 50%;
+        opacity: 0;
+        pointer-events: none;
+        content: ""; }
+      .mdc-button--raised.mdc-button--accent.mdc-ripple-upgraded::after {
+        top: 0;
+        left: 0;
+        /* @alternate */
+        width: 100%;
+        width: var(--mdc-ripple-fg-size, 100%);
+        /* @alternate */
+        height: 100%;
+        height: var(--mdc-ripple-fg-size, 100%);
+        -webkit-transform: scale(0);
+                transform: scale(0);
+        -webkit-transform-origin: center center;
+                transform-origin: center center;
+        opacity: 0; }
+      .mdc-button--raised.mdc-button--accent:not(.mdc-ripple-upgraded--unbounded)::after {
+        -webkit-transform-origin: center center;
+                transform-origin: center center; }
+      .mdc-button--raised.mdc-button--accent.mdc-ripple-upgraded--unbounded::after {
+        /* @alternate */
+        top: 0;
+        top: var(--mdc-ripple-top, 0);
+        /* @alternate */
+        left: 0;
+        left: var(--mdc-ripple-left, 0);
+        /* @alternate */
+        width: 100%;
+        width: var(--mdc-ripple-fg-size, 100%);
+        /* @alternate */
+        height: 100%;
+        height: var(--mdc-ripple-fg-size, 100%);
+        -webkit-transform: scale(0);
+                transform: scale(0);
+        -webkit-transform-origin: center center;
+                transform-origin: center center; }
+      .mdc-button--raised.mdc-button--accent.mdc-ripple-upgraded--foreground-activation::after {
+        -webkit-animation: 300ms mdc-ripple-fg-radius-in forwards, 83ms mdc-ripple-fg-opacity-in forwards;
+                animation: 300ms mdc-ripple-fg-radius-in forwards, 83ms mdc-ripple-fg-opacity-in forwards; }
+      .mdc-button--raised.mdc-button--accent.mdc-ripple-upgraded--foreground-deactivation::after {
+        -webkit-transform: translate(var(--mdc-ripple-fg-translate-end, 0)) scale(var(--mdc-ripple-fg-scale, 1));
+                transform: translate(var(--mdc-ripple-fg-translate-end, 0)) scale(var(--mdc-ripple-fg-scale, 1));
+        -webkit-animation: 83ms mdc-ripple-fg-opacity-out;
+                animation: 83ms mdc-ripple-fg-opacity-out; }
+    .mdc-button--theme-dark .mdc-button--raised,
+    .mdc-theme--dark .mdc-button--raised {
+      /* @alternate */
+      background-color: #3f51b5;
+      background-color: var(--mdc-theme-primary, #3f51b5);
+      /* @alternate */
+      color: white;
+      color: var(--mdc-theme-text-primary-on-primary, white); }
+      .mdc-button--theme-dark .mdc-button--raised::before,
+      .mdc-theme--dark .mdc-button--raised::before {
+        color: black; }
+  .mdc-button--primary {
+    /* @alternate */
+    color: #3f51b5;
+    color: var(--mdc-theme-primary, #3f51b5); }
+    .mdc-button--theme-dark .mdc-button--primary,
+    .mdc-theme--dark .mdc-button--primary {
+      /* @alternate */
+      color: #3f51b5;
+      color: var(--mdc-theme-primary, #3f51b5); }
+    .mdc-button--primary.mdc-button--raised {
+      /* @alternate */
+      background-color: #3f51b5;
+      background-color: var(--mdc-theme-primary, #3f51b5);
+      /* @alternate */
+      color: white;
+      color: var(--mdc-theme-text-primary-on-primary, white); }
+      .mdc-button--primary.mdc-button--raised::before {
+        color: black; }
+  .mdc-button--accent {
+    /* @alternate */
+    color: #ff4081;
+    color: var(--mdc-theme-accent, #ff4081); }
+    .mdc-button--theme-dark .mdc-button--accent,
+    .mdc-theme--dark .mdc-button--accent {
+      /* @alternate */
+      color: #ff4081;
+      color: var(--mdc-theme-accent, #ff4081); }
+    .mdc-button--accent.mdc-button--raised {
+      /* @alternate */
+      background-color: #ff4081;
+      background-color: var(--mdc-theme-accent, #ff4081);
+      /* @alternate */
+      color: white;
+      color: var(--mdc-theme-text-primary-on-accent, white); }
+      .mdc-button--accent.mdc-button--raised::before {
+        color: black; }
+  .mdc-button--compact {
+    padding: 0 8px; }
+  fieldset:disabled .mdc-button, .mdc-button:disabled {
+    color: rgba(0, 0, 0, 0.26);
+    cursor: default;
+    pointer-events: none; }
+    .mdc-button--theme-dark fieldset:disabled .mdc-button,
+    .mdc-theme--dark fieldset:disabled .mdc-button, .mdc-button--theme-dark .mdc-button:disabled,
+    .mdc-theme--dark .mdc-button:disabled {
+      color: rgba(255, 255, 255, 0.3); }
+  fieldset:disabled .mdc-button--raised, .mdc-button--raised:disabled {
+    -webkit-box-shadow: 0px 0px 0px 0px rgba(0, 0, 0, 0.2), 0px 0px 0px 0px rgba(0, 0, 0, 0.14), 0px 0px 0px 0px rgba(0, 0, 0, 0.12);
+            box-shadow: 0px 0px 0px 0px rgba(0, 0, 0, 0.2), 0px 0px 0px 0px rgba(0, 0, 0, 0.14), 0px 0px 0px 0px rgba(0, 0, 0, 0.12);
+    background-color: rgba(0, 0, 0, 0.12);
+    pointer-events: none; }
+    .mdc-button--theme-dark fieldset:disabled .mdc-button--raised,
+    .mdc-theme--dark fieldset:disabled .mdc-button--raised, .mdc-button--theme-dark .mdc-button--raised:disabled,
+    .mdc-theme--dark .mdc-button--raised:disabled {
+      background-color: rgba(255, 255, 255, 0.12); }

+ 83 - 0
support/client/lib/vwf/view/lib/mdc/dist/mdc.button.css-entry

@@ -0,0 +1,83 @@
+/*!
+ Material Components for the web
+ Copyright (c) 2017 Google Inc.
+ License: Apache-2.0
+*/
+/******/ (function(modules) { // webpackBootstrap
+/******/ 	// The module cache
+/******/ 	var installedModules = {};
+/******/
+/******/ 	// The require function
+/******/ 	function __webpack_require__(moduleId) {
+/******/
+/******/ 		// Check if module is in cache
+/******/ 		if(installedModules[moduleId]) {
+/******/ 			return installedModules[moduleId].exports;
+/******/ 		}
+/******/ 		// Create a new module (and put it into the cache)
+/******/ 		var module = installedModules[moduleId] = {
+/******/ 			i: moduleId,
+/******/ 			l: false,
+/******/ 			exports: {}
+/******/ 		};
+/******/
+/******/ 		// Execute the module function
+/******/ 		modules[moduleId].call(module.exports, module, module.exports, __webpack_require__);
+/******/
+/******/ 		// Flag the module as loaded
+/******/ 		module.l = true;
+/******/
+/******/ 		// Return the exports of the module
+/******/ 		return module.exports;
+/******/ 	}
+/******/
+/******/
+/******/ 	// expose the modules object (__webpack_modules__)
+/******/ 	__webpack_require__.m = modules;
+/******/
+/******/ 	// expose the module cache
+/******/ 	__webpack_require__.c = installedModules;
+/******/
+/******/ 	// identity function for calling harmony imports with the correct context
+/******/ 	__webpack_require__.i = function(value) { return value; };
+/******/
+/******/ 	// define getter function for harmony exports
+/******/ 	__webpack_require__.d = function(exports, name, getter) {
+/******/ 		if(!__webpack_require__.o(exports, name)) {
+/******/ 			Object.defineProperty(exports, name, {
+/******/ 				configurable: false,
+/******/ 				enumerable: true,
+/******/ 				get: getter
+/******/ 			});
+/******/ 		}
+/******/ 	};
+/******/
+/******/ 	// getDefaultExport function for compatibility with non-harmony modules
+/******/ 	__webpack_require__.n = function(module) {
+/******/ 		var getter = module && module.__esModule ?
+/******/ 			function getDefault() { return module['default']; } :
+/******/ 			function getModuleExports() { return module; };
+/******/ 		__webpack_require__.d(getter, 'a', getter);
+/******/ 		return getter;
+/******/ 	};
+/******/
+/******/ 	// Object.prototype.hasOwnProperty.call
+/******/ 	__webpack_require__.o = function(object, property) { return Object.prototype.hasOwnProperty.call(object, property); };
+/******/
+/******/ 	// __webpack_public_path__
+/******/ 	__webpack_require__.p = "/assets/";
+/******/
+/******/ 	// Load entry module and return exports
+/******/ 	return __webpack_require__(__webpack_require__.s = 2);
+/******/ })
+/************************************************************************/
+/******/ ({
+
+/***/ 2:
+/***/ (function(module, exports) {
+
+// removed by extract-text-webpack-plugin
+
+/***/ })
+
+/******/ });

+ 457 - 0
support/client/lib/vwf/view/lib/mdc/dist/mdc.card.css

@@ -0,0 +1,457 @@
+/*!
+ Material Components for the web
+ Copyright (c) 2017 Google Inc.
+ License: Apache-2.0
+*/
+/**
+ * The css property used for elevation. In most cases this should not be changed. It is exposed
+ * as a variable for abstraction / easy use when needing to reference the property directly, for
+ * example in a `will-change` rule.
+ */
+/**
+ * The default duration value for elevation transitions.
+ */
+/**
+ * The default easing value for elevation transitions.
+ */
+/**
+ * Applies the correct css rules to an element to give it the elevation specified by $z-value.
+ * The $z-value must be between 0 and 24.
+ */
+/**
+ * Returns a string that can be used as the value for a `transition` property for elevation.
+ * Calling this function directly is useful in situations where a component needs to transition
+ * more than one property.
+ *
+ * ```scss
+ * .foo {
+ *   transition: mdc-elevation-transition-rule(), opacity 100ms ease;
+ *   will-change: $mdc-elevation-property, opacity;
+ * }
+ * ```
+ */
+/**
+ * Applies the correct css rules needed to have an element transition between elevations.
+ * This mixin should be applied to elements whose elevation values will change depending on their
+ * context (e.g. when active or disabled).
+ */
+/*
+  Precomputed linear color channel values, for use in contrast calculations.
+  See https://www.w3.org/TR/WCAG20-TECHS/G17.html#G17-tests
+
+  Algorithm, for c in 0 to 255:
+  f(c) {
+    c = c / 255;
+    return c < 0.03928 ? c / 12.92 : Math.pow((c + 0.055) / 1.055, 2.4);
+  }
+
+  This lookup table is needed since there is no `pow` in SASS.
+*/
+/**
+ * Calculate the luminance for a color.
+ * See https://www.w3.org/TR/WCAG20-TECHS/G17.html#G17-tests
+ */
+/**
+ * Calculate the contrast ratio between two colors.
+ * See https://www.w3.org/TR/WCAG20-TECHS/G17.html#G17-tests
+ */
+/**
+ * Determine whether to use dark or light text on top of given color.
+ * Returns "dark" for dark text and "light" for light text.
+ */
+/*
+  Main theme colors.
+  If you're a user customizing your color scheme in SASS, these are probably the only variables you need to change.
+*/
+/* Indigo 500 */
+/* Pink A200 */
+/* White */
+/* Which set of text colors to use for each main theme color (light or dark) */
+/* Text colors according to light vs dark and text type */
+/* Primary text colors for each of the theme colors */
+/**
+ * Applies the correct theme color style to the specified property.
+ * $property is typically color or background-color, but can be any CSS property that accepts color values.
+ * $style should be one of the map keys in $mdc-theme-property-values (_variables.scss).
+ */
+/**
+ * Creates a rule to be used in MDC-Web components for dark theming, and applies the provided contents.
+ * Should provide the $root-selector option if applied to anything other than the root selector.
+ * When used with a modifier class, provide a second argument of `true` for the $compound parameter
+ * to specify that this should be attached as a compound class.
+ *
+ * Usage example:
+ *
+ * ```scss
+ * .mdc-foo {
+ *   color: black;
+ *
+ *   @include mdc-theme-dark {
+ *     color: white;
+ *   }
+ *
+ *   &__bar {
+ *     background: black;
+ *
+ *     @include mdc-theme-dark(".mdc-foo") {
+ *       background: white;
+ *     }
+ *   }
+ * }
+ *
+ * .mdc-foo--disabled {
+ *   opacity: .38;
+ *
+ *   @include mdc-theme-dark(".mdc-foo", true) {
+ *     opacity: .5;
+ *   }
+ * }
+ * ```
+ */
+/* TODO(sgomes): Figure out what to do about desktop font sizes. */
+/* TODO(sgomes): Figure out what to do about i18n and i18n font sizes. */
+/**
+ * Creates a rule that will be applied when an MDC-Web component is within the context of an RTL layout.
+ *
+ * Usage Example:
+ * ```scss
+ * .mdc-foo {
+ *   position: absolute;
+ *   left: 0;
+ *
+ *   @include mdc-rtl {
+ *     left: auto;
+ *     right: 0;
+ *   }
+ *
+ *   &__bar {
+ *     margin-left: 4px;
+ *     @include mdc-rtl(".mdc-foo") {
+ *       margin-left: auto;
+ *       margin-right: 4px;
+ *     }
+ *   }
+ * }
+ *
+ * .mdc-foo--mod {
+ *   padding-left: 4px;
+ *
+ *   @include mdc-rtl {
+ *     padding-left: auto;
+ *     padding-right: 4px;
+ *   }
+ * }
+ * ```
+ *
+ * Note that this works by checking for [dir="rtl"] on an ancestor element. While this will work
+ * in most cases, it will in some cases lead to false negatives, e.g.
+ *
+ * ```html
+ * <html dir="rtl">
+ *   <!-- ... -->
+ *   <div dir="ltr">
+ *     <div class="mdc-foo">Styled incorrectly as RTL!</div>
+ *   </div>
+ * </html>
+ * ```
+ *
+ * In the future, selectors such as :dir (http://mdn.io/:dir) will help us mitigate this.
+ */
+/**
+ * Takes a base box-model property - e.g. margin / border / padding - along with a default
+ * direction and value, and emits rules which apply the value to the
+ * "<base-property>-<default-direction>" property by default, but flips the direction
+ * when within an RTL context.
+ *
+ * For example:
+ *
+ * ```scss
+ * .mdc-foo {
+ *   @include mdc-rtl-reflexive-box(margin, left, 8px);
+ * }
+ * ```
+ * is equivalent to:
+ *
+ * ```scss
+ * .mdc-foo {
+ *   margin-left: 8px;
+ *
+ *   @include mdc-rtl {
+ *     margin-right: 8px;
+ *     margin-left: 0;
+ *   }
+ * }
+ * ```
+ * whereas:
+ *
+ * ```scss
+ * .mdc-foo {
+ *   @include mdc-rtl-reflexive-box(margin, right, 8px);
+ * }
+ * ```
+ * is equivalent to:
+ *
+ * ```scss
+ * .mdc-foo {
+ *   margin-right: 8px;
+ *
+ *   @include mdc-rtl {
+ *     margin-right: 0;
+ *     margin-left: 8px;
+ *   }
+ * }
+ * ```
+ *
+ * You can also pass a 4th optional $root-selector argument which will be forwarded to `mdc-rtl`,
+ * e.g. `@include mdc-rtl-reflexive-box(margin, left, 8px, ".mdc-component")`.
+ *
+ * Note that this function will always zero out the original value in an RTL context. If you're
+ * trying to flip the values, use mdc-rtl-reflexive-property().
+ */
+/**
+ * Takes a base property and emits rules that assign <base-property>-left to <left-value> and
+ * <base-property>-right to <right-value> in a LTR context, and vice versa in a RTL context.
+ * For example:
+ *
+ * ```scss
+ * .mdc-foo {
+ *   @include mdc-rtl-reflexive-property(margin, auto, 12px);
+ * }
+ * ```
+ * is equivalent to:
+ *
+ * ```scss
+ * .mdc-foo {
+ *   margin-left: auto;
+ *   margin-right: 12px;
+ *
+ *   @include mdc-rtl {
+ *     margin-left: 12px;
+ *     margin-right: auto;
+ *   }
+ * }
+ * ```
+ *
+ * A 4th optional $root-selector argument can be given, which will be passed to `mdc-rtl`.
+ */
+/**
+ * Takes an argument specifying a horizontal position property (either "left" or "right") as well
+ * as a value, and applies that value to the specified position in a LTR context, and flips it in a
+ * RTL context. For example:
+ *
+ * ```scss
+ * .mdc-foo {
+ *   @include mdc-rtl-reflexive-position(left, 0);
+ *   position: absolute;
+ * }
+ * ```
+ * is equivalent to:
+ *
+ * ```scss
+ *  .mdc-foo {
+ *    position: absolute;
+ *    left: 0;
+ *    right: initial;
+ *
+ *    @include mdc-rtl {
+ *      right: 0;
+ *      left: initial;
+ *    }
+ *  }
+ * ```
+ * An optional third $root-selector argument may also be given, which is passed to `mdc-rtl`.
+ */
+.mdc-card {
+  -webkit-box-shadow: 0px 3px 1px -2px rgba(0, 0, 0, 0.2), 0px 2px 2px 0px rgba(0, 0, 0, 0.14), 0px 1px 5px 0px rgba(0, 0, 0, 0.12);
+          box-shadow: 0px 3px 1px -2px rgba(0, 0, 0, 0.2), 0px 2px 2px 0px rgba(0, 0, 0, 0.14), 0px 1px 5px 0px rgba(0, 0, 0, 0.12);
+  display: -webkit-box;
+  display: -ms-flexbox;
+  display: flex;
+  -webkit-box-orient: vertical;
+  -webkit-box-direction: normal;
+      -ms-flex-direction: column;
+          flex-direction: column;
+  -webkit-box-pack: end;
+      -ms-flex-pack: end;
+          justify-content: flex-end;
+  padding: 0;
+  -webkit-box-sizing: border-box;
+          box-sizing: border-box;
+  border-radius: 2px;
+  overflow: hidden; }
+  .mdc-card__primary {
+    padding: 16px; }
+    .mdc-card__primary .mdc-card__title--large {
+      padding-top: 8px; }
+    .mdc-card__primary:last-child {
+      padding-bottom: 24px; }
+  .mdc-card__supporting-text {
+    padding: 8px 16px;
+    -webkit-box-sizing: border-box;
+            box-sizing: border-box;
+    font-family: Roboto, sans-serif;
+    -moz-osx-font-smoothing: grayscale;
+    -webkit-font-smoothing: antialiased;
+    font-size: 0.875rem;
+    font-weight: 400;
+    letter-spacing: 0.04em;
+    line-height: 1.25rem;
+    text-decoration: inherit;
+    text-transform: inherit;
+    /* @alternate */
+    color: rgba(0, 0, 0, 0.87);
+    color: var(--mdc-theme-text-primary-on-light, rgba(0, 0, 0, 0.87)); }
+    .mdc-card--theme-dark .mdc-card__supporting-text,
+    .mdc-theme--dark .mdc-card__supporting-text {
+      /* @alternate */
+      color: white;
+      color: var(--mdc-theme-text-primary-on-dark, white); }
+    .mdc-card__primary + .mdc-card__supporting-text {
+      margin-top: -8px;
+      padding-top: 0; }
+    .mdc-card__supporting-text:last-child {
+      padding-bottom: 24px; }
+  .mdc-card__actions {
+    display: -webkit-box;
+    display: -ms-flexbox;
+    display: flex;
+    padding: 8px;
+    -webkit-box-sizing: border-box;
+            box-sizing: border-box; }
+    .mdc-card--theme-dark .mdc-card__actions,
+    .mdc-theme--dark .mdc-card__actions {
+      /* @alternate */
+      color: white;
+      color: var(--mdc-theme-text-primary-on-dark, white); }
+    .mdc-card__actions .mdc-card__action {
+      margin: 0 8px 0 0; }
+      [dir="rtl"] .mdc-card__actions .mdc-card__action, .mdc-card__actions .mdc-card__action[dir="rtl"] {
+        margin: 0 0 0 8px; }
+    .mdc-card__actions .mdc-card__action:last-child {
+      margin-left: 0;
+      margin-right: 0; }
+      [dir="rtl"] .mdc-card__actions .mdc-card__action:last-child, .mdc-card__actions .mdc-card__action:last-child[dir="rtl"] {
+        margin-left: 0;
+        margin-right: 0; }
+    .mdc-card__actions--vertical {
+      -webkit-box-orient: vertical;
+      -webkit-box-direction: normal;
+          -ms-flex-flow: column;
+              flex-flow: column;
+      -webkit-box-align: start;
+          -ms-flex-align: start;
+              align-items: flex-start; }
+      .mdc-card__actions--vertical .mdc-card__action {
+        margin: 0 0 4px; }
+      .mdc-card__actions--vertical .mdc-card__action:last-child {
+        margin-bottom: 0; }
+  .mdc-card__media {
+    display: -webkit-box;
+    display: -ms-flexbox;
+    display: flex;
+    -webkit-box-orient: vertical;
+    -webkit-box-direction: normal;
+        -ms-flex-direction: column;
+            flex-direction: column;
+    -webkit-box-pack: end;
+        -ms-flex-pack: end;
+            justify-content: flex-end;
+    padding: 16px;
+    -webkit-box-sizing: border-box;
+            box-sizing: border-box; }
+  .mdc-card__media-item {
+    display: inline-block;
+    width: auto;
+    height: 80px;
+    margin: 16px 0 0;
+    padding: 0; }
+    .mdc-card__media-item--1dot5x {
+      width: auto;
+      height: 120px; }
+    .mdc-card__media-item--2x {
+      width: auto;
+      height: 160px; }
+    .mdc-card__media-item--3x {
+      width: auto;
+      height: 240px; }
+  .mdc-card__title {
+    font-family: Roboto, sans-serif;
+    -moz-osx-font-smoothing: grayscale;
+    -webkit-font-smoothing: antialiased;
+    font-size: 0.875rem;
+    font-weight: 500;
+    letter-spacing: 0.04em;
+    line-height: 1.5rem;
+    text-decoration: inherit;
+    text-transform: inherit;
+    /* @alternate */
+    color: rgba(0, 0, 0, 0.87);
+    color: var(--mdc-theme-text-primary-on-light, rgba(0, 0, 0, 0.87));
+    margin: -.063rem 0; }
+    .mdc-card--theme-dark .mdc-card__title,
+    .mdc-theme--dark .mdc-card__title {
+      /* @alternate */
+      color: white;
+      color: var(--mdc-theme-text-primary-on-dark, white); }
+  .mdc-card__title--large {
+    font-family: Roboto, sans-serif;
+    -moz-osx-font-smoothing: grayscale;
+    -webkit-font-smoothing: antialiased;
+    font-size: 1.5rem;
+    font-weight: 400;
+    letter-spacing: normal;
+    line-height: 2rem;
+    text-decoration: inherit;
+    text-transform: inherit;
+    margin: 0; }
+  .mdc-card__subtitle {
+    font-family: Roboto, sans-serif;
+    -moz-osx-font-smoothing: grayscale;
+    -webkit-font-smoothing: antialiased;
+    font-size: 0.875rem;
+    font-weight: 400;
+    letter-spacing: 0.04em;
+    line-height: 1.25rem;
+    text-decoration: inherit;
+    text-transform: inherit;
+    /* @alternate */
+    color: rgba(0, 0, 0, 0.87);
+    color: var(--mdc-theme-text-primary-on-light, rgba(0, 0, 0, 0.87));
+    margin: -.063rem 0; }
+    .mdc-card--theme-dark .mdc-card__subtitle,
+    .mdc-theme--dark .mdc-card__subtitle {
+      /* @alternate */
+      color: white;
+      color: var(--mdc-theme-text-primary-on-dark, white); }
+  .mdc-card__horizontal-block {
+    display: -webkit-box;
+    display: -ms-flexbox;
+    display: flex;
+    -webkit-box-orient: horizontal;
+    -webkit-box-direction: normal;
+        -ms-flex-direction: row;
+            flex-direction: row;
+    -webkit-box-align: start;
+        -ms-flex-align: start;
+            align-items: flex-start;
+    -webkit-box-pack: justify;
+        -ms-flex-pack: justify;
+            justify-content: space-between;
+    -webkit-box-sizing: border-box;
+            box-sizing: border-box;
+    padding: 0;
+    padding-left: 0;
+    padding-right: 16px; }
+    [dir="rtl"] .mdc-card__horizontal-block, .mdc-card__horizontal-block[dir="rtl"] {
+      padding-left: 16px;
+      padding-right: 0; }
+    .mdc-card__horizontal-block .mdc-card__actions--vertical {
+      margin: 16px; }
+    .mdc-card__horizontal-block .mdc-card__media-item {
+      margin-left: 16px;
+      margin-right: 0; }
+      [dir="rtl"] .mdc-card__horizontal-block .mdc-card__media-item, .mdc-card__horizontal-block .mdc-card__media-item[dir="rtl"] {
+        margin-left: 0;
+        margin-right: 16px; }
+    .mdc-card__horizontal-block .mdc-card__media-item--3x {
+      margin-bottom: 16px; }

+ 83 - 0
support/client/lib/vwf/view/lib/mdc/dist/mdc.card.css-entry

@@ -0,0 +1,83 @@
+/*!
+ Material Components for the web
+ Copyright (c) 2017 Google Inc.
+ License: Apache-2.0
+*/
+/******/ (function(modules) { // webpackBootstrap
+/******/ 	// The module cache
+/******/ 	var installedModules = {};
+/******/
+/******/ 	// The require function
+/******/ 	function __webpack_require__(moduleId) {
+/******/
+/******/ 		// Check if module is in cache
+/******/ 		if(installedModules[moduleId]) {
+/******/ 			return installedModules[moduleId].exports;
+/******/ 		}
+/******/ 		// Create a new module (and put it into the cache)
+/******/ 		var module = installedModules[moduleId] = {
+/******/ 			i: moduleId,
+/******/ 			l: false,
+/******/ 			exports: {}
+/******/ 		};
+/******/
+/******/ 		// Execute the module function
+/******/ 		modules[moduleId].call(module.exports, module, module.exports, __webpack_require__);
+/******/
+/******/ 		// Flag the module as loaded
+/******/ 		module.l = true;
+/******/
+/******/ 		// Return the exports of the module
+/******/ 		return module.exports;
+/******/ 	}
+/******/
+/******/
+/******/ 	// expose the modules object (__webpack_modules__)
+/******/ 	__webpack_require__.m = modules;
+/******/
+/******/ 	// expose the module cache
+/******/ 	__webpack_require__.c = installedModules;
+/******/
+/******/ 	// identity function for calling harmony imports with the correct context
+/******/ 	__webpack_require__.i = function(value) { return value; };
+/******/
+/******/ 	// define getter function for harmony exports
+/******/ 	__webpack_require__.d = function(exports, name, getter) {
+/******/ 		if(!__webpack_require__.o(exports, name)) {
+/******/ 			Object.defineProperty(exports, name, {
+/******/ 				configurable: false,
+/******/ 				enumerable: true,
+/******/ 				get: getter
+/******/ 			});
+/******/ 		}
+/******/ 	};
+/******/
+/******/ 	// getDefaultExport function for compatibility with non-harmony modules
+/******/ 	__webpack_require__.n = function(module) {
+/******/ 		var getter = module && module.__esModule ?
+/******/ 			function getDefault() { return module['default']; } :
+/******/ 			function getModuleExports() { return module; };
+/******/ 		__webpack_require__.d(getter, 'a', getter);
+/******/ 		return getter;
+/******/ 	};
+/******/
+/******/ 	// Object.prototype.hasOwnProperty.call
+/******/ 	__webpack_require__.o = function(object, property) { return Object.prototype.hasOwnProperty.call(object, property); };
+/******/
+/******/ 	// __webpack_public_path__
+/******/ 	__webpack_require__.p = "/assets/";
+/******/
+/******/ 	// Load entry module and return exports
+/******/ 	return __webpack_require__(__webpack_require__.s = 3);
+/******/ })
+/************************************************************************/
+/******/ ({
+
+/***/ 3:
+/***/ (function(module, exports) {
+
+// removed by extract-text-webpack-plugin
+
+/***/ })
+
+/******/ });

+ 1015 - 0
support/client/lib/vwf/view/lib/mdc/dist/mdc.checkbox.css

@@ -0,0 +1,1015 @@
+/*!
+ Material Components for the web
+ Copyright (c) 2017 Google Inc.
+ License: Apache-2.0
+*/
+/*
+  Precomputed linear color channel values, for use in contrast calculations.
+  See https://www.w3.org/TR/WCAG20-TECHS/G17.html#G17-tests
+
+  Algorithm, for c in 0 to 255:
+  f(c) {
+    c = c / 255;
+    return c < 0.03928 ? c / 12.92 : Math.pow((c + 0.055) / 1.055, 2.4);
+  }
+
+  This lookup table is needed since there is no `pow` in SASS.
+*/
+/**
+ * Calculate the luminance for a color.
+ * See https://www.w3.org/TR/WCAG20-TECHS/G17.html#G17-tests
+ */
+/**
+ * Calculate the contrast ratio between two colors.
+ * See https://www.w3.org/TR/WCAG20-TECHS/G17.html#G17-tests
+ */
+/**
+ * Determine whether to use dark or light text on top of given color.
+ * Returns "dark" for dark text and "light" for light text.
+ */
+/*
+  Main theme colors.
+  If you're a user customizing your color scheme in SASS, these are probably the only variables you need to change.
+*/
+/* Indigo 500 */
+/* Pink A200 */
+/* White */
+/* Which set of text colors to use for each main theme color (light or dark) */
+/* Text colors according to light vs dark and text type */
+/* Primary text colors for each of the theme colors */
+/** MDC Ripple keyframes are split into their own file so that _mixins.scss can rely on them. */
+@-webkit-keyframes mdc-ripple-fg-radius-in {
+  from {
+    -webkit-transform: translate(var(--mdc-ripple-fg-translate-start, 0)) scale(1);
+            transform: translate(var(--mdc-ripple-fg-translate-start, 0)) scale(1);
+    -webkit-animation-timing-function: cubic-bezier(0.4, 0, 0.2, 1);
+            animation-timing-function: cubic-bezier(0.4, 0, 0.2, 1); }
+  to {
+    -webkit-transform: translate(var(--mdc-ripple-fg-translate-end, 0)) scale(var(--mdc-ripple-fg-scale, 1));
+            transform: translate(var(--mdc-ripple-fg-translate-end, 0)) scale(var(--mdc-ripple-fg-scale, 1)); } }
+@keyframes mdc-ripple-fg-radius-in {
+  from {
+    -webkit-transform: translate(var(--mdc-ripple-fg-translate-start, 0)) scale(1);
+            transform: translate(var(--mdc-ripple-fg-translate-start, 0)) scale(1);
+    -webkit-animation-timing-function: cubic-bezier(0.4, 0, 0.2, 1);
+            animation-timing-function: cubic-bezier(0.4, 0, 0.2, 1); }
+  to {
+    -webkit-transform: translate(var(--mdc-ripple-fg-translate-end, 0)) scale(var(--mdc-ripple-fg-scale, 1));
+            transform: translate(var(--mdc-ripple-fg-translate-end, 0)) scale(var(--mdc-ripple-fg-scale, 1)); } }
+
+@-webkit-keyframes mdc-ripple-fg-opacity-in {
+  from {
+    opacity: 0;
+    -webkit-animation-timing-function: linear;
+            animation-timing-function: linear; }
+  to {
+    opacity: 1; } }
+
+@keyframes mdc-ripple-fg-opacity-in {
+  from {
+    opacity: 0;
+    -webkit-animation-timing-function: linear;
+            animation-timing-function: linear; }
+  to {
+    opacity: 1; } }
+
+@-webkit-keyframes mdc-ripple-fg-opacity-out {
+  from {
+    opacity: 1;
+    -webkit-animation-timing-function: linear;
+            animation-timing-function: linear; }
+  to {
+    opacity: 0; } }
+
+@keyframes mdc-ripple-fg-opacity-out {
+  from {
+    opacity: 1;
+    -webkit-animation-timing-function: linear;
+            animation-timing-function: linear; }
+  to {
+    opacity: 0; } }
+
+/**
+ * Creates a rule that will be applied when an MDC-Web component is within the context of an RTL layout.
+ *
+ * Usage Example:
+ * ```scss
+ * .mdc-foo {
+ *   position: absolute;
+ *   left: 0;
+ *
+ *   @include mdc-rtl {
+ *     left: auto;
+ *     right: 0;
+ *   }
+ *
+ *   &__bar {
+ *     margin-left: 4px;
+ *     @include mdc-rtl(".mdc-foo") {
+ *       margin-left: auto;
+ *       margin-right: 4px;
+ *     }
+ *   }
+ * }
+ *
+ * .mdc-foo--mod {
+ *   padding-left: 4px;
+ *
+ *   @include mdc-rtl {
+ *     padding-left: auto;
+ *     padding-right: 4px;
+ *   }
+ * }
+ * ```
+ *
+ * Note that this works by checking for [dir="rtl"] on an ancestor element. While this will work
+ * in most cases, it will in some cases lead to false negatives, e.g.
+ *
+ * ```html
+ * <html dir="rtl">
+ *   <!-- ... -->
+ *   <div dir="ltr">
+ *     <div class="mdc-foo">Styled incorrectly as RTL!</div>
+ *   </div>
+ * </html>
+ * ```
+ *
+ * In the future, selectors such as :dir (http://mdn.io/:dir) will help us mitigate this.
+ */
+/**
+ * Takes a base box-model property - e.g. margin / border / padding - along with a default
+ * direction and value, and emits rules which apply the value to the
+ * "<base-property>-<default-direction>" property by default, but flips the direction
+ * when within an RTL context.
+ *
+ * For example:
+ *
+ * ```scss
+ * .mdc-foo {
+ *   @include mdc-rtl-reflexive-box(margin, left, 8px);
+ * }
+ * ```
+ * is equivalent to:
+ *
+ * ```scss
+ * .mdc-foo {
+ *   margin-left: 8px;
+ *
+ *   @include mdc-rtl {
+ *     margin-right: 8px;
+ *     margin-left: 0;
+ *   }
+ * }
+ * ```
+ * whereas:
+ *
+ * ```scss
+ * .mdc-foo {
+ *   @include mdc-rtl-reflexive-box(margin, right, 8px);
+ * }
+ * ```
+ * is equivalent to:
+ *
+ * ```scss
+ * .mdc-foo {
+ *   margin-right: 8px;
+ *
+ *   @include mdc-rtl {
+ *     margin-right: 0;
+ *     margin-left: 8px;
+ *   }
+ * }
+ * ```
+ *
+ * You can also pass a 4th optional $root-selector argument which will be forwarded to `mdc-rtl`,
+ * e.g. `@include mdc-rtl-reflexive-box(margin, left, 8px, ".mdc-component")`.
+ *
+ * Note that this function will always zero out the original value in an RTL context. If you're
+ * trying to flip the values, use mdc-rtl-reflexive-property().
+ */
+/**
+ * Takes a base property and emits rules that assign <base-property>-left to <left-value> and
+ * <base-property>-right to <right-value> in a LTR context, and vice versa in a RTL context.
+ * For example:
+ *
+ * ```scss
+ * .mdc-foo {
+ *   @include mdc-rtl-reflexive-property(margin, auto, 12px);
+ * }
+ * ```
+ * is equivalent to:
+ *
+ * ```scss
+ * .mdc-foo {
+ *   margin-left: auto;
+ *   margin-right: 12px;
+ *
+ *   @include mdc-rtl {
+ *     margin-left: 12px;
+ *     margin-right: auto;
+ *   }
+ * }
+ * ```
+ *
+ * A 4th optional $root-selector argument can be given, which will be passed to `mdc-rtl`.
+ */
+/**
+ * Takes an argument specifying a horizontal position property (either "left" or "right") as well
+ * as a value, and applies that value to the specified position in a LTR context, and flips it in a
+ * RTL context. For example:
+ *
+ * ```scss
+ * .mdc-foo {
+ *   @include mdc-rtl-reflexive-position(left, 0);
+ *   position: absolute;
+ * }
+ * ```
+ * is equivalent to:
+ *
+ * ```scss
+ *  .mdc-foo {
+ *    position: absolute;
+ *    left: 0;
+ *    right: initial;
+ *
+ *    @include mdc-rtl {
+ *      right: 0;
+ *      left: initial;
+ *    }
+ *  }
+ * ```
+ * An optional third $root-selector argument may also be given, which is passed to `mdc-rtl`.
+ */
+/* Manual calculation done on SVG */
+/*
+  Precomputed linear color channel values, for use in contrast calculations.
+  See https://www.w3.org/TR/WCAG20-TECHS/G17.html#G17-tests
+
+  Algorithm, for c in 0 to 255:
+  f(c) {
+    c = c / 255;
+    return c < 0.03928 ? c / 12.92 : Math.pow((c + 0.055) / 1.055, 2.4);
+  }
+
+  This lookup table is needed since there is no `pow` in SASS.
+*/
+/**
+ * Calculate the luminance for a color.
+ * See https://www.w3.org/TR/WCAG20-TECHS/G17.html#G17-tests
+ */
+/**
+ * Calculate the contrast ratio between two colors.
+ * See https://www.w3.org/TR/WCAG20-TECHS/G17.html#G17-tests
+ */
+/**
+ * Determine whether to use dark or light text on top of given color.
+ * Returns "dark" for dark text and "light" for light text.
+ */
+/*
+  Main theme colors.
+  If you're a user customizing your color scheme in SASS, these are probably the only variables you need to change.
+*/
+/* Indigo 500 */
+/* Pink A200 */
+/* White */
+/* Which set of text colors to use for each main theme color (light or dark) */
+/* Text colors according to light vs dark and text type */
+/* Primary text colors for each of the theme colors */
+/**
+ * Applies the correct theme color style to the specified property.
+ * $property is typically color or background-color, but can be any CSS property that accepts color values.
+ * $style should be one of the map keys in $mdc-theme-property-values (_variables.scss).
+ */
+/**
+ * Creates a rule to be used in MDC-Web components for dark theming, and applies the provided contents.
+ * Should provide the $root-selector option if applied to anything other than the root selector.
+ * When used with a modifier class, provide a second argument of `true` for the $compound parameter
+ * to specify that this should be attached as a compound class.
+ *
+ * Usage example:
+ *
+ * ```scss
+ * .mdc-foo {
+ *   color: black;
+ *
+ *   @include mdc-theme-dark {
+ *     color: white;
+ *   }
+ *
+ *   &__bar {
+ *     background: black;
+ *
+ *     @include mdc-theme-dark(".mdc-foo") {
+ *       background: white;
+ *     }
+ *   }
+ * }
+ *
+ * .mdc-foo--disabled {
+ *   opacity: .38;
+ *
+ *   @include mdc-theme-dark(".mdc-foo", true) {
+ *     opacity: .5;
+ *   }
+ * }
+ * ```
+ */
+/* Manual calculation done on SVG */
+@-webkit-keyframes mdc-checkbox-fade-in-background {
+  0% {
+    border-color: rgba(0, 0, 0, 0.54);
+    background-color: transparent; }
+  50% {
+    /* @alternate */
+    border-color: #3f51b5;
+    border-color: var(--mdc-theme-primary, #3f51b5);
+    /* @alternate */
+    background-color: #3f51b5;
+    background-color: var(--mdc-theme-primary, #3f51b5); } }
+@keyframes mdc-checkbox-fade-in-background {
+  0% {
+    border-color: rgba(0, 0, 0, 0.54);
+    background-color: transparent; }
+  50% {
+    /* @alternate */
+    border-color: #3f51b5;
+    border-color: var(--mdc-theme-primary, #3f51b5);
+    /* @alternate */
+    background-color: #3f51b5;
+    background-color: var(--mdc-theme-primary, #3f51b5); } }
+
+@-webkit-keyframes mdc-checkbox-fade-out-background {
+  0%,
+  80% {
+    /* @alternate */
+    border-color: #3f51b5;
+    border-color: var(--mdc-theme-primary, #3f51b5);
+    /* @alternate */
+    background-color: #3f51b5;
+    background-color: var(--mdc-theme-primary, #3f51b5); }
+  100% {
+    border-color: rgba(0, 0, 0, 0.54);
+    background-color: transparent; } }
+
+@keyframes mdc-checkbox-fade-out-background {
+  0%,
+  80% {
+    /* @alternate */
+    border-color: #3f51b5;
+    border-color: var(--mdc-theme-primary, #3f51b5);
+    /* @alternate */
+    background-color: #3f51b5;
+    background-color: var(--mdc-theme-primary, #3f51b5); }
+  100% {
+    border-color: rgba(0, 0, 0, 0.54);
+    background-color: transparent; } }
+
+@-webkit-keyframes mdc-checkbox-fade-in-background-dark {
+  0% {
+    border-color: white;
+    background-color: transparent; }
+  50% {
+    /* @alternate */
+    border-color: #3f51b5;
+    border-color: var(--mdc-theme-primary, #3f51b5);
+    /* @alternate */
+    background-color: #3f51b5;
+    background-color: var(--mdc-theme-primary, #3f51b5); } }
+
+@keyframes mdc-checkbox-fade-in-background-dark {
+  0% {
+    border-color: white;
+    background-color: transparent; }
+  50% {
+    /* @alternate */
+    border-color: #3f51b5;
+    border-color: var(--mdc-theme-primary, #3f51b5);
+    /* @alternate */
+    background-color: #3f51b5;
+    background-color: var(--mdc-theme-primary, #3f51b5); } }
+
+@-webkit-keyframes mdc-checkbox-fade-out-background-dark {
+  0%,
+  80% {
+    /* @alternate */
+    border-color: #3f51b5;
+    border-color: var(--mdc-theme-primary, #3f51b5);
+    /* @alternate */
+    background-color: #3f51b5;
+    background-color: var(--mdc-theme-primary, #3f51b5); }
+  100% {
+    border-color: white;
+    background-color: transparent; } }
+
+@keyframes mdc-checkbox-fade-out-background-dark {
+  0%,
+  80% {
+    /* @alternate */
+    border-color: #3f51b5;
+    border-color: var(--mdc-theme-primary, #3f51b5);
+    /* @alternate */
+    background-color: #3f51b5;
+    background-color: var(--mdc-theme-primary, #3f51b5); }
+  100% {
+    border-color: white;
+    background-color: transparent; } }
+
+@-webkit-keyframes mdc-checkbox-unchecked-checked-checkmark-path {
+  0%,
+  50% {
+    stroke-dashoffset: 29.78334; }
+  50% {
+    -webkit-animation-timing-function: cubic-bezier(0, 0, 0.2, 1);
+            animation-timing-function: cubic-bezier(0, 0, 0.2, 1); }
+  100% {
+    stroke-dashoffset: 0; } }
+
+@keyframes mdc-checkbox-unchecked-checked-checkmark-path {
+  0%,
+  50% {
+    stroke-dashoffset: 29.78334; }
+  50% {
+    -webkit-animation-timing-function: cubic-bezier(0, 0, 0.2, 1);
+            animation-timing-function: cubic-bezier(0, 0, 0.2, 1); }
+  100% {
+    stroke-dashoffset: 0; } }
+
+@-webkit-keyframes mdc-checkbox-unchecked-indeterminate-mixedmark {
+  0%,
+  68.2% {
+    -webkit-transform: scaleX(0);
+            transform: scaleX(0); }
+  68.2% {
+    -webkit-animation-timing-function: cubic-bezier(0, 0, 0, 1);
+            animation-timing-function: cubic-bezier(0, 0, 0, 1); }
+  100% {
+    -webkit-transform: scaleX(1);
+            transform: scaleX(1); } }
+
+@keyframes mdc-checkbox-unchecked-indeterminate-mixedmark {
+  0%,
+  68.2% {
+    -webkit-transform: scaleX(0);
+            transform: scaleX(0); }
+  68.2% {
+    -webkit-animation-timing-function: cubic-bezier(0, 0, 0, 1);
+            animation-timing-function: cubic-bezier(0, 0, 0, 1); }
+  100% {
+    -webkit-transform: scaleX(1);
+            transform: scaleX(1); } }
+
+@-webkit-keyframes mdc-checkbox-checked-unchecked-checkmark-path {
+  from {
+    -webkit-animation-timing-function: cubic-bezier(0.4, 0, 1, 1);
+            animation-timing-function: cubic-bezier(0.4, 0, 1, 1);
+    opacity: 1;
+    stroke-dashoffset: 0; }
+  to {
+    opacity: 0;
+    stroke-dashoffset: -29.78334; } }
+
+@keyframes mdc-checkbox-checked-unchecked-checkmark-path {
+  from {
+    -webkit-animation-timing-function: cubic-bezier(0.4, 0, 1, 1);
+            animation-timing-function: cubic-bezier(0.4, 0, 1, 1);
+    opacity: 1;
+    stroke-dashoffset: 0; }
+  to {
+    opacity: 0;
+    stroke-dashoffset: -29.78334; } }
+
+@-webkit-keyframes mdc-checkbox-checked-indeterminate-checkmark {
+  from {
+    -webkit-transform: rotate(0deg);
+            transform: rotate(0deg);
+    opacity: 1;
+    -webkit-animation-timing-function: cubic-bezier(0, 0, 0.2, 1);
+            animation-timing-function: cubic-bezier(0, 0, 0.2, 1); }
+  to {
+    -webkit-transform: rotate(45deg);
+            transform: rotate(45deg);
+    opacity: 0; } }
+
+@keyframes mdc-checkbox-checked-indeterminate-checkmark {
+  from {
+    -webkit-transform: rotate(0deg);
+            transform: rotate(0deg);
+    opacity: 1;
+    -webkit-animation-timing-function: cubic-bezier(0, 0, 0.2, 1);
+            animation-timing-function: cubic-bezier(0, 0, 0.2, 1); }
+  to {
+    -webkit-transform: rotate(45deg);
+            transform: rotate(45deg);
+    opacity: 0; } }
+
+@-webkit-keyframes mdc-checkbox-indeterminate-checked-checkmark {
+  from {
+    -webkit-transform: rotate(45deg);
+            transform: rotate(45deg);
+    opacity: 0;
+    -webkit-animation-timing-function: cubic-bezier(0.14, 0, 0, 1);
+            animation-timing-function: cubic-bezier(0.14, 0, 0, 1); }
+  to {
+    -webkit-transform: rotate(360deg);
+            transform: rotate(360deg);
+    opacity: 1; } }
+
+@keyframes mdc-checkbox-indeterminate-checked-checkmark {
+  from {
+    -webkit-transform: rotate(45deg);
+            transform: rotate(45deg);
+    opacity: 0;
+    -webkit-animation-timing-function: cubic-bezier(0.14, 0, 0, 1);
+            animation-timing-function: cubic-bezier(0.14, 0, 0, 1); }
+  to {
+    -webkit-transform: rotate(360deg);
+            transform: rotate(360deg);
+    opacity: 1; } }
+
+@-webkit-keyframes mdc-checkbox-checked-indeterminate-mixedmark {
+  from {
+    -webkit-transform: rotate(-45deg);
+            transform: rotate(-45deg);
+    opacity: 0;
+    -webkit-animation-timing-function: cubic-bezier(0, 0, 0.2, 1);
+            animation-timing-function: cubic-bezier(0, 0, 0.2, 1); }
+  to {
+    -webkit-transform: rotate(0deg);
+            transform: rotate(0deg);
+    opacity: 1; } }
+
+@keyframes mdc-checkbox-checked-indeterminate-mixedmark {
+  from {
+    -webkit-transform: rotate(-45deg);
+            transform: rotate(-45deg);
+    opacity: 0;
+    -webkit-animation-timing-function: cubic-bezier(0, 0, 0.2, 1);
+            animation-timing-function: cubic-bezier(0, 0, 0.2, 1); }
+  to {
+    -webkit-transform: rotate(0deg);
+            transform: rotate(0deg);
+    opacity: 1; } }
+
+@-webkit-keyframes mdc-checkbox-indeterminate-checked-mixedmark {
+  from {
+    -webkit-transform: rotate(0deg);
+            transform: rotate(0deg);
+    opacity: 1;
+    -webkit-animation-timing-function: cubic-bezier(0.14, 0, 0, 1);
+            animation-timing-function: cubic-bezier(0.14, 0, 0, 1); }
+  to {
+    -webkit-transform: rotate(315deg);
+            transform: rotate(315deg);
+    opacity: 0; } }
+
+@keyframes mdc-checkbox-indeterminate-checked-mixedmark {
+  from {
+    -webkit-transform: rotate(0deg);
+            transform: rotate(0deg);
+    opacity: 1;
+    -webkit-animation-timing-function: cubic-bezier(0.14, 0, 0, 1);
+            animation-timing-function: cubic-bezier(0.14, 0, 0, 1); }
+  to {
+    -webkit-transform: rotate(315deg);
+            transform: rotate(315deg);
+    opacity: 0; } }
+
+@-webkit-keyframes mdc-checkbox-indeterminate-unchecked-mixedmark {
+  0% {
+    -webkit-transform: scaleX(1);
+            transform: scaleX(1);
+    opacity: 1;
+    -webkit-animation-timing-function: linear;
+            animation-timing-function: linear; }
+  32.8%,
+  100% {
+    -webkit-transform: scaleX(0);
+            transform: scaleX(0);
+    opacity: 0; } }
+
+@keyframes mdc-checkbox-indeterminate-unchecked-mixedmark {
+  0% {
+    -webkit-transform: scaleX(1);
+            transform: scaleX(1);
+    opacity: 1;
+    -webkit-animation-timing-function: linear;
+            animation-timing-function: linear; }
+  32.8%,
+  100% {
+    -webkit-transform: scaleX(0);
+            transform: scaleX(0);
+    opacity: 0; } }
+
+.mdc-checkbox {
+  --mdc-ripple-surface-width: 0;
+  --mdc-ripple-surface-height: 0;
+  --mdc-ripple-fg-size: 0;
+  --mdc-ripple-left: 0;
+  --mdc-ripple-top: 0;
+  --mdc-ripple-fg-scale: 1;
+  --mdc-ripple-fg-translate-end: 0;
+  --mdc-ripple-fg-translate-start: 0;
+  will-change: transform, opacity;
+  -webkit-tap-highlight-color: transparent;
+  display: inline-block;
+  position: relative;
+  -webkit-box-sizing: content-box;
+          box-sizing: content-box;
+  -webkit-box-flex: 0;
+      -ms-flex: 0 0 18px;
+          flex: 0 0 18px;
+  width: 18px;
+  height: 18px;
+  padding: 11px;
+  line-height: 0;
+  white-space: nowrap;
+  cursor: pointer;
+  vertical-align: bottom; }
+  .mdc-checkbox:not(.mdc-ripple-upgraded):hover::before, .mdc-checkbox:not(.mdc-ripple-upgraded):focus::before, .mdc-checkbox:not(.mdc-ripple-upgraded):active::after {
+    -webkit-transition-duration: 85ms;
+            transition-duration: 85ms;
+    opacity: .6; }
+  .mdc-checkbox::before {
+    /* @alternate */
+    background-color: rgba(63, 81, 181, 0.14);
+    position: absolute;
+    top: calc(50% - 100%);
+    left: calc(50% - 100%);
+    width: 200%;
+    height: 200%;
+    -webkit-transition: opacity 250ms linear;
+    transition: opacity 250ms linear;
+    border-radius: 50%;
+    opacity: 0;
+    pointer-events: none;
+    content: ""; }
+    @supports (background-color: color(green a(10%))) {
+      .mdc-checkbox::before {
+        background-color: color(var(--mdc-theme-primary, #3f51b5) a(14%)); } }
+  .mdc-checkbox.mdc-ripple-upgraded::before {
+    top: calc(50% - 100%);
+    left: calc(50% - 100%);
+    width: 200%;
+    height: 200%;
+    /* @alternate */
+    -webkit-transform: scale(0);
+            transform: scale(0);
+    -webkit-transform: scale(var(--mdc-ripple-fg-scale, 0));
+            transform: scale(var(--mdc-ripple-fg-scale, 0)); }
+  .mdc-checkbox.mdc-ripple-upgraded--background-focused::before {
+    opacity: .99999; }
+  .mdc-checkbox.mdc-ripple-upgraded--background-active-fill::before {
+    -webkit-transition-duration: 120ms;
+            transition-duration: 120ms;
+    opacity: 1; }
+  .mdc-checkbox.mdc-ripple-upgraded--unbounded::before {
+    /* @alternate */
+    top: calc(50% - 50%);
+    top: var(--mdc-ripple-top, calc(50% - 50%));
+    /* @alternate */
+    left: calc(50% - 50%);
+    left: var(--mdc-ripple-left, calc(50% - 50%));
+    /* @alternate */
+    width: 100%;
+    width: var(--mdc-ripple-fg-size, 100%);
+    /* @alternate */
+    height: 100%;
+    height: var(--mdc-ripple-fg-size, 100%);
+    /* @alternate */
+    -webkit-transform: scale(0);
+            transform: scale(0);
+    -webkit-transform: scale(var(--mdc-ripple-fg-scale, 0));
+            transform: scale(var(--mdc-ripple-fg-scale, 0)); }
+  .mdc-checkbox::after {
+    /* @alternate */
+    background-color: rgba(63, 81, 181, 0.14);
+    position: absolute;
+    top: calc(50% - 100%);
+    left: calc(50% - 100%);
+    width: 200%;
+    height: 200%;
+    -webkit-transition: opacity 250ms linear;
+    transition: opacity 250ms linear;
+    border-radius: 50%;
+    opacity: 0;
+    pointer-events: none;
+    content: ""; }
+    @supports (background-color: color(green a(10%))) {
+      .mdc-checkbox::after {
+        background-color: color(var(--mdc-theme-primary, #3f51b5) a(14%)); } }
+  .mdc-checkbox.mdc-ripple-upgraded::after {
+    top: 0;
+    left: 0;
+    /* @alternate */
+    width: 100%;
+    width: var(--mdc-ripple-fg-size, 100%);
+    /* @alternate */
+    height: 100%;
+    height: var(--mdc-ripple-fg-size, 100%);
+    -webkit-transform: scale(0);
+            transform: scale(0);
+    -webkit-transform-origin: center center;
+            transform-origin: center center;
+    opacity: 0; }
+  .mdc-checkbox:not(.mdc-ripple-upgraded--unbounded)::after {
+    -webkit-transform-origin: center center;
+            transform-origin: center center; }
+  .mdc-checkbox.mdc-ripple-upgraded--unbounded::after {
+    /* @alternate */
+    top: 0;
+    top: var(--mdc-ripple-top, 0);
+    /* @alternate */
+    left: 0;
+    left: var(--mdc-ripple-left, 0);
+    /* @alternate */
+    width: 100%;
+    width: var(--mdc-ripple-fg-size, 100%);
+    /* @alternate */
+    height: 100%;
+    height: var(--mdc-ripple-fg-size, 100%);
+    -webkit-transform: scale(0);
+            transform: scale(0);
+    -webkit-transform-origin: center center;
+            transform-origin: center center; }
+  .mdc-checkbox.mdc-ripple-upgraded--foreground-activation::after {
+    -webkit-animation: 300ms mdc-ripple-fg-radius-in forwards, 83ms mdc-ripple-fg-opacity-in forwards;
+            animation: 300ms mdc-ripple-fg-radius-in forwards, 83ms mdc-ripple-fg-opacity-in forwards; }
+  .mdc-checkbox.mdc-ripple-upgraded--foreground-deactivation::after {
+    -webkit-transform: translate(var(--mdc-ripple-fg-translate-end, 0)) scale(var(--mdc-ripple-fg-scale, 1));
+            transform: translate(var(--mdc-ripple-fg-translate-end, 0)) scale(var(--mdc-ripple-fg-scale, 1));
+    -webkit-animation: 83ms mdc-ripple-fg-opacity-out;
+            animation: 83ms mdc-ripple-fg-opacity-out; }
+  .mdc-checkbox::before, .mdc-checkbox::after {
+    top: 0;
+    left: 0;
+    width: 100%;
+    height: 100%; }
+  .mdc-checkbox.mdc-ripple-upgraded--unbounded .mdc-checkbox__background::before {
+    content: none; }
+  .mdc-checkbox__background {
+    position: absolute;
+    top: 0;
+    right: 0;
+    bottom: 0;
+    left: 0;
+    left: 11px;
+    right: initial;
+    display: -webkit-inline-box;
+    display: -ms-inline-flexbox;
+    display: inline-flex;
+    top: 11px;
+    -webkit-box-align: center;
+        -ms-flex-align: center;
+            align-items: center;
+    -webkit-box-pack: center;
+        -ms-flex-pack: center;
+            justify-content: center;
+    -webkit-box-sizing: border-box;
+            box-sizing: border-box;
+    pointer-events: none;
+    width: 45%;
+    height: 45%;
+    -webkit-transition: background-color 90ms 0ms cubic-bezier(0.4, 0, 0.6, 1), border-color 90ms 0ms cubic-bezier(0.4, 0, 0.6, 1);
+    transition: background-color 90ms 0ms cubic-bezier(0.4, 0, 0.6, 1), border-color 90ms 0ms cubic-bezier(0.4, 0, 0.6, 1);
+    border: 2px solid rgba(0, 0, 0, 0.54);
+    border-radius: 2px;
+    background-color: transparent;
+    will-change: background-color, border-color; }
+    [dir="rtl"] .mdc-checkbox .mdc-checkbox__background,
+    .mdc-checkbox[dir="rtl"] .mdc-checkbox__background {
+      left: initial;
+      right: 11px; }
+    .mdc-checkbox--theme-dark .mdc-checkbox__background,
+    .mdc-theme--dark .mdc-checkbox__background {
+      border-color: white; }
+    .mdc-checkbox__background::before {
+      position: absolute;
+      top: 0;
+      right: 0;
+      bottom: 0;
+      left: 0;
+      width: 100%;
+      height: 100%;
+      -webkit-transform: scale(0, 0);
+              transform: scale(0, 0);
+      -webkit-transition: opacity 90ms 0ms cubic-bezier(0.4, 0, 0.6, 1), -webkit-transform 90ms 0ms cubic-bezier(0.4, 0, 0.6, 1);
+      transition: opacity 90ms 0ms cubic-bezier(0.4, 0, 0.6, 1), -webkit-transform 90ms 0ms cubic-bezier(0.4, 0, 0.6, 1);
+      transition: opacity 90ms 0ms cubic-bezier(0.4, 0, 0.6, 1), transform 90ms 0ms cubic-bezier(0.4, 0, 0.6, 1);
+      transition: opacity 90ms 0ms cubic-bezier(0.4, 0, 0.6, 1), transform 90ms 0ms cubic-bezier(0.4, 0, 0.6, 1), -webkit-transform 90ms 0ms cubic-bezier(0.4, 0, 0.6, 1);
+      border-radius: 50%;
+      content: "";
+      opacity: 0;
+      pointer-events: none;
+      will-change: opacity, transform;
+      /* @alternate */
+      background: #3f51b5;
+      background: var(--mdc-theme-primary, #3f51b5); }
+  .mdc-checkbox__native-control {
+    position: absolute;
+    top: 0;
+    left: 0;
+    width: 100%;
+    height: 100%;
+    margin: 0;
+    padding: 0;
+    cursor: inherit;
+    opacity: 0; }
+  .mdc-checkbox__checkmark {
+    position: absolute;
+    top: 0;
+    right: 0;
+    bottom: 0;
+    left: 0;
+    width: 100%;
+    -webkit-transition: opacity 180ms 0ms cubic-bezier(0.4, 0, 0.6, 1);
+    transition: opacity 180ms 0ms cubic-bezier(0.4, 0, 0.6, 1);
+    opacity: 0;
+    fill: white; }
+    .mdc-checkbox__checkmark__path {
+      -webkit-transition: stroke-dashoffset 180ms 0ms cubic-bezier(0.4, 0, 0.6, 1);
+      transition: stroke-dashoffset 180ms 0ms cubic-bezier(0.4, 0, 0.6, 1);
+      stroke: white !important;
+      stroke-width: 3.12px;
+      stroke-dashoffset: 29.78334;
+      stroke-dasharray: 29.78334; }
+  .mdc-checkbox__mixedmark {
+    width: 100%;
+    height: 2px;
+    -webkit-transform: scaleX(0) rotate(0deg);
+            transform: scaleX(0) rotate(0deg);
+    -webkit-transition: opacity 90ms 0ms cubic-bezier(0.4, 0, 0.6, 1), -webkit-transform 90ms 0ms cubic-bezier(0.4, 0, 0.6, 1);
+    transition: opacity 90ms 0ms cubic-bezier(0.4, 0, 0.6, 1), -webkit-transform 90ms 0ms cubic-bezier(0.4, 0, 0.6, 1);
+    transition: opacity 90ms 0ms cubic-bezier(0.4, 0, 0.6, 1), transform 90ms 0ms cubic-bezier(0.4, 0, 0.6, 1);
+    transition: opacity 90ms 0ms cubic-bezier(0.4, 0, 0.6, 1), transform 90ms 0ms cubic-bezier(0.4, 0, 0.6, 1), -webkit-transform 90ms 0ms cubic-bezier(0.4, 0, 0.6, 1);
+    background-color: white;
+    opacity: 0; }
+
+.mdc-checkbox__native-control:focus ~ .mdc-checkbox__background::before {
+  -webkit-transform: scale(2.75, 2.75);
+          transform: scale(2.75, 2.75);
+  -webkit-transition: opacity 80ms 0ms cubic-bezier(0, 0, 0.2, 1), -webkit-transform 80ms 0ms cubic-bezier(0, 0, 0.2, 1);
+  transition: opacity 80ms 0ms cubic-bezier(0, 0, 0.2, 1), -webkit-transform 80ms 0ms cubic-bezier(0, 0, 0.2, 1);
+  transition: opacity 80ms 0ms cubic-bezier(0, 0, 0.2, 1), transform 80ms 0ms cubic-bezier(0, 0, 0.2, 1);
+  transition: opacity 80ms 0ms cubic-bezier(0, 0, 0.2, 1), transform 80ms 0ms cubic-bezier(0, 0, 0.2, 1), -webkit-transform 80ms 0ms cubic-bezier(0, 0, 0.2, 1);
+  opacity: .26; }
+
+.mdc-checkbox__native-control:checked ~ .mdc-checkbox__background {
+  -webkit-transition: border-color 90ms 0ms cubic-bezier(0, 0, 0.2, 1), background-color 90ms 0ms cubic-bezier(0, 0, 0.2, 1);
+  transition: border-color 90ms 0ms cubic-bezier(0, 0, 0.2, 1), background-color 90ms 0ms cubic-bezier(0, 0, 0.2, 1);
+  /* @alternate */
+  border-color: #3f51b5;
+  border-color: var(--mdc-theme-primary, #3f51b5);
+  /* @alternate */
+  background-color: #3f51b5;
+  background-color: var(--mdc-theme-primary, #3f51b5); }
+  .mdc-checkbox__native-control:checked ~ .mdc-checkbox__background .mdc-checkbox__checkmark {
+    -webkit-transition: opacity 180ms 0ms cubic-bezier(0, 0, 0.2, 1), -webkit-transform 180ms 0ms cubic-bezier(0, 0, 0.2, 1);
+    transition: opacity 180ms 0ms cubic-bezier(0, 0, 0.2, 1), -webkit-transform 180ms 0ms cubic-bezier(0, 0, 0.2, 1);
+    transition: opacity 180ms 0ms cubic-bezier(0, 0, 0.2, 1), transform 180ms 0ms cubic-bezier(0, 0, 0.2, 1);
+    transition: opacity 180ms 0ms cubic-bezier(0, 0, 0.2, 1), transform 180ms 0ms cubic-bezier(0, 0, 0.2, 1), -webkit-transform 180ms 0ms cubic-bezier(0, 0, 0.2, 1);
+    opacity: 1; }
+    .mdc-checkbox__native-control:checked ~ .mdc-checkbox__background .mdc-checkbox__checkmark__path {
+      stroke-dashoffset: 0; }
+  .mdc-checkbox__native-control:checked ~ .mdc-checkbox__background .mdc-checkbox__mixedmark {
+    -webkit-transform: scaleX(1) rotate(-45deg);
+            transform: scaleX(1) rotate(-45deg); }
+
+.mdc-checkbox__native-control:indeterminate ~ .mdc-checkbox__background {
+  /* @alternate */
+  border-color: #3f51b5;
+  border-color: var(--mdc-theme-primary, #3f51b5);
+  /* @alternate */
+  background-color: #3f51b5;
+  background-color: var(--mdc-theme-primary, #3f51b5); }
+  .mdc-checkbox__native-control:indeterminate ~ .mdc-checkbox__background .mdc-checkbox__checkmark {
+    -webkit-transform: rotate(45deg);
+            transform: rotate(45deg);
+    -webkit-transition: opacity 90ms 0ms cubic-bezier(0.4, 0, 0.6, 1), -webkit-transform 90ms 0ms cubic-bezier(0.4, 0, 0.6, 1);
+    transition: opacity 90ms 0ms cubic-bezier(0.4, 0, 0.6, 1), -webkit-transform 90ms 0ms cubic-bezier(0.4, 0, 0.6, 1);
+    transition: opacity 90ms 0ms cubic-bezier(0.4, 0, 0.6, 1), transform 90ms 0ms cubic-bezier(0.4, 0, 0.6, 1);
+    transition: opacity 90ms 0ms cubic-bezier(0.4, 0, 0.6, 1), transform 90ms 0ms cubic-bezier(0.4, 0, 0.6, 1), -webkit-transform 90ms 0ms cubic-bezier(0.4, 0, 0.6, 1);
+    opacity: 0; }
+    .mdc-checkbox__native-control:indeterminate ~ .mdc-checkbox__background .mdc-checkbox__checkmark__path {
+      stroke-dashoffset: 0; }
+  .mdc-checkbox__native-control:indeterminate ~ .mdc-checkbox__background .mdc-checkbox__mixedmark {
+    -webkit-transform: scaleX(1) rotate(0deg);
+            transform: scaleX(1) rotate(0deg);
+    opacity: 1; }
+
+.mdc-checkbox__native-control:disabled,
+fieldset:disabled .mdc-checkbox__native-control,
+[aria-disabled="true"] .mdc-checkbox__native-control {
+  cursor: default; }
+  .mdc-checkbox__native-control:disabled ~ .mdc-checkbox__background,
+  fieldset:disabled .mdc-checkbox__native-control ~ .mdc-checkbox__background,
+  [aria-disabled="true"] .mdc-checkbox__native-control ~ .mdc-checkbox__background {
+    border-color: rgba(0, 0, 0, 0.26); }
+    .mdc-checkbox--theme-dark .mdc-checkbox__native-control:disabled ~ .mdc-checkbox__background,
+    .mdc-theme--dark .mdc-checkbox__native-control:disabled ~ .mdc-checkbox__background, .mdc-checkbox--theme-dark
+    fieldset:disabled .mdc-checkbox__native-control ~ .mdc-checkbox__background,
+    .mdc-theme--dark
+    fieldset:disabled .mdc-checkbox__native-control ~ .mdc-checkbox__background, .mdc-checkbox--theme-dark
+    [aria-disabled="true"] .mdc-checkbox__native-control ~ .mdc-checkbox__background,
+    .mdc-theme--dark
+    [aria-disabled="true"] .mdc-checkbox__native-control ~ .mdc-checkbox__background {
+      border-color: rgba(255, 255, 255, 0.3); }
+  .mdc-checkbox__native-control:disabled:checked ~ .mdc-checkbox__background, .mdc-checkbox__native-control:disabled:indeterminate ~ .mdc-checkbox__background,
+  fieldset:disabled .mdc-checkbox__native-control:checked ~ .mdc-checkbox__background,
+  fieldset:disabled .mdc-checkbox__native-control:indeterminate ~ .mdc-checkbox__background,
+  [aria-disabled="true"] .mdc-checkbox__native-control:checked ~ .mdc-checkbox__background,
+  [aria-disabled="true"] .mdc-checkbox__native-control:indeterminate ~ .mdc-checkbox__background {
+    border-color: transparent;
+    background-color: rgba(0, 0, 0, 0.26); }
+    .mdc-checkbox--theme-dark .mdc-checkbox__native-control:disabled:checked ~ .mdc-checkbox__background,
+    .mdc-theme--dark .mdc-checkbox__native-control:disabled:checked ~ .mdc-checkbox__background, .mdc-checkbox--theme-dark .mdc-checkbox__native-control:disabled:indeterminate ~ .mdc-checkbox__background,
+    .mdc-theme--dark .mdc-checkbox__native-control:disabled:indeterminate ~ .mdc-checkbox__background, .mdc-checkbox--theme-dark
+    fieldset:disabled .mdc-checkbox__native-control:checked ~ .mdc-checkbox__background,
+    .mdc-theme--dark
+    fieldset:disabled .mdc-checkbox__native-control:checked ~ .mdc-checkbox__background, .mdc-checkbox--theme-dark
+    fieldset:disabled .mdc-checkbox__native-control:indeterminate ~ .mdc-checkbox__background,
+    .mdc-theme--dark
+    fieldset:disabled .mdc-checkbox__native-control:indeterminate ~ .mdc-checkbox__background, .mdc-checkbox--theme-dark
+    [aria-disabled="true"] .mdc-checkbox__native-control:checked ~ .mdc-checkbox__background,
+    .mdc-theme--dark
+    [aria-disabled="true"] .mdc-checkbox__native-control:checked ~ .mdc-checkbox__background, .mdc-checkbox--theme-dark
+    [aria-disabled="true"] .mdc-checkbox__native-control:indeterminate ~ .mdc-checkbox__background,
+    .mdc-theme--dark
+    [aria-disabled="true"] .mdc-checkbox__native-control:indeterminate ~ .mdc-checkbox__background {
+      background-color: rgba(255, 255, 255, 0.3); }
+
+.mdc-checkbox--disabled {
+  cursor: default;
+  pointer-events: none; }
+
+.mdc-checkbox--upgraded .mdc-checkbox__background,
+.mdc-checkbox--upgraded .mdc-checkbox__checkmark,
+.mdc-checkbox--upgraded .mdc-checkbox__checkmark__path,
+.mdc-checkbox--upgraded .mdc-checkbox__mixedmark {
+  -webkit-transition: none !important;
+  transition: none !important; }
+
+.mdc-checkbox--anim-unchecked-checked .mdc-checkbox__background, .mdc-checkbox--anim-unchecked-indeterminate .mdc-checkbox__background {
+  -webkit-animation: mdc-checkbox-fade-in-background 180ms linear;
+          animation: mdc-checkbox-fade-in-background 180ms linear; }
+  .mdc-checkbox--theme-dark .mdc-checkbox--anim-unchecked-checked .mdc-checkbox__background,
+  .mdc-theme--dark .mdc-checkbox--anim-unchecked-checked .mdc-checkbox__background, .mdc-checkbox--theme-dark .mdc-checkbox--anim-unchecked-indeterminate .mdc-checkbox__background,
+  .mdc-theme--dark .mdc-checkbox--anim-unchecked-indeterminate .mdc-checkbox__background {
+    -webkit-animation-name: mdc-checkbox-fade-in-background-dark;
+            animation-name: mdc-checkbox-fade-in-background-dark; }
+
+.mdc-checkbox--anim-checked-unchecked .mdc-checkbox__background, .mdc-checkbox--anim-indeterminate-unchecked .mdc-checkbox__background {
+  -webkit-animation: mdc-checkbox-fade-out-background 180ms linear;
+          animation: mdc-checkbox-fade-out-background 180ms linear; }
+  .mdc-checkbox--theme-dark .mdc-checkbox--anim-checked-unchecked .mdc-checkbox__background,
+  .mdc-theme--dark .mdc-checkbox--anim-checked-unchecked .mdc-checkbox__background, .mdc-checkbox--theme-dark .mdc-checkbox--anim-indeterminate-unchecked .mdc-checkbox__background,
+  .mdc-theme--dark .mdc-checkbox--anim-indeterminate-unchecked .mdc-checkbox__background {
+    -webkit-animation-name: mdc-checkbox-fade-out-background-dark;
+            animation-name: mdc-checkbox-fade-out-background-dark; }
+
+.mdc-checkbox--anim-unchecked-checked .mdc-checkbox__checkmark__path {
+  -webkit-animation: 180ms linear 0s mdc-checkbox-unchecked-checked-checkmark-path;
+          animation: 180ms linear 0s mdc-checkbox-unchecked-checked-checkmark-path;
+  -webkit-transition: none;
+  transition: none; }
+
+.mdc-checkbox--anim-unchecked-indeterminate .mdc-checkbox__mixedmark {
+  -webkit-animation: 90ms linear 0s mdc-checkbox-unchecked-indeterminate-mixedmark;
+          animation: 90ms linear 0s mdc-checkbox-unchecked-indeterminate-mixedmark;
+  -webkit-transition: none;
+  transition: none; }
+
+.mdc-checkbox--anim-checked-unchecked .mdc-checkbox__checkmark__path {
+  -webkit-animation: 90ms linear 0s mdc-checkbox-checked-unchecked-checkmark-path;
+          animation: 90ms linear 0s mdc-checkbox-checked-unchecked-checkmark-path;
+  -webkit-transition: none;
+  transition: none; }
+
+.mdc-checkbox--anim-checked-indeterminate .mdc-checkbox__checkmark {
+  -webkit-animation: 90ms linear 0s mdc-checkbox-checked-indeterminate-checkmark;
+          animation: 90ms linear 0s mdc-checkbox-checked-indeterminate-checkmark;
+  -webkit-transition: none;
+  transition: none; }
+
+.mdc-checkbox--anim-checked-indeterminate .mdc-checkbox__mixedmark {
+  -webkit-animation: 90ms linear 0s mdc-checkbox-checked-indeterminate-mixedmark;
+          animation: 90ms linear 0s mdc-checkbox-checked-indeterminate-mixedmark;
+  -webkit-transition: none;
+  transition: none; }
+
+.mdc-checkbox--anim-indeterminate-checked .mdc-checkbox__checkmark {
+  -webkit-animation: 500ms linear 0s mdc-checkbox-indeterminate-checked-checkmark;
+          animation: 500ms linear 0s mdc-checkbox-indeterminate-checked-checkmark;
+  -webkit-transition: none;
+  transition: none; }
+
+.mdc-checkbox--anim-indeterminate-checked .mdc-checkbox__mixedmark {
+  -webkit-animation: 500ms linear 0s mdc-checkbox-indeterminate-checked-mixedmark;
+          animation: 500ms linear 0s mdc-checkbox-indeterminate-checked-mixedmark;
+  -webkit-transition: none;
+  transition: none; }
+
+.mdc-checkbox--anim-indeterminate-unchecked .mdc-checkbox__mixedmark {
+  -webkit-animation: 300ms linear 0s mdc-checkbox-indeterminate-unchecked-mixedmark;
+          animation: 300ms linear 0s mdc-checkbox-indeterminate-unchecked-mixedmark;
+  -webkit-transition: none;
+  transition: none; }

+ 83 - 0
support/client/lib/vwf/view/lib/mdc/dist/mdc.checkbox.css-entry

@@ -0,0 +1,83 @@
+/*!
+ Material Components for the web
+ Copyright (c) 2017 Google Inc.
+ License: Apache-2.0
+*/
+/******/ (function(modules) { // webpackBootstrap
+/******/ 	// The module cache
+/******/ 	var installedModules = {};
+/******/
+/******/ 	// The require function
+/******/ 	function __webpack_require__(moduleId) {
+/******/
+/******/ 		// Check if module is in cache
+/******/ 		if(installedModules[moduleId]) {
+/******/ 			return installedModules[moduleId].exports;
+/******/ 		}
+/******/ 		// Create a new module (and put it into the cache)
+/******/ 		var module = installedModules[moduleId] = {
+/******/ 			i: moduleId,
+/******/ 			l: false,
+/******/ 			exports: {}
+/******/ 		};
+/******/
+/******/ 		// Execute the module function
+/******/ 		modules[moduleId].call(module.exports, module, module.exports, __webpack_require__);
+/******/
+/******/ 		// Flag the module as loaded
+/******/ 		module.l = true;
+/******/
+/******/ 		// Return the exports of the module
+/******/ 		return module.exports;
+/******/ 	}
+/******/
+/******/
+/******/ 	// expose the modules object (__webpack_modules__)
+/******/ 	__webpack_require__.m = modules;
+/******/
+/******/ 	// expose the module cache
+/******/ 	__webpack_require__.c = installedModules;
+/******/
+/******/ 	// identity function for calling harmony imports with the correct context
+/******/ 	__webpack_require__.i = function(value) { return value; };
+/******/
+/******/ 	// define getter function for harmony exports
+/******/ 	__webpack_require__.d = function(exports, name, getter) {
+/******/ 		if(!__webpack_require__.o(exports, name)) {
+/******/ 			Object.defineProperty(exports, name, {
+/******/ 				configurable: false,
+/******/ 				enumerable: true,
+/******/ 				get: getter
+/******/ 			});
+/******/ 		}
+/******/ 	};
+/******/
+/******/ 	// getDefaultExport function for compatibility with non-harmony modules
+/******/ 	__webpack_require__.n = function(module) {
+/******/ 		var getter = module && module.__esModule ?
+/******/ 			function getDefault() { return module['default']; } :
+/******/ 			function getModuleExports() { return module; };
+/******/ 		__webpack_require__.d(getter, 'a', getter);
+/******/ 		return getter;
+/******/ 	};
+/******/
+/******/ 	// Object.prototype.hasOwnProperty.call
+/******/ 	__webpack_require__.o = function(object, property) { return Object.prototype.hasOwnProperty.call(object, property); };
+/******/
+/******/ 	// __webpack_public_path__
+/******/ 	__webpack_require__.p = "/assets/";
+/******/
+/******/ 	// Load entry module and return exports
+/******/ 	return __webpack_require__(__webpack_require__.s = 4);
+/******/ })
+/************************************************************************/
+/******/ ({
+
+/***/ 4:
+/***/ (function(module, exports) {
+
+// removed by extract-text-webpack-plugin
+
+/***/ })
+
+/******/ });

+ 2585 - 0
support/client/lib/vwf/view/lib/mdc/dist/mdc.checkbox.js

@@ -0,0 +1,2585 @@
+/*!
+ Material Components for the web
+ Copyright (c) 2017 Google Inc.
+ License: Apache-2.0
+*/
+(function webpackUniversalModuleDefinition(root, factory) {
+	if(typeof exports === 'object' && typeof module === 'object')
+		module.exports = factory();
+	else if(typeof define === 'function' && define.amd)
+		define([], factory);
+	else if(typeof exports === 'object')
+		exports["checkbox"] = factory();
+	else
+		root["mdc"] = root["mdc"] || {}, root["mdc"]["checkbox"] = factory();
+})(this, function() {
+return /******/ (function(modules) { // webpackBootstrap
+/******/ 	// The module cache
+/******/ 	var installedModules = {};
+/******/
+/******/ 	// The require function
+/******/ 	function __webpack_require__(moduleId) {
+/******/
+/******/ 		// Check if module is in cache
+/******/ 		if(installedModules[moduleId]) {
+/******/ 			return installedModules[moduleId].exports;
+/******/ 		}
+/******/ 		// Create a new module (and put it into the cache)
+/******/ 		var module = installedModules[moduleId] = {
+/******/ 			i: moduleId,
+/******/ 			l: false,
+/******/ 			exports: {}
+/******/ 		};
+/******/
+/******/ 		// Execute the module function
+/******/ 		modules[moduleId].call(module.exports, module, module.exports, __webpack_require__);
+/******/
+/******/ 		// Flag the module as loaded
+/******/ 		module.l = true;
+/******/
+/******/ 		// Return the exports of the module
+/******/ 		return module.exports;
+/******/ 	}
+/******/
+/******/
+/******/ 	// expose the modules object (__webpack_modules__)
+/******/ 	__webpack_require__.m = modules;
+/******/
+/******/ 	// expose the module cache
+/******/ 	__webpack_require__.c = installedModules;
+/******/
+/******/ 	// identity function for calling harmony imports with the correct context
+/******/ 	__webpack_require__.i = function(value) { return value; };
+/******/
+/******/ 	// define getter function for harmony exports
+/******/ 	__webpack_require__.d = function(exports, name, getter) {
+/******/ 		if(!__webpack_require__.o(exports, name)) {
+/******/ 			Object.defineProperty(exports, name, {
+/******/ 				configurable: false,
+/******/ 				enumerable: true,
+/******/ 				get: getter
+/******/ 			});
+/******/ 		}
+/******/ 	};
+/******/
+/******/ 	// getDefaultExport function for compatibility with non-harmony modules
+/******/ 	__webpack_require__.n = function(module) {
+/******/ 		var getter = module && module.__esModule ?
+/******/ 			function getDefault() { return module['default']; } :
+/******/ 			function getModuleExports() { return module; };
+/******/ 		__webpack_require__.d(getter, 'a', getter);
+/******/ 		return getter;
+/******/ 	};
+/******/
+/******/ 	// Object.prototype.hasOwnProperty.call
+/******/ 	__webpack_require__.o = function(object, property) { return Object.prototype.hasOwnProperty.call(object, property); };
+/******/
+/******/ 	// __webpack_public_path__
+/******/ 	__webpack_require__.p = "/assets/";
+/******/
+/******/ 	// Load entry module and return exports
+/******/ 	return __webpack_require__(__webpack_require__.s = 84);
+/******/ })
+/************************************************************************/
+/******/ ({
+
+/***/ 0:
+/***/ (function(module, __webpack_exports__, __webpack_require__) {
+
+"use strict";
+var _createClass = function () { function defineProperties(target, props) { for (var i = 0; i < props.length; i++) { var descriptor = props[i]; descriptor.enumerable = descriptor.enumerable || false; descriptor.configurable = true; if ("value" in descriptor) descriptor.writable = true; Object.defineProperty(target, descriptor.key, descriptor); } } return function (Constructor, protoProps, staticProps) { if (protoProps) defineProperties(Constructor.prototype, protoProps); if (staticProps) defineProperties(Constructor, staticProps); return Constructor; }; }();
+
+function _classCallCheck(instance, Constructor) { if (!(instance instanceof Constructor)) { throw new TypeError("Cannot call a class as a function"); } }
+
+/**
+ * Copyright 2016 Google Inc.
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *   http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+
+/**
+ * @template A
+ */
+var MDCFoundation = function () {
+  _createClass(MDCFoundation, null, [{
+    key: "cssClasses",
+
+    /** @return enum{cssClasses} */
+    get: function get() {
+      // Classes extending MDCFoundation should implement this method to return an object which exports every
+      // CSS class the foundation class needs as a property. e.g. {ACTIVE: 'mdc-component--active'}
+      return {};
+    }
+
+    /** @return enum{strings} */
+
+  }, {
+    key: "strings",
+    get: function get() {
+      // Classes extending MDCFoundation should implement this method to return an object which exports all
+      // semantic strings as constants. e.g. {ARIA_ROLE: 'tablist'}
+      return {};
+    }
+
+    /** @return enum{numbers} */
+
+  }, {
+    key: "numbers",
+    get: function get() {
+      // Classes extending MDCFoundation should implement this method to return an object which exports all
+      // of its semantic numbers as constants. e.g. {ANIMATION_DELAY_MS: 350}
+      return {};
+    }
+
+    /** @return {!Object} */
+
+  }, {
+    key: "defaultAdapter",
+    get: function get() {
+      // Classes extending MDCFoundation may choose to implement this getter in order to provide a convenient
+      // way of viewing the necessary methods of an adapter. In the future, this could also be used for adapter
+      // validation.
+      return {};
+    }
+
+    /**
+     * @param {A=} adapter
+     */
+
+  }]);
+
+  function MDCFoundation() {
+    var adapter = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : {};
+
+    _classCallCheck(this, MDCFoundation);
+
+    /** @protected {!A} */
+    this.adapter_ = adapter;
+  }
+
+  _createClass(MDCFoundation, [{
+    key: "init",
+    value: function init() {
+      // Subclasses should override this method to perform initialization routines (registering events, etc.)
+    }
+  }, {
+    key: "destroy",
+    value: function destroy() {
+      // Subclasses should override this method to perform de-initialization routines (de-registering events, etc.)
+    }
+  }]);
+
+  return MDCFoundation;
+}();
+
+/* harmony default export */ __webpack_exports__["a"] = (MDCFoundation);
+
+/***/ }),
+
+/***/ 1:
+/***/ (function(module, __webpack_exports__, __webpack_require__) {
+
+"use strict";
+/* harmony import */ var __WEBPACK_IMPORTED_MODULE_0__foundation__ = __webpack_require__(0);
+var _createClass = function () { function defineProperties(target, props) { for (var i = 0; i < props.length; i++) { var descriptor = props[i]; descriptor.enumerable = descriptor.enumerable || false; descriptor.configurable = true; if ("value" in descriptor) descriptor.writable = true; Object.defineProperty(target, descriptor.key, descriptor); } } return function (Constructor, protoProps, staticProps) { if (protoProps) defineProperties(Constructor.prototype, protoProps); if (staticProps) defineProperties(Constructor, staticProps); return Constructor; }; }();
+
+function _classCallCheck(instance, Constructor) { if (!(instance instanceof Constructor)) { throw new TypeError("Cannot call a class as a function"); } }
+
+/**
+ * Copyright 2016 Google Inc.
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *   http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+
+
+
+/**
+ * @template F
+ */
+
+var MDCComponent = function () {
+  _createClass(MDCComponent, null, [{
+    key: 'attachTo',
+
+    /**
+     * @param {!Element} root
+     * @return {!MDCComponent}
+     */
+    value: function attachTo(root) {
+      // Subclasses which extend MDCBase should provide an attachTo() method that takes a root element and
+      // returns an instantiated component with its root set to that element. Also note that in the cases of
+      // subclasses, an explicit foundation class will not have to be passed in; it will simply be initialized
+      // from getDefaultFoundation().
+      return new MDCComponent(root, new __WEBPACK_IMPORTED_MODULE_0__foundation__["a" /* default */]());
+    }
+
+    /**
+     * @param {!Element} root
+     * @param {F=} foundation
+     * @param {...?} args
+     */
+
+  }]);
+
+  function MDCComponent(root) {
+    var foundation = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : undefined;
+
+    _classCallCheck(this, MDCComponent);
+
+    /** @protected {!Element} */
+    this.root_ = root;
+
+    for (var _len = arguments.length, args = Array(_len > 2 ? _len - 2 : 0), _key = 2; _key < _len; _key++) {
+      args[_key - 2] = arguments[_key];
+    }
+
+    this.initialize.apply(this, args);
+    // Note that we initialize foundation here and not within the constructor's default param so that
+    // this.root_ is defined and can be used within the foundation class.
+    /** @protected {!F} */
+    this.foundation_ = foundation === undefined ? this.getDefaultFoundation() : foundation;
+    this.foundation_.init();
+    this.initialSyncWithDOM();
+  }
+
+  _createClass(MDCComponent, [{
+    key: 'initialize',
+    value: function initialize() /* ...args */{}
+    // Subclasses can override this to do any additional setup work that would be considered part of a
+    // "constructor". Essentially, it is a hook into the parent constructor before the foundation is
+    // initialized. Any additional arguments besides root and foundation will be passed in here.
+
+
+    /**
+     * @return {!F} foundation
+     */
+
+  }, {
+    key: 'getDefaultFoundation',
+    value: function getDefaultFoundation() {
+      // Subclasses must override this method to return a properly configured foundation class for the
+      // component.
+      throw new Error('Subclasses must override getDefaultFoundation to return a properly configured ' + 'foundation class');
+    }
+  }, {
+    key: 'initialSyncWithDOM',
+    value: function initialSyncWithDOM() {
+      // Subclasses should override this method if they need to perform work to synchronize with a host DOM
+      // object. An example of this would be a form control wrapper that needs to synchronize its internal state
+      // to some property or attribute of the host DOM. Please note: this is *not* the place to perform DOM
+      // reads/writes that would cause layout / paint, as this is called synchronously from within the constructor.
+    }
+  }, {
+    key: 'destroy',
+    value: function destroy() {
+      // Subclasses may implement this method to release any resources / deregister any listeners they have
+      // attached. An example of this might be deregistering a resize event from the window object.
+      this.foundation_.destroy();
+    }
+
+    /**
+     * Wrapper method to add an event listener to the component's root element. This is most useful when
+     * listening for custom events.
+     * @param {string} evtType
+     * @param {!Function} handler
+     */
+
+  }, {
+    key: 'listen',
+    value: function listen(evtType, handler) {
+      this.root_.addEventListener(evtType, handler);
+    }
+
+    /**
+     * Wrapper method to remove an event listener to the component's root element. This is most useful when
+     * unlistening for custom events.
+     * @param {string} evtType
+     * @param {!Function} handler
+     */
+
+  }, {
+    key: 'unlisten',
+    value: function unlisten(evtType, handler) {
+      this.root_.removeEventListener(evtType, handler);
+    }
+
+    /**
+     * Fires a cross-browser-compatible custom event from the component root of the given type,
+     * with the given data.
+     * @param {string} evtType
+     * @param {!Object} evtData
+     * @param {boolean=} shouldBubble
+     */
+
+  }, {
+    key: 'emit',
+    value: function emit(evtType, evtData) {
+      var shouldBubble = arguments.length > 2 && arguments[2] !== undefined ? arguments[2] : false;
+
+      var evt = void 0;
+      if (typeof CustomEvent === 'function') {
+        evt = new CustomEvent(evtType, {
+          detail: evtData,
+          bubbles: shouldBubble
+        });
+      } else {
+        evt = document.createEvent('CustomEvent');
+        evt.initCustomEvent(evtType, shouldBubble, false, evtData);
+      }
+
+      this.root_.dispatchEvent(evt);
+    }
+  }]);
+
+  return MDCComponent;
+}();
+
+/* harmony default export */ __webpack_exports__["a"] = (MDCComponent);
+
+/***/ }),
+
+/***/ 24:
+/***/ (function(module, __webpack_exports__, __webpack_require__) {
+
+"use strict";
+Object.defineProperty(__webpack_exports__, "__esModule", { value: true });
+/* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, "MDCCheckbox", function() { return MDCCheckbox; });
+/* harmony import */ var __WEBPACK_IMPORTED_MODULE_0__material_animation__ = __webpack_require__(9);
+/* harmony import */ var __WEBPACK_IMPORTED_MODULE_1__material_base_component__ = __webpack_require__(1);
+/* harmony import */ var __WEBPACK_IMPORTED_MODULE_2__material_base_selection_control__ = __webpack_require__(3);
+/* harmony import */ var __WEBPACK_IMPORTED_MODULE_3__foundation__ = __webpack_require__(40);
+/* harmony import */ var __WEBPACK_IMPORTED_MODULE_4__material_ripple__ = __webpack_require__(6);
+/* harmony import */ var __WEBPACK_IMPORTED_MODULE_5__material_ripple_util__ = __webpack_require__(5);
+/* harmony reexport (binding) */ __webpack_require__.d(__webpack_exports__, "MDCCheckboxFoundation", function() { return __WEBPACK_IMPORTED_MODULE_3__foundation__["a"]; });
+var _extends = Object.assign || function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; };
+
+var _get = function get(object, property, receiver) { if (object === null) object = Function.prototype; var desc = Object.getOwnPropertyDescriptor(object, property); if (desc === undefined) { var parent = Object.getPrototypeOf(object); if (parent === null) { return undefined; } else { return get(parent, property, receiver); } } else if ("value" in desc) { return desc.value; } else { var getter = desc.get; if (getter === undefined) { return undefined; } return getter.call(receiver); } };
+
+var _createClass = function () { function defineProperties(target, props) { for (var i = 0; i < props.length; i++) { var descriptor = props[i]; descriptor.enumerable = descriptor.enumerable || false; descriptor.configurable = true; if ("value" in descriptor) descriptor.writable = true; Object.defineProperty(target, descriptor.key, descriptor); } } return function (Constructor, protoProps, staticProps) { if (protoProps) defineProperties(Constructor.prototype, protoProps); if (staticProps) defineProperties(Constructor, staticProps); return Constructor; }; }();
+
+function _classCallCheck(instance, Constructor) { if (!(instance instanceof Constructor)) { throw new TypeError("Cannot call a class as a function"); } }
+
+function _possibleConstructorReturn(self, call) { if (!self) { throw new ReferenceError("this hasn't been initialised - super() hasn't been called"); } return call && (typeof call === "object" || typeof call === "function") ? call : self; }
+
+function _inherits(subClass, superClass) { if (typeof superClass !== "function" && superClass !== null) { throw new TypeError("Super expression must either be null or a function, not " + typeof superClass); } subClass.prototype = Object.create(superClass && superClass.prototype, { constructor: { value: subClass, enumerable: false, writable: true, configurable: true } }); if (superClass) Object.setPrototypeOf ? Object.setPrototypeOf(subClass, superClass) : subClass.__proto__ = superClass; }
+
+/**
+ * Copyright 2016 Google Inc. All Rights Reserved.
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *      http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+
+
+
+/* eslint-disable no-unused-vars */
+
+/* eslint-enable no-unused-vars */
+
+
+
+
+
+
+/**
+ * @extends MDCComponent<!MDCCheckboxFoundation>
+ */
+var MDCCheckbox = function (_MDCComponent) {
+  _inherits(MDCCheckbox, _MDCComponent);
+
+  _createClass(MDCCheckbox, [{
+    key: 'nativeCb_',
+
+
+    /**
+     * Returns the state of the native control element, or null if the native control element is not present.
+     * @return {?SelectionControlState}
+     * @private
+     */
+    get: function get() {
+      var NATIVE_CONTROL_SELECTOR = __WEBPACK_IMPORTED_MODULE_3__foundation__["a" /* default */].strings.NATIVE_CONTROL_SELECTOR;
+
+      var cbEl = /** @type {?SelectionControlState} */this.root_.querySelector(NATIVE_CONTROL_SELECTOR);
+      return cbEl;
+    }
+  }], [{
+    key: 'attachTo',
+    value: function attachTo(root) {
+      return new MDCCheckbox(root);
+    }
+  }]);
+
+  function MDCCheckbox() {
+    var _ref;
+
+    _classCallCheck(this, MDCCheckbox);
+
+    for (var _len = arguments.length, args = Array(_len), _key = 0; _key < _len; _key++) {
+      args[_key] = arguments[_key];
+    }
+
+    /** @private {!MDCRipple} */
+    var _this = _possibleConstructorReturn(this, (_ref = MDCCheckbox.__proto__ || Object.getPrototypeOf(MDCCheckbox)).call.apply(_ref, [this].concat(args)));
+
+    _this.ripple_ = _this.initRipple_();
+    return _this;
+  }
+
+  /**
+   * @return {!MDCRipple}
+   * @private
+   */
+
+
+  _createClass(MDCCheckbox, [{
+    key: 'initRipple_',
+    value: function initRipple_() {
+      var _this2 = this;
+
+      var MATCHES = __webpack_require__.i(__WEBPACK_IMPORTED_MODULE_5__material_ripple_util__["getMatchesProperty"])(HTMLElement.prototype);
+      var adapter = _extends(__WEBPACK_IMPORTED_MODULE_4__material_ripple__["MDCRipple"].createAdapter(this), {
+        isUnbounded: function isUnbounded() {
+          return true;
+        },
+        isSurfaceActive: function isSurfaceActive() {
+          return _this2.nativeCb_[MATCHES](':active');
+        },
+        registerInteractionHandler: function registerInteractionHandler(type, handler) {
+          return _this2.nativeCb_.addEventListener(type, handler);
+        },
+        deregisterInteractionHandler: function deregisterInteractionHandler(type, handler) {
+          return _this2.nativeCb_.removeEventListener(type, handler);
+        },
+        computeBoundingRect: function computeBoundingRect() {
+          var _root_$getBoundingCli = _this2.root_.getBoundingClientRect(),
+              left = _root_$getBoundingCli.left,
+              top = _root_$getBoundingCli.top;
+
+          var DIM = 40;
+          return {
+            top: top,
+            left: left,
+            right: left + DIM,
+            bottom: top + DIM,
+            width: DIM,
+            height: DIM
+          };
+        }
+      });
+      var foundation = new __WEBPACK_IMPORTED_MODULE_4__material_ripple__["MDCRippleFoundation"](adapter);
+      return new __WEBPACK_IMPORTED_MODULE_4__material_ripple__["MDCRipple"](this.root_, foundation);
+    }
+
+    /** @return {!MDCCheckboxFoundation} */
+
+  }, {
+    key: 'getDefaultFoundation',
+    value: function getDefaultFoundation() {
+      var _this3 = this;
+
+      return new __WEBPACK_IMPORTED_MODULE_3__foundation__["a" /* default */]({
+        addClass: function addClass(className) {
+          return _this3.root_.classList.add(className);
+        },
+        removeClass: function removeClass(className) {
+          return _this3.root_.classList.remove(className);
+        },
+        registerAnimationEndHandler: function registerAnimationEndHandler(handler) {
+          return _this3.root_.addEventListener(__webpack_require__.i(__WEBPACK_IMPORTED_MODULE_0__material_animation__["getCorrectEventName"])(window, 'animationend'), handler);
+        },
+        deregisterAnimationEndHandler: function deregisterAnimationEndHandler(handler) {
+          return _this3.root_.removeEventListener(__webpack_require__.i(__WEBPACK_IMPORTED_MODULE_0__material_animation__["getCorrectEventName"])(window, 'animationend'), handler);
+        },
+        registerChangeHandler: function registerChangeHandler(handler) {
+          return _this3.nativeCb_.addEventListener('change', handler);
+        },
+        deregisterChangeHandler: function deregisterChangeHandler(handler) {
+          return _this3.nativeCb_.removeEventListener('change', handler);
+        },
+        getNativeControl: function getNativeControl() {
+          return _this3.nativeCb_;
+        },
+        forceLayout: function forceLayout() {
+          return _this3.root_.offsetWidth;
+        },
+        isAttachedToDOM: function isAttachedToDOM() {
+          return Boolean(_this3.root_.parentNode);
+        }
+      });
+    }
+
+    /** @return {!MDCRipple} */
+
+  }, {
+    key: 'destroy',
+    value: function destroy() {
+      this.ripple_.destroy();
+      _get(MDCCheckbox.prototype.__proto__ || Object.getPrototypeOf(MDCCheckbox.prototype), 'destroy', this).call(this);
+    }
+  }, {
+    key: 'ripple',
+    get: function get() {
+      return this.ripple_;
+    }
+
+    /** @return {boolean} */
+
+  }, {
+    key: 'checked',
+    get: function get() {
+      return this.foundation_.isChecked();
+    }
+
+    /** @param {boolean} checked */
+    ,
+    set: function set(checked) {
+      this.foundation_.setChecked(checked);
+    }
+
+    /** @return {boolean} */
+
+  }, {
+    key: 'indeterminate',
+    get: function get() {
+      return this.foundation_.isIndeterminate();
+    }
+
+    /** @param {boolean} indeterminate */
+    ,
+    set: function set(indeterminate) {
+      this.foundation_.setIndeterminate(indeterminate);
+    }
+
+    /** @return {boolean} */
+
+  }, {
+    key: 'disabled',
+    get: function get() {
+      return this.foundation_.isDisabled();
+    }
+
+    /** @param {boolean} disabled */
+    ,
+    set: function set(disabled) {
+      this.foundation_.setDisabled(disabled);
+    }
+
+    /** @return {?string} */
+
+  }, {
+    key: 'value',
+    get: function get() {
+      return this.foundation_.getValue();
+    }
+
+    /** @param {?string} value */
+    ,
+    set: function set(value) {
+      this.foundation_.setValue(value);
+    }
+  }]);
+
+  return MDCCheckbox;
+}(__WEBPACK_IMPORTED_MODULE_1__material_base_component__["a" /* default */]);
+
+/***/ }),
+
+/***/ 3:
+/***/ (function(module, __webpack_exports__, __webpack_require__) {
+
+"use strict";
+/* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, "a", function() { return SelectionControlState; });
+/**
+ * Copyright 2017 Google Inc. All Rights Reserved.
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *      http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+
+/**
+ * @typedef {!{
+ *   checked: boolean,
+ *   indeterminate: boolean,
+ *   disabled: boolean,
+ *   value: ?string
+ * }}
+ */
+var SelectionControlState = void 0;
+
+/***/ }),
+
+/***/ 38:
+/***/ (function(module, __webpack_exports__, __webpack_require__) {
+
+"use strict";
+/* harmony import */ var __WEBPACK_IMPORTED_MODULE_0__material_base_selection_control__ = __webpack_require__(3);
+var _createClass = function () { function defineProperties(target, props) { for (var i = 0; i < props.length; i++) { var descriptor = props[i]; descriptor.enumerable = descriptor.enumerable || false; descriptor.configurable = true; if ("value" in descriptor) descriptor.writable = true; Object.defineProperty(target, descriptor.key, descriptor); } } return function (Constructor, protoProps, staticProps) { if (protoProps) defineProperties(Constructor.prototype, protoProps); if (staticProps) defineProperties(Constructor, staticProps); return Constructor; }; }();
+
+function _classCallCheck(instance, Constructor) { if (!(instance instanceof Constructor)) { throw new TypeError("Cannot call a class as a function"); } }
+
+/**
+ * Copyright 2016 Google Inc. All Rights Reserved.
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *      http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+
+/* eslint-disable no-unused-vars */
+
+
+/* eslint no-unused-vars: [2, {"args": "none"}] */
+
+/**
+ * Adapter for MDC Checkbox. Provides an interface for managing
+ * - classes
+ * - dom
+ * - event handlers
+ *
+ * Additionally, provides type information for the adapter to the Closure
+ * compiler.
+ *
+ * Implement this adapter for your framework of choice to delegate updates to
+ * the component in your framework of choice. See architecture documentation
+ * for more details.
+ * https://github.com/material-components/material-components-web/blob/master/docs/architecture.md
+ *
+ * @record
+ */
+
+var MDCCheckboxAdapter = function () {
+  function MDCCheckboxAdapter() {
+    _classCallCheck(this, MDCCheckboxAdapter);
+  }
+
+  _createClass(MDCCheckboxAdapter, [{
+    key: 'addClass',
+
+    /** @param {string} className */
+    value: function addClass(className) {}
+
+    /** @param {string} className */
+
+  }, {
+    key: 'removeClass',
+    value: function removeClass(className) {}
+
+    /** @param {!EventListener} handler */
+
+  }, {
+    key: 'registerAnimationEndHandler',
+    value: function registerAnimationEndHandler(handler) {}
+
+    /** @param {!EventListener} handler */
+
+  }, {
+    key: 'deregisterAnimationEndHandler',
+    value: function deregisterAnimationEndHandler(handler) {}
+
+    /** @param {!EventListener} handler */
+
+  }, {
+    key: 'registerChangeHandler',
+    value: function registerChangeHandler(handler) {}
+
+    /** @param {!EventListener} handler */
+
+  }, {
+    key: 'deregisterChangeHandler',
+    value: function deregisterChangeHandler(handler) {}
+
+    /** @return {!SelectionControlState} */
+
+  }, {
+    key: 'getNativeControl',
+    value: function getNativeControl() {}
+  }, {
+    key: 'forceLayout',
+    value: function forceLayout() {}
+
+    /** @return {boolean} */
+
+  }, {
+    key: 'isAttachedToDOM',
+    value: function isAttachedToDOM() {}
+  }]);
+
+  return MDCCheckboxAdapter;
+}();
+
+/* unused harmony default export */ var _unused_webpack_default_export = (MDCCheckboxAdapter);
+
+/***/ }),
+
+/***/ 39:
+/***/ (function(module, __webpack_exports__, __webpack_require__) {
+
+"use strict";
+/* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, "a", function() { return cssClasses; });
+/* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, "b", function() { return strings; });
+/* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, "c", function() { return numbers; });
+/**
+ * Copyright 2016 Google Inc. All Rights Reserved.
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *      http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+
+/** @const {string} */
+var ROOT = 'mdc-checkbox';
+
+/** @enum {string} */
+var cssClasses = {
+  UPGRADED: 'mdc-checkbox--upgraded',
+  CHECKED: 'mdc-checkbox--checked',
+  INDETERMINATE: 'mdc-checkbox--indeterminate',
+  DISABLED: 'mdc-checkbox--disabled',
+  ANIM_UNCHECKED_CHECKED: 'mdc-checkbox--anim-unchecked-checked',
+  ANIM_UNCHECKED_INDETERMINATE: 'mdc-checkbox--anim-unchecked-indeterminate',
+  ANIM_CHECKED_UNCHECKED: 'mdc-checkbox--anim-checked-unchecked',
+  ANIM_CHECKED_INDETERMINATE: 'mdc-checkbox--anim-checked-indeterminate',
+  ANIM_INDETERMINATE_CHECKED: 'mdc-checkbox--anim-indeterminate-checked',
+  ANIM_INDETERMINATE_UNCHECKED: 'mdc-checkbox--anim-indeterminate-unchecked'
+};
+
+/** @enum {string} */
+var strings = {
+  NATIVE_CONTROL_SELECTOR: '.' + ROOT + '__native-control',
+  TRANSITION_STATE_INIT: 'init',
+  TRANSITION_STATE_CHECKED: 'checked',
+  TRANSITION_STATE_UNCHECKED: 'unchecked',
+  TRANSITION_STATE_INDETERMINATE: 'indeterminate'
+};
+
+/** @enum {number} */
+var numbers = {
+  ANIM_END_LATCH_MS: 100
+};
+
+/***/ }),
+
+/***/ 4:
+/***/ (function(module, __webpack_exports__, __webpack_require__) {
+
+"use strict";
+var _createClass = function () { function defineProperties(target, props) { for (var i = 0; i < props.length; i++) { var descriptor = props[i]; descriptor.enumerable = descriptor.enumerable || false; descriptor.configurable = true; if ("value" in descriptor) descriptor.writable = true; Object.defineProperty(target, descriptor.key, descriptor); } } return function (Constructor, protoProps, staticProps) { if (protoProps) defineProperties(Constructor.prototype, protoProps); if (staticProps) defineProperties(Constructor, staticProps); return Constructor; }; }();
+
+function _classCallCheck(instance, Constructor) { if (!(instance instanceof Constructor)) { throw new TypeError("Cannot call a class as a function"); } }
+
+/**
+ * Copyright 2016 Google Inc. All Rights Reserved.
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *      http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+
+/* eslint no-unused-vars: [2, {"args": "none"}] */
+
+/**
+ * Adapter for MDC Ripple. Provides an interface for managing
+ * - classes
+ * - dom
+ * - CSS variables
+ * - position
+ * - dimensions
+ * - scroll position
+ * - event handlers
+ * - unbounded, active and disabled states
+ *
+ * Additionally, provides type information for the adapter to the Closure
+ * compiler.
+ *
+ * Implement this adapter for your framework of choice to delegate updates to
+ * the component in your framework of choice. See architecture documentation
+ * for more details.
+ * https://github.com/material-components/material-components-web/blob/master/docs/architecture.md
+ *
+ * @record
+ */
+var MDCRippleAdapter = function () {
+  function MDCRippleAdapter() {
+    _classCallCheck(this, MDCRippleAdapter);
+  }
+
+  _createClass(MDCRippleAdapter, [{
+    key: "browserSupportsCssVars",
+
+    /** @return {boolean} */
+    value: function browserSupportsCssVars() {}
+
+    /** @return {boolean} */
+
+  }, {
+    key: "isUnbounded",
+    value: function isUnbounded() {}
+
+    /** @return {boolean} */
+
+  }, {
+    key: "isSurfaceActive",
+    value: function isSurfaceActive() {}
+
+    /** @return {boolean} */
+
+  }, {
+    key: "isSurfaceDisabled",
+    value: function isSurfaceDisabled() {}
+
+    /** @param {string} className */
+
+  }, {
+    key: "addClass",
+    value: function addClass(className) {}
+
+    /** @param {string} className */
+
+  }, {
+    key: "removeClass",
+    value: function removeClass(className) {}
+
+    /**
+     * @param {string} evtType
+     * @param {!Function} handler
+     */
+
+  }, {
+    key: "registerInteractionHandler",
+    value: function registerInteractionHandler(evtType, handler) {}
+
+    /**
+     * @param {string} evtType
+     * @param {!Function} handler
+     */
+
+  }, {
+    key: "deregisterInteractionHandler",
+    value: function deregisterInteractionHandler(evtType, handler) {}
+
+    /**
+     * @param {!Function} handler
+     */
+
+  }, {
+    key: "registerResizeHandler",
+    value: function registerResizeHandler(handler) {}
+
+    /**
+     * @param {!Function} handler
+     */
+
+  }, {
+    key: "deregisterResizeHandler",
+    value: function deregisterResizeHandler(handler) {}
+
+    /**
+     * @param {string} varName
+     * @param {?number|string} value
+     */
+
+  }, {
+    key: "updateCssVariable",
+    value: function updateCssVariable(varName, value) {}
+
+    /** @return {!ClientRect} */
+
+  }, {
+    key: "computeBoundingRect",
+    value: function computeBoundingRect() {}
+
+    /** @return {{x: number, y: number}} */
+
+  }, {
+    key: "getWindowPageOffset",
+    value: function getWindowPageOffset() {}
+  }]);
+
+  return MDCRippleAdapter;
+}();
+
+/* unused harmony default export */ var _unused_webpack_default_export = (MDCRippleAdapter);
+
+/***/ }),
+
+/***/ 40:
+/***/ (function(module, __webpack_exports__, __webpack_require__) {
+
+"use strict";
+/* harmony import */ var __WEBPACK_IMPORTED_MODULE_0__material_base_foundation__ = __webpack_require__(0);
+/* harmony import */ var __WEBPACK_IMPORTED_MODULE_1__material_base_selection_control__ = __webpack_require__(3);
+/* harmony import */ var __WEBPACK_IMPORTED_MODULE_2__adapter__ = __webpack_require__(38);
+/* harmony import */ var __WEBPACK_IMPORTED_MODULE_3__constants__ = __webpack_require__(39);
+var _extends = Object.assign || function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; };
+
+var _createClass = function () { function defineProperties(target, props) { for (var i = 0; i < props.length; i++) { var descriptor = props[i]; descriptor.enumerable = descriptor.enumerable || false; descriptor.configurable = true; if ("value" in descriptor) descriptor.writable = true; Object.defineProperty(target, descriptor.key, descriptor); } } return function (Constructor, protoProps, staticProps) { if (protoProps) defineProperties(Constructor.prototype, protoProps); if (staticProps) defineProperties(Constructor, staticProps); return Constructor; }; }();
+
+function _classCallCheck(instance, Constructor) { if (!(instance instanceof Constructor)) { throw new TypeError("Cannot call a class as a function"); } }
+
+function _possibleConstructorReturn(self, call) { if (!self) { throw new ReferenceError("this hasn't been initialised - super() hasn't been called"); } return call && (typeof call === "object" || typeof call === "function") ? call : self; }
+
+function _inherits(subClass, superClass) { if (typeof superClass !== "function" && superClass !== null) { throw new TypeError("Super expression must either be null or a function, not " + typeof superClass); } subClass.prototype = Object.create(superClass && superClass.prototype, { constructor: { value: subClass, enumerable: false, writable: true, configurable: true } }); if (superClass) Object.setPrototypeOf ? Object.setPrototypeOf(subClass, superClass) : subClass.__proto__ = superClass; }
+
+/**
+ * Copyright 2016 Google Inc. All Rights Reserved.
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *      http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+
+
+/* eslint-disable no-unused-vars */
+
+
+/* eslint-enable no-unused-vars */
+
+
+/** @const {!Array<string>} */
+var CB_PROTO_PROPS = ['checked', 'indeterminate'];
+
+/**
+ * @extends {MDCFoundation<!MDCCheckboxAdapter>}
+ */
+
+var MDCCheckboxFoundation = function (_MDCFoundation) {
+  _inherits(MDCCheckboxFoundation, _MDCFoundation);
+
+  _createClass(MDCCheckboxFoundation, null, [{
+    key: 'cssClasses',
+
+    /** @return enum {cssClasses} */
+    get: function get() {
+      return __WEBPACK_IMPORTED_MODULE_3__constants__["a" /* cssClasses */];
+    }
+
+    /** @return enum {strings} */
+
+  }, {
+    key: 'strings',
+    get: function get() {
+      return __WEBPACK_IMPORTED_MODULE_3__constants__["b" /* strings */];
+    }
+
+    /** @return enum {numbers} */
+
+  }, {
+    key: 'numbers',
+    get: function get() {
+      return __WEBPACK_IMPORTED_MODULE_3__constants__["c" /* numbers */];
+    }
+
+    /** @return {!MDCCheckboxAdapter} */
+
+  }, {
+    key: 'defaultAdapter',
+    get: function get() {
+      return (/** @type {!MDCCheckboxAdapter} */{
+          addClass: function addClass() /* className: string */{},
+          removeClass: function removeClass() /* className: string */{},
+          registerAnimationEndHandler: function registerAnimationEndHandler() /* handler: EventListener */{},
+          deregisterAnimationEndHandler: function deregisterAnimationEndHandler() /* handler: EventListener */{},
+          registerChangeHandler: function registerChangeHandler() /* handler: EventListener */{},
+          deregisterChangeHandler: function deregisterChangeHandler() /* handler: EventListener */{},
+          getNativeControl: function getNativeControl() /* !SelectionControlState */{},
+          forceLayout: function forceLayout() {},
+          isAttachedToDOM: function isAttachedToDOM() /* boolean */{}
+        }
+      );
+    }
+  }]);
+
+  function MDCCheckboxFoundation(adapter) {
+    _classCallCheck(this, MDCCheckboxFoundation);
+
+    /** @private {string} */
+    var _this = _possibleConstructorReturn(this, (MDCCheckboxFoundation.__proto__ || Object.getPrototypeOf(MDCCheckboxFoundation)).call(this, _extends(MDCCheckboxFoundation.defaultAdapter, adapter)));
+
+    _this.currentCheckState_ = __WEBPACK_IMPORTED_MODULE_3__constants__["b" /* strings */].TRANSITION_STATE_INIT;
+
+    /** @private {string} */
+    _this.currentAnimationClass_ = '';
+
+    /** @private {number} */
+    _this.animEndLatchTimer_ = 0;
+
+    _this.animEndHandler_ = /** @private {!EventListener} */function () {
+      clearTimeout(_this.animEndLatchTimer_);
+      _this.animEndLatchTimer_ = setTimeout(function () {
+        _this.adapter_.removeClass(_this.currentAnimationClass_);
+        _this.adapter_.deregisterAnimationEndHandler(_this.animEndHandler_);
+      }, __WEBPACK_IMPORTED_MODULE_3__constants__["c" /* numbers */].ANIM_END_LATCH_MS);
+    };
+
+    _this.changeHandler_ = /** @private {!EventListener} */function () {
+      return _this.transitionCheckState_();
+    };
+    return _this;
+  }
+
+  _createClass(MDCCheckboxFoundation, [{
+    key: 'init',
+    value: function init() {
+      this.adapter_.addClass(__WEBPACK_IMPORTED_MODULE_3__constants__["a" /* cssClasses */].UPGRADED);
+      this.adapter_.registerChangeHandler(this.changeHandler_);
+      this.installPropertyChangeHooks_();
+    }
+  }, {
+    key: 'destroy',
+    value: function destroy() {
+      this.adapter_.deregisterChangeHandler(this.changeHandler_);
+      this.uninstallPropertyChangeHooks_();
+    }
+
+    /** @return {boolean} */
+
+  }, {
+    key: 'isChecked',
+    value: function isChecked() {
+      return this.getNativeControl_().checked;
+    }
+
+    /** @param {boolean} checked */
+
+  }, {
+    key: 'setChecked',
+    value: function setChecked(checked) {
+      this.getNativeControl_().checked = checked;
+    }
+
+    /** @return {boolean} */
+
+  }, {
+    key: 'isIndeterminate',
+    value: function isIndeterminate() {
+      return this.getNativeControl_().indeterminate;
+    }
+
+    /** @param {boolean} indeterminate */
+
+  }, {
+    key: 'setIndeterminate',
+    value: function setIndeterminate(indeterminate) {
+      this.getNativeControl_().indeterminate = indeterminate;
+    }
+
+    /** @return {boolean} */
+
+  }, {
+    key: 'isDisabled',
+    value: function isDisabled() {
+      return this.getNativeControl_().disabled;
+    }
+
+    /** @param {boolean} disabled */
+
+  }, {
+    key: 'setDisabled',
+    value: function setDisabled(disabled) {
+      this.getNativeControl_().disabled = disabled;
+      if (disabled) {
+        this.adapter_.addClass(__WEBPACK_IMPORTED_MODULE_3__constants__["a" /* cssClasses */].DISABLED);
+      } else {
+        this.adapter_.removeClass(__WEBPACK_IMPORTED_MODULE_3__constants__["a" /* cssClasses */].DISABLED);
+      }
+    }
+
+    /** @return {?string} */
+
+  }, {
+    key: 'getValue',
+    value: function getValue() {
+      return this.getNativeControl_().value;
+    }
+
+    /** @param {?string} value */
+
+  }, {
+    key: 'setValue',
+    value: function setValue(value) {
+      this.getNativeControl_().value = value;
+    }
+
+    /** @private */
+
+  }, {
+    key: 'installPropertyChangeHooks_',
+    value: function installPropertyChangeHooks_() {
+      var _this2 = this;
+
+      var nativeCb = this.getNativeControl_();
+      var cbProto = Object.getPrototypeOf(nativeCb);
+
+      CB_PROTO_PROPS.forEach(function (controlState) {
+        var desc = Object.getOwnPropertyDescriptor(cbProto, controlState);
+        // We have to check for this descriptor, since some browsers (Safari) don't support its return.
+        // See: https://bugs.webkit.org/show_bug.cgi?id=49739
+        if (validDescriptor(desc)) {
+          var nativeCbDesc = /** @type {!ObjectPropertyDescriptor} */{
+            get: desc.get,
+            set: function set(state) {
+              desc.set.call(nativeCb, state);
+              _this2.transitionCheckState_();
+            },
+            configurable: desc.configurable,
+            enumerable: desc.enumerable
+          };
+          Object.defineProperty(nativeCb, controlState, nativeCbDesc);
+        }
+      });
+    }
+
+    /** @private */
+
+  }, {
+    key: 'uninstallPropertyChangeHooks_',
+    value: function uninstallPropertyChangeHooks_() {
+      var nativeCb = this.getNativeControl_();
+      var cbProto = Object.getPrototypeOf(nativeCb);
+
+      CB_PROTO_PROPS.forEach(function (controlState) {
+        var desc = /** @type {!ObjectPropertyDescriptor} */Object.getOwnPropertyDescriptor(cbProto, controlState);
+        if (validDescriptor(desc)) {
+          Object.defineProperty(nativeCb, controlState, desc);
+        }
+      });
+    }
+
+    /** @private */
+
+  }, {
+    key: 'transitionCheckState_',
+    value: function transitionCheckState_() {
+      var nativeCb = this.adapter_.getNativeControl();
+      if (!nativeCb) {
+        return;
+      }
+      var oldState = this.currentCheckState_;
+      var newState = this.determineCheckState_(nativeCb);
+      if (oldState === newState) {
+        return;
+      }
+
+      // Check to ensure that there isn't a previously existing animation class, in case for example
+      // the user interacted with the checkbox before the animation was finished.
+      if (this.currentAnimationClass_.length > 0) {
+        clearTimeout(this.animEndLatchTimer_);
+        this.adapter_.forceLayout();
+        this.adapter_.removeClass(this.currentAnimationClass_);
+      }
+
+      this.currentAnimationClass_ = this.getTransitionAnimationClass_(oldState, newState);
+      this.currentCheckState_ = newState;
+
+      // Check for parentNode so that animations are only run when the element is attached
+      // to the DOM.
+      if (this.adapter_.isAttachedToDOM() && this.currentAnimationClass_.length > 0) {
+        this.adapter_.addClass(this.currentAnimationClass_);
+        this.adapter_.registerAnimationEndHandler(this.animEndHandler_);
+      }
+    }
+
+    /**
+     * @param {!SelectionControlState} nativeCb
+     * @return {string}
+     * @private
+     */
+
+  }, {
+    key: 'determineCheckState_',
+    value: function determineCheckState_(nativeCb) {
+      var TRANSITION_STATE_INDETERMINATE = __WEBPACK_IMPORTED_MODULE_3__constants__["b" /* strings */].TRANSITION_STATE_INDETERMINATE,
+          TRANSITION_STATE_CHECKED = __WEBPACK_IMPORTED_MODULE_3__constants__["b" /* strings */].TRANSITION_STATE_CHECKED,
+          TRANSITION_STATE_UNCHECKED = __WEBPACK_IMPORTED_MODULE_3__constants__["b" /* strings */].TRANSITION_STATE_UNCHECKED;
+
+
+      if (nativeCb.indeterminate) {
+        return TRANSITION_STATE_INDETERMINATE;
+      }
+      return nativeCb.checked ? TRANSITION_STATE_CHECKED : TRANSITION_STATE_UNCHECKED;
+    }
+
+    /**
+     * @param {string} oldState
+     * @param {string} newState
+     * @return {string}
+     */
+
+  }, {
+    key: 'getTransitionAnimationClass_',
+    value: function getTransitionAnimationClass_(oldState, newState) {
+      var TRANSITION_STATE_INIT = __WEBPACK_IMPORTED_MODULE_3__constants__["b" /* strings */].TRANSITION_STATE_INIT,
+          TRANSITION_STATE_CHECKED = __WEBPACK_IMPORTED_MODULE_3__constants__["b" /* strings */].TRANSITION_STATE_CHECKED,
+          TRANSITION_STATE_UNCHECKED = __WEBPACK_IMPORTED_MODULE_3__constants__["b" /* strings */].TRANSITION_STATE_UNCHECKED;
+      var _MDCCheckboxFoundatio = MDCCheckboxFoundation.cssClasses,
+          ANIM_UNCHECKED_CHECKED = _MDCCheckboxFoundatio.ANIM_UNCHECKED_CHECKED,
+          ANIM_UNCHECKED_INDETERMINATE = _MDCCheckboxFoundatio.ANIM_UNCHECKED_INDETERMINATE,
+          ANIM_CHECKED_UNCHECKED = _MDCCheckboxFoundatio.ANIM_CHECKED_UNCHECKED,
+          ANIM_CHECKED_INDETERMINATE = _MDCCheckboxFoundatio.ANIM_CHECKED_INDETERMINATE,
+          ANIM_INDETERMINATE_CHECKED = _MDCCheckboxFoundatio.ANIM_INDETERMINATE_CHECKED,
+          ANIM_INDETERMINATE_UNCHECKED = _MDCCheckboxFoundatio.ANIM_INDETERMINATE_UNCHECKED;
+
+
+      switch (oldState) {
+        case TRANSITION_STATE_INIT:
+          if (newState === TRANSITION_STATE_UNCHECKED) {
+            return '';
+          }
+        // fallthrough
+        case TRANSITION_STATE_UNCHECKED:
+          return newState === TRANSITION_STATE_CHECKED ? ANIM_UNCHECKED_CHECKED : ANIM_UNCHECKED_INDETERMINATE;
+        case TRANSITION_STATE_CHECKED:
+          return newState === TRANSITION_STATE_UNCHECKED ? ANIM_CHECKED_UNCHECKED : ANIM_CHECKED_INDETERMINATE;
+        // TRANSITION_STATE_INDETERMINATE
+        default:
+          return newState === TRANSITION_STATE_CHECKED ? ANIM_INDETERMINATE_CHECKED : ANIM_INDETERMINATE_UNCHECKED;
+      }
+    }
+
+    /**
+     * @return {!SelectionControlState}
+     * @private
+     */
+
+  }, {
+    key: 'getNativeControl_',
+    value: function getNativeControl_() {
+      return this.adapter_.getNativeControl() || {
+        checked: false,
+        indeterminate: false,
+        disabled: false,
+        value: null
+      };
+    }
+  }]);
+
+  return MDCCheckboxFoundation;
+}(__WEBPACK_IMPORTED_MODULE_0__material_base_foundation__["a" /* default */]);
+
+/**
+ * @param {ObjectPropertyDescriptor|undefined} inputPropDesc
+ * @return {boolean}
+ */
+
+
+/* harmony default export */ __webpack_exports__["a"] = (MDCCheckboxFoundation);
+function validDescriptor(inputPropDesc) {
+  return !!inputPropDesc && typeof inputPropDesc.set === 'function';
+}
+
+/***/ }),
+
+/***/ 5:
+/***/ (function(module, __webpack_exports__, __webpack_require__) {
+
+"use strict";
+Object.defineProperty(__webpack_exports__, "__esModule", { value: true });
+/* harmony export (immutable) */ __webpack_exports__["supportsCssVariables"] = supportsCssVariables;
+/* harmony export (immutable) */ __webpack_exports__["applyPassive"] = applyPassive;
+/* harmony export (immutable) */ __webpack_exports__["getMatchesProperty"] = getMatchesProperty;
+/* harmony export (immutable) */ __webpack_exports__["getNormalizedEventCoords"] = getNormalizedEventCoords;
+/**
+ * Copyright 2016 Google Inc. All Rights Reserved.
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *      http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+
+/**
+ * Stores result from supportsCssVariables to avoid redundant processing to detect CSS custom variable support.
+ * @private {boolean|undefined}
+ */
+var supportsCssVariables_ = void 0;
+
+/**
+ * Stores result from applyPassive to avoid redundant processing to detect passive event listener support.
+ * @private {boolean|undefined}
+ */
+var supportsPassive_ = void 0;
+
+/**
+ * @param {!Window} windowObj
+ * @return {boolean}
+ */
+function detectEdgePseudoVarBug(windowObj) {
+  // Detect versions of Edge with buggy var() support
+  // See: https://developer.microsoft.com/en-us/microsoft-edge/platform/issues/11495448/
+  var document = windowObj.document;
+  var className = 'test-edge-css-var';
+  var styleNode = document.createElement('style');
+  document.head.appendChild(styleNode);
+  var sheet = styleNode.sheet;
+  // Internet Explorer 11 requires indices to always be specified to insertRule
+  sheet.insertRule(':root { --' + className + ': 1px solid #000; }', 0);
+  sheet.insertRule('.' + className + ' { visibility: hidden; }', 1);
+  sheet.insertRule('.' + className + '::before { border: var(--' + className + '); }', 2);
+  var node = document.createElement('div');
+  node.className = className;
+  document.body.appendChild(node);
+  // Bug exists if ::before style ends up propagating to the parent element
+  var hasPseudoVarBug = windowObj.getComputedStyle(node).borderTopStyle === 'solid';
+  node.remove();
+  styleNode.remove();
+  return hasPseudoVarBug;
+}
+
+/**
+ * @param {!Window} windowObj
+ * @param {boolean=} forceRefresh
+ * @return {boolean|undefined}
+ */
+function supportsCssVariables(windowObj) {
+  var forceRefresh = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : false;
+
+  if (typeof supportsCssVariables_ === 'boolean' && !forceRefresh) {
+    return supportsCssVariables_;
+  }
+
+  var supportsFunctionPresent = windowObj.CSS && typeof windowObj.CSS.supports === 'function';
+  if (!supportsFunctionPresent) {
+    return;
+  }
+
+  var explicitlySupportsCssVars = windowObj.CSS.supports('--css-vars', 'yes');
+  // See: https://bugs.webkit.org/show_bug.cgi?id=154669
+  // See: README section on Safari
+  var weAreFeatureDetectingSafari10plus = windowObj.CSS.supports('(--css-vars: yes)') && windowObj.CSS.supports('color', '#00000000');
+
+  if (explicitlySupportsCssVars || weAreFeatureDetectingSafari10plus) {
+    supportsCssVariables_ = !detectEdgePseudoVarBug(windowObj);
+  } else {
+    supportsCssVariables_ = false;
+  }
+  return supportsCssVariables_;
+}
+
+//
+/**
+ * Determine whether the current browser supports passive event listeners, and if so, use them.
+ * @param {!Window=} globalObj
+ * @param {boolean=} forceRefresh
+ * @return {boolean|{passive: boolean}}
+ */
+function applyPassive() {
+  var globalObj = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : window;
+  var forceRefresh = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : false;
+
+  if (supportsPassive_ === undefined || forceRefresh) {
+    var isSupported = false;
+    try {
+      globalObj.document.addEventListener('test', null, { get passive() {
+          isSupported = true;
+        } });
+    } catch (e) {}
+
+    supportsPassive_ = isSupported;
+  }
+
+  return supportsPassive_ ? { passive: true } : false;
+}
+
+/**
+ * @param {!Object} HTMLElementPrototype
+ * @return {!Array<string>}
+ */
+function getMatchesProperty(HTMLElementPrototype) {
+  return ['webkitMatchesSelector', 'msMatchesSelector', 'matches'].filter(function (p) {
+    return p in HTMLElementPrototype;
+  }).pop();
+}
+
+/**
+ * @param {!Event} ev
+ * @param {!{x: number, y: number}} pageOffset
+ * @param {!ClientRect} clientRect
+ * @return {!{x: number, y: number}}
+ */
+function getNormalizedEventCoords(ev, pageOffset, clientRect) {
+  var x = pageOffset.x,
+      y = pageOffset.y;
+
+  var documentX = x + clientRect.left;
+  var documentY = y + clientRect.top;
+
+  var normalizedX = void 0;
+  var normalizedY = void 0;
+  // Determine touch point relative to the ripple container.
+  if (ev.type === 'touchstart') {
+    normalizedX = ev.changedTouches[0].pageX - documentX;
+    normalizedY = ev.changedTouches[0].pageY - documentY;
+  } else {
+    normalizedX = ev.pageX - documentX;
+    normalizedY = ev.pageY - documentY;
+  }
+
+  return { x: normalizedX, y: normalizedY };
+}
+
+/***/ }),
+
+/***/ 6:
+/***/ (function(module, __webpack_exports__, __webpack_require__) {
+
+"use strict";
+Object.defineProperty(__webpack_exports__, "__esModule", { value: true });
+/* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, "MDCRipple", function() { return MDCRipple; });
+/* harmony import */ var __WEBPACK_IMPORTED_MODULE_0__material_base_component__ = __webpack_require__(1);
+/* harmony import */ var __WEBPACK_IMPORTED_MODULE_1__adapter__ = __webpack_require__(4);
+/* harmony import */ var __WEBPACK_IMPORTED_MODULE_2__foundation__ = __webpack_require__(8);
+/* harmony import */ var __WEBPACK_IMPORTED_MODULE_3__util__ = __webpack_require__(5);
+/* harmony reexport (binding) */ __webpack_require__.d(__webpack_exports__, "MDCRippleFoundation", function() { return __WEBPACK_IMPORTED_MODULE_2__foundation__["a"]; });
+/* harmony reexport (module object) */ __webpack_require__.d(__webpack_exports__, "util", function() { return __WEBPACK_IMPORTED_MODULE_3__util__; });
+var _createClass = function () { function defineProperties(target, props) { for (var i = 0; i < props.length; i++) { var descriptor = props[i]; descriptor.enumerable = descriptor.enumerable || false; descriptor.configurable = true; if ("value" in descriptor) descriptor.writable = true; Object.defineProperty(target, descriptor.key, descriptor); } } return function (Constructor, protoProps, staticProps) { if (protoProps) defineProperties(Constructor.prototype, protoProps); if (staticProps) defineProperties(Constructor, staticProps); return Constructor; }; }();
+
+function _classCallCheck(instance, Constructor) { if (!(instance instanceof Constructor)) { throw new TypeError("Cannot call a class as a function"); } }
+
+function _possibleConstructorReturn(self, call) { if (!self) { throw new ReferenceError("this hasn't been initialised - super() hasn't been called"); } return call && (typeof call === "object" || typeof call === "function") ? call : self; }
+
+function _inherits(subClass, superClass) { if (typeof superClass !== "function" && superClass !== null) { throw new TypeError("Super expression must either be null or a function, not " + typeof superClass); } subClass.prototype = Object.create(superClass && superClass.prototype, { constructor: { value: subClass, enumerable: false, writable: true, configurable: true } }); if (superClass) Object.setPrototypeOf ? Object.setPrototypeOf(subClass, superClass) : subClass.__proto__ = superClass; }
+
+/**
+ * Copyright 2016 Google Inc. All Rights Reserved.
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *      http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+
+
+
+
+
+
+
+
+
+/**
+ * @extends MDCComponent<!MDCRippleFoundation>
+ */
+var MDCRipple = function (_MDCComponent) {
+  _inherits(MDCRipple, _MDCComponent);
+
+  /** @param {...?} args */
+  function MDCRipple() {
+    var _ref;
+
+    _classCallCheck(this, MDCRipple);
+
+    for (var _len = arguments.length, args = Array(_len), _key = 0; _key < _len; _key++) {
+      args[_key] = arguments[_key];
+    }
+
+    /** @type {boolean} */
+    var _this = _possibleConstructorReturn(this, (_ref = MDCRipple.__proto__ || Object.getPrototypeOf(MDCRipple)).call.apply(_ref, [this].concat(args)));
+
+    _this.disabled = false;
+
+    /** @private {boolean} */
+    _this.unbounded_;
+    return _this;
+  }
+
+  /**
+   * @param {!Element} root
+   * @param {{isUnbounded: (boolean|undefined)}=} options
+   * @return {!MDCRipple}
+   */
+
+
+  _createClass(MDCRipple, [{
+    key: 'activate',
+    value: function activate() {
+      this.foundation_.activate();
+    }
+  }, {
+    key: 'deactivate',
+    value: function deactivate() {
+      this.foundation_.deactivate();
+    }
+  }, {
+    key: 'layout',
+    value: function layout() {
+      this.foundation_.layout();
+    }
+
+    /** @return {!MDCRippleFoundation} */
+
+  }, {
+    key: 'getDefaultFoundation',
+    value: function getDefaultFoundation() {
+      return new __WEBPACK_IMPORTED_MODULE_2__foundation__["a" /* default */](MDCRipple.createAdapter(this));
+    }
+  }, {
+    key: 'initialSyncWithDOM',
+    value: function initialSyncWithDOM() {
+      this.unbounded = 'mdcRippleIsUnbounded' in this.root_.dataset;
+    }
+  }, {
+    key: 'unbounded',
+
+
+    /** @return {boolean} */
+    get: function get() {
+      return this.unbounded_;
+    }
+
+    /** @param {boolean} unbounded */
+    ,
+    set: function set(unbounded) {
+      var UNBOUNDED = __WEBPACK_IMPORTED_MODULE_2__foundation__["a" /* default */].cssClasses.UNBOUNDED;
+
+      this.unbounded_ = Boolean(unbounded);
+      if (this.unbounded_) {
+        this.root_.classList.add(UNBOUNDED);
+      } else {
+        this.root_.classList.remove(UNBOUNDED);
+      }
+    }
+  }], [{
+    key: 'attachTo',
+    value: function attachTo(root) {
+      var _ref2 = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : {},
+          _ref2$isUnbounded = _ref2.isUnbounded,
+          isUnbounded = _ref2$isUnbounded === undefined ? undefined : _ref2$isUnbounded;
+
+      var ripple = new MDCRipple(root);
+      // Only override unbounded behavior if option is explicitly specified
+      if (isUnbounded !== undefined) {
+        ripple.unbounded = /** @type {boolean} */isUnbounded;
+      }
+      return ripple;
+    }
+
+    /**
+     * @param {!RippleCapableSurface} instance
+     * @return {!MDCRippleAdapter}
+     */
+
+  }, {
+    key: 'createAdapter',
+    value: function createAdapter(instance) {
+      var MATCHES = __WEBPACK_IMPORTED_MODULE_3__util__["getMatchesProperty"](HTMLElement.prototype);
+
+      return {
+        browserSupportsCssVars: function browserSupportsCssVars() {
+          return __WEBPACK_IMPORTED_MODULE_3__util__["supportsCssVariables"](window);
+        },
+        isUnbounded: function isUnbounded() {
+          return instance.unbounded;
+        },
+        isSurfaceActive: function isSurfaceActive() {
+          return instance.root_[MATCHES](':active');
+        },
+        isSurfaceDisabled: function isSurfaceDisabled() {
+          return instance.disabled;
+        },
+        addClass: function addClass(className) {
+          return instance.root_.classList.add(className);
+        },
+        removeClass: function removeClass(className) {
+          return instance.root_.classList.remove(className);
+        },
+        registerInteractionHandler: function registerInteractionHandler(evtType, handler) {
+          return instance.root_.addEventListener(evtType, handler, __WEBPACK_IMPORTED_MODULE_3__util__["applyPassive"]());
+        },
+        deregisterInteractionHandler: function deregisterInteractionHandler(evtType, handler) {
+          return instance.root_.removeEventListener(evtType, handler, __WEBPACK_IMPORTED_MODULE_3__util__["applyPassive"]());
+        },
+        registerResizeHandler: function registerResizeHandler(handler) {
+          return window.addEventListener('resize', handler);
+        },
+        deregisterResizeHandler: function deregisterResizeHandler(handler) {
+          return window.removeEventListener('resize', handler);
+        },
+        updateCssVariable: function updateCssVariable(varName, value) {
+          return instance.root_.style.setProperty(varName, value);
+        },
+        computeBoundingRect: function computeBoundingRect() {
+          return instance.root_.getBoundingClientRect();
+        },
+        getWindowPageOffset: function getWindowPageOffset() {
+          return { x: window.pageXOffset, y: window.pageYOffset };
+        }
+      };
+    }
+  }]);
+
+  return MDCRipple;
+}(__WEBPACK_IMPORTED_MODULE_0__material_base_component__["a" /* default */]);
+
+/**
+ * See Material Design spec for more details on when to use ripples.
+ * https://material.io/guidelines/motion/choreography.html#choreography-creation
+ * @record
+ */
+
+var RippleCapableSurface = function RippleCapableSurface() {
+  _classCallCheck(this, RippleCapableSurface);
+};
+
+/** @protected {!Element} */
+
+
+RippleCapableSurface.prototype.root_;
+
+/**
+ * Whether or not the ripple bleeds out of the bounds of the element.
+ * @type {boolean|undefined}
+ */
+RippleCapableSurface.prototype.unbounded;
+
+/**
+ * Whether or not the ripple is attached to a disabled component.
+ * @type {boolean|undefined}
+ */
+RippleCapableSurface.prototype.disabled;
+
+/***/ }),
+
+/***/ 7:
+/***/ (function(module, __webpack_exports__, __webpack_require__) {
+
+"use strict";
+/* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, "a", function() { return cssClasses; });
+/* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, "b", function() { return strings; });
+/* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, "c", function() { return numbers; });
+/**
+ * Copyright 2016 Google Inc. All Rights Reserved.
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *      http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+
+var cssClasses = {
+  // Ripple is a special case where the "root" component is really a "mixin" of sorts,
+  // given that it's an 'upgrade' to an existing component. That being said it is the root
+  // CSS class that all other CSS classes derive from.
+  ROOT: 'mdc-ripple-upgraded',
+  UNBOUNDED: 'mdc-ripple-upgraded--unbounded',
+  BG_FOCUSED: 'mdc-ripple-upgraded--background-focused',
+  BG_ACTIVE_FILL: 'mdc-ripple-upgraded--background-active-fill',
+  FG_ACTIVATION: 'mdc-ripple-upgraded--foreground-activation',
+  FG_DEACTIVATION: 'mdc-ripple-upgraded--foreground-deactivation'
+};
+
+var strings = {
+  VAR_SURFACE_WIDTH: '--mdc-ripple-surface-width',
+  VAR_SURFACE_HEIGHT: '--mdc-ripple-surface-height',
+  VAR_FG_SIZE: '--mdc-ripple-fg-size',
+  VAR_LEFT: '--mdc-ripple-left',
+  VAR_TOP: '--mdc-ripple-top',
+  VAR_FG_SCALE: '--mdc-ripple-fg-scale',
+  VAR_FG_TRANSLATE_START: '--mdc-ripple-fg-translate-start',
+  VAR_FG_TRANSLATE_END: '--mdc-ripple-fg-translate-end'
+};
+
+var numbers = {
+  PADDING: 10,
+  INITIAL_ORIGIN_SCALE: 0.6,
+  DEACTIVATION_TIMEOUT_MS: 300,
+  FG_DEACTIVATION_MS: 83
+};
+
+/***/ }),
+
+/***/ 8:
+/***/ (function(module, __webpack_exports__, __webpack_require__) {
+
+"use strict";
+/* harmony import */ var __WEBPACK_IMPORTED_MODULE_0__material_base_foundation__ = __webpack_require__(0);
+/* harmony import */ var __WEBPACK_IMPORTED_MODULE_1__adapter__ = __webpack_require__(4);
+/* harmony import */ var __WEBPACK_IMPORTED_MODULE_2__constants__ = __webpack_require__(7);
+/* harmony import */ var __WEBPACK_IMPORTED_MODULE_3__util__ = __webpack_require__(5);
+var _extends = Object.assign || function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; };
+
+var _createClass = function () { function defineProperties(target, props) { for (var i = 0; i < props.length; i++) { var descriptor = props[i]; descriptor.enumerable = descriptor.enumerable || false; descriptor.configurable = true; if ("value" in descriptor) descriptor.writable = true; Object.defineProperty(target, descriptor.key, descriptor); } } return function (Constructor, protoProps, staticProps) { if (protoProps) defineProperties(Constructor.prototype, protoProps); if (staticProps) defineProperties(Constructor, staticProps); return Constructor; }; }();
+
+function _classCallCheck(instance, Constructor) { if (!(instance instanceof Constructor)) { throw new TypeError("Cannot call a class as a function"); } }
+
+function _possibleConstructorReturn(self, call) { if (!self) { throw new ReferenceError("this hasn't been initialised - super() hasn't been called"); } return call && (typeof call === "object" || typeof call === "function") ? call : self; }
+
+function _inherits(subClass, superClass) { if (typeof superClass !== "function" && superClass !== null) { throw new TypeError("Super expression must either be null or a function, not " + typeof superClass); } subClass.prototype = Object.create(superClass && superClass.prototype, { constructor: { value: subClass, enumerable: false, writable: true, configurable: true } }); if (superClass) Object.setPrototypeOf ? Object.setPrototypeOf(subClass, superClass) : subClass.__proto__ = superClass; }
+
+/**
+ * Copyright 2016 Google Inc. All Rights Reserved.
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *      http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+
+
+
+
+
+
+/**
+ * @typedef {!{
+ *   isActivated: (boolean|undefined),
+ *   hasDeactivationUXRun: (boolean|undefined),
+ *   wasActivatedByPointer: (boolean|undefined),
+ *   wasElementMadeActive: (boolean|undefined),
+ *   activationStartTime: (number|undefined),
+ *   activationEvent: Event,
+ *   isProgrammatic: (boolean|undefined)
+ * }}
+ */
+var ActivationStateType = void 0;
+
+/**
+ * @typedef {!{
+ *   activate: (string|undefined),
+ *   deactivate: (string|undefined),
+ *   focus: (string|undefined),
+ *   blur: (string|undefined)
+ * }}
+ */
+var ListenerInfoType = void 0;
+
+/**
+ * @typedef {!{
+ *   activate: function(!Event),
+ *   deactivate: function(!Event),
+ *   focus: function(),
+ *   blur: function()
+ * }}
+ */
+var ListenersType = void 0;
+
+/**
+ * @typedef {!{
+ *   x: number,
+ *   y: number
+ * }}
+ */
+var PointType = void 0;
+
+/**
+ * @enum {string}
+ */
+var DEACTIVATION_ACTIVATION_PAIRS = {
+  mouseup: 'mousedown',
+  pointerup: 'pointerdown',
+  touchend: 'touchstart',
+  keyup: 'keydown',
+  blur: 'focus'
+};
+
+/**
+ * @extends {MDCFoundation<!MDCRippleAdapter>}
+ */
+
+var MDCRippleFoundation = function (_MDCFoundation) {
+  _inherits(MDCRippleFoundation, _MDCFoundation);
+
+  _createClass(MDCRippleFoundation, [{
+    key: 'isSupported_',
+
+
+    /**
+     * We compute this property so that we are not querying information about the client
+     * until the point in time where the foundation requests it. This prevents scenarios where
+     * client-side feature-detection may happen too early, such as when components are rendered on the server
+     * and then initialized at mount time on the client.
+     * @return {boolean}
+     */
+    get: function get() {
+      return this.adapter_.browserSupportsCssVars();
+    }
+  }], [{
+    key: 'cssClasses',
+    get: function get() {
+      return __WEBPACK_IMPORTED_MODULE_2__constants__["a" /* cssClasses */];
+    }
+  }, {
+    key: 'strings',
+    get: function get() {
+      return __WEBPACK_IMPORTED_MODULE_2__constants__["b" /* strings */];
+    }
+  }, {
+    key: 'numbers',
+    get: function get() {
+      return __WEBPACK_IMPORTED_MODULE_2__constants__["c" /* numbers */];
+    }
+  }, {
+    key: 'defaultAdapter',
+    get: function get() {
+      return {
+        browserSupportsCssVars: function browserSupportsCssVars() /* boolean - cached */{},
+        isUnbounded: function isUnbounded() /* boolean */{},
+        isSurfaceActive: function isSurfaceActive() /* boolean */{},
+        isSurfaceDisabled: function isSurfaceDisabled() /* boolean */{},
+        addClass: function addClass() /* className: string */{},
+        removeClass: function removeClass() /* className: string */{},
+        registerInteractionHandler: function registerInteractionHandler() /* evtType: string, handler: EventListener */{},
+        deregisterInteractionHandler: function deregisterInteractionHandler() /* evtType: string, handler: EventListener */{},
+        registerResizeHandler: function registerResizeHandler() /* handler: EventListener */{},
+        deregisterResizeHandler: function deregisterResizeHandler() /* handler: EventListener */{},
+        updateCssVariable: function updateCssVariable() /* varName: string, value: string */{},
+        computeBoundingRect: function computeBoundingRect() /* ClientRect */{},
+        getWindowPageOffset: function getWindowPageOffset() /* {x: number, y: number} */{}
+      };
+    }
+  }]);
+
+  function MDCRippleFoundation(adapter) {
+    _classCallCheck(this, MDCRippleFoundation);
+
+    /** @private {number} */
+    var _this = _possibleConstructorReturn(this, (MDCRippleFoundation.__proto__ || Object.getPrototypeOf(MDCRippleFoundation)).call(this, _extends(MDCRippleFoundation.defaultAdapter, adapter)));
+
+    _this.layoutFrame_ = 0;
+
+    /** @private {!ClientRect} */
+    _this.frame_ = /** @type {!ClientRect} */{ width: 0, height: 0 };
+
+    /** @private {!ActivationStateType} */
+    _this.activationState_ = _this.defaultActivationState_();
+
+    /** @private {number} */
+    _this.xfDuration_ = 0;
+
+    /** @private {number} */
+    _this.initialSize_ = 0;
+
+    /** @private {number} */
+    _this.maxRadius_ = 0;
+
+    /** @private {!Array<{ListenerInfoType}>} */
+    _this.listenerInfos_ = [{ activate: 'touchstart', deactivate: 'touchend' }, { activate: 'pointerdown', deactivate: 'pointerup' }, { activate: 'mousedown', deactivate: 'mouseup' }, { activate: 'keydown', deactivate: 'keyup' }, { focus: 'focus', blur: 'blur' }];
+
+    /** @private {!ListenersType} */
+    _this.listeners_ = {
+      activate: function activate(e) {
+        return _this.activate_(e);
+      },
+      deactivate: function deactivate(e) {
+        return _this.deactivate_(e);
+      },
+      focus: function focus() {
+        return requestAnimationFrame(function () {
+          return _this.adapter_.addClass(MDCRippleFoundation.cssClasses.BG_FOCUSED);
+        });
+      },
+      blur: function blur() {
+        return requestAnimationFrame(function () {
+          return _this.adapter_.removeClass(MDCRippleFoundation.cssClasses.BG_FOCUSED);
+        });
+      }
+    };
+
+    /** @private {!Function} */
+    _this.resizeHandler_ = function () {
+      return _this.layout();
+    };
+
+    /** @private {!{left: number, top:number}} */
+    _this.unboundedCoords_ = {
+      left: 0,
+      top: 0
+    };
+
+    /** @private {number} */
+    _this.fgScale_ = 0;
+
+    /** @private {number} */
+    _this.activationTimer_ = 0;
+
+    /** @private {number} */
+    _this.fgDeactivationRemovalTimer_ = 0;
+
+    /** @private {boolean} */
+    _this.activationAnimationHasEnded_ = false;
+
+    /** @private {!Function} */
+    _this.activationTimerCallback_ = function () {
+      _this.activationAnimationHasEnded_ = true;
+      _this.runDeactivationUXLogicIfReady_();
+    };
+    return _this;
+  }
+
+  /**
+   * @return {!ActivationStateType}
+   */
+
+
+  _createClass(MDCRippleFoundation, [{
+    key: 'defaultActivationState_',
+    value: function defaultActivationState_() {
+      return {
+        isActivated: false,
+        hasDeactivationUXRun: false,
+        wasActivatedByPointer: false,
+        wasElementMadeActive: false,
+        activationStartTime: 0,
+        activationEvent: null,
+        isProgrammatic: false
+      };
+    }
+  }, {
+    key: 'init',
+    value: function init() {
+      var _this2 = this;
+
+      if (!this.isSupported_) {
+        return;
+      }
+      this.addEventListeners_();
+
+      var _MDCRippleFoundation$ = MDCRippleFoundation.cssClasses,
+          ROOT = _MDCRippleFoundation$.ROOT,
+          UNBOUNDED = _MDCRippleFoundation$.UNBOUNDED;
+
+      requestAnimationFrame(function () {
+        _this2.adapter_.addClass(ROOT);
+        if (_this2.adapter_.isUnbounded()) {
+          _this2.adapter_.addClass(UNBOUNDED);
+        }
+        _this2.layoutInternal_();
+      });
+    }
+
+    /** @private */
+
+  }, {
+    key: 'addEventListeners_',
+    value: function addEventListeners_() {
+      var _this3 = this;
+
+      this.listenerInfos_.forEach(function (info) {
+        Object.keys(info).forEach(function (k) {
+          _this3.adapter_.registerInteractionHandler(info[k], _this3.listeners_[k]);
+        });
+      });
+      this.adapter_.registerResizeHandler(this.resizeHandler_);
+    }
+
+    /**
+     * @param {Event} e
+     * @private
+     */
+
+  }, {
+    key: 'activate_',
+    value: function activate_(e) {
+      var _this4 = this;
+
+      if (this.adapter_.isSurfaceDisabled()) {
+        return;
+      }
+
+      var activationState = this.activationState_;
+
+      if (activationState.isActivated) {
+        return;
+      }
+
+      activationState.isActivated = true;
+      activationState.isProgrammatic = e === null;
+      activationState.activationEvent = e;
+      activationState.wasActivatedByPointer = activationState.isProgrammatic ? false : e.type === 'mousedown' || e.type === 'touchstart' || e.type === 'pointerdown';
+      activationState.activationStartTime = Date.now();
+
+      requestAnimationFrame(function () {
+        // This needs to be wrapped in an rAF call b/c web browsers
+        // report active states inconsistently when they're called within
+        // event handling code:
+        // - https://bugs.chromium.org/p/chromium/issues/detail?id=635971
+        // - https://bugzilla.mozilla.org/show_bug.cgi?id=1293741
+        activationState.wasElementMadeActive = e && e.type === 'keydown' ? _this4.adapter_.isSurfaceActive() : true;
+        if (activationState.wasElementMadeActive) {
+          _this4.animateActivation_();
+        } else {
+          // Reset activation state immediately if element was not made active.
+          _this4.activationState_ = _this4.defaultActivationState_();
+        }
+      });
+    }
+  }, {
+    key: 'activate',
+    value: function activate() {
+      this.activate_(null);
+    }
+
+    /** @private */
+
+  }, {
+    key: 'animateActivation_',
+    value: function animateActivation_() {
+      var _this5 = this;
+
+      var _MDCRippleFoundation$2 = MDCRippleFoundation.strings,
+          VAR_FG_TRANSLATE_START = _MDCRippleFoundation$2.VAR_FG_TRANSLATE_START,
+          VAR_FG_TRANSLATE_END = _MDCRippleFoundation$2.VAR_FG_TRANSLATE_END;
+      var _MDCRippleFoundation$3 = MDCRippleFoundation.cssClasses,
+          BG_ACTIVE_FILL = _MDCRippleFoundation$3.BG_ACTIVE_FILL,
+          FG_DEACTIVATION = _MDCRippleFoundation$3.FG_DEACTIVATION,
+          FG_ACTIVATION = _MDCRippleFoundation$3.FG_ACTIVATION;
+      var DEACTIVATION_TIMEOUT_MS = MDCRippleFoundation.numbers.DEACTIVATION_TIMEOUT_MS;
+
+
+      var translateStart = '';
+      var translateEnd = '';
+
+      if (!this.adapter_.isUnbounded()) {
+        var _getFgTranslationCoor = this.getFgTranslationCoordinates_(),
+            startPoint = _getFgTranslationCoor.startPoint,
+            endPoint = _getFgTranslationCoor.endPoint;
+
+        translateStart = startPoint.x + 'px, ' + startPoint.y + 'px';
+        translateEnd = endPoint.x + 'px, ' + endPoint.y + 'px';
+      }
+
+      this.adapter_.updateCssVariable(VAR_FG_TRANSLATE_START, translateStart);
+      this.adapter_.updateCssVariable(VAR_FG_TRANSLATE_END, translateEnd);
+      // Cancel any ongoing activation/deactivation animations
+      clearTimeout(this.activationTimer_);
+      clearTimeout(this.fgDeactivationRemovalTimer_);
+      this.rmBoundedActivationClasses_();
+      this.adapter_.removeClass(FG_DEACTIVATION);
+
+      // Force layout in order to re-trigger the animation.
+      this.adapter_.computeBoundingRect();
+      this.adapter_.addClass(BG_ACTIVE_FILL);
+      this.adapter_.addClass(FG_ACTIVATION);
+      this.activationTimer_ = setTimeout(function () {
+        return _this5.activationTimerCallback_();
+      }, DEACTIVATION_TIMEOUT_MS);
+    }
+
+    /**
+     * @private
+     * @return {{startPoint: PointType, endPoint: PointType}}
+     */
+
+  }, {
+    key: 'getFgTranslationCoordinates_',
+    value: function getFgTranslationCoordinates_() {
+      var activationState = this.activationState_;
+      var activationEvent = activationState.activationEvent,
+          wasActivatedByPointer = activationState.wasActivatedByPointer;
+
+
+      var startPoint = void 0;
+      if (wasActivatedByPointer) {
+        startPoint = __webpack_require__.i(__WEBPACK_IMPORTED_MODULE_3__util__["getNormalizedEventCoords"])(
+        /** @type {!Event} */activationEvent, this.adapter_.getWindowPageOffset(), this.adapter_.computeBoundingRect());
+      } else {
+        startPoint = {
+          x: this.frame_.width / 2,
+          y: this.frame_.height / 2
+        };
+      }
+      // Center the element around the start point.
+      startPoint = {
+        x: startPoint.x - this.initialSize_ / 2,
+        y: startPoint.y - this.initialSize_ / 2
+      };
+
+      var endPoint = {
+        x: this.frame_.width / 2 - this.initialSize_ / 2,
+        y: this.frame_.height / 2 - this.initialSize_ / 2
+      };
+
+      return { startPoint: startPoint, endPoint: endPoint };
+    }
+
+    /** @private */
+
+  }, {
+    key: 'runDeactivationUXLogicIfReady_',
+    value: function runDeactivationUXLogicIfReady_() {
+      var _this6 = this;
+
+      var FG_DEACTIVATION = MDCRippleFoundation.cssClasses.FG_DEACTIVATION;
+      var _activationState_ = this.activationState_,
+          hasDeactivationUXRun = _activationState_.hasDeactivationUXRun,
+          isActivated = _activationState_.isActivated;
+
+      var activationHasEnded = hasDeactivationUXRun || !isActivated;
+      if (activationHasEnded && this.activationAnimationHasEnded_) {
+        this.rmBoundedActivationClasses_();
+        this.adapter_.addClass(FG_DEACTIVATION);
+        this.fgDeactivationRemovalTimer_ = setTimeout(function () {
+          _this6.adapter_.removeClass(FG_DEACTIVATION);
+        }, __WEBPACK_IMPORTED_MODULE_2__constants__["c" /* numbers */].FG_DEACTIVATION_MS);
+      }
+    }
+
+    /** @private */
+
+  }, {
+    key: 'rmBoundedActivationClasses_',
+    value: function rmBoundedActivationClasses_() {
+      var _MDCRippleFoundation$4 = MDCRippleFoundation.cssClasses,
+          BG_ACTIVE_FILL = _MDCRippleFoundation$4.BG_ACTIVE_FILL,
+          FG_ACTIVATION = _MDCRippleFoundation$4.FG_ACTIVATION;
+
+      this.adapter_.removeClass(BG_ACTIVE_FILL);
+      this.adapter_.removeClass(FG_ACTIVATION);
+      this.activationAnimationHasEnded_ = false;
+      this.adapter_.computeBoundingRect();
+    }
+
+    /**
+     * @param {Event} e
+     * @private
+     */
+
+  }, {
+    key: 'deactivate_',
+    value: function deactivate_(e) {
+      var _this7 = this;
+
+      var activationState = this.activationState_;
+      // This can happen in scenarios such as when you have a keyup event that blurs the element.
+
+      if (!activationState.isActivated) {
+        return;
+      }
+      // Programmatic deactivation.
+      if (activationState.isProgrammatic) {
+        var evtObject = null;
+        var _state = /** @type {!ActivationStateType} */_extends({}, activationState);
+        requestAnimationFrame(function () {
+          return _this7.animateDeactivation_(evtObject, _state);
+        });
+        this.activationState_ = this.defaultActivationState_();
+        return;
+      }
+
+      var actualActivationType = DEACTIVATION_ACTIVATION_PAIRS[e.type];
+      var expectedActivationType = activationState.activationEvent.type;
+      // NOTE: Pointer events are tricky - https://patrickhlauke.github.io/touch/tests/results/
+      // Essentially, what we need to do here is decouple the deactivation UX from the actual
+      // deactivation state itself. This way, touch/pointer events in sequence do not trample one
+      // another.
+      var needsDeactivationUX = actualActivationType === expectedActivationType;
+      var needsActualDeactivation = needsDeactivationUX;
+      if (activationState.wasActivatedByPointer) {
+        needsActualDeactivation = e.type === 'mouseup';
+      }
+
+      var state = /** @type {!ActivationStateType} */_extends({}, activationState);
+      requestAnimationFrame(function () {
+        if (needsDeactivationUX) {
+          _this7.activationState_.hasDeactivationUXRun = true;
+          _this7.animateDeactivation_(e, state);
+        }
+
+        if (needsActualDeactivation) {
+          _this7.activationState_ = _this7.defaultActivationState_();
+        }
+      });
+    }
+  }, {
+    key: 'deactivate',
+    value: function deactivate() {
+      this.deactivate_(null);
+    }
+
+    /**
+     * @param {Event} e
+     * @param {!ActivationStateType} options
+     * @private
+     */
+
+  }, {
+    key: 'animateDeactivation_',
+    value: function animateDeactivation_(e, _ref) {
+      var wasActivatedByPointer = _ref.wasActivatedByPointer,
+          wasElementMadeActive = _ref.wasElementMadeActive;
+      var BG_FOCUSED = MDCRippleFoundation.cssClasses.BG_FOCUSED;
+
+      if (wasActivatedByPointer || wasElementMadeActive) {
+        // Remove class left over by element being focused
+        this.adapter_.removeClass(BG_FOCUSED);
+        this.runDeactivationUXLogicIfReady_();
+      }
+    }
+  }, {
+    key: 'destroy',
+    value: function destroy() {
+      var _this8 = this;
+
+      if (!this.isSupported_) {
+        return;
+      }
+      this.removeEventListeners_();
+
+      var _MDCRippleFoundation$5 = MDCRippleFoundation.cssClasses,
+          ROOT = _MDCRippleFoundation$5.ROOT,
+          UNBOUNDED = _MDCRippleFoundation$5.UNBOUNDED;
+
+      requestAnimationFrame(function () {
+        _this8.adapter_.removeClass(ROOT);
+        _this8.adapter_.removeClass(UNBOUNDED);
+        _this8.removeCssVars_();
+      });
+    }
+
+    /** @private */
+
+  }, {
+    key: 'removeEventListeners_',
+    value: function removeEventListeners_() {
+      var _this9 = this;
+
+      this.listenerInfos_.forEach(function (info) {
+        Object.keys(info).forEach(function (k) {
+          _this9.adapter_.deregisterInteractionHandler(info[k], _this9.listeners_[k]);
+        });
+      });
+      this.adapter_.deregisterResizeHandler(this.resizeHandler_);
+    }
+
+    /** @private */
+
+  }, {
+    key: 'removeCssVars_',
+    value: function removeCssVars_() {
+      var _this10 = this;
+
+      var strings = MDCRippleFoundation.strings;
+
+      Object.keys(strings).forEach(function (k) {
+        if (k.indexOf('VAR_') === 0) {
+          _this10.adapter_.updateCssVariable(strings[k], null);
+        }
+      });
+    }
+  }, {
+    key: 'layout',
+    value: function layout() {
+      var _this11 = this;
+
+      if (this.layoutFrame_) {
+        cancelAnimationFrame(this.layoutFrame_);
+      }
+      this.layoutFrame_ = requestAnimationFrame(function () {
+        _this11.layoutInternal_();
+        _this11.layoutFrame_ = 0;
+      });
+    }
+
+    /** @private */
+
+  }, {
+    key: 'layoutInternal_',
+    value: function layoutInternal_() {
+      this.frame_ = this.adapter_.computeBoundingRect();
+
+      var maxDim = Math.max(this.frame_.height, this.frame_.width);
+      var surfaceDiameter = Math.sqrt(Math.pow(this.frame_.width, 2) + Math.pow(this.frame_.height, 2));
+
+      // 60% of the largest dimension of the surface
+      this.initialSize_ = maxDim * MDCRippleFoundation.numbers.INITIAL_ORIGIN_SCALE;
+
+      // Diameter of the surface + 10px
+      this.maxRadius_ = surfaceDiameter + MDCRippleFoundation.numbers.PADDING;
+      this.fgScale_ = this.maxRadius_ / this.initialSize_;
+      this.xfDuration_ = 1000 * Math.sqrt(this.maxRadius_ / 1024);
+      this.updateLayoutCssVars_();
+    }
+
+    /** @private */
+
+  }, {
+    key: 'updateLayoutCssVars_',
+    value: function updateLayoutCssVars_() {
+      var _MDCRippleFoundation$6 = MDCRippleFoundation.strings,
+          VAR_SURFACE_WIDTH = _MDCRippleFoundation$6.VAR_SURFACE_WIDTH,
+          VAR_SURFACE_HEIGHT = _MDCRippleFoundation$6.VAR_SURFACE_HEIGHT,
+          VAR_FG_SIZE = _MDCRippleFoundation$6.VAR_FG_SIZE,
+          VAR_LEFT = _MDCRippleFoundation$6.VAR_LEFT,
+          VAR_TOP = _MDCRippleFoundation$6.VAR_TOP,
+          VAR_FG_SCALE = _MDCRippleFoundation$6.VAR_FG_SCALE;
+
+
+      this.adapter_.updateCssVariable(VAR_SURFACE_WIDTH, this.frame_.width + 'px');
+      this.adapter_.updateCssVariable(VAR_SURFACE_HEIGHT, this.frame_.height + 'px');
+      this.adapter_.updateCssVariable(VAR_FG_SIZE, this.initialSize_ + 'px');
+      this.adapter_.updateCssVariable(VAR_FG_SCALE, this.fgScale_);
+
+      if (this.adapter_.isUnbounded()) {
+        this.unboundedCoords_ = {
+          left: Math.round(this.frame_.width / 2 - this.initialSize_ / 2),
+          top: Math.round(this.frame_.height / 2 - this.initialSize_ / 2)
+        };
+
+        this.adapter_.updateCssVariable(VAR_LEFT, this.unboundedCoords_.left + 'px');
+        this.adapter_.updateCssVariable(VAR_TOP, this.unboundedCoords_.top + 'px');
+      }
+    }
+  }]);
+
+  return MDCRippleFoundation;
+}(__WEBPACK_IMPORTED_MODULE_0__material_base_foundation__["a" /* default */]);
+
+/* harmony default export */ __webpack_exports__["a"] = (MDCRippleFoundation);
+
+/***/ }),
+
+/***/ 84:
+/***/ (function(module, exports, __webpack_require__) {
+
+module.exports = __webpack_require__(24);
+
+
+/***/ }),
+
+/***/ 9:
+/***/ (function(module, __webpack_exports__, __webpack_require__) {
+
+"use strict";
+Object.defineProperty(__webpack_exports__, "__esModule", { value: true });
+/* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, "transformStyleProperties", function() { return transformStyleProperties; });
+/* harmony export (immutable) */ __webpack_exports__["getCorrectEventName"] = getCorrectEventName;
+/* harmony export (immutable) */ __webpack_exports__["getCorrectPropertyName"] = getCorrectPropertyName;
+/**
+ * Copyright 2016 Google Inc. All Rights Reserved.
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *      http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+
+/**
+ * @typedef {{
+ *   noPrefix: string,
+ *   webkitPrefix: string
+ * }}
+ */
+var VendorPropertyMapType = void 0;
+
+/** @const {Object<string, !VendorPropertyMapType>} */
+var eventTypeMap = {
+  'animationstart': {
+    noPrefix: 'animationstart',
+    webkitPrefix: 'webkitAnimationStart',
+    styleProperty: 'animation'
+  },
+  'animationend': {
+    noPrefix: 'animationend',
+    webkitPrefix: 'webkitAnimationEnd',
+    styleProperty: 'animation'
+  },
+  'animationiteration': {
+    noPrefix: 'animationiteration',
+    webkitPrefix: 'webkitAnimationIteration',
+    styleProperty: 'animation'
+  },
+  'transitionend': {
+    noPrefix: 'transitionend',
+    webkitPrefix: 'webkitTransitionEnd',
+    styleProperty: 'transition'
+  }
+};
+
+/** @const {Object<string, !VendorPropertyMapType>} */
+var cssPropertyMap = {
+  'animation': {
+    noPrefix: 'animation',
+    webkitPrefix: '-webkit-animation'
+  },
+  'transform': {
+    noPrefix: 'transform',
+    webkitPrefix: '-webkit-transform'
+  },
+  'transition': {
+    noPrefix: 'transition',
+    webkitPrefix: '-webkit-transition'
+  }
+};
+
+/**
+ * @param {!Object} windowObj
+ * @return {boolean}
+ */
+function hasProperShape(windowObj) {
+  return windowObj['document'] !== undefined && typeof windowObj['document']['createElement'] === 'function';
+}
+
+/**
+ * @param {string} eventType
+ * @return {boolean}
+ */
+function eventFoundInMaps(eventType) {
+  return eventType in eventTypeMap || eventType in cssPropertyMap;
+}
+
+/**
+ * @param {string} eventType
+ * @param {!Object<string, !VendorPropertyMapType>} map
+ * @param {!Element} el
+ * @return {string}
+ */
+function getJavaScriptEventName(eventType, map, el) {
+  return map[eventType].styleProperty in el.style ? map[eventType].noPrefix : map[eventType].webkitPrefix;
+}
+
+/**
+ * Helper function to determine browser prefix for CSS3 animation events
+ * and property names.
+ * @param {!Object} windowObj
+ * @param {string} eventType
+ * @return {string}
+ */
+function getAnimationName(windowObj, eventType) {
+  if (!hasProperShape(windowObj) || !eventFoundInMaps(eventType)) {
+    return eventType;
+  }
+
+  var map = /** @type {!Object<string, !VendorPropertyMapType>} */eventType in eventTypeMap ? eventTypeMap : cssPropertyMap;
+  var el = windowObj['document']['createElement']('div');
+  var eventName = '';
+
+  if (map === eventTypeMap) {
+    eventName = getJavaScriptEventName(eventType, map, el);
+  } else {
+    eventName = map[eventType].noPrefix in el.style ? map[eventType].noPrefix : map[eventType].webkitPrefix;
+  }
+
+  return eventName;
+}
+
+// Public functions to access getAnimationName() for JavaScript events or CSS
+// property names.
+
+var transformStyleProperties = ['transform', 'WebkitTransform', 'MozTransform', 'OTransform', 'MSTransform'];
+
+/**
+ * @param {!Object} windowObj
+ * @param {string} eventType
+ * @return {string}
+ */
+function getCorrectEventName(windowObj, eventType) {
+  return getAnimationName(windowObj, eventType);
+}
+
+/**
+ * @param {!Object} windowObj
+ * @param {string} eventType
+ * @return {string}
+ */
+function getCorrectPropertyName(windowObj, eventType) {
+  return getAnimationName(windowObj, eventType);
+}
+
+/***/ })
+
+/******/ });
+});

+ 449 - 0
support/client/lib/vwf/view/lib/mdc/dist/mdc.dialog.css

@@ -0,0 +1,449 @@
+/*!
+ Material Components for the web
+ Copyright (c) 2017 Google Inc.
+ License: Apache-2.0
+*/
+/**
+ * The css property used for elevation. In most cases this should not be changed. It is exposed
+ * as a variable for abstraction / easy use when needing to reference the property directly, for
+ * example in a `will-change` rule.
+ */
+/**
+ * The default duration value for elevation transitions.
+ */
+/**
+ * The default easing value for elevation transitions.
+ */
+/**
+ * Applies the correct css rules to an element to give it the elevation specified by $z-value.
+ * The $z-value must be between 0 and 24.
+ */
+/**
+ * Returns a string that can be used as the value for a `transition` property for elevation.
+ * Calling this function directly is useful in situations where a component needs to transition
+ * more than one property.
+ *
+ * ```scss
+ * .foo {
+ *   transition: mdc-elevation-transition-rule(), opacity 100ms ease;
+ *   will-change: $mdc-elevation-property, opacity;
+ * }
+ * ```
+ */
+/**
+ * Applies the correct css rules needed to have an element transition between elevations.
+ * This mixin should be applied to elements whose elevation values will change depending on their
+ * context (e.g. when active or disabled).
+ */
+/**
+ * Creates a rule that will be applied when an MDC-Web component is within the context of an RTL layout.
+ *
+ * Usage Example:
+ * ```scss
+ * .mdc-foo {
+ *   position: absolute;
+ *   left: 0;
+ *
+ *   @include mdc-rtl {
+ *     left: auto;
+ *     right: 0;
+ *   }
+ *
+ *   &__bar {
+ *     margin-left: 4px;
+ *     @include mdc-rtl(".mdc-foo") {
+ *       margin-left: auto;
+ *       margin-right: 4px;
+ *     }
+ *   }
+ * }
+ *
+ * .mdc-foo--mod {
+ *   padding-left: 4px;
+ *
+ *   @include mdc-rtl {
+ *     padding-left: auto;
+ *     padding-right: 4px;
+ *   }
+ * }
+ * ```
+ *
+ * Note that this works by checking for [dir="rtl"] on an ancestor element. While this will work
+ * in most cases, it will in some cases lead to false negatives, e.g.
+ *
+ * ```html
+ * <html dir="rtl">
+ *   <!-- ... -->
+ *   <div dir="ltr">
+ *     <div class="mdc-foo">Styled incorrectly as RTL!</div>
+ *   </div>
+ * </html>
+ * ```
+ *
+ * In the future, selectors such as :dir (http://mdn.io/:dir) will help us mitigate this.
+ */
+/**
+ * Takes a base box-model property - e.g. margin / border / padding - along with a default
+ * direction and value, and emits rules which apply the value to the
+ * "<base-property>-<default-direction>" property by default, but flips the direction
+ * when within an RTL context.
+ *
+ * For example:
+ *
+ * ```scss
+ * .mdc-foo {
+ *   @include mdc-rtl-reflexive-box(margin, left, 8px);
+ * }
+ * ```
+ * is equivalent to:
+ *
+ * ```scss
+ * .mdc-foo {
+ *   margin-left: 8px;
+ *
+ *   @include mdc-rtl {
+ *     margin-right: 8px;
+ *     margin-left: 0;
+ *   }
+ * }
+ * ```
+ * whereas:
+ *
+ * ```scss
+ * .mdc-foo {
+ *   @include mdc-rtl-reflexive-box(margin, right, 8px);
+ * }
+ * ```
+ * is equivalent to:
+ *
+ * ```scss
+ * .mdc-foo {
+ *   margin-right: 8px;
+ *
+ *   @include mdc-rtl {
+ *     margin-right: 0;
+ *     margin-left: 8px;
+ *   }
+ * }
+ * ```
+ *
+ * You can also pass a 4th optional $root-selector argument which will be forwarded to `mdc-rtl`,
+ * e.g. `@include mdc-rtl-reflexive-box(margin, left, 8px, ".mdc-component")`.
+ *
+ * Note that this function will always zero out the original value in an RTL context. If you're
+ * trying to flip the values, use mdc-rtl-reflexive-property().
+ */
+/**
+ * Takes a base property and emits rules that assign <base-property>-left to <left-value> and
+ * <base-property>-right to <right-value> in a LTR context, and vice versa in a RTL context.
+ * For example:
+ *
+ * ```scss
+ * .mdc-foo {
+ *   @include mdc-rtl-reflexive-property(margin, auto, 12px);
+ * }
+ * ```
+ * is equivalent to:
+ *
+ * ```scss
+ * .mdc-foo {
+ *   margin-left: auto;
+ *   margin-right: 12px;
+ *
+ *   @include mdc-rtl {
+ *     margin-left: 12px;
+ *     margin-right: auto;
+ *   }
+ * }
+ * ```
+ *
+ * A 4th optional $root-selector argument can be given, which will be passed to `mdc-rtl`.
+ */
+/**
+ * Takes an argument specifying a horizontal position property (either "left" or "right") as well
+ * as a value, and applies that value to the specified position in a LTR context, and flips it in a
+ * RTL context. For example:
+ *
+ * ```scss
+ * .mdc-foo {
+ *   @include mdc-rtl-reflexive-position(left, 0);
+ *   position: absolute;
+ * }
+ * ```
+ * is equivalent to:
+ *
+ * ```scss
+ *  .mdc-foo {
+ *    position: absolute;
+ *    left: 0;
+ *    right: initial;
+ *
+ *    @include mdc-rtl {
+ *      right: 0;
+ *      left: initial;
+ *    }
+ *  }
+ * ```
+ * An optional third $root-selector argument may also be given, which is passed to `mdc-rtl`.
+ */
+/*
+  Precomputed linear color channel values, for use in contrast calculations.
+  See https://www.w3.org/TR/WCAG20-TECHS/G17.html#G17-tests
+
+  Algorithm, for c in 0 to 255:
+  f(c) {
+    c = c / 255;
+    return c < 0.03928 ? c / 12.92 : Math.pow((c + 0.055) / 1.055, 2.4);
+  }
+
+  This lookup table is needed since there is no `pow` in SASS.
+*/
+/**
+ * Calculate the luminance for a color.
+ * See https://www.w3.org/TR/WCAG20-TECHS/G17.html#G17-tests
+ */
+/**
+ * Calculate the contrast ratio between two colors.
+ * See https://www.w3.org/TR/WCAG20-TECHS/G17.html#G17-tests
+ */
+/**
+ * Determine whether to use dark or light text on top of given color.
+ * Returns "dark" for dark text and "light" for light text.
+ */
+/*
+  Main theme colors.
+  If you're a user customizing your color scheme in SASS, these are probably the only variables you need to change.
+*/
+/* Indigo 500 */
+/* Pink A200 */
+/* White */
+/* Which set of text colors to use for each main theme color (light or dark) */
+/* Text colors according to light vs dark and text type */
+/* Primary text colors for each of the theme colors */
+/**
+ * Applies the correct theme color style to the specified property.
+ * $property is typically color or background-color, but can be any CSS property that accepts color values.
+ * $style should be one of the map keys in $mdc-theme-property-values (_variables.scss).
+ */
+/**
+ * Creates a rule to be used in MDC-Web components for dark theming, and applies the provided contents.
+ * Should provide the $root-selector option if applied to anything other than the root selector.
+ * When used with a modifier class, provide a second argument of `true` for the $compound parameter
+ * to specify that this should be attached as a compound class.
+ *
+ * Usage example:
+ *
+ * ```scss
+ * .mdc-foo {
+ *   color: black;
+ *
+ *   @include mdc-theme-dark {
+ *     color: white;
+ *   }
+ *
+ *   &__bar {
+ *     background: black;
+ *
+ *     @include mdc-theme-dark(".mdc-foo") {
+ *       background: white;
+ *     }
+ *   }
+ * }
+ *
+ * .mdc-foo--disabled {
+ *   opacity: .38;
+ *
+ *   @include mdc-theme-dark(".mdc-foo", true) {
+ *     opacity: .5;
+ *   }
+ * }
+ * ```
+ */
+/* TODO(sgomes): Figure out what to do about desktop font sizes. */
+/* TODO(sgomes): Figure out what to do about i18n and i18n font sizes. */
+/* TODO(sgomes): Figure out what to do about desktop font sizes. */
+/* TODO(sgomes): Figure out what to do about i18n and i18n font sizes. */
+:root {
+  --mdc-dialog-dark-theme-bg-color: #303030; }
+
+.mdc-dialog {
+  display: -webkit-box;
+  display: -ms-flexbox;
+  display: flex;
+  position: fixed;
+  top: 0;
+  left: 0;
+  -webkit-box-align: center;
+      -ms-flex-align: center;
+          align-items: center;
+  -webkit-box-pack: center;
+      -ms-flex-pack: center;
+          justify-content: center;
+  width: 100%;
+  height: 100%;
+  visibility: hidden;
+  z-index: 2; }
+  .mdc-dialog__backdrop {
+    position: fixed;
+    top: 0;
+    left: 0;
+    -webkit-box-align: center;
+        -ms-flex-align: center;
+            align-items: center;
+    -webkit-box-pack: center;
+        -ms-flex-pack: center;
+            justify-content: center;
+    width: 100%;
+    height: 100%;
+    /* @alternate */
+    background-color: rgba(0, 0, 0, 0.87);
+    background-color: var(--mdc-theme-text-primary-on-light, rgba(0, 0, 0, 0.87));
+    opacity: 0;
+    z-index: -1; }
+  .mdc-dialog__surface {
+    display: -webkit-inline-box;
+    display: -ms-inline-flexbox;
+    display: inline-flex;
+    -webkit-box-orient: vertical;
+    -webkit-box-direction: normal;
+        -ms-flex-direction: column;
+            flex-direction: column;
+    -webkit-box-shadow: 0px 11px 15px -7px rgba(0, 0, 0, 0.2), 0px 24px 38px 3px rgba(0, 0, 0, 0.14), 0px 9px 46px 8px rgba(0, 0, 0, 0.12);
+            box-shadow: 0px 11px 15px -7px rgba(0, 0, 0, 0.2), 0px 24px 38px 3px rgba(0, 0, 0, 0.14), 0px 9px 46px 8px rgba(0, 0, 0, 0.12);
+    width: calc(100% - 30px);
+    min-width: 640px;
+    max-width: 865px;
+    -webkit-transform: translateY(150px) scale(0.8);
+            transform: translateY(150px) scale(0.8);
+    border-radius: 2px;
+    /* @alternate */
+    background-color: #fff;
+    background-color: var(--mdc-theme-background, #fff);
+    opacity: 0; }
+    .mdc-dialog--theme-dark .mdc-dialog__surface,
+    .mdc-theme--dark .mdc-dialog__surface {
+      /* @alternate */
+      color: white;
+      color: var(--mdc-theme-text-primary-on-dark, white);
+      background-color: #303030;
+      background-color: var(--mdc-dialog-dark-theme-bg-color, #303030); }
+    [dir="rtl"] .mdc-dialog .mdc-dialog__surface,
+    .mdc-dialog[dir="rtl"] .mdc-dialog__surface {
+      text-align: right; }
+  .mdc-dialog__header {
+    display: -webkit-box;
+    display: -ms-flexbox;
+    display: flex;
+    -webkit-box-align: center;
+        -ms-flex-align: center;
+            align-items: center;
+    padding: 24px 24px 0; }
+    .mdc-dialog__header__empty {
+      padding: 0; }
+    [dir="rtl"] .mdc-dialog .mdc-dialog__header,
+    .mdc-dialog[dir="rtl"] .mdc-dialog__header {
+      text-align: right; }
+    .mdc-dialog__header__title {
+      -webkit-box-flex: 1;
+          -ms-flex: 1;
+              flex: 1;
+      margin: 0;
+      font-family: Roboto, sans-serif;
+      -moz-osx-font-smoothing: grayscale;
+      -webkit-font-smoothing: antialiased;
+      font-size: 1.25rem;
+      font-weight: 500;
+      letter-spacing: 0.02em;
+      line-height: 2rem;
+      text-decoration: inherit;
+      text-transform: inherit; }
+  .mdc-dialog__body {
+    margin-top: 20px;
+    padding: 0 24px 24px;
+    /* @alternate */
+    color: rgba(0, 0, 0, 0.54);
+    color: var(--mdc-theme-text-secondary-on-light, rgba(0, 0, 0, 0.54));
+    font-family: Roboto, sans-serif;
+    -moz-osx-font-smoothing: grayscale;
+    -webkit-font-smoothing: antialiased;
+    font-size: 0.875rem;
+    font-weight: 400;
+    letter-spacing: 0.04em;
+    line-height: 1.25rem;
+    text-decoration: inherit;
+    text-transform: inherit; }
+    .mdc-dialog--theme-dark.mdc-dialog__body,
+    .mdc-theme--dark .mdc-dialog__body {
+      /* @alternate */
+      color: rgba(255, 255, 255, 0.7);
+      color: var(--mdc-theme-text-secondary-on-dark, rgba(255, 255, 255, 0.7)); }
+    .mdc-dialog__body--scrollable {
+      max-height: 195px;
+      border-top: 1px solid rgba(0, 0, 0, 0.1);
+      border-bottom: 1px solid rgba(0, 0, 0, 0.1);
+      overflow-y: scroll;
+      overflow-x: auto;
+      -webkit-overflow-scrolling: touch; }
+  .mdc-dialog__footer {
+    display: -webkit-box;
+    display: -ms-flexbox;
+    display: flex;
+    -ms-flex-wrap: wrap;
+        flex-wrap: wrap;
+    -webkit-box-align: center;
+        -ms-flex-align: center;
+            align-items: center;
+    -webkit-box-pack: end;
+        -ms-flex-pack: end;
+            justify-content: flex-end;
+    padding: 8px; }
+    .mdc-dialog__footer__button {
+      margin-left: 0;
+      margin-right: 8px; }
+      [dir="rtl"] .mdc-dialog__footer__button, .mdc-dialog__footer__button[dir="rtl"] {
+        margin-left: 8px;
+        margin-right: 0; }
+      .mdc-dialog__footer__button:last-child {
+        margin-left: 0;
+        margin-right: 0; }
+        [dir="rtl"] .mdc-dialog__footer__button:last-child, .mdc-dialog__footer__button:last-child[dir="rtl"] {
+          margin-left: 0;
+          margin-right: 0; }
+    .mdc-dialog__footer__action {
+      /* @alternate */
+      color: #ff4081;
+      color: var(--mdc-theme-accent, #ff4081); }
+  @media (max-width: 640px) {
+    .mdc-dialog {
+      min-width: 280px; }
+      .mdc-dialog__surface {
+        min-width: 280px; }
+      .mdc-dialog__body {
+        line-height: 24px; } }
+  .mdc-dialog--animating {
+    visibility: visible; }
+    .mdc-dialog--animating .mdc-dialog__backdrop {
+      -webkit-transition: opacity 120ms 0ms cubic-bezier(0, 0, 0.2, 1);
+      transition: opacity 120ms 0ms cubic-bezier(0, 0, 0.2, 1); }
+    .mdc-dialog--animating .mdc-dialog--open .mdc-dialog__surface {
+      -webkit-transition: opacity 120ms 0ms cubic-bezier(0, 0, 0.2, 1), -webkit-transform 120ms 0ms cubic-bezier(0, 0, 0.2, 1);
+      transition: opacity 120ms 0ms cubic-bezier(0, 0, 0.2, 1), -webkit-transform 120ms 0ms cubic-bezier(0, 0, 0.2, 1);
+      transition: opacity 120ms 0ms cubic-bezier(0, 0, 0.2, 1), transform 120ms 0ms cubic-bezier(0, 0, 0.2, 1);
+      transition: opacity 120ms 0ms cubic-bezier(0, 0, 0.2, 1), transform 120ms 0ms cubic-bezier(0, 0, 0.2, 1), -webkit-transform 120ms 0ms cubic-bezier(0, 0, 0.2, 1); }
+    .mdc-dialog--animating .mdc-dialog__surface {
+      -webkit-transition: opacity 120ms 0ms cubic-bezier(0, 0, 0.2, 1), -webkit-transform 120ms 0ms cubic-bezier(0, 0, 0.2, 1);
+      transition: opacity 120ms 0ms cubic-bezier(0, 0, 0.2, 1), -webkit-transform 120ms 0ms cubic-bezier(0, 0, 0.2, 1);
+      transition: opacity 120ms 0ms cubic-bezier(0, 0, 0.2, 1), transform 120ms 0ms cubic-bezier(0, 0, 0.2, 1);
+      transition: opacity 120ms 0ms cubic-bezier(0, 0, 0.2, 1), transform 120ms 0ms cubic-bezier(0, 0, 0.2, 1), -webkit-transform 120ms 0ms cubic-bezier(0, 0, 0.2, 1); }
+  .mdc-dialog--open {
+    visibility: visible; }
+    .mdc-dialog--open .mdc-dialog__backdrop {
+      opacity: .3; }
+    .mdc-dialog--open .mdc-dialog__surface {
+      -webkit-transform: translateY(0) scale(1);
+              transform: translateY(0) scale(1);
+      opacity: 1; }
+
+.mdc-dialog-scroll-lock {
+  height: 100vh;
+  overflow: hidden; }

+ 83 - 0
support/client/lib/vwf/view/lib/mdc/dist/mdc.dialog.css-entry

@@ -0,0 +1,83 @@
+/*!
+ Material Components for the web
+ Copyright (c) 2017 Google Inc.
+ License: Apache-2.0
+*/
+/******/ (function(modules) { // webpackBootstrap
+/******/ 	// The module cache
+/******/ 	var installedModules = {};
+/******/
+/******/ 	// The require function
+/******/ 	function __webpack_require__(moduleId) {
+/******/
+/******/ 		// Check if module is in cache
+/******/ 		if(installedModules[moduleId]) {
+/******/ 			return installedModules[moduleId].exports;
+/******/ 		}
+/******/ 		// Create a new module (and put it into the cache)
+/******/ 		var module = installedModules[moduleId] = {
+/******/ 			i: moduleId,
+/******/ 			l: false,
+/******/ 			exports: {}
+/******/ 		};
+/******/
+/******/ 		// Execute the module function
+/******/ 		modules[moduleId].call(module.exports, module, module.exports, __webpack_require__);
+/******/
+/******/ 		// Flag the module as loaded
+/******/ 		module.l = true;
+/******/
+/******/ 		// Return the exports of the module
+/******/ 		return module.exports;
+/******/ 	}
+/******/
+/******/
+/******/ 	// expose the modules object (__webpack_modules__)
+/******/ 	__webpack_require__.m = modules;
+/******/
+/******/ 	// expose the module cache
+/******/ 	__webpack_require__.c = installedModules;
+/******/
+/******/ 	// identity function for calling harmony imports with the correct context
+/******/ 	__webpack_require__.i = function(value) { return value; };
+/******/
+/******/ 	// define getter function for harmony exports
+/******/ 	__webpack_require__.d = function(exports, name, getter) {
+/******/ 		if(!__webpack_require__.o(exports, name)) {
+/******/ 			Object.defineProperty(exports, name, {
+/******/ 				configurable: false,
+/******/ 				enumerable: true,
+/******/ 				get: getter
+/******/ 			});
+/******/ 		}
+/******/ 	};
+/******/
+/******/ 	// getDefaultExport function for compatibility with non-harmony modules
+/******/ 	__webpack_require__.n = function(module) {
+/******/ 		var getter = module && module.__esModule ?
+/******/ 			function getDefault() { return module['default']; } :
+/******/ 			function getModuleExports() { return module; };
+/******/ 		__webpack_require__.d(getter, 'a', getter);
+/******/ 		return getter;
+/******/ 	};
+/******/
+/******/ 	// Object.prototype.hasOwnProperty.call
+/******/ 	__webpack_require__.o = function(object, property) { return Object.prototype.hasOwnProperty.call(object, property); };
+/******/
+/******/ 	// __webpack_public_path__
+/******/ 	__webpack_require__.p = "/assets/";
+/******/
+/******/ 	// Load entry module and return exports
+/******/ 	return __webpack_require__(__webpack_require__.s = 5);
+/******/ })
+/************************************************************************/
+/******/ ({
+
+/***/ 5:
+/***/ (function(module, exports) {
+
+// removed by extract-text-webpack-plugin
+
+/***/ })
+
+/******/ });

+ 2486 - 0
support/client/lib/vwf/view/lib/mdc/dist/mdc.dialog.js

@@ -0,0 +1,2486 @@
+/*!
+ Material Components for the web
+ Copyright (c) 2017 Google Inc.
+ License: Apache-2.0
+*/
+(function webpackUniversalModuleDefinition(root, factory) {
+	if(typeof exports === 'object' && typeof module === 'object')
+		module.exports = factory();
+	else if(typeof define === 'function' && define.amd)
+		define([], factory);
+	else if(typeof exports === 'object')
+		exports["dialog"] = factory();
+	else
+		root["mdc"] = root["mdc"] || {}, root["mdc"]["dialog"] = factory();
+})(this, function() {
+return /******/ (function(modules) { // webpackBootstrap
+/******/ 	// The module cache
+/******/ 	var installedModules = {};
+/******/
+/******/ 	// The require function
+/******/ 	function __webpack_require__(moduleId) {
+/******/
+/******/ 		// Check if module is in cache
+/******/ 		if(installedModules[moduleId]) {
+/******/ 			return installedModules[moduleId].exports;
+/******/ 		}
+/******/ 		// Create a new module (and put it into the cache)
+/******/ 		var module = installedModules[moduleId] = {
+/******/ 			i: moduleId,
+/******/ 			l: false,
+/******/ 			exports: {}
+/******/ 		};
+/******/
+/******/ 		// Execute the module function
+/******/ 		modules[moduleId].call(module.exports, module, module.exports, __webpack_require__);
+/******/
+/******/ 		// Flag the module as loaded
+/******/ 		module.l = true;
+/******/
+/******/ 		// Return the exports of the module
+/******/ 		return module.exports;
+/******/ 	}
+/******/
+/******/
+/******/ 	// expose the modules object (__webpack_modules__)
+/******/ 	__webpack_require__.m = modules;
+/******/
+/******/ 	// expose the module cache
+/******/ 	__webpack_require__.c = installedModules;
+/******/
+/******/ 	// identity function for calling harmony imports with the correct context
+/******/ 	__webpack_require__.i = function(value) { return value; };
+/******/
+/******/ 	// define getter function for harmony exports
+/******/ 	__webpack_require__.d = function(exports, name, getter) {
+/******/ 		if(!__webpack_require__.o(exports, name)) {
+/******/ 			Object.defineProperty(exports, name, {
+/******/ 				configurable: false,
+/******/ 				enumerable: true,
+/******/ 				get: getter
+/******/ 			});
+/******/ 		}
+/******/ 	};
+/******/
+/******/ 	// getDefaultExport function for compatibility with non-harmony modules
+/******/ 	__webpack_require__.n = function(module) {
+/******/ 		var getter = module && module.__esModule ?
+/******/ 			function getDefault() { return module['default']; } :
+/******/ 			function getModuleExports() { return module; };
+/******/ 		__webpack_require__.d(getter, 'a', getter);
+/******/ 		return getter;
+/******/ 	};
+/******/
+/******/ 	// Object.prototype.hasOwnProperty.call
+/******/ 	__webpack_require__.o = function(object, property) { return Object.prototype.hasOwnProperty.call(object, property); };
+/******/
+/******/ 	// __webpack_public_path__
+/******/ 	__webpack_require__.p = "/assets/";
+/******/
+/******/ 	// Load entry module and return exports
+/******/ 	return __webpack_require__(__webpack_require__.s = 85);
+/******/ })
+/************************************************************************/
+/******/ ({
+
+/***/ 0:
+/***/ (function(module, __webpack_exports__, __webpack_require__) {
+
+"use strict";
+var _createClass = function () { function defineProperties(target, props) { for (var i = 0; i < props.length; i++) { var descriptor = props[i]; descriptor.enumerable = descriptor.enumerable || false; descriptor.configurable = true; if ("value" in descriptor) descriptor.writable = true; Object.defineProperty(target, descriptor.key, descriptor); } } return function (Constructor, protoProps, staticProps) { if (protoProps) defineProperties(Constructor.prototype, protoProps); if (staticProps) defineProperties(Constructor, staticProps); return Constructor; }; }();
+
+function _classCallCheck(instance, Constructor) { if (!(instance instanceof Constructor)) { throw new TypeError("Cannot call a class as a function"); } }
+
+/**
+ * Copyright 2016 Google Inc.
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *   http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+
+/**
+ * @template A
+ */
+var MDCFoundation = function () {
+  _createClass(MDCFoundation, null, [{
+    key: "cssClasses",
+
+    /** @return enum{cssClasses} */
+    get: function get() {
+      // Classes extending MDCFoundation should implement this method to return an object which exports every
+      // CSS class the foundation class needs as a property. e.g. {ACTIVE: 'mdc-component--active'}
+      return {};
+    }
+
+    /** @return enum{strings} */
+
+  }, {
+    key: "strings",
+    get: function get() {
+      // Classes extending MDCFoundation should implement this method to return an object which exports all
+      // semantic strings as constants. e.g. {ARIA_ROLE: 'tablist'}
+      return {};
+    }
+
+    /** @return enum{numbers} */
+
+  }, {
+    key: "numbers",
+    get: function get() {
+      // Classes extending MDCFoundation should implement this method to return an object which exports all
+      // of its semantic numbers as constants. e.g. {ANIMATION_DELAY_MS: 350}
+      return {};
+    }
+
+    /** @return {!Object} */
+
+  }, {
+    key: "defaultAdapter",
+    get: function get() {
+      // Classes extending MDCFoundation may choose to implement this getter in order to provide a convenient
+      // way of viewing the necessary methods of an adapter. In the future, this could also be used for adapter
+      // validation.
+      return {};
+    }
+
+    /**
+     * @param {A=} adapter
+     */
+
+  }]);
+
+  function MDCFoundation() {
+    var adapter = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : {};
+
+    _classCallCheck(this, MDCFoundation);
+
+    /** @protected {!A} */
+    this.adapter_ = adapter;
+  }
+
+  _createClass(MDCFoundation, [{
+    key: "init",
+    value: function init() {
+      // Subclasses should override this method to perform initialization routines (registering events, etc.)
+    }
+  }, {
+    key: "destroy",
+    value: function destroy() {
+      // Subclasses should override this method to perform de-initialization routines (de-registering events, etc.)
+    }
+  }]);
+
+  return MDCFoundation;
+}();
+
+/* harmony default export */ __webpack_exports__["a"] = (MDCFoundation);
+
+/***/ }),
+
+/***/ 1:
+/***/ (function(module, __webpack_exports__, __webpack_require__) {
+
+"use strict";
+/* harmony import */ var __WEBPACK_IMPORTED_MODULE_0__foundation__ = __webpack_require__(0);
+var _createClass = function () { function defineProperties(target, props) { for (var i = 0; i < props.length; i++) { var descriptor = props[i]; descriptor.enumerable = descriptor.enumerable || false; descriptor.configurable = true; if ("value" in descriptor) descriptor.writable = true; Object.defineProperty(target, descriptor.key, descriptor); } } return function (Constructor, protoProps, staticProps) { if (protoProps) defineProperties(Constructor.prototype, protoProps); if (staticProps) defineProperties(Constructor, staticProps); return Constructor; }; }();
+
+function _classCallCheck(instance, Constructor) { if (!(instance instanceof Constructor)) { throw new TypeError("Cannot call a class as a function"); } }
+
+/**
+ * Copyright 2016 Google Inc.
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *   http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+
+
+
+/**
+ * @template F
+ */
+
+var MDCComponent = function () {
+  _createClass(MDCComponent, null, [{
+    key: 'attachTo',
+
+    /**
+     * @param {!Element} root
+     * @return {!MDCComponent}
+     */
+    value: function attachTo(root) {
+      // Subclasses which extend MDCBase should provide an attachTo() method that takes a root element and
+      // returns an instantiated component with its root set to that element. Also note that in the cases of
+      // subclasses, an explicit foundation class will not have to be passed in; it will simply be initialized
+      // from getDefaultFoundation().
+      return new MDCComponent(root, new __WEBPACK_IMPORTED_MODULE_0__foundation__["a" /* default */]());
+    }
+
+    /**
+     * @param {!Element} root
+     * @param {F=} foundation
+     * @param {...?} args
+     */
+
+  }]);
+
+  function MDCComponent(root) {
+    var foundation = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : undefined;
+
+    _classCallCheck(this, MDCComponent);
+
+    /** @protected {!Element} */
+    this.root_ = root;
+
+    for (var _len = arguments.length, args = Array(_len > 2 ? _len - 2 : 0), _key = 2; _key < _len; _key++) {
+      args[_key - 2] = arguments[_key];
+    }
+
+    this.initialize.apply(this, args);
+    // Note that we initialize foundation here and not within the constructor's default param so that
+    // this.root_ is defined and can be used within the foundation class.
+    /** @protected {!F} */
+    this.foundation_ = foundation === undefined ? this.getDefaultFoundation() : foundation;
+    this.foundation_.init();
+    this.initialSyncWithDOM();
+  }
+
+  _createClass(MDCComponent, [{
+    key: 'initialize',
+    value: function initialize() /* ...args */{}
+    // Subclasses can override this to do any additional setup work that would be considered part of a
+    // "constructor". Essentially, it is a hook into the parent constructor before the foundation is
+    // initialized. Any additional arguments besides root and foundation will be passed in here.
+
+
+    /**
+     * @return {!F} foundation
+     */
+
+  }, {
+    key: 'getDefaultFoundation',
+    value: function getDefaultFoundation() {
+      // Subclasses must override this method to return a properly configured foundation class for the
+      // component.
+      throw new Error('Subclasses must override getDefaultFoundation to return a properly configured ' + 'foundation class');
+    }
+  }, {
+    key: 'initialSyncWithDOM',
+    value: function initialSyncWithDOM() {
+      // Subclasses should override this method if they need to perform work to synchronize with a host DOM
+      // object. An example of this would be a form control wrapper that needs to synchronize its internal state
+      // to some property or attribute of the host DOM. Please note: this is *not* the place to perform DOM
+      // reads/writes that would cause layout / paint, as this is called synchronously from within the constructor.
+    }
+  }, {
+    key: 'destroy',
+    value: function destroy() {
+      // Subclasses may implement this method to release any resources / deregister any listeners they have
+      // attached. An example of this might be deregistering a resize event from the window object.
+      this.foundation_.destroy();
+    }
+
+    /**
+     * Wrapper method to add an event listener to the component's root element. This is most useful when
+     * listening for custom events.
+     * @param {string} evtType
+     * @param {!Function} handler
+     */
+
+  }, {
+    key: 'listen',
+    value: function listen(evtType, handler) {
+      this.root_.addEventListener(evtType, handler);
+    }
+
+    /**
+     * Wrapper method to remove an event listener to the component's root element. This is most useful when
+     * unlistening for custom events.
+     * @param {string} evtType
+     * @param {!Function} handler
+     */
+
+  }, {
+    key: 'unlisten',
+    value: function unlisten(evtType, handler) {
+      this.root_.removeEventListener(evtType, handler);
+    }
+
+    /**
+     * Fires a cross-browser-compatible custom event from the component root of the given type,
+     * with the given data.
+     * @param {string} evtType
+     * @param {!Object} evtData
+     * @param {boolean=} shouldBubble
+     */
+
+  }, {
+    key: 'emit',
+    value: function emit(evtType, evtData) {
+      var shouldBubble = arguments.length > 2 && arguments[2] !== undefined ? arguments[2] : false;
+
+      var evt = void 0;
+      if (typeof CustomEvent === 'function') {
+        evt = new CustomEvent(evtType, {
+          detail: evtData,
+          bubbles: shouldBubble
+        });
+      } else {
+        evt = document.createEvent('CustomEvent');
+        evt.initCustomEvent(evtType, shouldBubble, false, evtData);
+      }
+
+      this.root_.dispatchEvent(evt);
+    }
+  }]);
+
+  return MDCComponent;
+}();
+
+/* harmony default export */ __webpack_exports__["a"] = (MDCComponent);
+
+/***/ }),
+
+/***/ 2:
+/***/ (function(module, __webpack_exports__, __webpack_require__) {
+
+"use strict";
+Object.defineProperty(__webpack_exports__, "__esModule", { value: true });
+/* harmony import */ var __WEBPACK_IMPORTED_MODULE_0__foundation__ = __webpack_require__(0);
+/* harmony import */ var __WEBPACK_IMPORTED_MODULE_1__component__ = __webpack_require__(1);
+/* harmony import */ var __WEBPACK_IMPORTED_MODULE_2__selection_control__ = __webpack_require__(3);
+/* harmony reexport (binding) */ __webpack_require__.d(__webpack_exports__, "MDCFoundation", function() { return __WEBPACK_IMPORTED_MODULE_0__foundation__["a"]; });
+/* harmony reexport (binding) */ __webpack_require__.d(__webpack_exports__, "MDCComponent", function() { return __WEBPACK_IMPORTED_MODULE_1__component__["a"]; });
+/* harmony reexport (binding) */ __webpack_require__.d(__webpack_exports__, "SelectionControlState", function() { return __WEBPACK_IMPORTED_MODULE_2__selection_control__["a"]; });
+/**
+ * Copyright 2016 Google Inc.
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *   http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+
+
+
+
+
+
+
+/***/ }),
+
+/***/ 25:
+/***/ (function(module, __webpack_exports__, __webpack_require__) {
+
+"use strict";
+Object.defineProperty(__webpack_exports__, "__esModule", { value: true });
+/* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, "MDCDialog", function() { return MDCDialog; });
+/* harmony import */ var __WEBPACK_IMPORTED_MODULE_0__material_base__ = __webpack_require__(2);
+/* harmony import */ var __WEBPACK_IMPORTED_MODULE_1__material_ripple__ = __webpack_require__(6);
+/* harmony import */ var __WEBPACK_IMPORTED_MODULE_2__foundation__ = __webpack_require__(42);
+/* harmony import */ var __WEBPACK_IMPORTED_MODULE_3__util__ = __webpack_require__(43);
+/* harmony reexport (binding) */ __webpack_require__.d(__webpack_exports__, "MDCDialogFoundation", function() { return __WEBPACK_IMPORTED_MODULE_2__foundation__["a"]; });
+/* harmony reexport (module object) */ __webpack_require__.d(__webpack_exports__, "util", function() { return __WEBPACK_IMPORTED_MODULE_3__util__; });
+var _createClass = function () { function defineProperties(target, props) { for (var i = 0; i < props.length; i++) { var descriptor = props[i]; descriptor.enumerable = descriptor.enumerable || false; descriptor.configurable = true; if ("value" in descriptor) descriptor.writable = true; Object.defineProperty(target, descriptor.key, descriptor); } } return function (Constructor, protoProps, staticProps) { if (protoProps) defineProperties(Constructor.prototype, protoProps); if (staticProps) defineProperties(Constructor, staticProps); return Constructor; }; }();
+
+var _get = function get(object, property, receiver) { if (object === null) object = Function.prototype; var desc = Object.getOwnPropertyDescriptor(object, property); if (desc === undefined) { var parent = Object.getPrototypeOf(object); if (parent === null) { return undefined; } else { return get(parent, property, receiver); } } else if ("value" in desc) { return desc.value; } else { var getter = desc.get; if (getter === undefined) { return undefined; } return getter.call(receiver); } };
+
+function _classCallCheck(instance, Constructor) { if (!(instance instanceof Constructor)) { throw new TypeError("Cannot call a class as a function"); } }
+
+function _possibleConstructorReturn(self, call) { if (!self) { throw new ReferenceError("this hasn't been initialised - super() hasn't been called"); } return call && (typeof call === "object" || typeof call === "function") ? call : self; }
+
+function _inherits(subClass, superClass) { if (typeof superClass !== "function" && superClass !== null) { throw new TypeError("Super expression must either be null or a function, not " + typeof superClass); } subClass.prototype = Object.create(superClass && superClass.prototype, { constructor: { value: subClass, enumerable: false, writable: true, configurable: true } }); if (superClass) Object.setPrototypeOf ? Object.setPrototypeOf(subClass, superClass) : subClass.__proto__ = superClass; }
+
+/**
+ * Copyright 2017 Google Inc. All Rights Reserved.
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *      http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+
+
+
+
+
+
+
+
+
+
+var MDCDialog = function (_MDCComponent) {
+  _inherits(MDCDialog, _MDCComponent);
+
+  function MDCDialog() {
+    _classCallCheck(this, MDCDialog);
+
+    return _possibleConstructorReturn(this, (MDCDialog.__proto__ || Object.getPrototypeOf(MDCDialog)).apply(this, arguments));
+  }
+
+  _createClass(MDCDialog, [{
+    key: 'initialize',
+    value: function initialize() {
+      this.focusTrap_ = __WEBPACK_IMPORTED_MODULE_3__util__["createFocusTrapInstance"](this.dialogSurface_, this.acceptButton_);
+      this.footerBtnRipples_ = [];
+
+      var footerBtns = this.root_.querySelectorAll('.mdc-dialog__footer__button');
+      for (var i = 0, footerBtn; footerBtn = footerBtns[i]; i++) {
+        this.footerBtnRipples_.push(new __WEBPACK_IMPORTED_MODULE_1__material_ripple__["MDCRipple"](footerBtn));
+      }
+    }
+  }, {
+    key: 'destroy',
+    value: function destroy() {
+      this.footerBtnRipples_.forEach(function (ripple) {
+        return ripple.destroy();
+      });
+      _get(MDCDialog.prototype.__proto__ || Object.getPrototypeOf(MDCDialog.prototype), 'destroy', this).call(this);
+    }
+  }, {
+    key: 'show',
+    value: function show() {
+      this.foundation_.open();
+    }
+  }, {
+    key: 'close',
+    value: function close() {
+      this.foundation_.close();
+    }
+  }, {
+    key: 'getDefaultFoundation',
+    value: function getDefaultFoundation() {
+      var _this2 = this;
+
+      return new __WEBPACK_IMPORTED_MODULE_2__foundation__["a" /* default */]({
+        addClass: function addClass(className) {
+          return _this2.root_.classList.add(className);
+        },
+        removeClass: function removeClass(className) {
+          return _this2.root_.classList.remove(className);
+        },
+        addBodyClass: function addBodyClass(className) {
+          return document.body.classList.add(className);
+        },
+        removeBodyClass: function removeBodyClass(className) {
+          return document.body.classList.remove(className);
+        },
+        eventTargetHasClass: function eventTargetHasClass(target, className) {
+          return target.classList.contains(className);
+        },
+        registerInteractionHandler: function registerInteractionHandler(evt, handler) {
+          return _this2.root_.addEventListener(evt, handler);
+        },
+        deregisterInteractionHandler: function deregisterInteractionHandler(evt, handler) {
+          return _this2.root_.removeEventListener(evt, handler);
+        },
+        registerSurfaceInteractionHandler: function registerSurfaceInteractionHandler(evt, handler) {
+          return _this2.dialogSurface_.addEventListener(evt, handler);
+        },
+        deregisterSurfaceInteractionHandler: function deregisterSurfaceInteractionHandler(evt, handler) {
+          return _this2.dialogSurface_.removeEventListener(evt, handler);
+        },
+        registerDocumentKeydownHandler: function registerDocumentKeydownHandler(handler) {
+          return document.addEventListener('keydown', handler);
+        },
+        deregisterDocumentKeydownHandler: function deregisterDocumentKeydownHandler(handler) {
+          return document.removeEventListener('keydown', handler);
+        },
+        registerTransitionEndHandler: function registerTransitionEndHandler(handler) {
+          return _this2.dialogSurface_.addEventListener('transitionend', handler);
+        },
+        deregisterTransitionEndHandler: function deregisterTransitionEndHandler(handler) {
+          return _this2.dialogSurface_.removeEventListener('transitionend', handler);
+        },
+        notifyAccept: function notifyAccept() {
+          return _this2.emit(__WEBPACK_IMPORTED_MODULE_2__foundation__["a" /* default */].strings.ACCEPT_EVENT);
+        },
+        notifyCancel: function notifyCancel() {
+          return _this2.emit(__WEBPACK_IMPORTED_MODULE_2__foundation__["a" /* default */].strings.CANCEL_EVENT);
+        },
+        trapFocusOnSurface: function trapFocusOnSurface() {
+          return _this2.focusTrap_.activate();
+        },
+        untrapFocusOnSurface: function untrapFocusOnSurface() {
+          return _this2.focusTrap_.deactivate();
+        },
+        isDialog: function isDialog(el) {
+          return el === _this2.dialogSurface_;
+        }
+      });
+    }
+  }, {
+    key: 'open',
+    get: function get() {
+      return this.foundation_.isOpen();
+    }
+  }, {
+    key: 'acceptButton_',
+    get: function get() {
+      return this.root_.querySelector(__WEBPACK_IMPORTED_MODULE_2__foundation__["a" /* default */].strings.ACCEPT_SELECTOR);
+    }
+  }, {
+    key: 'dialogSurface_',
+    get: function get() {
+      return this.root_.querySelector(__WEBPACK_IMPORTED_MODULE_2__foundation__["a" /* default */].strings.DIALOG_SURFACE_SELECTOR);
+    }
+  }], [{
+    key: 'attachTo',
+    value: function attachTo(root) {
+      return new MDCDialog(root);
+    }
+  }]);
+
+  return MDCDialog;
+}(__WEBPACK_IMPORTED_MODULE_0__material_base__["MDCComponent"]);
+
+/***/ }),
+
+/***/ 3:
+/***/ (function(module, __webpack_exports__, __webpack_require__) {
+
+"use strict";
+/* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, "a", function() { return SelectionControlState; });
+/**
+ * Copyright 2017 Google Inc. All Rights Reserved.
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *      http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+
+/**
+ * @typedef {!{
+ *   checked: boolean,
+ *   indeterminate: boolean,
+ *   disabled: boolean,
+ *   value: ?string
+ * }}
+ */
+var SelectionControlState = void 0;
+
+/***/ }),
+
+/***/ 4:
+/***/ (function(module, __webpack_exports__, __webpack_require__) {
+
+"use strict";
+var _createClass = function () { function defineProperties(target, props) { for (var i = 0; i < props.length; i++) { var descriptor = props[i]; descriptor.enumerable = descriptor.enumerable || false; descriptor.configurable = true; if ("value" in descriptor) descriptor.writable = true; Object.defineProperty(target, descriptor.key, descriptor); } } return function (Constructor, protoProps, staticProps) { if (protoProps) defineProperties(Constructor.prototype, protoProps); if (staticProps) defineProperties(Constructor, staticProps); return Constructor; }; }();
+
+function _classCallCheck(instance, Constructor) { if (!(instance instanceof Constructor)) { throw new TypeError("Cannot call a class as a function"); } }
+
+/**
+ * Copyright 2016 Google Inc. All Rights Reserved.
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *      http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+
+/* eslint no-unused-vars: [2, {"args": "none"}] */
+
+/**
+ * Adapter for MDC Ripple. Provides an interface for managing
+ * - classes
+ * - dom
+ * - CSS variables
+ * - position
+ * - dimensions
+ * - scroll position
+ * - event handlers
+ * - unbounded, active and disabled states
+ *
+ * Additionally, provides type information for the adapter to the Closure
+ * compiler.
+ *
+ * Implement this adapter for your framework of choice to delegate updates to
+ * the component in your framework of choice. See architecture documentation
+ * for more details.
+ * https://github.com/material-components/material-components-web/blob/master/docs/architecture.md
+ *
+ * @record
+ */
+var MDCRippleAdapter = function () {
+  function MDCRippleAdapter() {
+    _classCallCheck(this, MDCRippleAdapter);
+  }
+
+  _createClass(MDCRippleAdapter, [{
+    key: "browserSupportsCssVars",
+
+    /** @return {boolean} */
+    value: function browserSupportsCssVars() {}
+
+    /** @return {boolean} */
+
+  }, {
+    key: "isUnbounded",
+    value: function isUnbounded() {}
+
+    /** @return {boolean} */
+
+  }, {
+    key: "isSurfaceActive",
+    value: function isSurfaceActive() {}
+
+    /** @return {boolean} */
+
+  }, {
+    key: "isSurfaceDisabled",
+    value: function isSurfaceDisabled() {}
+
+    /** @param {string} className */
+
+  }, {
+    key: "addClass",
+    value: function addClass(className) {}
+
+    /** @param {string} className */
+
+  }, {
+    key: "removeClass",
+    value: function removeClass(className) {}
+
+    /**
+     * @param {string} evtType
+     * @param {!Function} handler
+     */
+
+  }, {
+    key: "registerInteractionHandler",
+    value: function registerInteractionHandler(evtType, handler) {}
+
+    /**
+     * @param {string} evtType
+     * @param {!Function} handler
+     */
+
+  }, {
+    key: "deregisterInteractionHandler",
+    value: function deregisterInteractionHandler(evtType, handler) {}
+
+    /**
+     * @param {!Function} handler
+     */
+
+  }, {
+    key: "registerResizeHandler",
+    value: function registerResizeHandler(handler) {}
+
+    /**
+     * @param {!Function} handler
+     */
+
+  }, {
+    key: "deregisterResizeHandler",
+    value: function deregisterResizeHandler(handler) {}
+
+    /**
+     * @param {string} varName
+     * @param {?number|string} value
+     */
+
+  }, {
+    key: "updateCssVariable",
+    value: function updateCssVariable(varName, value) {}
+
+    /** @return {!ClientRect} */
+
+  }, {
+    key: "computeBoundingRect",
+    value: function computeBoundingRect() {}
+
+    /** @return {{x: number, y: number}} */
+
+  }, {
+    key: "getWindowPageOffset",
+    value: function getWindowPageOffset() {}
+  }]);
+
+  return MDCRippleAdapter;
+}();
+
+/* unused harmony default export */ var _unused_webpack_default_export = (MDCRippleAdapter);
+
+/***/ }),
+
+/***/ 41:
+/***/ (function(module, __webpack_exports__, __webpack_require__) {
+
+"use strict";
+/* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, "a", function() { return cssClasses; });
+/* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, "b", function() { return strings; });
+/**
+ * Copyright 2016 Google Inc. All Rights Reserved.
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *      http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+
+var cssClasses = {
+  ROOT: 'mdc-dialog',
+  OPEN: 'mdc-dialog--open',
+  ANIMATING: 'mdc-dialog--animating',
+  BACKDROP: 'mdc-dialog__backdrop',
+  SCROLL_LOCK: 'mdc-dialog-scroll-lock',
+  ACCEPT_BTN: 'mdc-dialog__footer__button--accept',
+  CANCEL_BTN: 'mdc-dialog__footer__button--cancel'
+};
+
+var strings = {
+  OPEN_DIALOG_SELECTOR: '.mdc-dialog--open',
+  DIALOG_SURFACE_SELECTOR: '.mdc-dialog__surface',
+  ACCEPT_SELECTOR: '.mdc-dialog__footer__button--accept',
+  ACCEPT_EVENT: 'MDCDialog:accept',
+  CANCEL_EVENT: 'MDCDialog:cancel'
+};
+
+/***/ }),
+
+/***/ 42:
+/***/ (function(module, __webpack_exports__, __webpack_require__) {
+
+"use strict";
+/* harmony import */ var __WEBPACK_IMPORTED_MODULE_0__material_base__ = __webpack_require__(2);
+/* harmony import */ var __WEBPACK_IMPORTED_MODULE_1__constants__ = __webpack_require__(41);
+var _extends = Object.assign || function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; };
+
+var _createClass = function () { function defineProperties(target, props) { for (var i = 0; i < props.length; i++) { var descriptor = props[i]; descriptor.enumerable = descriptor.enumerable || false; descriptor.configurable = true; if ("value" in descriptor) descriptor.writable = true; Object.defineProperty(target, descriptor.key, descriptor); } } return function (Constructor, protoProps, staticProps) { if (protoProps) defineProperties(Constructor.prototype, protoProps); if (staticProps) defineProperties(Constructor, staticProps); return Constructor; }; }();
+
+function _classCallCheck(instance, Constructor) { if (!(instance instanceof Constructor)) { throw new TypeError("Cannot call a class as a function"); } }
+
+function _possibleConstructorReturn(self, call) { if (!self) { throw new ReferenceError("this hasn't been initialised - super() hasn't been called"); } return call && (typeof call === "object" || typeof call === "function") ? call : self; }
+
+function _inherits(subClass, superClass) { if (typeof superClass !== "function" && superClass !== null) { throw new TypeError("Super expression must either be null or a function, not " + typeof superClass); } subClass.prototype = Object.create(superClass && superClass.prototype, { constructor: { value: subClass, enumerable: false, writable: true, configurable: true } }); if (superClass) Object.setPrototypeOf ? Object.setPrototypeOf(subClass, superClass) : subClass.__proto__ = superClass; }
+
+/**
+ * Copyright 2017 Google Inc. All Rights Reserved.
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *      http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+
+
+
+
+var MDCDialogFoundation = function (_MDCFoundation) {
+  _inherits(MDCDialogFoundation, _MDCFoundation);
+
+  _createClass(MDCDialogFoundation, null, [{
+    key: 'cssClasses',
+    get: function get() {
+      return __WEBPACK_IMPORTED_MODULE_1__constants__["a" /* cssClasses */];
+    }
+  }, {
+    key: 'strings',
+    get: function get() {
+      return __WEBPACK_IMPORTED_MODULE_1__constants__["b" /* strings */];
+    }
+  }, {
+    key: 'defaultAdapter',
+    get: function get() {
+      return {
+        addClass: function addClass() /* className: string */{},
+        removeClass: function removeClass() /* className: string */{},
+        addBodyClass: function addBodyClass() /* className: string */{},
+        removeBodyClass: function removeBodyClass() /* className: string */{},
+        eventTargetHasClass: function eventTargetHasClass() {
+          return (/* target: EventTarget, className: string */ /* boolean */false
+          );
+        },
+        registerInteractionHandler: function registerInteractionHandler() /* evt: string, handler: EventListener */{},
+        deregisterInteractionHandler: function deregisterInteractionHandler() /* evt: string, handler: EventListener */{},
+        registerSurfaceInteractionHandler: function registerSurfaceInteractionHandler() /* evt: string, handler: EventListener */{},
+        deregisterSurfaceInteractionHandler: function deregisterSurfaceInteractionHandler() /* evt: string, handler: EventListener */{},
+        registerDocumentKeydownHandler: function registerDocumentKeydownHandler() /* handler: EventListener */{},
+        deregisterDocumentKeydownHandler: function deregisterDocumentKeydownHandler() /* handler: EventListener */{},
+        registerTransitionEndHandler: function registerTransitionEndHandler() /* handler: EventListener */{},
+        deregisterTransitionEndHandler: function deregisterTransitionEndHandler() /* handler: EventListener */{},
+        notifyAccept: function notifyAccept() {},
+        notifyCancel: function notifyCancel() {},
+        trapFocusOnSurface: function trapFocusOnSurface() {},
+        untrapFocusOnSurface: function untrapFocusOnSurface() {},
+        isDialog: function isDialog() {
+          return (/* el: Element */ /* boolean */false
+          );
+        }
+      };
+    }
+  }]);
+
+  function MDCDialogFoundation(adapter) {
+    _classCallCheck(this, MDCDialogFoundation);
+
+    var _this = _possibleConstructorReturn(this, (MDCDialogFoundation.__proto__ || Object.getPrototypeOf(MDCDialogFoundation)).call(this, _extends(MDCDialogFoundation.defaultAdapter, adapter)));
+
+    _this.isOpen_ = false;
+    _this.componentClickHandler_ = function (evt) {
+      if (_this.adapter_.eventTargetHasClass(evt.target, __WEBPACK_IMPORTED_MODULE_1__constants__["a" /* cssClasses */].BACKDROP)) {
+        _this.cancel(true);
+      }
+    };
+    _this.dialogClickHandler_ = function (evt) {
+      return _this.handleDialogClick_(evt);
+    };
+    _this.documentKeydownHandler_ = function (evt) {
+      if (evt.key && evt.key === 'Escape' || evt.keyCode === 27) {
+        _this.cancel(true);
+      }
+    };
+    _this.transitionEndHandler_ = function (evt) {
+      return _this.handleTransitionEnd_(evt);
+    };
+    return _this;
+  }
+
+  _createClass(MDCDialogFoundation, [{
+    key: 'destroy',
+    value: function destroy() {
+      // Ensure that dialog is cleaned up when destroyed
+      if (this.isOpen_) {
+        this.adapter_.deregisterSurfaceInteractionHandler('click', this.dialogClickHandler_);
+        this.adapter_.deregisterDocumentKeydownHandler(this.documentKeydownHandler_);
+        this.adapter_.deregisterInteractionHandler('click', this.componentClickHandler_);
+        this.adapter_.untrapFocusOnSurface();
+        this.adapter_.deregisterTransitionEndHandler(this.transitionEndHandler_);
+        this.adapter_.removeClass(MDCDialogFoundation.cssClasses.ANIMATING);
+        this.adapter_.removeClass(MDCDialogFoundation.cssClasses.OPEN);
+        this.enableScroll_();
+      }
+    }
+  }, {
+    key: 'open',
+    value: function open() {
+      this.isOpen_ = true;
+      this.disableScroll_();
+      this.adapter_.registerDocumentKeydownHandler(this.documentKeydownHandler_);
+      this.adapter_.registerSurfaceInteractionHandler('click', this.dialogClickHandler_);
+      this.adapter_.registerInteractionHandler('click', this.componentClickHandler_);
+      this.adapter_.registerTransitionEndHandler(this.transitionEndHandler_);
+      this.adapter_.addClass(MDCDialogFoundation.cssClasses.ANIMATING);
+      this.adapter_.addClass(MDCDialogFoundation.cssClasses.OPEN);
+    }
+  }, {
+    key: 'close',
+    value: function close() {
+      this.isOpen_ = false;
+      this.adapter_.deregisterSurfaceInteractionHandler('click', this.dialogClickHandler_);
+      this.adapter_.deregisterDocumentKeydownHandler(this.documentKeydownHandler_);
+      this.adapter_.deregisterInteractionHandler('click', this.componentClickHandler_);
+      this.adapter_.untrapFocusOnSurface();
+      this.adapter_.registerTransitionEndHandler(this.transitionEndHandler_);
+      this.adapter_.addClass(MDCDialogFoundation.cssClasses.ANIMATING);
+      this.adapter_.removeClass(MDCDialogFoundation.cssClasses.OPEN);
+    }
+  }, {
+    key: 'isOpen',
+    value: function isOpen() {
+      return this.isOpen_;
+    }
+  }, {
+    key: 'accept',
+    value: function accept(shouldNotify) {
+      if (shouldNotify) {
+        this.adapter_.notifyAccept();
+      }
+
+      this.close();
+    }
+  }, {
+    key: 'cancel',
+    value: function cancel(shouldNotify) {
+      if (shouldNotify) {
+        this.adapter_.notifyCancel();
+      }
+
+      this.close();
+    }
+  }, {
+    key: 'handleDialogClick_',
+    value: function handleDialogClick_(evt) {
+      var target = evt.target;
+
+      if (this.adapter_.eventTargetHasClass(target, __WEBPACK_IMPORTED_MODULE_1__constants__["a" /* cssClasses */].ACCEPT_BTN)) {
+        this.accept(true);
+      } else if (this.adapter_.eventTargetHasClass(target, __WEBPACK_IMPORTED_MODULE_1__constants__["a" /* cssClasses */].CANCEL_BTN)) {
+        this.cancel(true);
+      }
+    }
+  }, {
+    key: 'handleTransitionEnd_',
+    value: function handleTransitionEnd_(evt) {
+      if (this.adapter_.isDialog(evt.target)) {
+        this.adapter_.deregisterTransitionEndHandler(this.transitionEndHandler_);
+        this.adapter_.removeClass(MDCDialogFoundation.cssClasses.ANIMATING);
+        if (this.isOpen_) {
+          this.adapter_.trapFocusOnSurface();
+        } else {
+          this.enableScroll_();
+        };
+      };
+    }
+  }, {
+    key: 'disableScroll_',
+    value: function disableScroll_() {
+      this.adapter_.addBodyClass(__WEBPACK_IMPORTED_MODULE_1__constants__["a" /* cssClasses */].SCROLL_LOCK);
+    }
+  }, {
+    key: 'enableScroll_',
+    value: function enableScroll_() {
+      this.adapter_.removeBodyClass(__WEBPACK_IMPORTED_MODULE_1__constants__["a" /* cssClasses */].SCROLL_LOCK);
+    }
+  }]);
+
+  return MDCDialogFoundation;
+}(__WEBPACK_IMPORTED_MODULE_0__material_base__["MDCFoundation"]);
+
+/* harmony default export */ __webpack_exports__["a"] = (MDCDialogFoundation);
+
+/***/ }),
+
+/***/ 43:
+/***/ (function(module, __webpack_exports__, __webpack_require__) {
+
+"use strict";
+Object.defineProperty(__webpack_exports__, "__esModule", { value: true });
+/* harmony export (immutable) */ __webpack_exports__["createFocusTrapInstance"] = createFocusTrapInstance;
+/* harmony import */ var __WEBPACK_IMPORTED_MODULE_0_focus_trap__ = __webpack_require__(79);
+/* harmony import */ var __WEBPACK_IMPORTED_MODULE_0_focus_trap___default = __webpack_require__.n(__WEBPACK_IMPORTED_MODULE_0_focus_trap__);
+/**
+ * Copyright 2016 Google Inc. All Rights Reserved.
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *      http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+
+
+
+function createFocusTrapInstance(surfaceEl, acceptButtonEl) {
+  var focusTrapFactory = arguments.length > 2 && arguments[2] !== undefined ? arguments[2] : __WEBPACK_IMPORTED_MODULE_0_focus_trap___default.a;
+
+  return focusTrapFactory(surfaceEl, {
+    initialFocus: acceptButtonEl,
+    clickOutsideDeactivates: true
+  });
+}
+
+/***/ }),
+
+/***/ 5:
+/***/ (function(module, __webpack_exports__, __webpack_require__) {
+
+"use strict";
+Object.defineProperty(__webpack_exports__, "__esModule", { value: true });
+/* harmony export (immutable) */ __webpack_exports__["supportsCssVariables"] = supportsCssVariables;
+/* harmony export (immutable) */ __webpack_exports__["applyPassive"] = applyPassive;
+/* harmony export (immutable) */ __webpack_exports__["getMatchesProperty"] = getMatchesProperty;
+/* harmony export (immutable) */ __webpack_exports__["getNormalizedEventCoords"] = getNormalizedEventCoords;
+/**
+ * Copyright 2016 Google Inc. All Rights Reserved.
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *      http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+
+/**
+ * Stores result from supportsCssVariables to avoid redundant processing to detect CSS custom variable support.
+ * @private {boolean|undefined}
+ */
+var supportsCssVariables_ = void 0;
+
+/**
+ * Stores result from applyPassive to avoid redundant processing to detect passive event listener support.
+ * @private {boolean|undefined}
+ */
+var supportsPassive_ = void 0;
+
+/**
+ * @param {!Window} windowObj
+ * @return {boolean}
+ */
+function detectEdgePseudoVarBug(windowObj) {
+  // Detect versions of Edge with buggy var() support
+  // See: https://developer.microsoft.com/en-us/microsoft-edge/platform/issues/11495448/
+  var document = windowObj.document;
+  var className = 'test-edge-css-var';
+  var styleNode = document.createElement('style');
+  document.head.appendChild(styleNode);
+  var sheet = styleNode.sheet;
+  // Internet Explorer 11 requires indices to always be specified to insertRule
+  sheet.insertRule(':root { --' + className + ': 1px solid #000; }', 0);
+  sheet.insertRule('.' + className + ' { visibility: hidden; }', 1);
+  sheet.insertRule('.' + className + '::before { border: var(--' + className + '); }', 2);
+  var node = document.createElement('div');
+  node.className = className;
+  document.body.appendChild(node);
+  // Bug exists if ::before style ends up propagating to the parent element
+  var hasPseudoVarBug = windowObj.getComputedStyle(node).borderTopStyle === 'solid';
+  node.remove();
+  styleNode.remove();
+  return hasPseudoVarBug;
+}
+
+/**
+ * @param {!Window} windowObj
+ * @param {boolean=} forceRefresh
+ * @return {boolean|undefined}
+ */
+function supportsCssVariables(windowObj) {
+  var forceRefresh = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : false;
+
+  if (typeof supportsCssVariables_ === 'boolean' && !forceRefresh) {
+    return supportsCssVariables_;
+  }
+
+  var supportsFunctionPresent = windowObj.CSS && typeof windowObj.CSS.supports === 'function';
+  if (!supportsFunctionPresent) {
+    return;
+  }
+
+  var explicitlySupportsCssVars = windowObj.CSS.supports('--css-vars', 'yes');
+  // See: https://bugs.webkit.org/show_bug.cgi?id=154669
+  // See: README section on Safari
+  var weAreFeatureDetectingSafari10plus = windowObj.CSS.supports('(--css-vars: yes)') && windowObj.CSS.supports('color', '#00000000');
+
+  if (explicitlySupportsCssVars || weAreFeatureDetectingSafari10plus) {
+    supportsCssVariables_ = !detectEdgePseudoVarBug(windowObj);
+  } else {
+    supportsCssVariables_ = false;
+  }
+  return supportsCssVariables_;
+}
+
+//
+/**
+ * Determine whether the current browser supports passive event listeners, and if so, use them.
+ * @param {!Window=} globalObj
+ * @param {boolean=} forceRefresh
+ * @return {boolean|{passive: boolean}}
+ */
+function applyPassive() {
+  var globalObj = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : window;
+  var forceRefresh = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : false;
+
+  if (supportsPassive_ === undefined || forceRefresh) {
+    var isSupported = false;
+    try {
+      globalObj.document.addEventListener('test', null, { get passive() {
+          isSupported = true;
+        } });
+    } catch (e) {}
+
+    supportsPassive_ = isSupported;
+  }
+
+  return supportsPassive_ ? { passive: true } : false;
+}
+
+/**
+ * @param {!Object} HTMLElementPrototype
+ * @return {!Array<string>}
+ */
+function getMatchesProperty(HTMLElementPrototype) {
+  return ['webkitMatchesSelector', 'msMatchesSelector', 'matches'].filter(function (p) {
+    return p in HTMLElementPrototype;
+  }).pop();
+}
+
+/**
+ * @param {!Event} ev
+ * @param {!{x: number, y: number}} pageOffset
+ * @param {!ClientRect} clientRect
+ * @return {!{x: number, y: number}}
+ */
+function getNormalizedEventCoords(ev, pageOffset, clientRect) {
+  var x = pageOffset.x,
+      y = pageOffset.y;
+
+  var documentX = x + clientRect.left;
+  var documentY = y + clientRect.top;
+
+  var normalizedX = void 0;
+  var normalizedY = void 0;
+  // Determine touch point relative to the ripple container.
+  if (ev.type === 'touchstart') {
+    normalizedX = ev.changedTouches[0].pageX - documentX;
+    normalizedY = ev.changedTouches[0].pageY - documentY;
+  } else {
+    normalizedX = ev.pageX - documentX;
+    normalizedY = ev.pageY - documentY;
+  }
+
+  return { x: normalizedX, y: normalizedY };
+}
+
+/***/ }),
+
+/***/ 6:
+/***/ (function(module, __webpack_exports__, __webpack_require__) {
+
+"use strict";
+Object.defineProperty(__webpack_exports__, "__esModule", { value: true });
+/* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, "MDCRipple", function() { return MDCRipple; });
+/* harmony import */ var __WEBPACK_IMPORTED_MODULE_0__material_base_component__ = __webpack_require__(1);
+/* harmony import */ var __WEBPACK_IMPORTED_MODULE_1__adapter__ = __webpack_require__(4);
+/* harmony import */ var __WEBPACK_IMPORTED_MODULE_2__foundation__ = __webpack_require__(8);
+/* harmony import */ var __WEBPACK_IMPORTED_MODULE_3__util__ = __webpack_require__(5);
+/* harmony reexport (binding) */ __webpack_require__.d(__webpack_exports__, "MDCRippleFoundation", function() { return __WEBPACK_IMPORTED_MODULE_2__foundation__["a"]; });
+/* harmony reexport (module object) */ __webpack_require__.d(__webpack_exports__, "util", function() { return __WEBPACK_IMPORTED_MODULE_3__util__; });
+var _createClass = function () { function defineProperties(target, props) { for (var i = 0; i < props.length; i++) { var descriptor = props[i]; descriptor.enumerable = descriptor.enumerable || false; descriptor.configurable = true; if ("value" in descriptor) descriptor.writable = true; Object.defineProperty(target, descriptor.key, descriptor); } } return function (Constructor, protoProps, staticProps) { if (protoProps) defineProperties(Constructor.prototype, protoProps); if (staticProps) defineProperties(Constructor, staticProps); return Constructor; }; }();
+
+function _classCallCheck(instance, Constructor) { if (!(instance instanceof Constructor)) { throw new TypeError("Cannot call a class as a function"); } }
+
+function _possibleConstructorReturn(self, call) { if (!self) { throw new ReferenceError("this hasn't been initialised - super() hasn't been called"); } return call && (typeof call === "object" || typeof call === "function") ? call : self; }
+
+function _inherits(subClass, superClass) { if (typeof superClass !== "function" && superClass !== null) { throw new TypeError("Super expression must either be null or a function, not " + typeof superClass); } subClass.prototype = Object.create(superClass && superClass.prototype, { constructor: { value: subClass, enumerable: false, writable: true, configurable: true } }); if (superClass) Object.setPrototypeOf ? Object.setPrototypeOf(subClass, superClass) : subClass.__proto__ = superClass; }
+
+/**
+ * Copyright 2016 Google Inc. All Rights Reserved.
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *      http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+
+
+
+
+
+
+
+
+
+/**
+ * @extends MDCComponent<!MDCRippleFoundation>
+ */
+var MDCRipple = function (_MDCComponent) {
+  _inherits(MDCRipple, _MDCComponent);
+
+  /** @param {...?} args */
+  function MDCRipple() {
+    var _ref;
+
+    _classCallCheck(this, MDCRipple);
+
+    for (var _len = arguments.length, args = Array(_len), _key = 0; _key < _len; _key++) {
+      args[_key] = arguments[_key];
+    }
+
+    /** @type {boolean} */
+    var _this = _possibleConstructorReturn(this, (_ref = MDCRipple.__proto__ || Object.getPrototypeOf(MDCRipple)).call.apply(_ref, [this].concat(args)));
+
+    _this.disabled = false;
+
+    /** @private {boolean} */
+    _this.unbounded_;
+    return _this;
+  }
+
+  /**
+   * @param {!Element} root
+   * @param {{isUnbounded: (boolean|undefined)}=} options
+   * @return {!MDCRipple}
+   */
+
+
+  _createClass(MDCRipple, [{
+    key: 'activate',
+    value: function activate() {
+      this.foundation_.activate();
+    }
+  }, {
+    key: 'deactivate',
+    value: function deactivate() {
+      this.foundation_.deactivate();
+    }
+  }, {
+    key: 'layout',
+    value: function layout() {
+      this.foundation_.layout();
+    }
+
+    /** @return {!MDCRippleFoundation} */
+
+  }, {
+    key: 'getDefaultFoundation',
+    value: function getDefaultFoundation() {
+      return new __WEBPACK_IMPORTED_MODULE_2__foundation__["a" /* default */](MDCRipple.createAdapter(this));
+    }
+  }, {
+    key: 'initialSyncWithDOM',
+    value: function initialSyncWithDOM() {
+      this.unbounded = 'mdcRippleIsUnbounded' in this.root_.dataset;
+    }
+  }, {
+    key: 'unbounded',
+
+
+    /** @return {boolean} */
+    get: function get() {
+      return this.unbounded_;
+    }
+
+    /** @param {boolean} unbounded */
+    ,
+    set: function set(unbounded) {
+      var UNBOUNDED = __WEBPACK_IMPORTED_MODULE_2__foundation__["a" /* default */].cssClasses.UNBOUNDED;
+
+      this.unbounded_ = Boolean(unbounded);
+      if (this.unbounded_) {
+        this.root_.classList.add(UNBOUNDED);
+      } else {
+        this.root_.classList.remove(UNBOUNDED);
+      }
+    }
+  }], [{
+    key: 'attachTo',
+    value: function attachTo(root) {
+      var _ref2 = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : {},
+          _ref2$isUnbounded = _ref2.isUnbounded,
+          isUnbounded = _ref2$isUnbounded === undefined ? undefined : _ref2$isUnbounded;
+
+      var ripple = new MDCRipple(root);
+      // Only override unbounded behavior if option is explicitly specified
+      if (isUnbounded !== undefined) {
+        ripple.unbounded = /** @type {boolean} */isUnbounded;
+      }
+      return ripple;
+    }
+
+    /**
+     * @param {!RippleCapableSurface} instance
+     * @return {!MDCRippleAdapter}
+     */
+
+  }, {
+    key: 'createAdapter',
+    value: function createAdapter(instance) {
+      var MATCHES = __WEBPACK_IMPORTED_MODULE_3__util__["getMatchesProperty"](HTMLElement.prototype);
+
+      return {
+        browserSupportsCssVars: function browserSupportsCssVars() {
+          return __WEBPACK_IMPORTED_MODULE_3__util__["supportsCssVariables"](window);
+        },
+        isUnbounded: function isUnbounded() {
+          return instance.unbounded;
+        },
+        isSurfaceActive: function isSurfaceActive() {
+          return instance.root_[MATCHES](':active');
+        },
+        isSurfaceDisabled: function isSurfaceDisabled() {
+          return instance.disabled;
+        },
+        addClass: function addClass(className) {
+          return instance.root_.classList.add(className);
+        },
+        removeClass: function removeClass(className) {
+          return instance.root_.classList.remove(className);
+        },
+        registerInteractionHandler: function registerInteractionHandler(evtType, handler) {
+          return instance.root_.addEventListener(evtType, handler, __WEBPACK_IMPORTED_MODULE_3__util__["applyPassive"]());
+        },
+        deregisterInteractionHandler: function deregisterInteractionHandler(evtType, handler) {
+          return instance.root_.removeEventListener(evtType, handler, __WEBPACK_IMPORTED_MODULE_3__util__["applyPassive"]());
+        },
+        registerResizeHandler: function registerResizeHandler(handler) {
+          return window.addEventListener('resize', handler);
+        },
+        deregisterResizeHandler: function deregisterResizeHandler(handler) {
+          return window.removeEventListener('resize', handler);
+        },
+        updateCssVariable: function updateCssVariable(varName, value) {
+          return instance.root_.style.setProperty(varName, value);
+        },
+        computeBoundingRect: function computeBoundingRect() {
+          return instance.root_.getBoundingClientRect();
+        },
+        getWindowPageOffset: function getWindowPageOffset() {
+          return { x: window.pageXOffset, y: window.pageYOffset };
+        }
+      };
+    }
+  }]);
+
+  return MDCRipple;
+}(__WEBPACK_IMPORTED_MODULE_0__material_base_component__["a" /* default */]);
+
+/**
+ * See Material Design spec for more details on when to use ripples.
+ * https://material.io/guidelines/motion/choreography.html#choreography-creation
+ * @record
+ */
+
+var RippleCapableSurface = function RippleCapableSurface() {
+  _classCallCheck(this, RippleCapableSurface);
+};
+
+/** @protected {!Element} */
+
+
+RippleCapableSurface.prototype.root_;
+
+/**
+ * Whether or not the ripple bleeds out of the bounds of the element.
+ * @type {boolean|undefined}
+ */
+RippleCapableSurface.prototype.unbounded;
+
+/**
+ * Whether or not the ripple is attached to a disabled component.
+ * @type {boolean|undefined}
+ */
+RippleCapableSurface.prototype.disabled;
+
+/***/ }),
+
+/***/ 7:
+/***/ (function(module, __webpack_exports__, __webpack_require__) {
+
+"use strict";
+/* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, "a", function() { return cssClasses; });
+/* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, "b", function() { return strings; });
+/* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, "c", function() { return numbers; });
+/**
+ * Copyright 2016 Google Inc. All Rights Reserved.
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *      http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+
+var cssClasses = {
+  // Ripple is a special case where the "root" component is really a "mixin" of sorts,
+  // given that it's an 'upgrade' to an existing component. That being said it is the root
+  // CSS class that all other CSS classes derive from.
+  ROOT: 'mdc-ripple-upgraded',
+  UNBOUNDED: 'mdc-ripple-upgraded--unbounded',
+  BG_FOCUSED: 'mdc-ripple-upgraded--background-focused',
+  BG_ACTIVE_FILL: 'mdc-ripple-upgraded--background-active-fill',
+  FG_ACTIVATION: 'mdc-ripple-upgraded--foreground-activation',
+  FG_DEACTIVATION: 'mdc-ripple-upgraded--foreground-deactivation'
+};
+
+var strings = {
+  VAR_SURFACE_WIDTH: '--mdc-ripple-surface-width',
+  VAR_SURFACE_HEIGHT: '--mdc-ripple-surface-height',
+  VAR_FG_SIZE: '--mdc-ripple-fg-size',
+  VAR_LEFT: '--mdc-ripple-left',
+  VAR_TOP: '--mdc-ripple-top',
+  VAR_FG_SCALE: '--mdc-ripple-fg-scale',
+  VAR_FG_TRANSLATE_START: '--mdc-ripple-fg-translate-start',
+  VAR_FG_TRANSLATE_END: '--mdc-ripple-fg-translate-end'
+};
+
+var numbers = {
+  PADDING: 10,
+  INITIAL_ORIGIN_SCALE: 0.6,
+  DEACTIVATION_TIMEOUT_MS: 300,
+  FG_DEACTIVATION_MS: 83
+};
+
+/***/ }),
+
+/***/ 79:
+/***/ (function(module, exports, __webpack_require__) {
+
+var tabbable = __webpack_require__(80);
+
+var listeningFocusTrap = null;
+
+function focusTrap(element, userOptions) {
+  var tabbableNodes = [];
+  var nodeFocusedBeforeActivation = null;
+  var active = false;
+  var paused = false;
+
+  var container = (typeof element === 'string')
+    ? document.querySelector(element)
+    : element;
+
+  var config = userOptions || {};
+  config.returnFocusOnDeactivate = (userOptions && userOptions.returnFocusOnDeactivate !== undefined)
+    ? userOptions.returnFocusOnDeactivate
+    : true;
+  config.escapeDeactivates = (userOptions && userOptions.escapeDeactivates !== undefined)
+    ? userOptions.escapeDeactivates
+    : true;
+
+  var trap = {
+    activate: activate,
+    deactivate: deactivate,
+    pause: pause,
+    unpause: unpause,
+  };
+
+  return trap;
+
+  function activate(activateOptions) {
+    if (active) return;
+
+    var defaultedActivateOptions = {
+      onActivate: (activateOptions && activateOptions.onActivate !== undefined)
+        ? activateOptions.onActivate
+        : config.onActivate,
+    };
+
+    active = true;
+    paused = false;
+    nodeFocusedBeforeActivation = document.activeElement;
+
+    if (defaultedActivateOptions.onActivate) {
+      defaultedActivateOptions.onActivate();
+    }
+
+    addListeners();
+    return trap;
+  }
+
+  function deactivate(deactivateOptions) {
+    if (!active) return;
+
+    var defaultedDeactivateOptions = {
+      returnFocus: (deactivateOptions && deactivateOptions.returnFocus !== undefined)
+        ? deactivateOptions.returnFocus
+        : config.returnFocusOnDeactivate,
+      onDeactivate: (deactivateOptions && deactivateOptions.onDeactivate !== undefined)
+        ? deactivateOptions.onDeactivate
+        : config.onDeactivate,
+    };
+
+    removeListeners();
+
+    if (defaultedDeactivateOptions.onDeactivate) {
+      defaultedDeactivateOptions.onDeactivate();
+    }
+
+    if (defaultedDeactivateOptions.returnFocus) {
+      setTimeout(function () {
+        tryFocus(nodeFocusedBeforeActivation);
+      }, 0);
+    }
+
+    active = false;
+    paused = false;
+    return this;
+  }
+
+  function pause() {
+    if (paused || !active) return;
+    paused = true;
+    removeListeners();
+  }
+
+  function unpause() {
+    if (!paused || !active) return;
+    paused = false;
+    addListeners();
+  }
+
+  function addListeners() {
+    if (!active) return;
+
+    // There can be only one listening focus trap at a time
+    if (listeningFocusTrap) {
+      listeningFocusTrap.pause();
+    }
+    listeningFocusTrap = trap;
+
+    updateTabbableNodes();
+    tryFocus(firstFocusNode());
+    document.addEventListener('focus', checkFocus, true);
+    document.addEventListener('click', checkClick, true);
+    document.addEventListener('mousedown', checkPointerDown, true);
+    document.addEventListener('touchstart', checkPointerDown, true);
+    document.addEventListener('keydown', checkKey, true);
+
+    return trap;
+  }
+
+  function removeListeners() {
+    if (!active || listeningFocusTrap !== trap) return;
+
+    document.removeEventListener('focus', checkFocus, true);
+    document.removeEventListener('click', checkClick, true);
+    document.removeEventListener('mousedown', checkPointerDown, true);
+    document.removeEventListener('touchstart', checkPointerDown, true);
+    document.removeEventListener('keydown', checkKey, true);
+
+    listeningFocusTrap = null;
+
+    return trap;
+  }
+
+  function getNodeForOption(optionName) {
+    var optionValue = config[optionName];
+    var node = optionValue;
+    if (!optionValue) {
+      return null;
+    }
+    if (typeof optionValue === 'string') {
+      node = document.querySelector(optionValue);
+      if (!node) {
+        throw new Error('`' + optionName + '` refers to no known node');
+      }
+    }
+    if (typeof optionValue === 'function') {
+      node = optionValue();
+      if (!node) {
+        throw new Error('`' + optionName + '` did not return a node');
+      }
+    }
+    return node;
+  }
+
+  function firstFocusNode() {
+    var node;
+    if (getNodeForOption('initialFocus') !== null) {
+      node = getNodeForOption('initialFocus');
+    } else if (container.contains(document.activeElement)) {
+      node = document.activeElement;
+    } else {
+      node = tabbableNodes[0] || getNodeForOption('fallbackFocus');
+    }
+
+    if (!node) {
+      throw new Error('You can\'t have a focus-trap without at least one focusable element');
+    }
+
+    return node;
+  }
+
+  // This needs to be done on mousedown and touchstart instead of click
+  // so that it precedes the focus event
+  function checkPointerDown(e) {
+    if (config.clickOutsideDeactivates && !container.contains(e.target)) {
+      deactivate({ returnFocus: false });
+    }
+  }
+
+  function checkClick(e) {
+    if (config.clickOutsideDeactivates) return;
+    if (container.contains(e.target)) return;
+    e.preventDefault();
+    e.stopImmediatePropagation();
+  }
+
+  function checkFocus(e) {
+    if (container.contains(e.target)) return;
+    e.preventDefault();
+    e.stopImmediatePropagation();
+    // Checking for a blur method here resolves a Firefox issue (#15)
+    if (typeof e.target.blur === 'function') e.target.blur();
+  }
+
+  function checkKey(e) {
+    if (e.key === 'Tab' || e.keyCode === 9) {
+      handleTab(e);
+    }
+
+    if (config.escapeDeactivates !== false && isEscapeEvent(e)) {
+      deactivate();
+    }
+  }
+
+  function handleTab(e) {
+    e.preventDefault();
+    updateTabbableNodes();
+    var currentFocusIndex = tabbableNodes.indexOf(e.target);
+    var lastTabbableNode = tabbableNodes[tabbableNodes.length - 1];
+    var firstTabbableNode = tabbableNodes[0];
+
+    if (e.shiftKey) {
+      if (e.target === firstTabbableNode || tabbableNodes.indexOf(e.target) === -1) {
+        return tryFocus(lastTabbableNode);
+      }
+      return tryFocus(tabbableNodes[currentFocusIndex - 1]);
+    }
+
+    if (e.target === lastTabbableNode) return tryFocus(firstTabbableNode);
+
+    tryFocus(tabbableNodes[currentFocusIndex + 1]);
+  }
+
+  function updateTabbableNodes() {
+    tabbableNodes = tabbable(container);
+  }
+}
+
+function isEscapeEvent(e) {
+  return e.key === 'Escape' || e.key === 'Esc' || e.keyCode === 27;
+}
+
+function tryFocus(node) {
+  if (!node || !node.focus) return;
+  node.focus();
+  if (node.tagName.toLowerCase() === 'input') {
+    node.select();
+  }
+}
+
+module.exports = focusTrap;
+
+
+/***/ }),
+
+/***/ 8:
+/***/ (function(module, __webpack_exports__, __webpack_require__) {
+
+"use strict";
+/* harmony import */ var __WEBPACK_IMPORTED_MODULE_0__material_base_foundation__ = __webpack_require__(0);
+/* harmony import */ var __WEBPACK_IMPORTED_MODULE_1__adapter__ = __webpack_require__(4);
+/* harmony import */ var __WEBPACK_IMPORTED_MODULE_2__constants__ = __webpack_require__(7);
+/* harmony import */ var __WEBPACK_IMPORTED_MODULE_3__util__ = __webpack_require__(5);
+var _extends = Object.assign || function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; };
+
+var _createClass = function () { function defineProperties(target, props) { for (var i = 0; i < props.length; i++) { var descriptor = props[i]; descriptor.enumerable = descriptor.enumerable || false; descriptor.configurable = true; if ("value" in descriptor) descriptor.writable = true; Object.defineProperty(target, descriptor.key, descriptor); } } return function (Constructor, protoProps, staticProps) { if (protoProps) defineProperties(Constructor.prototype, protoProps); if (staticProps) defineProperties(Constructor, staticProps); return Constructor; }; }();
+
+function _classCallCheck(instance, Constructor) { if (!(instance instanceof Constructor)) { throw new TypeError("Cannot call a class as a function"); } }
+
+function _possibleConstructorReturn(self, call) { if (!self) { throw new ReferenceError("this hasn't been initialised - super() hasn't been called"); } return call && (typeof call === "object" || typeof call === "function") ? call : self; }
+
+function _inherits(subClass, superClass) { if (typeof superClass !== "function" && superClass !== null) { throw new TypeError("Super expression must either be null or a function, not " + typeof superClass); } subClass.prototype = Object.create(superClass && superClass.prototype, { constructor: { value: subClass, enumerable: false, writable: true, configurable: true } }); if (superClass) Object.setPrototypeOf ? Object.setPrototypeOf(subClass, superClass) : subClass.__proto__ = superClass; }
+
+/**
+ * Copyright 2016 Google Inc. All Rights Reserved.
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *      http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+
+
+
+
+
+
+/**
+ * @typedef {!{
+ *   isActivated: (boolean|undefined),
+ *   hasDeactivationUXRun: (boolean|undefined),
+ *   wasActivatedByPointer: (boolean|undefined),
+ *   wasElementMadeActive: (boolean|undefined),
+ *   activationStartTime: (number|undefined),
+ *   activationEvent: Event,
+ *   isProgrammatic: (boolean|undefined)
+ * }}
+ */
+var ActivationStateType = void 0;
+
+/**
+ * @typedef {!{
+ *   activate: (string|undefined),
+ *   deactivate: (string|undefined),
+ *   focus: (string|undefined),
+ *   blur: (string|undefined)
+ * }}
+ */
+var ListenerInfoType = void 0;
+
+/**
+ * @typedef {!{
+ *   activate: function(!Event),
+ *   deactivate: function(!Event),
+ *   focus: function(),
+ *   blur: function()
+ * }}
+ */
+var ListenersType = void 0;
+
+/**
+ * @typedef {!{
+ *   x: number,
+ *   y: number
+ * }}
+ */
+var PointType = void 0;
+
+/**
+ * @enum {string}
+ */
+var DEACTIVATION_ACTIVATION_PAIRS = {
+  mouseup: 'mousedown',
+  pointerup: 'pointerdown',
+  touchend: 'touchstart',
+  keyup: 'keydown',
+  blur: 'focus'
+};
+
+/**
+ * @extends {MDCFoundation<!MDCRippleAdapter>}
+ */
+
+var MDCRippleFoundation = function (_MDCFoundation) {
+  _inherits(MDCRippleFoundation, _MDCFoundation);
+
+  _createClass(MDCRippleFoundation, [{
+    key: 'isSupported_',
+
+
+    /**
+     * We compute this property so that we are not querying information about the client
+     * until the point in time where the foundation requests it. This prevents scenarios where
+     * client-side feature-detection may happen too early, such as when components are rendered on the server
+     * and then initialized at mount time on the client.
+     * @return {boolean}
+     */
+    get: function get() {
+      return this.adapter_.browserSupportsCssVars();
+    }
+  }], [{
+    key: 'cssClasses',
+    get: function get() {
+      return __WEBPACK_IMPORTED_MODULE_2__constants__["a" /* cssClasses */];
+    }
+  }, {
+    key: 'strings',
+    get: function get() {
+      return __WEBPACK_IMPORTED_MODULE_2__constants__["b" /* strings */];
+    }
+  }, {
+    key: 'numbers',
+    get: function get() {
+      return __WEBPACK_IMPORTED_MODULE_2__constants__["c" /* numbers */];
+    }
+  }, {
+    key: 'defaultAdapter',
+    get: function get() {
+      return {
+        browserSupportsCssVars: function browserSupportsCssVars() /* boolean - cached */{},
+        isUnbounded: function isUnbounded() /* boolean */{},
+        isSurfaceActive: function isSurfaceActive() /* boolean */{},
+        isSurfaceDisabled: function isSurfaceDisabled() /* boolean */{},
+        addClass: function addClass() /* className: string */{},
+        removeClass: function removeClass() /* className: string */{},
+        registerInteractionHandler: function registerInteractionHandler() /* evtType: string, handler: EventListener */{},
+        deregisterInteractionHandler: function deregisterInteractionHandler() /* evtType: string, handler: EventListener */{},
+        registerResizeHandler: function registerResizeHandler() /* handler: EventListener */{},
+        deregisterResizeHandler: function deregisterResizeHandler() /* handler: EventListener */{},
+        updateCssVariable: function updateCssVariable() /* varName: string, value: string */{},
+        computeBoundingRect: function computeBoundingRect() /* ClientRect */{},
+        getWindowPageOffset: function getWindowPageOffset() /* {x: number, y: number} */{}
+      };
+    }
+  }]);
+
+  function MDCRippleFoundation(adapter) {
+    _classCallCheck(this, MDCRippleFoundation);
+
+    /** @private {number} */
+    var _this = _possibleConstructorReturn(this, (MDCRippleFoundation.__proto__ || Object.getPrototypeOf(MDCRippleFoundation)).call(this, _extends(MDCRippleFoundation.defaultAdapter, adapter)));
+
+    _this.layoutFrame_ = 0;
+
+    /** @private {!ClientRect} */
+    _this.frame_ = /** @type {!ClientRect} */{ width: 0, height: 0 };
+
+    /** @private {!ActivationStateType} */
+    _this.activationState_ = _this.defaultActivationState_();
+
+    /** @private {number} */
+    _this.xfDuration_ = 0;
+
+    /** @private {number} */
+    _this.initialSize_ = 0;
+
+    /** @private {number} */
+    _this.maxRadius_ = 0;
+
+    /** @private {!Array<{ListenerInfoType}>} */
+    _this.listenerInfos_ = [{ activate: 'touchstart', deactivate: 'touchend' }, { activate: 'pointerdown', deactivate: 'pointerup' }, { activate: 'mousedown', deactivate: 'mouseup' }, { activate: 'keydown', deactivate: 'keyup' }, { focus: 'focus', blur: 'blur' }];
+
+    /** @private {!ListenersType} */
+    _this.listeners_ = {
+      activate: function activate(e) {
+        return _this.activate_(e);
+      },
+      deactivate: function deactivate(e) {
+        return _this.deactivate_(e);
+      },
+      focus: function focus() {
+        return requestAnimationFrame(function () {
+          return _this.adapter_.addClass(MDCRippleFoundation.cssClasses.BG_FOCUSED);
+        });
+      },
+      blur: function blur() {
+        return requestAnimationFrame(function () {
+          return _this.adapter_.removeClass(MDCRippleFoundation.cssClasses.BG_FOCUSED);
+        });
+      }
+    };
+
+    /** @private {!Function} */
+    _this.resizeHandler_ = function () {
+      return _this.layout();
+    };
+
+    /** @private {!{left: number, top:number}} */
+    _this.unboundedCoords_ = {
+      left: 0,
+      top: 0
+    };
+
+    /** @private {number} */
+    _this.fgScale_ = 0;
+
+    /** @private {number} */
+    _this.activationTimer_ = 0;
+
+    /** @private {number} */
+    _this.fgDeactivationRemovalTimer_ = 0;
+
+    /** @private {boolean} */
+    _this.activationAnimationHasEnded_ = false;
+
+    /** @private {!Function} */
+    _this.activationTimerCallback_ = function () {
+      _this.activationAnimationHasEnded_ = true;
+      _this.runDeactivationUXLogicIfReady_();
+    };
+    return _this;
+  }
+
+  /**
+   * @return {!ActivationStateType}
+   */
+
+
+  _createClass(MDCRippleFoundation, [{
+    key: 'defaultActivationState_',
+    value: function defaultActivationState_() {
+      return {
+        isActivated: false,
+        hasDeactivationUXRun: false,
+        wasActivatedByPointer: false,
+        wasElementMadeActive: false,
+        activationStartTime: 0,
+        activationEvent: null,
+        isProgrammatic: false
+      };
+    }
+  }, {
+    key: 'init',
+    value: function init() {
+      var _this2 = this;
+
+      if (!this.isSupported_) {
+        return;
+      }
+      this.addEventListeners_();
+
+      var _MDCRippleFoundation$ = MDCRippleFoundation.cssClasses,
+          ROOT = _MDCRippleFoundation$.ROOT,
+          UNBOUNDED = _MDCRippleFoundation$.UNBOUNDED;
+
+      requestAnimationFrame(function () {
+        _this2.adapter_.addClass(ROOT);
+        if (_this2.adapter_.isUnbounded()) {
+          _this2.adapter_.addClass(UNBOUNDED);
+        }
+        _this2.layoutInternal_();
+      });
+    }
+
+    /** @private */
+
+  }, {
+    key: 'addEventListeners_',
+    value: function addEventListeners_() {
+      var _this3 = this;
+
+      this.listenerInfos_.forEach(function (info) {
+        Object.keys(info).forEach(function (k) {
+          _this3.adapter_.registerInteractionHandler(info[k], _this3.listeners_[k]);
+        });
+      });
+      this.adapter_.registerResizeHandler(this.resizeHandler_);
+    }
+
+    /**
+     * @param {Event} e
+     * @private
+     */
+
+  }, {
+    key: 'activate_',
+    value: function activate_(e) {
+      var _this4 = this;
+
+      if (this.adapter_.isSurfaceDisabled()) {
+        return;
+      }
+
+      var activationState = this.activationState_;
+
+      if (activationState.isActivated) {
+        return;
+      }
+
+      activationState.isActivated = true;
+      activationState.isProgrammatic = e === null;
+      activationState.activationEvent = e;
+      activationState.wasActivatedByPointer = activationState.isProgrammatic ? false : e.type === 'mousedown' || e.type === 'touchstart' || e.type === 'pointerdown';
+      activationState.activationStartTime = Date.now();
+
+      requestAnimationFrame(function () {
+        // This needs to be wrapped in an rAF call b/c web browsers
+        // report active states inconsistently when they're called within
+        // event handling code:
+        // - https://bugs.chromium.org/p/chromium/issues/detail?id=635971
+        // - https://bugzilla.mozilla.org/show_bug.cgi?id=1293741
+        activationState.wasElementMadeActive = e && e.type === 'keydown' ? _this4.adapter_.isSurfaceActive() : true;
+        if (activationState.wasElementMadeActive) {
+          _this4.animateActivation_();
+        } else {
+          // Reset activation state immediately if element was not made active.
+          _this4.activationState_ = _this4.defaultActivationState_();
+        }
+      });
+    }
+  }, {
+    key: 'activate',
+    value: function activate() {
+      this.activate_(null);
+    }
+
+    /** @private */
+
+  }, {
+    key: 'animateActivation_',
+    value: function animateActivation_() {
+      var _this5 = this;
+
+      var _MDCRippleFoundation$2 = MDCRippleFoundation.strings,
+          VAR_FG_TRANSLATE_START = _MDCRippleFoundation$2.VAR_FG_TRANSLATE_START,
+          VAR_FG_TRANSLATE_END = _MDCRippleFoundation$2.VAR_FG_TRANSLATE_END;
+      var _MDCRippleFoundation$3 = MDCRippleFoundation.cssClasses,
+          BG_ACTIVE_FILL = _MDCRippleFoundation$3.BG_ACTIVE_FILL,
+          FG_DEACTIVATION = _MDCRippleFoundation$3.FG_DEACTIVATION,
+          FG_ACTIVATION = _MDCRippleFoundation$3.FG_ACTIVATION;
+      var DEACTIVATION_TIMEOUT_MS = MDCRippleFoundation.numbers.DEACTIVATION_TIMEOUT_MS;
+
+
+      var translateStart = '';
+      var translateEnd = '';
+
+      if (!this.adapter_.isUnbounded()) {
+        var _getFgTranslationCoor = this.getFgTranslationCoordinates_(),
+            startPoint = _getFgTranslationCoor.startPoint,
+            endPoint = _getFgTranslationCoor.endPoint;
+
+        translateStart = startPoint.x + 'px, ' + startPoint.y + 'px';
+        translateEnd = endPoint.x + 'px, ' + endPoint.y + 'px';
+      }
+
+      this.adapter_.updateCssVariable(VAR_FG_TRANSLATE_START, translateStart);
+      this.adapter_.updateCssVariable(VAR_FG_TRANSLATE_END, translateEnd);
+      // Cancel any ongoing activation/deactivation animations
+      clearTimeout(this.activationTimer_);
+      clearTimeout(this.fgDeactivationRemovalTimer_);
+      this.rmBoundedActivationClasses_();
+      this.adapter_.removeClass(FG_DEACTIVATION);
+
+      // Force layout in order to re-trigger the animation.
+      this.adapter_.computeBoundingRect();
+      this.adapter_.addClass(BG_ACTIVE_FILL);
+      this.adapter_.addClass(FG_ACTIVATION);
+      this.activationTimer_ = setTimeout(function () {
+        return _this5.activationTimerCallback_();
+      }, DEACTIVATION_TIMEOUT_MS);
+    }
+
+    /**
+     * @private
+     * @return {{startPoint: PointType, endPoint: PointType}}
+     */
+
+  }, {
+    key: 'getFgTranslationCoordinates_',
+    value: function getFgTranslationCoordinates_() {
+      var activationState = this.activationState_;
+      var activationEvent = activationState.activationEvent,
+          wasActivatedByPointer = activationState.wasActivatedByPointer;
+
+
+      var startPoint = void 0;
+      if (wasActivatedByPointer) {
+        startPoint = __webpack_require__.i(__WEBPACK_IMPORTED_MODULE_3__util__["getNormalizedEventCoords"])(
+        /** @type {!Event} */activationEvent, this.adapter_.getWindowPageOffset(), this.adapter_.computeBoundingRect());
+      } else {
+        startPoint = {
+          x: this.frame_.width / 2,
+          y: this.frame_.height / 2
+        };
+      }
+      // Center the element around the start point.
+      startPoint = {
+        x: startPoint.x - this.initialSize_ / 2,
+        y: startPoint.y - this.initialSize_ / 2
+      };
+
+      var endPoint = {
+        x: this.frame_.width / 2 - this.initialSize_ / 2,
+        y: this.frame_.height / 2 - this.initialSize_ / 2
+      };
+
+      return { startPoint: startPoint, endPoint: endPoint };
+    }
+
+    /** @private */
+
+  }, {
+    key: 'runDeactivationUXLogicIfReady_',
+    value: function runDeactivationUXLogicIfReady_() {
+      var _this6 = this;
+
+      var FG_DEACTIVATION = MDCRippleFoundation.cssClasses.FG_DEACTIVATION;
+      var _activationState_ = this.activationState_,
+          hasDeactivationUXRun = _activationState_.hasDeactivationUXRun,
+          isActivated = _activationState_.isActivated;
+
+      var activationHasEnded = hasDeactivationUXRun || !isActivated;
+      if (activationHasEnded && this.activationAnimationHasEnded_) {
+        this.rmBoundedActivationClasses_();
+        this.adapter_.addClass(FG_DEACTIVATION);
+        this.fgDeactivationRemovalTimer_ = setTimeout(function () {
+          _this6.adapter_.removeClass(FG_DEACTIVATION);
+        }, __WEBPACK_IMPORTED_MODULE_2__constants__["c" /* numbers */].FG_DEACTIVATION_MS);
+      }
+    }
+
+    /** @private */
+
+  }, {
+    key: 'rmBoundedActivationClasses_',
+    value: function rmBoundedActivationClasses_() {
+      var _MDCRippleFoundation$4 = MDCRippleFoundation.cssClasses,
+          BG_ACTIVE_FILL = _MDCRippleFoundation$4.BG_ACTIVE_FILL,
+          FG_ACTIVATION = _MDCRippleFoundation$4.FG_ACTIVATION;
+
+      this.adapter_.removeClass(BG_ACTIVE_FILL);
+      this.adapter_.removeClass(FG_ACTIVATION);
+      this.activationAnimationHasEnded_ = false;
+      this.adapter_.computeBoundingRect();
+    }
+
+    /**
+     * @param {Event} e
+     * @private
+     */
+
+  }, {
+    key: 'deactivate_',
+    value: function deactivate_(e) {
+      var _this7 = this;
+
+      var activationState = this.activationState_;
+      // This can happen in scenarios such as when you have a keyup event that blurs the element.
+
+      if (!activationState.isActivated) {
+        return;
+      }
+      // Programmatic deactivation.
+      if (activationState.isProgrammatic) {
+        var evtObject = null;
+        var _state = /** @type {!ActivationStateType} */_extends({}, activationState);
+        requestAnimationFrame(function () {
+          return _this7.animateDeactivation_(evtObject, _state);
+        });
+        this.activationState_ = this.defaultActivationState_();
+        return;
+      }
+
+      var actualActivationType = DEACTIVATION_ACTIVATION_PAIRS[e.type];
+      var expectedActivationType = activationState.activationEvent.type;
+      // NOTE: Pointer events are tricky - https://patrickhlauke.github.io/touch/tests/results/
+      // Essentially, what we need to do here is decouple the deactivation UX from the actual
+      // deactivation state itself. This way, touch/pointer events in sequence do not trample one
+      // another.
+      var needsDeactivationUX = actualActivationType === expectedActivationType;
+      var needsActualDeactivation = needsDeactivationUX;
+      if (activationState.wasActivatedByPointer) {
+        needsActualDeactivation = e.type === 'mouseup';
+      }
+
+      var state = /** @type {!ActivationStateType} */_extends({}, activationState);
+      requestAnimationFrame(function () {
+        if (needsDeactivationUX) {
+          _this7.activationState_.hasDeactivationUXRun = true;
+          _this7.animateDeactivation_(e, state);
+        }
+
+        if (needsActualDeactivation) {
+          _this7.activationState_ = _this7.defaultActivationState_();
+        }
+      });
+    }
+  }, {
+    key: 'deactivate',
+    value: function deactivate() {
+      this.deactivate_(null);
+    }
+
+    /**
+     * @param {Event} e
+     * @param {!ActivationStateType} options
+     * @private
+     */
+
+  }, {
+    key: 'animateDeactivation_',
+    value: function animateDeactivation_(e, _ref) {
+      var wasActivatedByPointer = _ref.wasActivatedByPointer,
+          wasElementMadeActive = _ref.wasElementMadeActive;
+      var BG_FOCUSED = MDCRippleFoundation.cssClasses.BG_FOCUSED;
+
+      if (wasActivatedByPointer || wasElementMadeActive) {
+        // Remove class left over by element being focused
+        this.adapter_.removeClass(BG_FOCUSED);
+        this.runDeactivationUXLogicIfReady_();
+      }
+    }
+  }, {
+    key: 'destroy',
+    value: function destroy() {
+      var _this8 = this;
+
+      if (!this.isSupported_) {
+        return;
+      }
+      this.removeEventListeners_();
+
+      var _MDCRippleFoundation$5 = MDCRippleFoundation.cssClasses,
+          ROOT = _MDCRippleFoundation$5.ROOT,
+          UNBOUNDED = _MDCRippleFoundation$5.UNBOUNDED;
+
+      requestAnimationFrame(function () {
+        _this8.adapter_.removeClass(ROOT);
+        _this8.adapter_.removeClass(UNBOUNDED);
+        _this8.removeCssVars_();
+      });
+    }
+
+    /** @private */
+
+  }, {
+    key: 'removeEventListeners_',
+    value: function removeEventListeners_() {
+      var _this9 = this;
+
+      this.listenerInfos_.forEach(function (info) {
+        Object.keys(info).forEach(function (k) {
+          _this9.adapter_.deregisterInteractionHandler(info[k], _this9.listeners_[k]);
+        });
+      });
+      this.adapter_.deregisterResizeHandler(this.resizeHandler_);
+    }
+
+    /** @private */
+
+  }, {
+    key: 'removeCssVars_',
+    value: function removeCssVars_() {
+      var _this10 = this;
+
+      var strings = MDCRippleFoundation.strings;
+
+      Object.keys(strings).forEach(function (k) {
+        if (k.indexOf('VAR_') === 0) {
+          _this10.adapter_.updateCssVariable(strings[k], null);
+        }
+      });
+    }
+  }, {
+    key: 'layout',
+    value: function layout() {
+      var _this11 = this;
+
+      if (this.layoutFrame_) {
+        cancelAnimationFrame(this.layoutFrame_);
+      }
+      this.layoutFrame_ = requestAnimationFrame(function () {
+        _this11.layoutInternal_();
+        _this11.layoutFrame_ = 0;
+      });
+    }
+
+    /** @private */
+
+  }, {
+    key: 'layoutInternal_',
+    value: function layoutInternal_() {
+      this.frame_ = this.adapter_.computeBoundingRect();
+
+      var maxDim = Math.max(this.frame_.height, this.frame_.width);
+      var surfaceDiameter = Math.sqrt(Math.pow(this.frame_.width, 2) + Math.pow(this.frame_.height, 2));
+
+      // 60% of the largest dimension of the surface
+      this.initialSize_ = maxDim * MDCRippleFoundation.numbers.INITIAL_ORIGIN_SCALE;
+
+      // Diameter of the surface + 10px
+      this.maxRadius_ = surfaceDiameter + MDCRippleFoundation.numbers.PADDING;
+      this.fgScale_ = this.maxRadius_ / this.initialSize_;
+      this.xfDuration_ = 1000 * Math.sqrt(this.maxRadius_ / 1024);
+      this.updateLayoutCssVars_();
+    }
+
+    /** @private */
+
+  }, {
+    key: 'updateLayoutCssVars_',
+    value: function updateLayoutCssVars_() {
+      var _MDCRippleFoundation$6 = MDCRippleFoundation.strings,
+          VAR_SURFACE_WIDTH = _MDCRippleFoundation$6.VAR_SURFACE_WIDTH,
+          VAR_SURFACE_HEIGHT = _MDCRippleFoundation$6.VAR_SURFACE_HEIGHT,
+          VAR_FG_SIZE = _MDCRippleFoundation$6.VAR_FG_SIZE,
+          VAR_LEFT = _MDCRippleFoundation$6.VAR_LEFT,
+          VAR_TOP = _MDCRippleFoundation$6.VAR_TOP,
+          VAR_FG_SCALE = _MDCRippleFoundation$6.VAR_FG_SCALE;
+
+
+      this.adapter_.updateCssVariable(VAR_SURFACE_WIDTH, this.frame_.width + 'px');
+      this.adapter_.updateCssVariable(VAR_SURFACE_HEIGHT, this.frame_.height + 'px');
+      this.adapter_.updateCssVariable(VAR_FG_SIZE, this.initialSize_ + 'px');
+      this.adapter_.updateCssVariable(VAR_FG_SCALE, this.fgScale_);
+
+      if (this.adapter_.isUnbounded()) {
+        this.unboundedCoords_ = {
+          left: Math.round(this.frame_.width / 2 - this.initialSize_ / 2),
+          top: Math.round(this.frame_.height / 2 - this.initialSize_ / 2)
+        };
+
+        this.adapter_.updateCssVariable(VAR_LEFT, this.unboundedCoords_.left + 'px');
+        this.adapter_.updateCssVariable(VAR_TOP, this.unboundedCoords_.top + 'px');
+      }
+    }
+  }]);
+
+  return MDCRippleFoundation;
+}(__WEBPACK_IMPORTED_MODULE_0__material_base_foundation__["a" /* default */]);
+
+/* harmony default export */ __webpack_exports__["a"] = (MDCRippleFoundation);
+
+/***/ }),
+
+/***/ 80:
+/***/ (function(module, exports) {
+
+module.exports = function(el) {
+  var basicTabbables = [];
+  var orderedTabbables = [];
+
+  // A node is "available" if
+  // - it's computed style
+  var isUnavailable = createIsUnavailable();
+
+  var candidateSelectors = [
+    'input',
+    'select',
+    'a[href]',
+    'textarea',
+    'button',
+    '[tabindex]',
+  ];
+
+  var candidates = el.querySelectorAll(candidateSelectors);
+
+  var candidate, candidateIndex;
+  for (var i = 0, l = candidates.length; i < l; i++) {
+    candidate = candidates[i];
+    candidateIndex = parseInt(candidate.getAttribute('tabindex'), 10) || candidate.tabIndex;
+
+    if (
+      candidateIndex < 0
+      || (candidate.tagName === 'INPUT' && candidate.type === 'hidden')
+      || candidate.disabled
+      || isUnavailable(candidate)
+    ) {
+      continue;
+    }
+
+    if (candidateIndex === 0) {
+      basicTabbables.push(candidate);
+    } else {
+      orderedTabbables.push({
+        tabIndex: candidateIndex,
+        node: candidate,
+      });
+    }
+  }
+
+  var tabbableNodes = orderedTabbables
+    .sort(function(a, b) {
+      return a.tabIndex - b.tabIndex;
+    })
+    .map(function(a) {
+      return a.node
+    });
+
+  Array.prototype.push.apply(tabbableNodes, basicTabbables);
+
+  return tabbableNodes;
+}
+
+function createIsUnavailable() {
+  // Node cache must be refreshed on every check, in case
+  // the content of the element has changed
+  var isOffCache = [];
+
+  // "off" means `display: none;`, as opposed to "hidden",
+  // which means `visibility: hidden;`. getComputedStyle
+  // accurately reflects visiblity in context but not
+  // "off" state, so we need to recursively check parents.
+
+  function isOff(node, nodeComputedStyle) {
+    if (node === document.documentElement) return false;
+
+    // Find the cached node (Array.prototype.find not available in IE9)
+    for (var i = 0, length = isOffCache.length; i < length; i++) {
+      if (isOffCache[i][0] === node) return isOffCache[i][1];
+    }
+
+    nodeComputedStyle = nodeComputedStyle || window.getComputedStyle(node);
+
+    var result = false;
+
+    if (nodeComputedStyle.display === 'none') {
+      result = true;
+    } else if (node.parentNode) {
+      result = isOff(node.parentNode);
+    }
+
+    isOffCache.push([node, result]);
+
+    return result;
+  }
+
+  return function isUnavailable(node) {
+    if (node === document.documentElement) return false;
+
+    var computedStyle = window.getComputedStyle(node);
+
+    if (isOff(node, computedStyle)) return true;
+
+    return computedStyle.visibility === 'hidden';
+  }
+}
+
+
+/***/ }),
+
+/***/ 85:
+/***/ (function(module, exports, __webpack_require__) {
+
+module.exports = __webpack_require__(25);
+
+
+/***/ })
+
+/******/ });
+});

+ 1888 - 0
support/client/lib/vwf/view/lib/mdc/dist/mdc.drawer.css

@@ -0,0 +1,1888 @@
+/*!
+ Material Components for the web
+ Copyright (c) 2017 Google Inc.
+ License: Apache-2.0
+*/
+/**
+ * Creates a rule that will be applied when an MDC-Web component is within the context of an RTL layout.
+ *
+ * Usage Example:
+ * ```scss
+ * .mdc-foo {
+ *   position: absolute;
+ *   left: 0;
+ *
+ *   @include mdc-rtl {
+ *     left: auto;
+ *     right: 0;
+ *   }
+ *
+ *   &__bar {
+ *     margin-left: 4px;
+ *     @include mdc-rtl(".mdc-foo") {
+ *       margin-left: auto;
+ *       margin-right: 4px;
+ *     }
+ *   }
+ * }
+ *
+ * .mdc-foo--mod {
+ *   padding-left: 4px;
+ *
+ *   @include mdc-rtl {
+ *     padding-left: auto;
+ *     padding-right: 4px;
+ *   }
+ * }
+ * ```
+ *
+ * Note that this works by checking for [dir="rtl"] on an ancestor element. While this will work
+ * in most cases, it will in some cases lead to false negatives, e.g.
+ *
+ * ```html
+ * <html dir="rtl">
+ *   <!-- ... -->
+ *   <div dir="ltr">
+ *     <div class="mdc-foo">Styled incorrectly as RTL!</div>
+ *   </div>
+ * </html>
+ * ```
+ *
+ * In the future, selectors such as :dir (http://mdn.io/:dir) will help us mitigate this.
+ */
+/**
+ * Takes a base box-model property - e.g. margin / border / padding - along with a default
+ * direction and value, and emits rules which apply the value to the
+ * "<base-property>-<default-direction>" property by default, but flips the direction
+ * when within an RTL context.
+ *
+ * For example:
+ *
+ * ```scss
+ * .mdc-foo {
+ *   @include mdc-rtl-reflexive-box(margin, left, 8px);
+ * }
+ * ```
+ * is equivalent to:
+ *
+ * ```scss
+ * .mdc-foo {
+ *   margin-left: 8px;
+ *
+ *   @include mdc-rtl {
+ *     margin-right: 8px;
+ *     margin-left: 0;
+ *   }
+ * }
+ * ```
+ * whereas:
+ *
+ * ```scss
+ * .mdc-foo {
+ *   @include mdc-rtl-reflexive-box(margin, right, 8px);
+ * }
+ * ```
+ * is equivalent to:
+ *
+ * ```scss
+ * .mdc-foo {
+ *   margin-right: 8px;
+ *
+ *   @include mdc-rtl {
+ *     margin-right: 0;
+ *     margin-left: 8px;
+ *   }
+ * }
+ * ```
+ *
+ * You can also pass a 4th optional $root-selector argument which will be forwarded to `mdc-rtl`,
+ * e.g. `@include mdc-rtl-reflexive-box(margin, left, 8px, ".mdc-component")`.
+ *
+ * Note that this function will always zero out the original value in an RTL context. If you're
+ * trying to flip the values, use mdc-rtl-reflexive-property().
+ */
+/**
+ * Takes a base property and emits rules that assign <base-property>-left to <left-value> and
+ * <base-property>-right to <right-value> in a LTR context, and vice versa in a RTL context.
+ * For example:
+ *
+ * ```scss
+ * .mdc-foo {
+ *   @include mdc-rtl-reflexive-property(margin, auto, 12px);
+ * }
+ * ```
+ * is equivalent to:
+ *
+ * ```scss
+ * .mdc-foo {
+ *   margin-left: auto;
+ *   margin-right: 12px;
+ *
+ *   @include mdc-rtl {
+ *     margin-left: 12px;
+ *     margin-right: auto;
+ *   }
+ * }
+ * ```
+ *
+ * A 4th optional $root-selector argument can be given, which will be passed to `mdc-rtl`.
+ */
+/**
+ * Takes an argument specifying a horizontal position property (either "left" or "right") as well
+ * as a value, and applies that value to the specified position in a LTR context, and flips it in a
+ * RTL context. For example:
+ *
+ * ```scss
+ * .mdc-foo {
+ *   @include mdc-rtl-reflexive-position(left, 0);
+ *   position: absolute;
+ * }
+ * ```
+ * is equivalent to:
+ *
+ * ```scss
+ *  .mdc-foo {
+ *    position: absolute;
+ *    left: 0;
+ *    right: initial;
+ *
+ *    @include mdc-rtl {
+ *      right: 0;
+ *      left: initial;
+ *    }
+ *  }
+ * ```
+ * An optional third $root-selector argument may also be given, which is passed to `mdc-rtl`.
+ */
+/*
+  Precomputed linear color channel values, for use in contrast calculations.
+  See https://www.w3.org/TR/WCAG20-TECHS/G17.html#G17-tests
+
+  Algorithm, for c in 0 to 255:
+  f(c) {
+    c = c / 255;
+    return c < 0.03928 ? c / 12.92 : Math.pow((c + 0.055) / 1.055, 2.4);
+  }
+
+  This lookup table is needed since there is no `pow` in SASS.
+*/
+/**
+ * Calculate the luminance for a color.
+ * See https://www.w3.org/TR/WCAG20-TECHS/G17.html#G17-tests
+ */
+/**
+ * Calculate the contrast ratio between two colors.
+ * See https://www.w3.org/TR/WCAG20-TECHS/G17.html#G17-tests
+ */
+/**
+ * Determine whether to use dark or light text on top of given color.
+ * Returns "dark" for dark text and "light" for light text.
+ */
+/*
+  Main theme colors.
+  If you're a user customizing your color scheme in SASS, these are probably the only variables you need to change.
+*/
+/* Indigo 500 */
+/* Pink A200 */
+/* White */
+/* Which set of text colors to use for each main theme color (light or dark) */
+/* Text colors according to light vs dark and text type */
+/* Primary text colors for each of the theme colors */
+/**
+ * Applies the correct theme color style to the specified property.
+ * $property is typically color or background-color, but can be any CSS property that accepts color values.
+ * $style should be one of the map keys in $mdc-theme-property-values (_variables.scss).
+ */
+/**
+ * Creates a rule to be used in MDC-Web components for dark theming, and applies the provided contents.
+ * Should provide the $root-selector option if applied to anything other than the root selector.
+ * When used with a modifier class, provide a second argument of `true` for the $compound parameter
+ * to specify that this should be attached as a compound class.
+ *
+ * Usage example:
+ *
+ * ```scss
+ * .mdc-foo {
+ *   color: black;
+ *
+ *   @include mdc-theme-dark {
+ *     color: white;
+ *   }
+ *
+ *   &__bar {
+ *     background: black;
+ *
+ *     @include mdc-theme-dark(".mdc-foo") {
+ *       background: white;
+ *     }
+ *   }
+ * }
+ *
+ * .mdc-foo--disabled {
+ *   opacity: .38;
+ *
+ *   @include mdc-theme-dark(".mdc-foo", true) {
+ *     opacity: .5;
+ *   }
+ * }
+ * ```
+ */
+/*
+  Precomputed linear color channel values, for use in contrast calculations.
+  See https://www.w3.org/TR/WCAG20-TECHS/G17.html#G17-tests
+
+  Algorithm, for c in 0 to 255:
+  f(c) {
+    c = c / 255;
+    return c < 0.03928 ? c / 12.92 : Math.pow((c + 0.055) / 1.055, 2.4);
+  }
+
+  This lookup table is needed since there is no `pow` in SASS.
+*/
+/**
+ * Calculate the luminance for a color.
+ * See https://www.w3.org/TR/WCAG20-TECHS/G17.html#G17-tests
+ */
+/**
+ * Calculate the contrast ratio between two colors.
+ * See https://www.w3.org/TR/WCAG20-TECHS/G17.html#G17-tests
+ */
+/**
+ * Determine whether to use dark or light text on top of given color.
+ * Returns "dark" for dark text and "light" for light text.
+ */
+/*
+  Main theme colors.
+  If you're a user customizing your color scheme in SASS, these are probably the only variables you need to change.
+*/
+/* Indigo 500 */
+/* Pink A200 */
+/* White */
+/* Which set of text colors to use for each main theme color (light or dark) */
+/* Text colors according to light vs dark and text type */
+/* Primary text colors for each of the theme colors */
+/**
+ * Applies the correct theme color style to the specified property.
+ * $property is typically color or background-color, but can be any CSS property that accepts color values.
+ * $style should be one of the map keys in $mdc-theme-property-values (_variables.scss).
+ */
+/**
+ * Creates a rule to be used in MDC-Web components for dark theming, and applies the provided contents.
+ * Should provide the $root-selector option if applied to anything other than the root selector.
+ * When used with a modifier class, provide a second argument of `true` for the $compound parameter
+ * to specify that this should be attached as a compound class.
+ *
+ * Usage example:
+ *
+ * ```scss
+ * .mdc-foo {
+ *   color: black;
+ *
+ *   @include mdc-theme-dark {
+ *     color: white;
+ *   }
+ *
+ *   &__bar {
+ *     background: black;
+ *
+ *     @include mdc-theme-dark(".mdc-foo") {
+ *       background: white;
+ *     }
+ *   }
+ * }
+ *
+ * .mdc-foo--disabled {
+ *   opacity: .38;
+ *
+ *   @include mdc-theme-dark(".mdc-foo", true) {
+ *     opacity: .5;
+ *   }
+ * }
+ * ```
+ */
+/* TODO(sgomes): Figure out what to do about desktop font sizes. */
+/* TODO(sgomes): Figure out what to do about i18n and i18n font sizes. */
+/**
+ * Copyright 2016 Google Inc. All Rights Reserved.
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *      http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+/**
+ * Creates a rule that will be applied when an MDC-Web component is within the context of an RTL layout.
+ *
+ * Usage Example:
+ * ```scss
+ * .mdc-foo {
+ *   position: absolute;
+ *   left: 0;
+ *
+ *   @include mdc-rtl {
+ *     left: auto;
+ *     right: 0;
+ *   }
+ *
+ *   &__bar {
+ *     margin-left: 4px;
+ *     @include mdc-rtl(".mdc-foo") {
+ *       margin-left: auto;
+ *       margin-right: 4px;
+ *     }
+ *   }
+ * }
+ *
+ * .mdc-foo--mod {
+ *   padding-left: 4px;
+ *
+ *   @include mdc-rtl {
+ *     padding-left: auto;
+ *     padding-right: 4px;
+ *   }
+ * }
+ * ```
+ *
+ * Note that this works by checking for [dir="rtl"] on an ancestor element. While this will work
+ * in most cases, it will in some cases lead to false negatives, e.g.
+ *
+ * ```html
+ * <html dir="rtl">
+ *   <!-- ... -->
+ *   <div dir="ltr">
+ *     <div class="mdc-foo">Styled incorrectly as RTL!</div>
+ *   </div>
+ * </html>
+ * ```
+ *
+ * In the future, selectors such as :dir (http://mdn.io/:dir) will help us mitigate this.
+ */
+/**
+ * Takes a base box-model property - e.g. margin / border / padding - along with a default
+ * direction and value, and emits rules which apply the value to the
+ * "<base-property>-<default-direction>" property by default, but flips the direction
+ * when within an RTL context.
+ *
+ * For example:
+ *
+ * ```scss
+ * .mdc-foo {
+ *   @include mdc-rtl-reflexive-box(margin, left, 8px);
+ * }
+ * ```
+ * is equivalent to:
+ *
+ * ```scss
+ * .mdc-foo {
+ *   margin-left: 8px;
+ *
+ *   @include mdc-rtl {
+ *     margin-right: 8px;
+ *     margin-left: 0;
+ *   }
+ * }
+ * ```
+ * whereas:
+ *
+ * ```scss
+ * .mdc-foo {
+ *   @include mdc-rtl-reflexive-box(margin, right, 8px);
+ * }
+ * ```
+ * is equivalent to:
+ *
+ * ```scss
+ * .mdc-foo {
+ *   margin-right: 8px;
+ *
+ *   @include mdc-rtl {
+ *     margin-right: 0;
+ *     margin-left: 8px;
+ *   }
+ * }
+ * ```
+ *
+ * You can also pass a 4th optional $root-selector argument which will be forwarded to `mdc-rtl`,
+ * e.g. `@include mdc-rtl-reflexive-box(margin, left, 8px, ".mdc-component")`.
+ *
+ * Note that this function will always zero out the original value in an RTL context. If you're
+ * trying to flip the values, use mdc-rtl-reflexive-property().
+ */
+/**
+ * Takes a base property and emits rules that assign <base-property>-left to <left-value> and
+ * <base-property>-right to <right-value> in a LTR context, and vice versa in a RTL context.
+ * For example:
+ *
+ * ```scss
+ * .mdc-foo {
+ *   @include mdc-rtl-reflexive-property(margin, auto, 12px);
+ * }
+ * ```
+ * is equivalent to:
+ *
+ * ```scss
+ * .mdc-foo {
+ *   margin-left: auto;
+ *   margin-right: 12px;
+ *
+ *   @include mdc-rtl {
+ *     margin-left: 12px;
+ *     margin-right: auto;
+ *   }
+ * }
+ * ```
+ *
+ * A 4th optional $root-selector argument can be given, which will be passed to `mdc-rtl`.
+ */
+/**
+ * Takes an argument specifying a horizontal position property (either "left" or "right") as well
+ * as a value, and applies that value to the specified position in a LTR context, and flips it in a
+ * RTL context. For example:
+ *
+ * ```scss
+ * .mdc-foo {
+ *   @include mdc-rtl-reflexive-position(left, 0);
+ *   position: absolute;
+ * }
+ * ```
+ * is equivalent to:
+ *
+ * ```scss
+ *  .mdc-foo {
+ *    position: absolute;
+ *    left: 0;
+ *    right: initial;
+ *
+ *    @include mdc-rtl {
+ *      right: 0;
+ *      left: initial;
+ *    }
+ *  }
+ * ```
+ * An optional third $root-selector argument may also be given, which is passed to `mdc-rtl`.
+ */
+/**
+ * Copyright 2016 Google Inc. All Rights Reserved.
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *      http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+:root {
+  --mdc-persistent-drawer-dark-theme-bg-color: #212121; }
+
+.mdc-persistent-drawer {
+  /* Use aspect ratio trick to maintain 16:9 aspect ratio on the header */
+  /* stylelint-disable selector-no-qualifying-type */
+  /* stylelint-enable selector-no-qualifying-type */
+  /* TODO(sgomes): Revisit when we have interactive lists. */
+  width: 0; }
+  .mdc-persistent-drawer__toolbar-spacer {
+    display: -webkit-box;
+    display: -ms-flexbox;
+    display: flex;
+    position: relative;
+    -webkit-box-orient: horizontal;
+    -webkit-box-direction: normal;
+        -ms-flex-direction: row;
+            flex-direction: row;
+    -ms-flex-negative: 0;
+        flex-shrink: 0;
+    -webkit-box-align: flex-center;
+        -ms-flex-align: flex-center;
+            align-items: flex-center;
+    height: 56px;
+    padding: 16px;
+    border-bottom: 1px solid rgba(0, 0, 0, 0.12);
+    -webkit-box-sizing: border-box;
+            box-sizing: border-box;
+    /* TODO(sgomes): replace with global breakpoints when we have them */ }
+    .mdc-persistent-drawer__toolbar-spacer--theme-dark .mdc-persistent-drawer__toolbar-spacer,
+    .mdc-theme--dark .mdc-persistent-drawer__toolbar-spacer {
+      border-bottom: 1px solid rgba(255, 255, 255, 0.12); }
+    @media (min-width: 600px) {
+      .mdc-persistent-drawer__toolbar-spacer {
+        height: 64px; } }
+  .mdc-persistent-drawer__header {
+    position: relative; }
+  .mdc-persistent-drawer__header::before {
+    display: block;
+    padding-top: 56.25%;
+    content: ""; }
+  .mdc-persistent-drawer__header-content {
+    display: -webkit-box;
+    display: -ms-flexbox;
+    display: flex;
+    position: absolute;
+    top: 0;
+    right: 0;
+    bottom: 0;
+    left: 0;
+    -webkit-box-align: end;
+        -ms-flex-align: end;
+            align-items: flex-end;
+    padding: 16px;
+    -webkit-box-sizing: border-box;
+            box-sizing: border-box; }
+  .mdc-persistent-drawer .mdc-list-group,
+  .mdc-persistent-drawer .mdc-list {
+    padding-right: 0;
+    padding-left: 0; }
+  .mdc-persistent-drawer .mdc-list-item {
+    position: relative;
+    padding: 0 16px;
+    outline: none;
+    color: inherit;
+    text-decoration: none;
+    font-family: Roboto, sans-serif;
+    -moz-osx-font-smoothing: grayscale;
+    -webkit-font-smoothing: antialiased;
+    font-size: 0.875rem;
+    font-weight: 500;
+    letter-spacing: 0.04em;
+    line-height: 1.5rem;
+    text-decoration: inherit;
+    text-transform: inherit; }
+    .mdc-persistent-drawer .mdc-list-item.mdc-ripple-upgraded {
+      left: 0; }
+  .mdc-persistent-drawer .mdc-list-item__start-detail {
+    color: rgba(0, 0, 0, 0.54); }
+    .mdc-persistent-drawer .mdc-list-item__start-detail--theme-dark .mdc-persistent-drawer .mdc-list-item__start-detail,
+    .mdc-theme--dark .mdc-persistent-drawer .mdc-list-item__start-detail {
+      color: rgba(255, 255, 255, 0.54); }
+  .mdc-persistent-drawer--selected.mdc-list-item,
+  .mdc-persistent-drawer--selected.mdc-list-item .mdc-list-item__start-detail {
+    /* @alternate */
+    color: #3f51b5;
+    color: var(--mdc-theme-primary, #3f51b5); }
+  .mdc-persistent-drawer .mdc-list-item::before {
+    position: absolute;
+    top: 0;
+    left: 0;
+    width: 100%;
+    height: 100%;
+    -webkit-transition: opacity 120ms 0ms cubic-bezier(0.4, 0, 0.6, 1);
+    transition: opacity 120ms 0ms cubic-bezier(0.4, 0, 0.6, 1);
+    border-radius: inherit;
+    background: currentColor;
+    content: "";
+    opacity: 0; }
+  .mdc-persistent-drawer .mdc-list-item:focus::before {
+    -webkit-transition: opacity 180ms 0ms cubic-bezier(0, 0, 0.2, 1);
+    transition: opacity 180ms 0ms cubic-bezier(0, 0, 0.2, 1);
+    opacity: .12; }
+  .mdc-persistent-drawer .mdc-list-item:active::before {
+    /*
+      Slightly darker value for visual distinction.
+      This allows a full base that has distinct modes.
+      Progressive enhancement with ripples will provide complete button spec alignment.
+    */
+    -webkit-transition: opacity 180ms 0ms cubic-bezier(0, 0, 0.2, 1);
+    transition: opacity 180ms 0ms cubic-bezier(0, 0, 0.2, 1);
+    opacity: .18; }
+  .mdc-persistent-drawer .mdc-list-item:active:focus::before {
+    -webkit-transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);
+            transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1); }
+  .mdc-persistent-drawer__drawer {
+    /* @alternate */
+    background: #fff;
+    background: var(--mdc-theme-background, #fff);
+    border-left: 0;
+    border-right: 1px solid #e4e4e4;
+    left: 0;
+    right: initial;
+    height: 100%;
+    -webkit-transform: translateX(-107%);
+            transform: translateX(-107%);
+    -webkit-transform: translateX(calc(-100% - 20px));
+            transform: translateX(calc(-100% - 20px));
+    will-change: transform;
+    display: -webkit-inline-box;
+    display: -ms-inline-flexbox;
+    display: inline-flex;
+    -webkit-box-orient: vertical;
+    -webkit-box-direction: normal;
+        -ms-flex-direction: column;
+            flex-direction: column;
+    -webkit-box-sizing: border-box;
+            box-sizing: border-box;
+    width: 240px;
+    overflow: hidden;
+    -ms-touch-action: none;
+        touch-action: none; }
+    [dir="rtl"] .mdc-persistent-drawer__drawer, .mdc-persistent-drawer__drawer[dir="rtl"] {
+      border-left: 1px solid #e4e4e4;
+      border-right: 0; }
+    [dir="rtl"] .mdc-persistent-drawer__drawer, .mdc-persistent-drawer__drawer[dir="rtl"] {
+      left: initial;
+      right: 0; }
+    .mdc-persistent-drawer__drawer--theme-dark,
+    .mdc-theme--dark .mdc-persistent-drawer__drawer {
+      background-color: #212121;
+      background-color: var(--mdc-persistent-drawer-dark-theme-bg-color, #212121);
+      /* @alternate */
+      color: white;
+      color: var(--mdc-theme-text-primary-on-dark, white);
+      border-left: 0;
+      border-right: 1px solid rgba(255, 255, 255, 0.12); }
+      [dir="rtl"] .mdc-persistent-drawer__drawer--theme-dark, .mdc-persistent-drawer__drawer--theme-dark[dir="rtl"], [dir="rtl"]
+      .mdc-theme--dark .mdc-persistent-drawer__drawer,
+      .mdc-theme--dark .mdc-persistent-drawer__drawer[dir="rtl"] {
+        border-left: 1px solid rgba(255, 255, 255, 0.12);
+        border-right: 0; }
+    [dir="rtl"] .mdc-persistent-drawer .mdc-persistent-drawer__drawer,
+    .mdc-persistent-drawer[dir="rtl"] .mdc-persistent-drawer__drawer {
+      -webkit-transform: translateX(107%);
+              transform: translateX(107%);
+      -webkit-transform: translateX(calc(100% + 20px));
+              transform: translateX(calc(100% + 20px)); }
+  .mdc-persistent-drawer--animating .mdc-persistent-drawer__drawer {
+    -webkit-transition: -webkit-transform 0.195s 0ms cubic-bezier(0.4, 0, 0.6, 1);
+    transition: -webkit-transform 0.195s 0ms cubic-bezier(0.4, 0, 0.6, 1);
+    transition: transform 0.195s 0ms cubic-bezier(0.4, 0, 0.6, 1);
+    transition: transform 0.195s 0ms cubic-bezier(0.4, 0, 0.6, 1), -webkit-transform 0.195s 0ms cubic-bezier(0.4, 0, 0.6, 1); }
+  .mdc-persistent-drawer--animating.mdc-persistent-drawer--open .mdc-persistent-drawer__drawer {
+    -webkit-transition: -webkit-transform 0.225s 0ms cubic-bezier(0, 0, 0.2, 1);
+    transition: -webkit-transform 0.225s 0ms cubic-bezier(0, 0, 0.2, 1);
+    transition: transform 0.225s 0ms cubic-bezier(0, 0, 0.2, 1);
+    transition: transform 0.225s 0ms cubic-bezier(0, 0, 0.2, 1), -webkit-transform 0.225s 0ms cubic-bezier(0, 0, 0.2, 1); }
+  .mdc-persistent-drawer--open {
+    width: 240px;
+    pointer-events: auto; }
+    .mdc-persistent-drawer--open .mdc-persistent-drawer__drawer {
+      -webkit-transform: none;
+              transform: none; }
+    [dir="rtl"] .mdc-persistent-drawer--open .mdc-persistent-drawer__drawer, .mdc-persistent-drawer--open[dir="rtl"] .mdc-persistent-drawer__drawer {
+      -webkit-transform: none;
+              transform: none; }
+
+/**
+ * Creates a rule that will be applied when an MDC-Web component is within the context of an RTL layout.
+ *
+ * Usage Example:
+ * ```scss
+ * .mdc-foo {
+ *   position: absolute;
+ *   left: 0;
+ *
+ *   @include mdc-rtl {
+ *     left: auto;
+ *     right: 0;
+ *   }
+ *
+ *   &__bar {
+ *     margin-left: 4px;
+ *     @include mdc-rtl(".mdc-foo") {
+ *       margin-left: auto;
+ *       margin-right: 4px;
+ *     }
+ *   }
+ * }
+ *
+ * .mdc-foo--mod {
+ *   padding-left: 4px;
+ *
+ *   @include mdc-rtl {
+ *     padding-left: auto;
+ *     padding-right: 4px;
+ *   }
+ * }
+ * ```
+ *
+ * Note that this works by checking for [dir="rtl"] on an ancestor element. While this will work
+ * in most cases, it will in some cases lead to false negatives, e.g.
+ *
+ * ```html
+ * <html dir="rtl">
+ *   <!-- ... -->
+ *   <div dir="ltr">
+ *     <div class="mdc-foo">Styled incorrectly as RTL!</div>
+ *   </div>
+ * </html>
+ * ```
+ *
+ * In the future, selectors such as :dir (http://mdn.io/:dir) will help us mitigate this.
+ */
+/**
+ * Takes a base box-model property - e.g. margin / border / padding - along with a default
+ * direction and value, and emits rules which apply the value to the
+ * "<base-property>-<default-direction>" property by default, but flips the direction
+ * when within an RTL context.
+ *
+ * For example:
+ *
+ * ```scss
+ * .mdc-foo {
+ *   @include mdc-rtl-reflexive-box(margin, left, 8px);
+ * }
+ * ```
+ * is equivalent to:
+ *
+ * ```scss
+ * .mdc-foo {
+ *   margin-left: 8px;
+ *
+ *   @include mdc-rtl {
+ *     margin-right: 8px;
+ *     margin-left: 0;
+ *   }
+ * }
+ * ```
+ * whereas:
+ *
+ * ```scss
+ * .mdc-foo {
+ *   @include mdc-rtl-reflexive-box(margin, right, 8px);
+ * }
+ * ```
+ * is equivalent to:
+ *
+ * ```scss
+ * .mdc-foo {
+ *   margin-right: 8px;
+ *
+ *   @include mdc-rtl {
+ *     margin-right: 0;
+ *     margin-left: 8px;
+ *   }
+ * }
+ * ```
+ *
+ * You can also pass a 4th optional $root-selector argument which will be forwarded to `mdc-rtl`,
+ * e.g. `@include mdc-rtl-reflexive-box(margin, left, 8px, ".mdc-component")`.
+ *
+ * Note that this function will always zero out the original value in an RTL context. If you're
+ * trying to flip the values, use mdc-rtl-reflexive-property().
+ */
+/**
+ * Takes a base property and emits rules that assign <base-property>-left to <left-value> and
+ * <base-property>-right to <right-value> in a LTR context, and vice versa in a RTL context.
+ * For example:
+ *
+ * ```scss
+ * .mdc-foo {
+ *   @include mdc-rtl-reflexive-property(margin, auto, 12px);
+ * }
+ * ```
+ * is equivalent to:
+ *
+ * ```scss
+ * .mdc-foo {
+ *   margin-left: auto;
+ *   margin-right: 12px;
+ *
+ *   @include mdc-rtl {
+ *     margin-left: 12px;
+ *     margin-right: auto;
+ *   }
+ * }
+ * ```
+ *
+ * A 4th optional $root-selector argument can be given, which will be passed to `mdc-rtl`.
+ */
+/**
+ * Takes an argument specifying a horizontal position property (either "left" or "right") as well
+ * as a value, and applies that value to the specified position in a LTR context, and flips it in a
+ * RTL context. For example:
+ *
+ * ```scss
+ * .mdc-foo {
+ *   @include mdc-rtl-reflexive-position(left, 0);
+ *   position: absolute;
+ * }
+ * ```
+ * is equivalent to:
+ *
+ * ```scss
+ *  .mdc-foo {
+ *    position: absolute;
+ *    left: 0;
+ *    right: initial;
+ *
+ *    @include mdc-rtl {
+ *      right: 0;
+ *      left: initial;
+ *    }
+ *  }
+ * ```
+ * An optional third $root-selector argument may also be given, which is passed to `mdc-rtl`.
+ */
+/*
+  Precomputed linear color channel values, for use in contrast calculations.
+  See https://www.w3.org/TR/WCAG20-TECHS/G17.html#G17-tests
+
+  Algorithm, for c in 0 to 255:
+  f(c) {
+    c = c / 255;
+    return c < 0.03928 ? c / 12.92 : Math.pow((c + 0.055) / 1.055, 2.4);
+  }
+
+  This lookup table is needed since there is no `pow` in SASS.
+*/
+/**
+ * Calculate the luminance for a color.
+ * See https://www.w3.org/TR/WCAG20-TECHS/G17.html#G17-tests
+ */
+/**
+ * Calculate the contrast ratio between two colors.
+ * See https://www.w3.org/TR/WCAG20-TECHS/G17.html#G17-tests
+ */
+/**
+ * Determine whether to use dark or light text on top of given color.
+ * Returns "dark" for dark text and "light" for light text.
+ */
+/*
+  Main theme colors.
+  If you're a user customizing your color scheme in SASS, these are probably the only variables you need to change.
+*/
+/* Indigo 500 */
+/* Pink A200 */
+/* White */
+/* Which set of text colors to use for each main theme color (light or dark) */
+/* Text colors according to light vs dark and text type */
+/* Primary text colors for each of the theme colors */
+/**
+ * Applies the correct theme color style to the specified property.
+ * $property is typically color or background-color, but can be any CSS property that accepts color values.
+ * $style should be one of the map keys in $mdc-theme-property-values (_variables.scss).
+ */
+/**
+ * Creates a rule to be used in MDC-Web components for dark theming, and applies the provided contents.
+ * Should provide the $root-selector option if applied to anything other than the root selector.
+ * When used with a modifier class, provide a second argument of `true` for the $compound parameter
+ * to specify that this should be attached as a compound class.
+ *
+ * Usage example:
+ *
+ * ```scss
+ * .mdc-foo {
+ *   color: black;
+ *
+ *   @include mdc-theme-dark {
+ *     color: white;
+ *   }
+ *
+ *   &__bar {
+ *     background: black;
+ *
+ *     @include mdc-theme-dark(".mdc-foo") {
+ *       background: white;
+ *     }
+ *   }
+ * }
+ *
+ * .mdc-foo--disabled {
+ *   opacity: .38;
+ *
+ *   @include mdc-theme-dark(".mdc-foo", true) {
+ *     opacity: .5;
+ *   }
+ * }
+ * ```
+ */
+/*
+  Precomputed linear color channel values, for use in contrast calculations.
+  See https://www.w3.org/TR/WCAG20-TECHS/G17.html#G17-tests
+
+  Algorithm, for c in 0 to 255:
+  f(c) {
+    c = c / 255;
+    return c < 0.03928 ? c / 12.92 : Math.pow((c + 0.055) / 1.055, 2.4);
+  }
+
+  This lookup table is needed since there is no `pow` in SASS.
+*/
+/**
+ * Calculate the luminance for a color.
+ * See https://www.w3.org/TR/WCAG20-TECHS/G17.html#G17-tests
+ */
+/**
+ * Calculate the contrast ratio between two colors.
+ * See https://www.w3.org/TR/WCAG20-TECHS/G17.html#G17-tests
+ */
+/**
+ * Determine whether to use dark or light text on top of given color.
+ * Returns "dark" for dark text and "light" for light text.
+ */
+/*
+  Main theme colors.
+  If you're a user customizing your color scheme in SASS, these are probably the only variables you need to change.
+*/
+/* Indigo 500 */
+/* Pink A200 */
+/* White */
+/* Which set of text colors to use for each main theme color (light or dark) */
+/* Text colors according to light vs dark and text type */
+/* Primary text colors for each of the theme colors */
+/**
+ * Applies the correct theme color style to the specified property.
+ * $property is typically color or background-color, but can be any CSS property that accepts color values.
+ * $style should be one of the map keys in $mdc-theme-property-values (_variables.scss).
+ */
+/**
+ * Creates a rule to be used in MDC-Web components for dark theming, and applies the provided contents.
+ * Should provide the $root-selector option if applied to anything other than the root selector.
+ * When used with a modifier class, provide a second argument of `true` for the $compound parameter
+ * to specify that this should be attached as a compound class.
+ *
+ * Usage example:
+ *
+ * ```scss
+ * .mdc-foo {
+ *   color: black;
+ *
+ *   @include mdc-theme-dark {
+ *     color: white;
+ *   }
+ *
+ *   &__bar {
+ *     background: black;
+ *
+ *     @include mdc-theme-dark(".mdc-foo") {
+ *       background: white;
+ *     }
+ *   }
+ * }
+ *
+ * .mdc-foo--disabled {
+ *   opacity: .38;
+ *
+ *   @include mdc-theme-dark(".mdc-foo", true) {
+ *     opacity: .5;
+ *   }
+ * }
+ * ```
+ */
+/* TODO(sgomes): Figure out what to do about desktop font sizes. */
+/* TODO(sgomes): Figure out what to do about i18n and i18n font sizes. */
+:root {
+  --mdc-permanent-drawer-dark-theme-bg-color: #212121; }
+
+.mdc-permanent-drawer {
+  /* Use aspect ratio trick to maintain 16:9 aspect ratio on the header */
+  /* stylelint-disable selector-no-qualifying-type */
+  /* stylelint-enable selector-no-qualifying-type */
+  /* TODO(sgomes): Revisit when we have interactive lists. */
+  /* @alternate */
+  background: #fff;
+  background: var(--mdc-theme-background, #fff);
+  border-left: 0;
+  border-right: 1px solid #e4e4e4;
+  left: 0;
+  right: initial;
+  display: -webkit-inline-box;
+  display: -ms-inline-flexbox;
+  display: inline-flex;
+  -webkit-box-orient: vertical;
+  -webkit-box-direction: normal;
+      -ms-flex-direction: column;
+          flex-direction: column;
+  -webkit-box-flex: 0;
+      -ms-flex: 0 0 auto;
+          flex: 0 0 auto;
+  width: 240px;
+  -webkit-box-sizing: border-box;
+          box-sizing: border-box;
+  overflow: hidden; }
+  .mdc-permanent-drawer__toolbar-spacer {
+    display: -webkit-box;
+    display: -ms-flexbox;
+    display: flex;
+    position: relative;
+    -webkit-box-orient: horizontal;
+    -webkit-box-direction: normal;
+        -ms-flex-direction: row;
+            flex-direction: row;
+    -ms-flex-negative: 0;
+        flex-shrink: 0;
+    -webkit-box-align: flex-center;
+        -ms-flex-align: flex-center;
+            align-items: flex-center;
+    height: 56px;
+    padding: 16px;
+    border-bottom: 1px solid rgba(0, 0, 0, 0.12);
+    -webkit-box-sizing: border-box;
+            box-sizing: border-box;
+    /* TODO(sgomes): replace with global breakpoints when we have them */ }
+    .mdc-permanent-drawer__toolbar-spacer--theme-dark .mdc-permanent-drawer__toolbar-spacer,
+    .mdc-theme--dark .mdc-permanent-drawer__toolbar-spacer {
+      border-bottom: 1px solid rgba(255, 255, 255, 0.12); }
+    @media (min-width: 600px) {
+      .mdc-permanent-drawer__toolbar-spacer {
+        height: 64px; } }
+  .mdc-permanent-drawer__header {
+    position: relative; }
+  .mdc-permanent-drawer__header::before {
+    display: block;
+    padding-top: 56.25%;
+    content: ""; }
+  .mdc-permanent-drawer__header-content {
+    display: -webkit-box;
+    display: -ms-flexbox;
+    display: flex;
+    position: absolute;
+    top: 0;
+    right: 0;
+    bottom: 0;
+    left: 0;
+    -webkit-box-align: end;
+        -ms-flex-align: end;
+            align-items: flex-end;
+    padding: 16px;
+    -webkit-box-sizing: border-box;
+            box-sizing: border-box; }
+  .mdc-permanent-drawer .mdc-list-group,
+  .mdc-permanent-drawer .mdc-list {
+    padding-right: 0;
+    padding-left: 0; }
+  .mdc-permanent-drawer .mdc-list-item {
+    position: relative;
+    padding: 0 16px;
+    outline: none;
+    color: inherit;
+    text-decoration: none;
+    font-family: Roboto, sans-serif;
+    -moz-osx-font-smoothing: grayscale;
+    -webkit-font-smoothing: antialiased;
+    font-size: 0.875rem;
+    font-weight: 500;
+    letter-spacing: 0.04em;
+    line-height: 1.5rem;
+    text-decoration: inherit;
+    text-transform: inherit; }
+    .mdc-permanent-drawer .mdc-list-item.mdc-ripple-upgraded {
+      left: 0; }
+  .mdc-permanent-drawer .mdc-list-item__start-detail {
+    color: rgba(0, 0, 0, 0.54); }
+    .mdc-permanent-drawer .mdc-list-item__start-detail--theme-dark .mdc-permanent-drawer .mdc-list-item__start-detail,
+    .mdc-theme--dark .mdc-permanent-drawer .mdc-list-item__start-detail {
+      color: rgba(255, 255, 255, 0.54); }
+  .mdc-permanent-drawer--selected.mdc-list-item,
+  .mdc-permanent-drawer--selected.mdc-list-item .mdc-list-item__start-detail {
+    /* @alternate */
+    color: #3f51b5;
+    color: var(--mdc-theme-primary, #3f51b5); }
+  .mdc-permanent-drawer .mdc-list-item::before {
+    position: absolute;
+    top: 0;
+    left: 0;
+    width: 100%;
+    height: 100%;
+    -webkit-transition: opacity 120ms 0ms cubic-bezier(0.4, 0, 0.6, 1);
+    transition: opacity 120ms 0ms cubic-bezier(0.4, 0, 0.6, 1);
+    border-radius: inherit;
+    background: currentColor;
+    content: "";
+    opacity: 0; }
+  .mdc-permanent-drawer .mdc-list-item:focus::before {
+    -webkit-transition: opacity 180ms 0ms cubic-bezier(0, 0, 0.2, 1);
+    transition: opacity 180ms 0ms cubic-bezier(0, 0, 0.2, 1);
+    opacity: .12; }
+  .mdc-permanent-drawer .mdc-list-item:active::before {
+    /*
+      Slightly darker value for visual distinction.
+      This allows a full base that has distinct modes.
+      Progressive enhancement with ripples will provide complete button spec alignment.
+    */
+    -webkit-transition: opacity 180ms 0ms cubic-bezier(0, 0, 0.2, 1);
+    transition: opacity 180ms 0ms cubic-bezier(0, 0, 0.2, 1);
+    opacity: .18; }
+  .mdc-permanent-drawer .mdc-list-item:active:focus::before {
+    -webkit-transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);
+            transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1); }
+  [dir="rtl"] .mdc-permanent-drawer, .mdc-permanent-drawer[dir="rtl"] {
+    border-left: 1px solid #e4e4e4;
+    border-right: 0; }
+  [dir="rtl"] .mdc-permanent-drawer, .mdc-permanent-drawer[dir="rtl"] {
+    left: initial;
+    right: 0; }
+  .mdc-permanent-drawer--theme-dark,
+  .mdc-theme--dark .mdc-permanent-drawer {
+    background-color: #212121;
+    background-color: var(--mdc-permanent-drawer-dark-theme-bg-color, #212121);
+    /* @alternate */
+    color: white;
+    color: var(--mdc-theme-text-primary-on-dark, white);
+    border-left: 0;
+    border-right: 1px solid rgba(255, 255, 255, 0.12); }
+    [dir="rtl"] .mdc-permanent-drawer--theme-dark, .mdc-permanent-drawer--theme-dark[dir="rtl"], [dir="rtl"]
+    .mdc-theme--dark .mdc-permanent-drawer,
+    .mdc-theme--dark .mdc-permanent-drawer[dir="rtl"] {
+      border-left: 1px solid rgba(255, 255, 255, 0.12);
+      border-right: 0; }
+  .mdc-permanent-drawer--floating {
+    background: none;
+    border-left: 0;
+    border-right: none; }
+    [dir="rtl"] .mdc-permanent-drawer--floating, .mdc-permanent-drawer--floating[dir="rtl"] {
+      border-left: none;
+      border-right: 0; }
+    .mdc-permanent-drawer--floating--theme-dark,
+    .mdc-theme--dark .mdc-permanent-drawer--floating {
+      background: none;
+      border-left: 0;
+      border-right: none; }
+      [dir="rtl"] .mdc-permanent-drawer--floating--theme-dark, .mdc-permanent-drawer--floating--theme-dark[dir="rtl"], [dir="rtl"]
+      .mdc-theme--dark .mdc-permanent-drawer--floating,
+      .mdc-theme--dark .mdc-permanent-drawer--floating[dir="rtl"] {
+        border-left: none;
+        border-right: 0; }
+
+/**
+ * The css property used for elevation. In most cases this should not be changed. It is exposed
+ * as a variable for abstraction / easy use when needing to reference the property directly, for
+ * example in a `will-change` rule.
+ */
+/**
+ * The default duration value for elevation transitions.
+ */
+/**
+ * The default easing value for elevation transitions.
+ */
+/**
+ * Applies the correct css rules to an element to give it the elevation specified by $z-value.
+ * The $z-value must be between 0 and 24.
+ */
+/**
+ * Returns a string that can be used as the value for a `transition` property for elevation.
+ * Calling this function directly is useful in situations where a component needs to transition
+ * more than one property.
+ *
+ * ```scss
+ * .foo {
+ *   transition: mdc-elevation-transition-rule(), opacity 100ms ease;
+ *   will-change: $mdc-elevation-property, opacity;
+ * }
+ * ```
+ */
+/**
+ * Applies the correct css rules needed to have an element transition between elevations.
+ * This mixin should be applied to elements whose elevation values will change depending on their
+ * context (e.g. when active or disabled).
+ */
+/**
+ * Creates a rule that will be applied when an MDC-Web component is within the context of an RTL layout.
+ *
+ * Usage Example:
+ * ```scss
+ * .mdc-foo {
+ *   position: absolute;
+ *   left: 0;
+ *
+ *   @include mdc-rtl {
+ *     left: auto;
+ *     right: 0;
+ *   }
+ *
+ *   &__bar {
+ *     margin-left: 4px;
+ *     @include mdc-rtl(".mdc-foo") {
+ *       margin-left: auto;
+ *       margin-right: 4px;
+ *     }
+ *   }
+ * }
+ *
+ * .mdc-foo--mod {
+ *   padding-left: 4px;
+ *
+ *   @include mdc-rtl {
+ *     padding-left: auto;
+ *     padding-right: 4px;
+ *   }
+ * }
+ * ```
+ *
+ * Note that this works by checking for [dir="rtl"] on an ancestor element. While this will work
+ * in most cases, it will in some cases lead to false negatives, e.g.
+ *
+ * ```html
+ * <html dir="rtl">
+ *   <!-- ... -->
+ *   <div dir="ltr">
+ *     <div class="mdc-foo">Styled incorrectly as RTL!</div>
+ *   </div>
+ * </html>
+ * ```
+ *
+ * In the future, selectors such as :dir (http://mdn.io/:dir) will help us mitigate this.
+ */
+/**
+ * Takes a base box-model property - e.g. margin / border / padding - along with a default
+ * direction and value, and emits rules which apply the value to the
+ * "<base-property>-<default-direction>" property by default, but flips the direction
+ * when within an RTL context.
+ *
+ * For example:
+ *
+ * ```scss
+ * .mdc-foo {
+ *   @include mdc-rtl-reflexive-box(margin, left, 8px);
+ * }
+ * ```
+ * is equivalent to:
+ *
+ * ```scss
+ * .mdc-foo {
+ *   margin-left: 8px;
+ *
+ *   @include mdc-rtl {
+ *     margin-right: 8px;
+ *     margin-left: 0;
+ *   }
+ * }
+ * ```
+ * whereas:
+ *
+ * ```scss
+ * .mdc-foo {
+ *   @include mdc-rtl-reflexive-box(margin, right, 8px);
+ * }
+ * ```
+ * is equivalent to:
+ *
+ * ```scss
+ * .mdc-foo {
+ *   margin-right: 8px;
+ *
+ *   @include mdc-rtl {
+ *     margin-right: 0;
+ *     margin-left: 8px;
+ *   }
+ * }
+ * ```
+ *
+ * You can also pass a 4th optional $root-selector argument which will be forwarded to `mdc-rtl`,
+ * e.g. `@include mdc-rtl-reflexive-box(margin, left, 8px, ".mdc-component")`.
+ *
+ * Note that this function will always zero out the original value in an RTL context. If you're
+ * trying to flip the values, use mdc-rtl-reflexive-property().
+ */
+/**
+ * Takes a base property and emits rules that assign <base-property>-left to <left-value> and
+ * <base-property>-right to <right-value> in a LTR context, and vice versa in a RTL context.
+ * For example:
+ *
+ * ```scss
+ * .mdc-foo {
+ *   @include mdc-rtl-reflexive-property(margin, auto, 12px);
+ * }
+ * ```
+ * is equivalent to:
+ *
+ * ```scss
+ * .mdc-foo {
+ *   margin-left: auto;
+ *   margin-right: 12px;
+ *
+ *   @include mdc-rtl {
+ *     margin-left: 12px;
+ *     margin-right: auto;
+ *   }
+ * }
+ * ```
+ *
+ * A 4th optional $root-selector argument can be given, which will be passed to `mdc-rtl`.
+ */
+/**
+ * Takes an argument specifying a horizontal position property (either "left" or "right") as well
+ * as a value, and applies that value to the specified position in a LTR context, and flips it in a
+ * RTL context. For example:
+ *
+ * ```scss
+ * .mdc-foo {
+ *   @include mdc-rtl-reflexive-position(left, 0);
+ *   position: absolute;
+ * }
+ * ```
+ * is equivalent to:
+ *
+ * ```scss
+ *  .mdc-foo {
+ *    position: absolute;
+ *    left: 0;
+ *    right: initial;
+ *
+ *    @include mdc-rtl {
+ *      right: 0;
+ *      left: initial;
+ *    }
+ *  }
+ * ```
+ * An optional third $root-selector argument may also be given, which is passed to `mdc-rtl`.
+ */
+/*
+  Precomputed linear color channel values, for use in contrast calculations.
+  See https://www.w3.org/TR/WCAG20-TECHS/G17.html#G17-tests
+
+  Algorithm, for c in 0 to 255:
+  f(c) {
+    c = c / 255;
+    return c < 0.03928 ? c / 12.92 : Math.pow((c + 0.055) / 1.055, 2.4);
+  }
+
+  This lookup table is needed since there is no `pow` in SASS.
+*/
+/**
+ * Calculate the luminance for a color.
+ * See https://www.w3.org/TR/WCAG20-TECHS/G17.html#G17-tests
+ */
+/**
+ * Calculate the contrast ratio between two colors.
+ * See https://www.w3.org/TR/WCAG20-TECHS/G17.html#G17-tests
+ */
+/**
+ * Determine whether to use dark or light text on top of given color.
+ * Returns "dark" for dark text and "light" for light text.
+ */
+/*
+  Main theme colors.
+  If you're a user customizing your color scheme in SASS, these are probably the only variables you need to change.
+*/
+/* Indigo 500 */
+/* Pink A200 */
+/* White */
+/* Which set of text colors to use for each main theme color (light or dark) */
+/* Text colors according to light vs dark and text type */
+/* Primary text colors for each of the theme colors */
+/**
+ * Applies the correct theme color style to the specified property.
+ * $property is typically color or background-color, but can be any CSS property that accepts color values.
+ * $style should be one of the map keys in $mdc-theme-property-values (_variables.scss).
+ */
+/**
+ * Creates a rule to be used in MDC-Web components for dark theming, and applies the provided contents.
+ * Should provide the $root-selector option if applied to anything other than the root selector.
+ * When used with a modifier class, provide a second argument of `true` for the $compound parameter
+ * to specify that this should be attached as a compound class.
+ *
+ * Usage example:
+ *
+ * ```scss
+ * .mdc-foo {
+ *   color: black;
+ *
+ *   @include mdc-theme-dark {
+ *     color: white;
+ *   }
+ *
+ *   &__bar {
+ *     background: black;
+ *
+ *     @include mdc-theme-dark(".mdc-foo") {
+ *       background: white;
+ *     }
+ *   }
+ * }
+ *
+ * .mdc-foo--disabled {
+ *   opacity: .38;
+ *
+ *   @include mdc-theme-dark(".mdc-foo", true) {
+ *     opacity: .5;
+ *   }
+ * }
+ * ```
+ */
+/*
+  Precomputed linear color channel values, for use in contrast calculations.
+  See https://www.w3.org/TR/WCAG20-TECHS/G17.html#G17-tests
+
+  Algorithm, for c in 0 to 255:
+  f(c) {
+    c = c / 255;
+    return c < 0.03928 ? c / 12.92 : Math.pow((c + 0.055) / 1.055, 2.4);
+  }
+
+  This lookup table is needed since there is no `pow` in SASS.
+*/
+/**
+ * Calculate the luminance for a color.
+ * See https://www.w3.org/TR/WCAG20-TECHS/G17.html#G17-tests
+ */
+/**
+ * Calculate the contrast ratio between two colors.
+ * See https://www.w3.org/TR/WCAG20-TECHS/G17.html#G17-tests
+ */
+/**
+ * Determine whether to use dark or light text on top of given color.
+ * Returns "dark" for dark text and "light" for light text.
+ */
+/*
+  Main theme colors.
+  If you're a user customizing your color scheme in SASS, these are probably the only variables you need to change.
+*/
+/* Indigo 500 */
+/* Pink A200 */
+/* White */
+/* Which set of text colors to use for each main theme color (light or dark) */
+/* Text colors according to light vs dark and text type */
+/* Primary text colors for each of the theme colors */
+/**
+ * Applies the correct theme color style to the specified property.
+ * $property is typically color or background-color, but can be any CSS property that accepts color values.
+ * $style should be one of the map keys in $mdc-theme-property-values (_variables.scss).
+ */
+/**
+ * Creates a rule to be used in MDC-Web components for dark theming, and applies the provided contents.
+ * Should provide the $root-selector option if applied to anything other than the root selector.
+ * When used with a modifier class, provide a second argument of `true` for the $compound parameter
+ * to specify that this should be attached as a compound class.
+ *
+ * Usage example:
+ *
+ * ```scss
+ * .mdc-foo {
+ *   color: black;
+ *
+ *   @include mdc-theme-dark {
+ *     color: white;
+ *   }
+ *
+ *   &__bar {
+ *     background: black;
+ *
+ *     @include mdc-theme-dark(".mdc-foo") {
+ *       background: white;
+ *     }
+ *   }
+ * }
+ *
+ * .mdc-foo--disabled {
+ *   opacity: .38;
+ *
+ *   @include mdc-theme-dark(".mdc-foo", true) {
+ *     opacity: .5;
+ *   }
+ * }
+ * ```
+ */
+/* TODO(sgomes): Figure out what to do about desktop font sizes. */
+/* TODO(sgomes): Figure out what to do about i18n and i18n font sizes. */
+/**
+ * Copyright 2016 Google Inc. All Rights Reserved.
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *      http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+/**
+ * Creates a rule that will be applied when an MDC-Web component is within the context of an RTL layout.
+ *
+ * Usage Example:
+ * ```scss
+ * .mdc-foo {
+ *   position: absolute;
+ *   left: 0;
+ *
+ *   @include mdc-rtl {
+ *     left: auto;
+ *     right: 0;
+ *   }
+ *
+ *   &__bar {
+ *     margin-left: 4px;
+ *     @include mdc-rtl(".mdc-foo") {
+ *       margin-left: auto;
+ *       margin-right: 4px;
+ *     }
+ *   }
+ * }
+ *
+ * .mdc-foo--mod {
+ *   padding-left: 4px;
+ *
+ *   @include mdc-rtl {
+ *     padding-left: auto;
+ *     padding-right: 4px;
+ *   }
+ * }
+ * ```
+ *
+ * Note that this works by checking for [dir="rtl"] on an ancestor element. While this will work
+ * in most cases, it will in some cases lead to false negatives, e.g.
+ *
+ * ```html
+ * <html dir="rtl">
+ *   <!-- ... -->
+ *   <div dir="ltr">
+ *     <div class="mdc-foo">Styled incorrectly as RTL!</div>
+ *   </div>
+ * </html>
+ * ```
+ *
+ * In the future, selectors such as :dir (http://mdn.io/:dir) will help us mitigate this.
+ */
+/**
+ * Takes a base box-model property - e.g. margin / border / padding - along with a default
+ * direction and value, and emits rules which apply the value to the
+ * "<base-property>-<default-direction>" property by default, but flips the direction
+ * when within an RTL context.
+ *
+ * For example:
+ *
+ * ```scss
+ * .mdc-foo {
+ *   @include mdc-rtl-reflexive-box(margin, left, 8px);
+ * }
+ * ```
+ * is equivalent to:
+ *
+ * ```scss
+ * .mdc-foo {
+ *   margin-left: 8px;
+ *
+ *   @include mdc-rtl {
+ *     margin-right: 8px;
+ *     margin-left: 0;
+ *   }
+ * }
+ * ```
+ * whereas:
+ *
+ * ```scss
+ * .mdc-foo {
+ *   @include mdc-rtl-reflexive-box(margin, right, 8px);
+ * }
+ * ```
+ * is equivalent to:
+ *
+ * ```scss
+ * .mdc-foo {
+ *   margin-right: 8px;
+ *
+ *   @include mdc-rtl {
+ *     margin-right: 0;
+ *     margin-left: 8px;
+ *   }
+ * }
+ * ```
+ *
+ * You can also pass a 4th optional $root-selector argument which will be forwarded to `mdc-rtl`,
+ * e.g. `@include mdc-rtl-reflexive-box(margin, left, 8px, ".mdc-component")`.
+ *
+ * Note that this function will always zero out the original value in an RTL context. If you're
+ * trying to flip the values, use mdc-rtl-reflexive-property().
+ */
+/**
+ * Takes a base property and emits rules that assign <base-property>-left to <left-value> and
+ * <base-property>-right to <right-value> in a LTR context, and vice versa in a RTL context.
+ * For example:
+ *
+ * ```scss
+ * .mdc-foo {
+ *   @include mdc-rtl-reflexive-property(margin, auto, 12px);
+ * }
+ * ```
+ * is equivalent to:
+ *
+ * ```scss
+ * .mdc-foo {
+ *   margin-left: auto;
+ *   margin-right: 12px;
+ *
+ *   @include mdc-rtl {
+ *     margin-left: 12px;
+ *     margin-right: auto;
+ *   }
+ * }
+ * ```
+ *
+ * A 4th optional $root-selector argument can be given, which will be passed to `mdc-rtl`.
+ */
+/**
+ * Takes an argument specifying a horizontal position property (either "left" or "right") as well
+ * as a value, and applies that value to the specified position in a LTR context, and flips it in a
+ * RTL context. For example:
+ *
+ * ```scss
+ * .mdc-foo {
+ *   @include mdc-rtl-reflexive-position(left, 0);
+ *   position: absolute;
+ * }
+ * ```
+ * is equivalent to:
+ *
+ * ```scss
+ *  .mdc-foo {
+ *    position: absolute;
+ *    left: 0;
+ *    right: initial;
+ *
+ *    @include mdc-rtl {
+ *      right: 0;
+ *      left: initial;
+ *    }
+ *  }
+ * ```
+ * An optional third $root-selector argument may also be given, which is passed to `mdc-rtl`.
+ */
+/**
+ * Copyright 2016 Google Inc. All Rights Reserved.
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *      http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+.mdc-temporary-drawer {
+  /* Use aspect ratio trick to maintain 16:9 aspect ratio on the header */
+  /* stylelint-disable selector-no-qualifying-type */
+  /* stylelint-enable selector-no-qualifying-type */
+  /* TODO(sgomes): Revisit when we have interactive lists. */
+  position: fixed;
+  top: 0;
+  left: 0;
+  width: 100%;
+  height: 100%;
+  overflow: hidden;
+  pointer-events: none;
+  -webkit-box-sizing: border-box;
+          box-sizing: border-box;
+  contain: strict;
+  z-index: 5;
+  /* Shaded background */ }
+  .mdc-temporary-drawer__toolbar-spacer {
+    display: -webkit-box;
+    display: -ms-flexbox;
+    display: flex;
+    position: relative;
+    -webkit-box-orient: horizontal;
+    -webkit-box-direction: normal;
+        -ms-flex-direction: row;
+            flex-direction: row;
+    -ms-flex-negative: 0;
+        flex-shrink: 0;
+    -webkit-box-align: flex-center;
+        -ms-flex-align: flex-center;
+            align-items: flex-center;
+    height: 56px;
+    padding: 16px;
+    border-bottom: 1px solid rgba(0, 0, 0, 0.12);
+    -webkit-box-sizing: border-box;
+            box-sizing: border-box;
+    /* TODO(sgomes): replace with global breakpoints when we have them */ }
+    .mdc-temporary-drawer__toolbar-spacer--theme-dark .mdc-temporary-drawer__toolbar-spacer,
+    .mdc-theme--dark .mdc-temporary-drawer__toolbar-spacer {
+      border-bottom: 1px solid rgba(255, 255, 255, 0.12); }
+    @media (min-width: 600px) {
+      .mdc-temporary-drawer__toolbar-spacer {
+        height: 64px; } }
+  .mdc-temporary-drawer__header {
+    position: relative; }
+  .mdc-temporary-drawer__header::before {
+    display: block;
+    padding-top: 56.25%;
+    content: ""; }
+  .mdc-temporary-drawer__header-content {
+    display: -webkit-box;
+    display: -ms-flexbox;
+    display: flex;
+    position: absolute;
+    top: 0;
+    right: 0;
+    bottom: 0;
+    left: 0;
+    -webkit-box-align: end;
+        -ms-flex-align: end;
+            align-items: flex-end;
+    padding: 16px;
+    -webkit-box-sizing: border-box;
+            box-sizing: border-box; }
+  .mdc-temporary-drawer .mdc-list-group,
+  .mdc-temporary-drawer .mdc-list {
+    padding-right: 0;
+    padding-left: 0; }
+  .mdc-temporary-drawer .mdc-list-item {
+    position: relative;
+    padding: 0 16px;
+    outline: none;
+    color: inherit;
+    text-decoration: none;
+    font-family: Roboto, sans-serif;
+    -moz-osx-font-smoothing: grayscale;
+    -webkit-font-smoothing: antialiased;
+    font-size: 0.875rem;
+    font-weight: 500;
+    letter-spacing: 0.04em;
+    line-height: 1.5rem;
+    text-decoration: inherit;
+    text-transform: inherit; }
+    .mdc-temporary-drawer .mdc-list-item.mdc-ripple-upgraded {
+      left: 0; }
+  .mdc-temporary-drawer .mdc-list-item__start-detail {
+    color: rgba(0, 0, 0, 0.54); }
+    .mdc-temporary-drawer .mdc-list-item__start-detail--theme-dark .mdc-temporary-drawer .mdc-list-item__start-detail,
+    .mdc-theme--dark .mdc-temporary-drawer .mdc-list-item__start-detail {
+      color: rgba(255, 255, 255, 0.54); }
+  .mdc-temporary-drawer--selected.mdc-list-item,
+  .mdc-temporary-drawer--selected.mdc-list-item .mdc-list-item__start-detail {
+    /* @alternate */
+    color: #3f51b5;
+    color: var(--mdc-theme-primary, #3f51b5); }
+  .mdc-temporary-drawer .mdc-list-item::before {
+    position: absolute;
+    top: 0;
+    left: 0;
+    width: 100%;
+    height: 100%;
+    -webkit-transition: opacity 120ms 0ms cubic-bezier(0.4, 0, 0.6, 1);
+    transition: opacity 120ms 0ms cubic-bezier(0.4, 0, 0.6, 1);
+    border-radius: inherit;
+    background: currentColor;
+    content: "";
+    opacity: 0; }
+  .mdc-temporary-drawer .mdc-list-item:focus::before {
+    -webkit-transition: opacity 180ms 0ms cubic-bezier(0, 0, 0.2, 1);
+    transition: opacity 180ms 0ms cubic-bezier(0, 0, 0.2, 1);
+    opacity: .12; }
+  .mdc-temporary-drawer .mdc-list-item:active::before {
+    /*
+      Slightly darker value for visual distinction.
+      This allows a full base that has distinct modes.
+      Progressive enhancement with ripples will provide complete button spec alignment.
+    */
+    -webkit-transition: opacity 180ms 0ms cubic-bezier(0, 0, 0.2, 1);
+    transition: opacity 180ms 0ms cubic-bezier(0, 0, 0.2, 1);
+    opacity: .18; }
+  .mdc-temporary-drawer .mdc-list-item:active:focus::before {
+    -webkit-transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);
+            transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1); }
+  .mdc-temporary-drawer::before {
+    display: block;
+    position: absolute;
+    top: 0;
+    left: 0;
+    width: 100%;
+    height: 100%;
+    background: rgba(0, 0, 0, 0.6);
+    content: "";
+    opacity: 0;
+    opacity: var(--mdc-temporary-drawer-opacity, 0);
+    will-change: opacity;
+    -webkit-box-sizing: border-box;
+            box-sizing: border-box; }
+  .mdc-temporary-drawer__drawer {
+    /* @alternate */
+    background: #fff;
+    background: var(--mdc-theme-background, #fff);
+    -webkit-box-shadow: 0px 8px 10px -5px rgba(0, 0, 0, 0.2), 0px 16px 24px 2px rgba(0, 0, 0, 0.14), 0px 6px 30px 5px rgba(0, 0, 0, 0.12);
+            box-shadow: 0px 8px 10px -5px rgba(0, 0, 0, 0.2), 0px 16px 24px 2px rgba(0, 0, 0, 0.14), 0px 6px 30px 5px rgba(0, 0, 0, 0.12);
+    left: 0;
+    right: initial;
+    height: 100%;
+    -webkit-transform: translateX(-107%);
+            transform: translateX(-107%);
+    -webkit-transform: translateX(calc(-100% - 20px));
+            transform: translateX(calc(-100% - 20px));
+    will-change: transform;
+    display: -webkit-box;
+    display: -ms-flexbox;
+    display: flex;
+    position: absolute;
+    -webkit-box-orient: vertical;
+    -webkit-box-direction: normal;
+        -ms-flex-direction: column;
+            flex-direction: column;
+    width: calc(100% - 56px);
+    max-width: 280px;
+    -webkit-box-sizing: border-box;
+            box-sizing: border-box;
+    overflow: hidden;
+    -ms-touch-action: none;
+        touch-action: none;
+    /* TODO(sgomes): replace with global breakpoints when we have them */ }
+    [dir="rtl"] .mdc-temporary-drawer__drawer, .mdc-temporary-drawer__drawer[dir="rtl"] {
+      left: initial;
+      right: 0; }
+    .mdc-temporary-drawer--theme-dark .mdc-temporary-drawer__drawer,
+    .mdc-theme--dark .mdc-temporary-drawer__drawer {
+      background: #303030;
+      /* @alternate */
+      color: white;
+      color: var(--mdc-theme-text-primary-on-dark, white); }
+    [dir="rtl"] .mdc-temporary-drawer .mdc-temporary-drawer__drawer,
+    .mdc-temporary-drawer[dir="rtl"] .mdc-temporary-drawer__drawer {
+      -webkit-transform: translateX(107%);
+              transform: translateX(107%);
+      -webkit-transform: translateX(calc(100% + 20px));
+              transform: translateX(calc(100% + 20px)); }
+    @media (min-width: 600px) {
+      .mdc-temporary-drawer__drawer {
+        width: calc(100% - 64px);
+        max-width: 320px; } }
+  .mdc-temporary-drawer__content {
+    -webkit-box-flex: 1;
+        -ms-flex-positive: 1;
+            flex-grow: 1;
+    margin: 0;
+    overflow-x: hidden;
+    overflow-y: auto;
+    -webkit-box-sizing: border-box;
+            box-sizing: border-box;
+    -webkit-overflow-scrolling: touch;
+    -ms-touch-action: pan-y;
+        touch-action: pan-y; }
+  .mdc-temporary-drawer__footer {
+    -webkit-box-shadow: 0px 3px 1px -2px rgba(0, 0, 0, 0.2), 0px 2px 2px 0px rgba(0, 0, 0, 0.14), 0px 1px 5px 0px rgba(0, 0, 0, 0.12);
+            box-shadow: 0px 3px 1px -2px rgba(0, 0, 0, 0.2), 0px 2px 2px 0px rgba(0, 0, 0, 0.14), 0px 1px 5px 0px rgba(0, 0, 0, 0.12);
+    -ms-flex-negative: 0;
+        flex-shrink: 0; }
+  .mdc-temporary-drawer--animating::before {
+    -webkit-transition: opacity 0.3s 0ms cubic-bezier(0, 0, 0.2, 1);
+    transition: opacity 0.3s 0ms cubic-bezier(0, 0, 0.2, 1); }
+  .mdc-temporary-drawer--animating.mdc-temporary-drawer--open .mdc-temporary-drawer__drawer {
+    -webkit-transition: -webkit-transform 0.225s 0ms cubic-bezier(0, 0, 0.2, 1);
+    transition: -webkit-transform 0.225s 0ms cubic-bezier(0, 0, 0.2, 1);
+    transition: transform 0.225s 0ms cubic-bezier(0, 0, 0.2, 1);
+    transition: transform 0.225s 0ms cubic-bezier(0, 0, 0.2, 1), -webkit-transform 0.225s 0ms cubic-bezier(0, 0, 0.2, 1); }
+  .mdc-temporary-drawer--animating .mdc-temporary-drawer__drawer {
+    -webkit-transition: -webkit-transform 0.195s 0ms cubic-bezier(0.4, 0, 0.6, 1);
+    transition: -webkit-transform 0.195s 0ms cubic-bezier(0.4, 0, 0.6, 1);
+    transition: transform 0.195s 0ms cubic-bezier(0.4, 0, 0.6, 1);
+    transition: transform 0.195s 0ms cubic-bezier(0.4, 0, 0.6, 1), -webkit-transform 0.195s 0ms cubic-bezier(0.4, 0, 0.6, 1); }
+  .mdc-temporary-drawer--open {
+    pointer-events: auto; }
+    .mdc-temporary-drawer--open::before {
+      opacity: 1;
+      opacity: var(--mdc-temporary-drawer-opacity, 1); }
+    .mdc-temporary-drawer--open .mdc-temporary-drawer__drawer {
+      -webkit-transform: none;
+              transform: none; }
+    [dir="rtl"] .mdc-temporary-drawer--open .mdc-temporary-drawer__drawer, .mdc-temporary-drawer--open[dir="rtl"] .mdc-temporary-drawer__drawer {
+      -webkit-transform: none;
+              transform: none; }
+
+.mdc-drawer-scroll-lock {
+  height: 100vh;
+  overflow: hidden; }

+ 83 - 0
support/client/lib/vwf/view/lib/mdc/dist/mdc.drawer.css-entry

@@ -0,0 +1,83 @@
+/*!
+ Material Components for the web
+ Copyright (c) 2017 Google Inc.
+ License: Apache-2.0
+*/
+/******/ (function(modules) { // webpackBootstrap
+/******/ 	// The module cache
+/******/ 	var installedModules = {};
+/******/
+/******/ 	// The require function
+/******/ 	function __webpack_require__(moduleId) {
+/******/
+/******/ 		// Check if module is in cache
+/******/ 		if(installedModules[moduleId]) {
+/******/ 			return installedModules[moduleId].exports;
+/******/ 		}
+/******/ 		// Create a new module (and put it into the cache)
+/******/ 		var module = installedModules[moduleId] = {
+/******/ 			i: moduleId,
+/******/ 			l: false,
+/******/ 			exports: {}
+/******/ 		};
+/******/
+/******/ 		// Execute the module function
+/******/ 		modules[moduleId].call(module.exports, module, module.exports, __webpack_require__);
+/******/
+/******/ 		// Flag the module as loaded
+/******/ 		module.l = true;
+/******/
+/******/ 		// Return the exports of the module
+/******/ 		return module.exports;
+/******/ 	}
+/******/
+/******/
+/******/ 	// expose the modules object (__webpack_modules__)
+/******/ 	__webpack_require__.m = modules;
+/******/
+/******/ 	// expose the module cache
+/******/ 	__webpack_require__.c = installedModules;
+/******/
+/******/ 	// identity function for calling harmony imports with the correct context
+/******/ 	__webpack_require__.i = function(value) { return value; };
+/******/
+/******/ 	// define getter function for harmony exports
+/******/ 	__webpack_require__.d = function(exports, name, getter) {
+/******/ 		if(!__webpack_require__.o(exports, name)) {
+/******/ 			Object.defineProperty(exports, name, {
+/******/ 				configurable: false,
+/******/ 				enumerable: true,
+/******/ 				get: getter
+/******/ 			});
+/******/ 		}
+/******/ 	};
+/******/
+/******/ 	// getDefaultExport function for compatibility with non-harmony modules
+/******/ 	__webpack_require__.n = function(module) {
+/******/ 		var getter = module && module.__esModule ?
+/******/ 			function getDefault() { return module['default']; } :
+/******/ 			function getModuleExports() { return module; };
+/******/ 		__webpack_require__.d(getter, 'a', getter);
+/******/ 		return getter;
+/******/ 	};
+/******/
+/******/ 	// Object.prototype.hasOwnProperty.call
+/******/ 	__webpack_require__.o = function(object, property) { return Object.prototype.hasOwnProperty.call(object, property); };
+/******/
+/******/ 	// __webpack_public_path__
+/******/ 	__webpack_require__.p = "/assets/";
+/******/
+/******/ 	// Load entry module and return exports
+/******/ 	return __webpack_require__(__webpack_require__.s = 6);
+/******/ })
+/************************************************************************/
+/******/ ({
+
+/***/ 6:
+/***/ (function(module, exports) {
+
+// removed by extract-text-webpack-plugin
+
+/***/ })
+
+/******/ });

+ 1609 - 0
support/client/lib/vwf/view/lib/mdc/dist/mdc.drawer.js

@@ -0,0 +1,1609 @@
+/*!
+ Material Components for the web
+ Copyright (c) 2017 Google Inc.
+ License: Apache-2.0
+*/
+(function webpackUniversalModuleDefinition(root, factory) {
+	if(typeof exports === 'object' && typeof module === 'object')
+		module.exports = factory();
+	else if(typeof define === 'function' && define.amd)
+		define([], factory);
+	else if(typeof exports === 'object')
+		exports["drawer"] = factory();
+	else
+		root["mdc"] = root["mdc"] || {}, root["mdc"]["drawer"] = factory();
+})(this, function() {
+return /******/ (function(modules) { // webpackBootstrap
+/******/ 	// The module cache
+/******/ 	var installedModules = {};
+/******/
+/******/ 	// The require function
+/******/ 	function __webpack_require__(moduleId) {
+/******/
+/******/ 		// Check if module is in cache
+/******/ 		if(installedModules[moduleId]) {
+/******/ 			return installedModules[moduleId].exports;
+/******/ 		}
+/******/ 		// Create a new module (and put it into the cache)
+/******/ 		var module = installedModules[moduleId] = {
+/******/ 			i: moduleId,
+/******/ 			l: false,
+/******/ 			exports: {}
+/******/ 		};
+/******/
+/******/ 		// Execute the module function
+/******/ 		modules[moduleId].call(module.exports, module, module.exports, __webpack_require__);
+/******/
+/******/ 		// Flag the module as loaded
+/******/ 		module.l = true;
+/******/
+/******/ 		// Return the exports of the module
+/******/ 		return module.exports;
+/******/ 	}
+/******/
+/******/
+/******/ 	// expose the modules object (__webpack_modules__)
+/******/ 	__webpack_require__.m = modules;
+/******/
+/******/ 	// expose the module cache
+/******/ 	__webpack_require__.c = installedModules;
+/******/
+/******/ 	// identity function for calling harmony imports with the correct context
+/******/ 	__webpack_require__.i = function(value) { return value; };
+/******/
+/******/ 	// define getter function for harmony exports
+/******/ 	__webpack_require__.d = function(exports, name, getter) {
+/******/ 		if(!__webpack_require__.o(exports, name)) {
+/******/ 			Object.defineProperty(exports, name, {
+/******/ 				configurable: false,
+/******/ 				enumerable: true,
+/******/ 				get: getter
+/******/ 			});
+/******/ 		}
+/******/ 	};
+/******/
+/******/ 	// getDefaultExport function for compatibility with non-harmony modules
+/******/ 	__webpack_require__.n = function(module) {
+/******/ 		var getter = module && module.__esModule ?
+/******/ 			function getDefault() { return module['default']; } :
+/******/ 			function getModuleExports() { return module; };
+/******/ 		__webpack_require__.d(getter, 'a', getter);
+/******/ 		return getter;
+/******/ 	};
+/******/
+/******/ 	// Object.prototype.hasOwnProperty.call
+/******/ 	__webpack_require__.o = function(object, property) { return Object.prototype.hasOwnProperty.call(object, property); };
+/******/
+/******/ 	// __webpack_public_path__
+/******/ 	__webpack_require__.p = "/assets/";
+/******/
+/******/ 	// Load entry module and return exports
+/******/ 	return __webpack_require__(__webpack_require__.s = 86);
+/******/ })
+/************************************************************************/
+/******/ ({
+
+/***/ 0:
+/***/ (function(module, __webpack_exports__, __webpack_require__) {
+
+"use strict";
+var _createClass = function () { function defineProperties(target, props) { for (var i = 0; i < props.length; i++) { var descriptor = props[i]; descriptor.enumerable = descriptor.enumerable || false; descriptor.configurable = true; if ("value" in descriptor) descriptor.writable = true; Object.defineProperty(target, descriptor.key, descriptor); } } return function (Constructor, protoProps, staticProps) { if (protoProps) defineProperties(Constructor.prototype, protoProps); if (staticProps) defineProperties(Constructor, staticProps); return Constructor; }; }();
+
+function _classCallCheck(instance, Constructor) { if (!(instance instanceof Constructor)) { throw new TypeError("Cannot call a class as a function"); } }
+
+/**
+ * Copyright 2016 Google Inc.
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *   http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+
+/**
+ * @template A
+ */
+var MDCFoundation = function () {
+  _createClass(MDCFoundation, null, [{
+    key: "cssClasses",
+
+    /** @return enum{cssClasses} */
+    get: function get() {
+      // Classes extending MDCFoundation should implement this method to return an object which exports every
+      // CSS class the foundation class needs as a property. e.g. {ACTIVE: 'mdc-component--active'}
+      return {};
+    }
+
+    /** @return enum{strings} */
+
+  }, {
+    key: "strings",
+    get: function get() {
+      // Classes extending MDCFoundation should implement this method to return an object which exports all
+      // semantic strings as constants. e.g. {ARIA_ROLE: 'tablist'}
+      return {};
+    }
+
+    /** @return enum{numbers} */
+
+  }, {
+    key: "numbers",
+    get: function get() {
+      // Classes extending MDCFoundation should implement this method to return an object which exports all
+      // of its semantic numbers as constants. e.g. {ANIMATION_DELAY_MS: 350}
+      return {};
+    }
+
+    /** @return {!Object} */
+
+  }, {
+    key: "defaultAdapter",
+    get: function get() {
+      // Classes extending MDCFoundation may choose to implement this getter in order to provide a convenient
+      // way of viewing the necessary methods of an adapter. In the future, this could also be used for adapter
+      // validation.
+      return {};
+    }
+
+    /**
+     * @param {A=} adapter
+     */
+
+  }]);
+
+  function MDCFoundation() {
+    var adapter = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : {};
+
+    _classCallCheck(this, MDCFoundation);
+
+    /** @protected {!A} */
+    this.adapter_ = adapter;
+  }
+
+  _createClass(MDCFoundation, [{
+    key: "init",
+    value: function init() {
+      // Subclasses should override this method to perform initialization routines (registering events, etc.)
+    }
+  }, {
+    key: "destroy",
+    value: function destroy() {
+      // Subclasses should override this method to perform de-initialization routines (de-registering events, etc.)
+    }
+  }]);
+
+  return MDCFoundation;
+}();
+
+/* harmony default export */ __webpack_exports__["a"] = (MDCFoundation);
+
+/***/ }),
+
+/***/ 1:
+/***/ (function(module, __webpack_exports__, __webpack_require__) {
+
+"use strict";
+/* harmony import */ var __WEBPACK_IMPORTED_MODULE_0__foundation__ = __webpack_require__(0);
+var _createClass = function () { function defineProperties(target, props) { for (var i = 0; i < props.length; i++) { var descriptor = props[i]; descriptor.enumerable = descriptor.enumerable || false; descriptor.configurable = true; if ("value" in descriptor) descriptor.writable = true; Object.defineProperty(target, descriptor.key, descriptor); } } return function (Constructor, protoProps, staticProps) { if (protoProps) defineProperties(Constructor.prototype, protoProps); if (staticProps) defineProperties(Constructor, staticProps); return Constructor; }; }();
+
+function _classCallCheck(instance, Constructor) { if (!(instance instanceof Constructor)) { throw new TypeError("Cannot call a class as a function"); } }
+
+/**
+ * Copyright 2016 Google Inc.
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *   http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+
+
+
+/**
+ * @template F
+ */
+
+var MDCComponent = function () {
+  _createClass(MDCComponent, null, [{
+    key: 'attachTo',
+
+    /**
+     * @param {!Element} root
+     * @return {!MDCComponent}
+     */
+    value: function attachTo(root) {
+      // Subclasses which extend MDCBase should provide an attachTo() method that takes a root element and
+      // returns an instantiated component with its root set to that element. Also note that in the cases of
+      // subclasses, an explicit foundation class will not have to be passed in; it will simply be initialized
+      // from getDefaultFoundation().
+      return new MDCComponent(root, new __WEBPACK_IMPORTED_MODULE_0__foundation__["a" /* default */]());
+    }
+
+    /**
+     * @param {!Element} root
+     * @param {F=} foundation
+     * @param {...?} args
+     */
+
+  }]);
+
+  function MDCComponent(root) {
+    var foundation = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : undefined;
+
+    _classCallCheck(this, MDCComponent);
+
+    /** @protected {!Element} */
+    this.root_ = root;
+
+    for (var _len = arguments.length, args = Array(_len > 2 ? _len - 2 : 0), _key = 2; _key < _len; _key++) {
+      args[_key - 2] = arguments[_key];
+    }
+
+    this.initialize.apply(this, args);
+    // Note that we initialize foundation here and not within the constructor's default param so that
+    // this.root_ is defined and can be used within the foundation class.
+    /** @protected {!F} */
+    this.foundation_ = foundation === undefined ? this.getDefaultFoundation() : foundation;
+    this.foundation_.init();
+    this.initialSyncWithDOM();
+  }
+
+  _createClass(MDCComponent, [{
+    key: 'initialize',
+    value: function initialize() /* ...args */{}
+    // Subclasses can override this to do any additional setup work that would be considered part of a
+    // "constructor". Essentially, it is a hook into the parent constructor before the foundation is
+    // initialized. Any additional arguments besides root and foundation will be passed in here.
+
+
+    /**
+     * @return {!F} foundation
+     */
+
+  }, {
+    key: 'getDefaultFoundation',
+    value: function getDefaultFoundation() {
+      // Subclasses must override this method to return a properly configured foundation class for the
+      // component.
+      throw new Error('Subclasses must override getDefaultFoundation to return a properly configured ' + 'foundation class');
+    }
+  }, {
+    key: 'initialSyncWithDOM',
+    value: function initialSyncWithDOM() {
+      // Subclasses should override this method if they need to perform work to synchronize with a host DOM
+      // object. An example of this would be a form control wrapper that needs to synchronize its internal state
+      // to some property or attribute of the host DOM. Please note: this is *not* the place to perform DOM
+      // reads/writes that would cause layout / paint, as this is called synchronously from within the constructor.
+    }
+  }, {
+    key: 'destroy',
+    value: function destroy() {
+      // Subclasses may implement this method to release any resources / deregister any listeners they have
+      // attached. An example of this might be deregistering a resize event from the window object.
+      this.foundation_.destroy();
+    }
+
+    /**
+     * Wrapper method to add an event listener to the component's root element. This is most useful when
+     * listening for custom events.
+     * @param {string} evtType
+     * @param {!Function} handler
+     */
+
+  }, {
+    key: 'listen',
+    value: function listen(evtType, handler) {
+      this.root_.addEventListener(evtType, handler);
+    }
+
+    /**
+     * Wrapper method to remove an event listener to the component's root element. This is most useful when
+     * unlistening for custom events.
+     * @param {string} evtType
+     * @param {!Function} handler
+     */
+
+  }, {
+    key: 'unlisten',
+    value: function unlisten(evtType, handler) {
+      this.root_.removeEventListener(evtType, handler);
+    }
+
+    /**
+     * Fires a cross-browser-compatible custom event from the component root of the given type,
+     * with the given data.
+     * @param {string} evtType
+     * @param {!Object} evtData
+     * @param {boolean=} shouldBubble
+     */
+
+  }, {
+    key: 'emit',
+    value: function emit(evtType, evtData) {
+      var shouldBubble = arguments.length > 2 && arguments[2] !== undefined ? arguments[2] : false;
+
+      var evt = void 0;
+      if (typeof CustomEvent === 'function') {
+        evt = new CustomEvent(evtType, {
+          detail: evtData,
+          bubbles: shouldBubble
+        });
+      } else {
+        evt = document.createEvent('CustomEvent');
+        evt.initCustomEvent(evtType, shouldBubble, false, evtData);
+      }
+
+      this.root_.dispatchEvent(evt);
+    }
+  }]);
+
+  return MDCComponent;
+}();
+
+/* harmony default export */ __webpack_exports__["a"] = (MDCComponent);
+
+/***/ }),
+
+/***/ 12:
+/***/ (function(module, __webpack_exports__, __webpack_require__) {
+
+"use strict";
+/* harmony import */ var __WEBPACK_IMPORTED_MODULE_0__constants__ = __webpack_require__(47);
+/* harmony reexport (binding) */ __webpack_require__.d(__webpack_exports__, "b", function() { return __WEBPACK_IMPORTED_MODULE_0__constants__["a"]; });
+/* harmony import */ var __WEBPACK_IMPORTED_MODULE_1__foundation__ = __webpack_require__(48);
+/* harmony reexport (binding) */ __webpack_require__.d(__webpack_exports__, "a", function() { return __WEBPACK_IMPORTED_MODULE_1__foundation__["a"]; });
+/**
+ * Copyright 2016 Google Inc. All Rights Reserved.
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *      http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+
+
+
+
+/***/ }),
+
+/***/ 13:
+/***/ (function(module, __webpack_exports__, __webpack_require__) {
+
+"use strict";
+Object.defineProperty(__webpack_exports__, "__esModule", { value: true });
+/* harmony export (immutable) */ __webpack_exports__["remapEvent"] = remapEvent;
+/* harmony export (immutable) */ __webpack_exports__["getTransformPropertyName"] = getTransformPropertyName;
+/* harmony export (immutable) */ __webpack_exports__["supportsCssCustomProperties"] = supportsCssCustomProperties;
+/* harmony export (immutable) */ __webpack_exports__["applyPassive"] = applyPassive;
+/* harmony export (immutable) */ __webpack_exports__["saveElementTabState"] = saveElementTabState;
+/* harmony export (immutable) */ __webpack_exports__["restoreElementTabState"] = restoreElementTabState;
+/**
+ * Copyright 2016 Google Inc. All Rights Reserved.
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *      http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+
+var TAB_DATA = 'data-mdc-tabindex';
+var TAB_DATA_HANDLED = 'data-mdc-tabindex-handled';
+
+var storedTransformPropertyName_ = void 0;
+var supportsPassive_ = void 0;
+
+// Remap touch events to pointer events, if the browser doesn't support touch events.
+function remapEvent(eventName) {
+  var globalObj = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : window;
+
+  if (!('ontouchstart' in globalObj.document)) {
+    switch (eventName) {
+      case 'touchstart':
+        return 'pointerdown';
+      case 'touchmove':
+        return 'pointermove';
+      case 'touchend':
+        return 'pointerup';
+      default:
+        return eventName;
+    }
+  }
+
+  return eventName;
+}
+
+// Choose the correct transform property to use on the current browser.
+function getTransformPropertyName() {
+  var globalObj = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : window;
+  var forceRefresh = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : false;
+
+  if (storedTransformPropertyName_ === undefined || forceRefresh) {
+    var el = globalObj.document.createElement('div');
+    var transformPropertyName = 'transform' in el.style ? 'transform' : '-webkit-transform';
+    storedTransformPropertyName_ = transformPropertyName;
+  }
+
+  return storedTransformPropertyName_;
+}
+
+// Determine whether the current browser supports CSS properties.
+function supportsCssCustomProperties() {
+  var globalObj = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : window;
+
+  if ('CSS' in globalObj) {
+    return globalObj.CSS.supports('(--color: red)');
+  }
+  return false;
+}
+
+// Determine whether the current browser supports passive event listeners, and if so, use them.
+function applyPassive() {
+  var globalObj = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : window;
+  var forceRefresh = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : false;
+
+  if (supportsPassive_ === undefined || forceRefresh) {
+    var isSupported = false;
+    try {
+      globalObj.document.addEventListener('test', null, { get passive() {
+          isSupported = true;
+        } });
+    } catch (e) {}
+
+    supportsPassive_ = isSupported;
+  }
+
+  return supportsPassive_ ? { passive: true } : false;
+}
+
+// Save the tab state for an element.
+function saveElementTabState(el) {
+  if (el.hasAttribute('tabindex')) {
+    el.setAttribute(TAB_DATA, el.getAttribute('tabindex'));
+  }
+  el.setAttribute(TAB_DATA_HANDLED, true);
+}
+
+// Restore the tab state for an element, if it was saved.
+function restoreElementTabState(el) {
+  // Only modify elements we've already handled, in case anything was dynamically added since we saved state.
+  if (el.hasAttribute(TAB_DATA_HANDLED)) {
+    if (el.hasAttribute(TAB_DATA)) {
+      el.setAttribute('tabindex', el.getAttribute(TAB_DATA));
+      el.removeAttribute(TAB_DATA);
+    } else {
+      el.removeAttribute('tabindex');
+    }
+    el.removeAttribute(TAB_DATA_HANDLED);
+  }
+}
+
+/***/ }),
+
+/***/ 2:
+/***/ (function(module, __webpack_exports__, __webpack_require__) {
+
+"use strict";
+Object.defineProperty(__webpack_exports__, "__esModule", { value: true });
+/* harmony import */ var __WEBPACK_IMPORTED_MODULE_0__foundation__ = __webpack_require__(0);
+/* harmony import */ var __WEBPACK_IMPORTED_MODULE_1__component__ = __webpack_require__(1);
+/* harmony import */ var __WEBPACK_IMPORTED_MODULE_2__selection_control__ = __webpack_require__(3);
+/* harmony reexport (binding) */ __webpack_require__.d(__webpack_exports__, "MDCFoundation", function() { return __WEBPACK_IMPORTED_MODULE_0__foundation__["a"]; });
+/* harmony reexport (binding) */ __webpack_require__.d(__webpack_exports__, "MDCComponent", function() { return __WEBPACK_IMPORTED_MODULE_1__component__["a"]; });
+/* harmony reexport (binding) */ __webpack_require__.d(__webpack_exports__, "SelectionControlState", function() { return __WEBPACK_IMPORTED_MODULE_2__selection_control__["a"]; });
+/**
+ * Copyright 2016 Google Inc.
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *   http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+
+
+
+
+
+
+
+/***/ }),
+
+/***/ 26:
+/***/ (function(module, __webpack_exports__, __webpack_require__) {
+
+"use strict";
+Object.defineProperty(__webpack_exports__, "__esModule", { value: true });
+/* harmony import */ var __WEBPACK_IMPORTED_MODULE_0__util__ = __webpack_require__(13);
+/* harmony import */ var __WEBPACK_IMPORTED_MODULE_1__temporary__ = __webpack_require__(51);
+/* harmony reexport (binding) */ __webpack_require__.d(__webpack_exports__, "MDCTemporaryDrawer", function() { return __WEBPACK_IMPORTED_MODULE_1__temporary__["a"]; });
+/* harmony reexport (binding) */ __webpack_require__.d(__webpack_exports__, "MDCTemporaryDrawerFoundation", function() { return __WEBPACK_IMPORTED_MODULE_1__temporary__["b"]; });
+/* harmony import */ var __WEBPACK_IMPORTED_MODULE_2__persistent__ = __webpack_require__(46);
+/* harmony reexport (binding) */ __webpack_require__.d(__webpack_exports__, "MDCPersistentDrawer", function() { return __WEBPACK_IMPORTED_MODULE_2__persistent__["a"]; });
+/* harmony reexport (binding) */ __webpack_require__.d(__webpack_exports__, "MDCPersistentDrawerFoundation", function() { return __WEBPACK_IMPORTED_MODULE_2__persistent__["b"]; });
+/* harmony reexport (module object) */ __webpack_require__.d(__webpack_exports__, "util", function() { return __WEBPACK_IMPORTED_MODULE_0__util__; });
+/**
+ * Copyright 2016 Google Inc. All Rights Reserved.
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *      http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+
+
+
+
+
+
+/***/ }),
+
+/***/ 3:
+/***/ (function(module, __webpack_exports__, __webpack_require__) {
+
+"use strict";
+/* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, "a", function() { return SelectionControlState; });
+/**
+ * Copyright 2017 Google Inc. All Rights Reserved.
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *      http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+
+/**
+ * @typedef {!{
+ *   checked: boolean,
+ *   indeterminate: boolean,
+ *   disabled: boolean,
+ *   value: ?string
+ * }}
+ */
+var SelectionControlState = void 0;
+
+/***/ }),
+
+/***/ 44:
+/***/ (function(module, __webpack_exports__, __webpack_require__) {
+
+"use strict";
+/* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, "a", function() { return cssClasses; });
+/* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, "b", function() { return strings; });
+/* harmony import */ var __WEBPACK_IMPORTED_MODULE_0__slidable__ = __webpack_require__(12);
+/**
+ * Copyright 2016 Google Inc. All Rights Reserved.
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *      http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+
+
+
+var cssClasses = {
+  ROOT: 'mdc-persistent-drawer',
+  OPEN: 'mdc-persistent-drawer--open',
+  ANIMATING: 'mdc-persistent-drawer--animating'
+};
+
+var strings = {
+  DRAWER_SELECTOR: '.mdc-persistent-drawer__drawer',
+  FOCUSABLE_ELEMENTS: __WEBPACK_IMPORTED_MODULE_0__slidable__["b" /* FOCUSABLE_ELEMENTS */],
+  OPEN_EVENT: 'MDCPersistentDrawer:open',
+  CLOSE_EVENT: 'MDCPersistentDrawer:close'
+};
+
+/***/ }),
+
+/***/ 45:
+/***/ (function(module, __webpack_exports__, __webpack_require__) {
+
+"use strict";
+/* harmony import */ var __WEBPACK_IMPORTED_MODULE_0__slidable__ = __webpack_require__(12);
+/* harmony import */ var __WEBPACK_IMPORTED_MODULE_1__constants__ = __webpack_require__(44);
+var _extends = Object.assign || function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; };
+
+var _createClass = function () { function defineProperties(target, props) { for (var i = 0; i < props.length; i++) { var descriptor = props[i]; descriptor.enumerable = descriptor.enumerable || false; descriptor.configurable = true; if ("value" in descriptor) descriptor.writable = true; Object.defineProperty(target, descriptor.key, descriptor); } } return function (Constructor, protoProps, staticProps) { if (protoProps) defineProperties(Constructor.prototype, protoProps); if (staticProps) defineProperties(Constructor, staticProps); return Constructor; }; }();
+
+function _classCallCheck(instance, Constructor) { if (!(instance instanceof Constructor)) { throw new TypeError("Cannot call a class as a function"); } }
+
+function _possibleConstructorReturn(self, call) { if (!self) { throw new ReferenceError("this hasn't been initialised - super() hasn't been called"); } return call && (typeof call === "object" || typeof call === "function") ? call : self; }
+
+function _inherits(subClass, superClass) { if (typeof superClass !== "function" && superClass !== null) { throw new TypeError("Super expression must either be null or a function, not " + typeof superClass); } subClass.prototype = Object.create(superClass && superClass.prototype, { constructor: { value: subClass, enumerable: false, writable: true, configurable: true } }); if (superClass) Object.setPrototypeOf ? Object.setPrototypeOf(subClass, superClass) : subClass.__proto__ = superClass; }
+
+/**
+ * Copyright 2016 Google Inc. All Rights Reserved.
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *      http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+
+
+
+
+var MDCPersistentDrawerFoundation = function (_MDCSlidableDrawerFou) {
+  _inherits(MDCPersistentDrawerFoundation, _MDCSlidableDrawerFou);
+
+  _createClass(MDCPersistentDrawerFoundation, null, [{
+    key: 'cssClasses',
+    get: function get() {
+      return __WEBPACK_IMPORTED_MODULE_1__constants__["a" /* cssClasses */];
+    }
+  }, {
+    key: 'strings',
+    get: function get() {
+      return __WEBPACK_IMPORTED_MODULE_1__constants__["b" /* strings */];
+    }
+  }, {
+    key: 'defaultAdapter',
+    get: function get() {
+      return _extends(__WEBPACK_IMPORTED_MODULE_0__slidable__["a" /* MDCSlidableDrawerFoundation */].defaultAdapter, {
+        isDrawer: function isDrawer() {
+          return false;
+        }
+      });
+    }
+  }]);
+
+  function MDCPersistentDrawerFoundation(adapter) {
+    _classCallCheck(this, MDCPersistentDrawerFoundation);
+
+    return _possibleConstructorReturn(this, (MDCPersistentDrawerFoundation.__proto__ || Object.getPrototypeOf(MDCPersistentDrawerFoundation)).call(this, _extends(MDCPersistentDrawerFoundation.defaultAdapter, adapter), MDCPersistentDrawerFoundation.cssClasses.ROOT, MDCPersistentDrawerFoundation.cssClasses.ANIMATING, MDCPersistentDrawerFoundation.cssClasses.OPEN));
+  }
+
+  _createClass(MDCPersistentDrawerFoundation, [{
+    key: 'isRootTransitioningEventTarget_',
+    value: function isRootTransitioningEventTarget_(el) {
+      return this.adapter_.isDrawer(el);
+    }
+  }]);
+
+  return MDCPersistentDrawerFoundation;
+}(__WEBPACK_IMPORTED_MODULE_0__slidable__["a" /* MDCSlidableDrawerFoundation */]);
+
+/* harmony default export */ __webpack_exports__["a"] = (MDCPersistentDrawerFoundation);
+
+/***/ }),
+
+/***/ 46:
+/***/ (function(module, __webpack_exports__, __webpack_require__) {
+
+"use strict";
+/* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, "a", function() { return MDCPersistentDrawer; });
+/* harmony import */ var __WEBPACK_IMPORTED_MODULE_0__material_base__ = __webpack_require__(2);
+/* harmony import */ var __WEBPACK_IMPORTED_MODULE_1__foundation__ = __webpack_require__(45);
+/* harmony import */ var __WEBPACK_IMPORTED_MODULE_2__util__ = __webpack_require__(13);
+/* harmony reexport (binding) */ __webpack_require__.d(__webpack_exports__, "b", function() { return __WEBPACK_IMPORTED_MODULE_1__foundation__["a"]; });
+/* unused harmony reexport util */
+var _createClass = function () { function defineProperties(target, props) { for (var i = 0; i < props.length; i++) { var descriptor = props[i]; descriptor.enumerable = descriptor.enumerable || false; descriptor.configurable = true; if ("value" in descriptor) descriptor.writable = true; Object.defineProperty(target, descriptor.key, descriptor); } } return function (Constructor, protoProps, staticProps) { if (protoProps) defineProperties(Constructor.prototype, protoProps); if (staticProps) defineProperties(Constructor, staticProps); return Constructor; }; }();
+
+function _classCallCheck(instance, Constructor) { if (!(instance instanceof Constructor)) { throw new TypeError("Cannot call a class as a function"); } }
+
+function _possibleConstructorReturn(self, call) { if (!self) { throw new ReferenceError("this hasn't been initialised - super() hasn't been called"); } return call && (typeof call === "object" || typeof call === "function") ? call : self; }
+
+function _inherits(subClass, superClass) { if (typeof superClass !== "function" && superClass !== null) { throw new TypeError("Super expression must either be null or a function, not " + typeof superClass); } subClass.prototype = Object.create(superClass && superClass.prototype, { constructor: { value: subClass, enumerable: false, writable: true, configurable: true } }); if (superClass) Object.setPrototypeOf ? Object.setPrototypeOf(subClass, superClass) : subClass.__proto__ = superClass; }
+
+/**
+ * Copyright 2016 Google Inc. All Rights Reserved.
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *      http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+
+
+
+
+
+
+
+
+var MDCPersistentDrawer = function (_MDCComponent) {
+  _inherits(MDCPersistentDrawer, _MDCComponent);
+
+  function MDCPersistentDrawer() {
+    _classCallCheck(this, MDCPersistentDrawer);
+
+    return _possibleConstructorReturn(this, (MDCPersistentDrawer.__proto__ || Object.getPrototypeOf(MDCPersistentDrawer)).apply(this, arguments));
+  }
+
+  _createClass(MDCPersistentDrawer, [{
+    key: 'getDefaultFoundation',
+    value: function getDefaultFoundation() {
+      var _this2 = this;
+
+      var FOCUSABLE_ELEMENTS = __WEBPACK_IMPORTED_MODULE_1__foundation__["a" /* default */].strings.FOCUSABLE_ELEMENTS;
+
+
+      return new __WEBPACK_IMPORTED_MODULE_1__foundation__["a" /* default */]({
+        addClass: function addClass(className) {
+          return _this2.root_.classList.add(className);
+        },
+        removeClass: function removeClass(className) {
+          return _this2.root_.classList.remove(className);
+        },
+        hasClass: function hasClass(className) {
+          return _this2.root_.classList.contains(className);
+        },
+        hasNecessaryDom: function hasNecessaryDom() {
+          return Boolean(_this2.drawer);
+        },
+        registerInteractionHandler: function registerInteractionHandler(evt, handler) {
+          return _this2.root_.addEventListener(__WEBPACK_IMPORTED_MODULE_2__util__["remapEvent"](evt), handler, __WEBPACK_IMPORTED_MODULE_2__util__["applyPassive"]());
+        },
+        deregisterInteractionHandler: function deregisterInteractionHandler(evt, handler) {
+          return _this2.root_.removeEventListener(__WEBPACK_IMPORTED_MODULE_2__util__["remapEvent"](evt), handler, __WEBPACK_IMPORTED_MODULE_2__util__["applyPassive"]());
+        },
+        registerDrawerInteractionHandler: function registerDrawerInteractionHandler(evt, handler) {
+          return _this2.drawer.addEventListener(__WEBPACK_IMPORTED_MODULE_2__util__["remapEvent"](evt), handler);
+        },
+        deregisterDrawerInteractionHandler: function deregisterDrawerInteractionHandler(evt, handler) {
+          return _this2.drawer.removeEventListener(__WEBPACK_IMPORTED_MODULE_2__util__["remapEvent"](evt), handler);
+        },
+        registerTransitionEndHandler: function registerTransitionEndHandler(handler) {
+          return _this2.root_.addEventListener('transitionend', handler);
+        },
+        deregisterTransitionEndHandler: function deregisterTransitionEndHandler(handler) {
+          return _this2.root_.removeEventListener('transitionend', handler);
+        },
+        registerDocumentKeydownHandler: function registerDocumentKeydownHandler(handler) {
+          return document.addEventListener('keydown', handler);
+        },
+        deregisterDocumentKeydownHandler: function deregisterDocumentKeydownHandler(handler) {
+          return document.removeEventListener('keydown', handler);
+        },
+        getDrawerWidth: function getDrawerWidth() {
+          return _this2.drawer.offsetWidth;
+        },
+        setTranslateX: function setTranslateX(value) {
+          return _this2.drawer.style.setProperty(__WEBPACK_IMPORTED_MODULE_2__util__["getTransformPropertyName"](), value === null ? null : 'translateX(' + value + 'px)');
+        },
+        getFocusableElements: function getFocusableElements() {
+          return _this2.drawer.querySelectorAll(FOCUSABLE_ELEMENTS);
+        },
+        saveElementTabState: function saveElementTabState(el) {
+          return __WEBPACK_IMPORTED_MODULE_2__util__["saveElementTabState"](el);
+        },
+        restoreElementTabState: function restoreElementTabState(el) {
+          return __WEBPACK_IMPORTED_MODULE_2__util__["restoreElementTabState"](el);
+        },
+        makeElementUntabbable: function makeElementUntabbable(el) {
+          return el.setAttribute('tabindex', -1);
+        },
+        notifyOpen: function notifyOpen() {
+          return _this2.emit(__WEBPACK_IMPORTED_MODULE_1__foundation__["a" /* default */].strings.OPEN_EVENT);
+        },
+        notifyClose: function notifyClose() {
+          return _this2.emit(__WEBPACK_IMPORTED_MODULE_1__foundation__["a" /* default */].strings.CLOSE_EVENT);
+        },
+        isRtl: function isRtl() {
+          return getComputedStyle(_this2.root_).getPropertyValue('direction') === 'rtl';
+        },
+        isDrawer: function isDrawer(el) {
+          return el === _this2.drawer;
+        }
+      });
+    }
+  }, {
+    key: 'open',
+    get: function get() {
+      return this.foundation_.isOpen();
+    },
+    set: function set(value) {
+      if (value) {
+        this.foundation_.open();
+      } else {
+        this.foundation_.close();
+      }
+    }
+
+    // Return the drawer element inside the component.
+
+  }, {
+    key: 'drawer',
+    get: function get() {
+      return this.root_.querySelector(__WEBPACK_IMPORTED_MODULE_1__foundation__["a" /* default */].strings.DRAWER_SELECTOR);
+    }
+  }], [{
+    key: 'attachTo',
+    value: function attachTo(root) {
+      return new MDCPersistentDrawer(root);
+    }
+  }]);
+
+  return MDCPersistentDrawer;
+}(__WEBPACK_IMPORTED_MODULE_0__material_base__["MDCComponent"]);
+
+/***/ }),
+
+/***/ 47:
+/***/ (function(module, __webpack_exports__, __webpack_require__) {
+
+"use strict";
+/* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, "a", function() { return FOCUSABLE_ELEMENTS; });
+/**
+ * Copyright 2016 Google Inc. All Rights Reserved.
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *      http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+
+var FOCUSABLE_ELEMENTS = 'a[href], area[href], input:not([disabled]), select:not([disabled]), textarea:not([disabled]), ' + 'button:not([disabled]), iframe, object, embed, [tabindex], [contenteditable]';
+
+/***/ }),
+
+/***/ 48:
+/***/ (function(module, __webpack_exports__, __webpack_require__) {
+
+"use strict";
+/* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, "a", function() { return MDCSlidableDrawerFoundation; });
+/* harmony import */ var __WEBPACK_IMPORTED_MODULE_0__material_base__ = __webpack_require__(2);
+var _extends = Object.assign || function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; };
+
+var _createClass = function () { function defineProperties(target, props) { for (var i = 0; i < props.length; i++) { var descriptor = props[i]; descriptor.enumerable = descriptor.enumerable || false; descriptor.configurable = true; if ("value" in descriptor) descriptor.writable = true; Object.defineProperty(target, descriptor.key, descriptor); } } return function (Constructor, protoProps, staticProps) { if (protoProps) defineProperties(Constructor.prototype, protoProps); if (staticProps) defineProperties(Constructor, staticProps); return Constructor; }; }();
+
+function _classCallCheck(instance, Constructor) { if (!(instance instanceof Constructor)) { throw new TypeError("Cannot call a class as a function"); } }
+
+function _possibleConstructorReturn(self, call) { if (!self) { throw new ReferenceError("this hasn't been initialised - super() hasn't been called"); } return call && (typeof call === "object" || typeof call === "function") ? call : self; }
+
+function _inherits(subClass, superClass) { if (typeof superClass !== "function" && superClass !== null) { throw new TypeError("Super expression must either be null or a function, not " + typeof superClass); } subClass.prototype = Object.create(superClass && superClass.prototype, { constructor: { value: subClass, enumerable: false, writable: true, configurable: true } }); if (superClass) Object.setPrototypeOf ? Object.setPrototypeOf(subClass, superClass) : subClass.__proto__ = superClass; }
+
+/**
+ * Copyright 2016 Google Inc. All Rights Reserved.
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *      http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+
+
+
+var MDCSlidableDrawerFoundation = function (_MDCFoundation) {
+  _inherits(MDCSlidableDrawerFoundation, _MDCFoundation);
+
+  _createClass(MDCSlidableDrawerFoundation, null, [{
+    key: 'defaultAdapter',
+    get: function get() {
+      return {
+        addClass: function addClass() /* className: string */{},
+        removeClass: function removeClass() /* className: string */{},
+        hasClass: function hasClass() /* className: string */{},
+        hasNecessaryDom: function hasNecessaryDom() {
+          return (/* boolean */false
+          );
+        },
+        registerInteractionHandler: function registerInteractionHandler() /* evt: string, handler: EventListener */{},
+        deregisterInteractionHandler: function deregisterInteractionHandler() /* evt: string, handler: EventListener */{},
+        registerDrawerInteractionHandler: function registerDrawerInteractionHandler() /* evt: string, handler: EventListener */{},
+        deregisterDrawerInteractionHandler: function deregisterDrawerInteractionHandler() /* evt: string, handler: EventListener */{},
+        registerTransitionEndHandler: function registerTransitionEndHandler() /* handler: EventListener */{},
+        deregisterTransitionEndHandler: function deregisterTransitionEndHandler() /* handler: EventListener */{},
+        registerDocumentKeydownHandler: function registerDocumentKeydownHandler() /* handler: EventListener */{},
+        deregisterDocumentKeydownHandler: function deregisterDocumentKeydownHandler() /* handler: EventListener */{},
+        setTranslateX: function setTranslateX() /* value: number | null */{},
+        getFocusableElements: function getFocusableElements() /* NodeList */{},
+        saveElementTabState: function saveElementTabState() /* el: Element */{},
+        restoreElementTabState: function restoreElementTabState() /* el: Element */{},
+        makeElementUntabbable: function makeElementUntabbable() /* el: Element */{},
+        notifyOpen: function notifyOpen() {},
+        notifyClose: function notifyClose() {},
+        isRtl: function isRtl() {
+          return (/* boolean */false
+          );
+        },
+        getDrawerWidth: function getDrawerWidth() {
+          return (/* number */0
+          );
+        }
+      };
+    }
+  }]);
+
+  function MDCSlidableDrawerFoundation(adapter, rootCssClass, animatingCssClass, openCssClass) {
+    _classCallCheck(this, MDCSlidableDrawerFoundation);
+
+    var _this = _possibleConstructorReturn(this, (MDCSlidableDrawerFoundation.__proto__ || Object.getPrototypeOf(MDCSlidableDrawerFoundation)).call(this, _extends(MDCSlidableDrawerFoundation.defaultAdapter, adapter)));
+
+    _this.rootCssClass_ = rootCssClass;
+    _this.animatingCssClass_ = animatingCssClass;
+    _this.openCssClass_ = openCssClass;
+
+    _this.transitionEndHandler_ = function (evt) {
+      return _this.handleTransitionEnd_(evt);
+    };
+
+    _this.inert_ = false;
+
+    _this.drawerClickHandler_ = function (evt) {
+      return evt.stopPropagation();
+    };
+    _this.componentTouchStartHandler_ = function (evt) {
+      return _this.handleTouchStart_(evt);
+    };
+    _this.componentTouchMoveHandler_ = function (evt) {
+      return _this.handleTouchMove_(evt);
+    };
+    _this.componentTouchEndHandler_ = function (evt) {
+      return _this.handleTouchEnd_(evt);
+    };
+    _this.documentKeydownHandler_ = function (evt) {
+      if (evt.key && evt.key === 'Escape' || evt.keyCode === 27) {
+        _this.close();
+      }
+    };
+    return _this;
+  }
+
+  _createClass(MDCSlidableDrawerFoundation, [{
+    key: 'init',
+    value: function init() {
+      var ROOT = this.rootCssClass_;
+      var OPEN = this.openCssClass_;
+
+      if (!this.adapter_.hasClass(ROOT)) {
+        throw new Error(ROOT + ' class required in root element.');
+      }
+
+      if (!this.adapter_.hasNecessaryDom()) {
+        throw new Error('Required DOM nodes missing in ' + ROOT + ' component.');
+      }
+
+      if (this.adapter_.hasClass(OPEN)) {
+        this.isOpen_ = true;
+      } else {
+        this.detabinate_();
+        this.isOpen_ = false;
+      }
+
+      this.adapter_.registerDrawerInteractionHandler('click', this.drawerClickHandler_);
+      this.adapter_.registerDrawerInteractionHandler('touchstart', this.componentTouchStartHandler_);
+      this.adapter_.registerInteractionHandler('touchmove', this.componentTouchMoveHandler_);
+      this.adapter_.registerInteractionHandler('touchend', this.componentTouchEndHandler_);
+    }
+  }, {
+    key: 'destroy',
+    value: function destroy() {
+      this.adapter_.deregisterDrawerInteractionHandler('click', this.drawerClickHandler_);
+      this.adapter_.deregisterDrawerInteractionHandler('touchstart', this.componentTouchStartHandler_);
+      this.adapter_.deregisterInteractionHandler('touchmove', this.componentTouchMoveHandler_);
+      this.adapter_.deregisterInteractionHandler('touchend', this.componentTouchEndHandler_);
+      // Deregister the document keydown handler just in case the component is destroyed while the menu is open.
+      this.adapter_.deregisterDocumentKeydownHandler(this.documentKeydownHandler_);
+    }
+  }, {
+    key: 'open',
+    value: function open() {
+      this.adapter_.registerTransitionEndHandler(this.transitionEndHandler_);
+      this.adapter_.registerDocumentKeydownHandler(this.documentKeydownHandler_);
+      this.adapter_.addClass(this.animatingCssClass_);
+      this.adapter_.addClass(this.openCssClass_);
+      this.retabinate_();
+      // Debounce multiple calls
+      if (!this.isOpen_) {
+        this.adapter_.notifyOpen();
+      }
+      this.isOpen_ = true;
+    }
+  }, {
+    key: 'close',
+    value: function close() {
+      this.adapter_.deregisterDocumentKeydownHandler(this.documentKeydownHandler_);
+      this.adapter_.registerTransitionEndHandler(this.transitionEndHandler_);
+      this.adapter_.addClass(this.animatingCssClass_);
+      this.adapter_.removeClass(this.openCssClass_);
+      this.detabinate_();
+      // Debounce multiple calls
+      if (this.isOpen_) {
+        this.adapter_.notifyClose();
+      }
+      this.isOpen_ = false;
+    }
+  }, {
+    key: 'isOpen',
+    value: function isOpen() {
+      return this.isOpen_;
+    }
+
+    /**
+     *  Render all children of the drawer inert when it's closed.
+     */
+
+  }, {
+    key: 'detabinate_',
+    value: function detabinate_() {
+      if (this.inert_) {
+        return;
+      }
+
+      var elements = this.adapter_.getFocusableElements();
+      if (elements) {
+        for (var i = 0; i < elements.length; i++) {
+          this.adapter_.saveElementTabState(elements[i]);
+          this.adapter_.makeElementUntabbable(elements[i]);
+        }
+      }
+
+      this.inert_ = true;
+    }
+
+    /**
+     *  Make all children of the drawer tabbable again when it's open.
+     */
+
+  }, {
+    key: 'retabinate_',
+    value: function retabinate_() {
+      if (!this.inert_) {
+        return;
+      }
+
+      var elements = this.adapter_.getFocusableElements();
+      if (elements) {
+        for (var i = 0; i < elements.length; i++) {
+          this.adapter_.restoreElementTabState(elements[i]);
+        }
+      }
+
+      this.inert_ = false;
+    }
+  }, {
+    key: 'handleTouchStart_',
+    value: function handleTouchStart_(evt) {
+      if (!this.adapter_.hasClass(this.openCssClass_)) {
+        return;
+      }
+      if (evt.pointerType && evt.pointerType !== 'touch') {
+        return;
+      }
+
+      this.direction_ = this.adapter_.isRtl() ? -1 : 1;
+      this.drawerWidth_ = this.adapter_.getDrawerWidth();
+      this.startX_ = evt.touches ? evt.touches[0].pageX : evt.pageX;
+      this.currentX_ = this.startX_;
+
+      this.updateRaf_ = requestAnimationFrame(this.updateDrawer_.bind(this));
+    }
+  }, {
+    key: 'handleTouchMove_',
+    value: function handleTouchMove_(evt) {
+      if (evt.pointerType && evt.pointerType !== 'touch') {
+        return;
+      }
+
+      this.currentX_ = evt.touches ? evt.touches[0].pageX : evt.pageX;
+    }
+  }, {
+    key: 'handleTouchEnd_',
+    value: function handleTouchEnd_(evt) {
+      if (evt.pointerType && evt.pointerType !== 'touch') {
+        return;
+      }
+
+      this.prepareForTouchEnd_();
+
+      // Did the user close the drawer by more than 50%?
+      if (Math.abs(this.newPosition_ / this.drawerWidth_) >= 0.5) {
+        this.close();
+      } else {
+        // Triggering an open here means we'll get a nice animation back to the fully open state.
+        this.open();
+      }
+    }
+  }, {
+    key: 'prepareForTouchEnd_',
+    value: function prepareForTouchEnd_() {
+      cancelAnimationFrame(this.updateRaf_);
+      this.adapter_.setTranslateX(null);
+    }
+  }, {
+    key: 'updateDrawer_',
+    value: function updateDrawer_() {
+      this.updateRaf_ = requestAnimationFrame(this.updateDrawer_.bind(this));
+      this.adapter_.setTranslateX(this.newPosition_);
+    }
+  }, {
+    key: 'isRootTransitioningEventTarget_',
+    value: function isRootTransitioningEventTarget_() {
+      // Classes extending MDCSlidableDrawerFoundation should implement this method to return true or false
+      // if the event target is the root event target currently transitioning.
+      return false;
+    }
+  }, {
+    key: 'handleTransitionEnd_',
+    value: function handleTransitionEnd_(evt) {
+      if (this.isRootTransitioningEventTarget_(evt.target)) {
+        this.adapter_.removeClass(this.animatingCssClass_);
+        this.adapter_.deregisterTransitionEndHandler(this.transitionEndHandler_);
+      }
+    }
+  }, {
+    key: 'newPosition_',
+    get: function get() {
+      var newPos = null;
+
+      if (this.direction_ === 1) {
+        newPos = Math.min(0, this.currentX_ - this.startX_);
+      } else {
+        newPos = Math.max(0, this.currentX_ - this.startX_);
+      }
+
+      return newPos;
+    }
+  }]);
+
+  return MDCSlidableDrawerFoundation;
+}(__WEBPACK_IMPORTED_MODULE_0__material_base__["MDCFoundation"]);
+
+/***/ }),
+
+/***/ 49:
+/***/ (function(module, __webpack_exports__, __webpack_require__) {
+
+"use strict";
+/* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, "a", function() { return cssClasses; });
+/* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, "b", function() { return strings; });
+/* harmony import */ var __WEBPACK_IMPORTED_MODULE_0__slidable__ = __webpack_require__(12);
+/**
+ * Copyright 2016 Google Inc. All Rights Reserved.
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *      http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+
+
+
+var cssClasses = {
+  ROOT: 'mdc-temporary-drawer',
+  OPEN: 'mdc-temporary-drawer--open',
+  ANIMATING: 'mdc-temporary-drawer--animating',
+  SCROLL_LOCK: 'mdc-drawer-scroll-lock'
+};
+
+var strings = {
+  DRAWER_SELECTOR: '.mdc-temporary-drawer__drawer',
+  OPACITY_VAR_NAME: '--mdc-temporary-drawer-opacity',
+  FOCUSABLE_ELEMENTS: __WEBPACK_IMPORTED_MODULE_0__slidable__["b" /* FOCUSABLE_ELEMENTS */],
+  OPEN_EVENT: 'MDCTemporaryDrawer:open',
+  CLOSE_EVENT: 'MDCTemporaryDrawer:close'
+};
+
+/***/ }),
+
+/***/ 50:
+/***/ (function(module, __webpack_exports__, __webpack_require__) {
+
+"use strict";
+/* harmony import */ var __WEBPACK_IMPORTED_MODULE_0__slidable__ = __webpack_require__(12);
+/* harmony import */ var __WEBPACK_IMPORTED_MODULE_1__constants__ = __webpack_require__(49);
+var _extends = Object.assign || function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; };
+
+var _get = function get(object, property, receiver) { if (object === null) object = Function.prototype; var desc = Object.getOwnPropertyDescriptor(object, property); if (desc === undefined) { var parent = Object.getPrototypeOf(object); if (parent === null) { return undefined; } else { return get(parent, property, receiver); } } else if ("value" in desc) { return desc.value; } else { var getter = desc.get; if (getter === undefined) { return undefined; } return getter.call(receiver); } };
+
+var _createClass = function () { function defineProperties(target, props) { for (var i = 0; i < props.length; i++) { var descriptor = props[i]; descriptor.enumerable = descriptor.enumerable || false; descriptor.configurable = true; if ("value" in descriptor) descriptor.writable = true; Object.defineProperty(target, descriptor.key, descriptor); } } return function (Constructor, protoProps, staticProps) { if (protoProps) defineProperties(Constructor.prototype, protoProps); if (staticProps) defineProperties(Constructor, staticProps); return Constructor; }; }();
+
+function _classCallCheck(instance, Constructor) { if (!(instance instanceof Constructor)) { throw new TypeError("Cannot call a class as a function"); } }
+
+function _possibleConstructorReturn(self, call) { if (!self) { throw new ReferenceError("this hasn't been initialised - super() hasn't been called"); } return call && (typeof call === "object" || typeof call === "function") ? call : self; }
+
+function _inherits(subClass, superClass) { if (typeof superClass !== "function" && superClass !== null) { throw new TypeError("Super expression must either be null or a function, not " + typeof superClass); } subClass.prototype = Object.create(superClass && superClass.prototype, { constructor: { value: subClass, enumerable: false, writable: true, configurable: true } }); if (superClass) Object.setPrototypeOf ? Object.setPrototypeOf(subClass, superClass) : subClass.__proto__ = superClass; }
+
+/**
+ * Copyright 2016 Google Inc. All Rights Reserved.
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *      http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+
+
+
+
+var MDCTemporaryDrawerFoundation = function (_MDCSlidableDrawerFou) {
+  _inherits(MDCTemporaryDrawerFoundation, _MDCSlidableDrawerFou);
+
+  _createClass(MDCTemporaryDrawerFoundation, null, [{
+    key: 'cssClasses',
+    get: function get() {
+      return __WEBPACK_IMPORTED_MODULE_1__constants__["a" /* cssClasses */];
+    }
+  }, {
+    key: 'strings',
+    get: function get() {
+      return __WEBPACK_IMPORTED_MODULE_1__constants__["b" /* strings */];
+    }
+  }, {
+    key: 'defaultAdapter',
+    get: function get() {
+      return _extends(__WEBPACK_IMPORTED_MODULE_0__slidable__["a" /* MDCSlidableDrawerFoundation */].defaultAdapter, {
+        addBodyClass: function addBodyClass() /* className: string */{},
+        removeBodyClass: function removeBodyClass() /* className: string */{},
+        isDrawer: function isDrawer() {
+          return false;
+        },
+        updateCssVariable: function updateCssVariable() /* value: string */{}
+      });
+    }
+  }]);
+
+  function MDCTemporaryDrawerFoundation(adapter) {
+    _classCallCheck(this, MDCTemporaryDrawerFoundation);
+
+    var _this = _possibleConstructorReturn(this, (MDCTemporaryDrawerFoundation.__proto__ || Object.getPrototypeOf(MDCTemporaryDrawerFoundation)).call(this, _extends(MDCTemporaryDrawerFoundation.defaultAdapter, adapter), MDCTemporaryDrawerFoundation.cssClasses.ROOT, MDCTemporaryDrawerFoundation.cssClasses.ANIMATING, MDCTemporaryDrawerFoundation.cssClasses.OPEN));
+
+    _this.componentClickHandler_ = function () {
+      return _this.close();
+    };
+    return _this;
+  }
+
+  _createClass(MDCTemporaryDrawerFoundation, [{
+    key: 'init',
+    value: function init() {
+      _get(MDCTemporaryDrawerFoundation.prototype.__proto__ || Object.getPrototypeOf(MDCTemporaryDrawerFoundation.prototype), 'init', this).call(this);
+
+      // Make browser aware of custom property being used in this element.
+      // Workaround for certain types of hard-to-reproduce heisenbugs.
+      this.adapter_.updateCssVariable(0);
+      this.adapter_.registerInteractionHandler('click', this.componentClickHandler_);
+    }
+  }, {
+    key: 'destroy',
+    value: function destroy() {
+      _get(MDCTemporaryDrawerFoundation.prototype.__proto__ || Object.getPrototypeOf(MDCTemporaryDrawerFoundation.prototype), 'destroy', this).call(this);
+
+      this.adapter_.deregisterInteractionHandler('click', this.componentClickHandler_);
+      this.enableScroll_();
+    }
+  }, {
+    key: 'open',
+    value: function open() {
+      this.disableScroll_();
+      // Make sure custom property values are cleared before starting.
+      this.adapter_.updateCssVariable('');
+
+      _get(MDCTemporaryDrawerFoundation.prototype.__proto__ || Object.getPrototypeOf(MDCTemporaryDrawerFoundation.prototype), 'open', this).call(this);
+    }
+  }, {
+    key: 'close',
+    value: function close() {
+      // Make sure custom property values are cleared before making any changes.
+      this.adapter_.updateCssVariable('');
+
+      _get(MDCTemporaryDrawerFoundation.prototype.__proto__ || Object.getPrototypeOf(MDCTemporaryDrawerFoundation.prototype), 'close', this).call(this);
+    }
+  }, {
+    key: 'prepareForTouchEnd_',
+    value: function prepareForTouchEnd_() {
+      _get(MDCTemporaryDrawerFoundation.prototype.__proto__ || Object.getPrototypeOf(MDCTemporaryDrawerFoundation.prototype), 'prepareForTouchEnd_', this).call(this);
+
+      this.adapter_.updateCssVariable('');
+    }
+  }, {
+    key: 'updateDrawer_',
+    value: function updateDrawer_() {
+      _get(MDCTemporaryDrawerFoundation.prototype.__proto__ || Object.getPrototypeOf(MDCTemporaryDrawerFoundation.prototype), 'updateDrawer_', this).call(this);
+
+      var newOpacity = Math.max(0, 1 + this.direction_ * (this.newPosition_ / this.drawerWidth_));
+      this.adapter_.updateCssVariable(newOpacity);
+    }
+  }, {
+    key: 'isRootTransitioningEventTarget_',
+    value: function isRootTransitioningEventTarget_(el) {
+      return this.adapter_.isDrawer(el);
+    }
+  }, {
+    key: 'handleTransitionEnd_',
+    value: function handleTransitionEnd_(evt) {
+      _get(MDCTemporaryDrawerFoundation.prototype.__proto__ || Object.getPrototypeOf(MDCTemporaryDrawerFoundation.prototype), 'handleTransitionEnd_', this).call(this, evt);
+      if (!this.isOpen_) {
+        this.enableScroll_();
+      }
+    }
+  }, {
+    key: 'disableScroll_',
+    value: function disableScroll_() {
+      this.adapter_.addBodyClass(__WEBPACK_IMPORTED_MODULE_1__constants__["a" /* cssClasses */].SCROLL_LOCK);
+    }
+  }, {
+    key: 'enableScroll_',
+    value: function enableScroll_() {
+      this.adapter_.removeBodyClass(__WEBPACK_IMPORTED_MODULE_1__constants__["a" /* cssClasses */].SCROLL_LOCK);
+    }
+  }]);
+
+  return MDCTemporaryDrawerFoundation;
+}(__WEBPACK_IMPORTED_MODULE_0__slidable__["a" /* MDCSlidableDrawerFoundation */]);
+
+/* harmony default export */ __webpack_exports__["a"] = (MDCTemporaryDrawerFoundation);
+
+/***/ }),
+
+/***/ 51:
+/***/ (function(module, __webpack_exports__, __webpack_require__) {
+
+"use strict";
+/* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, "a", function() { return MDCTemporaryDrawer; });
+/* harmony import */ var __WEBPACK_IMPORTED_MODULE_0__material_base__ = __webpack_require__(2);
+/* harmony import */ var __WEBPACK_IMPORTED_MODULE_1__foundation__ = __webpack_require__(50);
+/* harmony import */ var __WEBPACK_IMPORTED_MODULE_2__util__ = __webpack_require__(13);
+/* harmony reexport (binding) */ __webpack_require__.d(__webpack_exports__, "b", function() { return __WEBPACK_IMPORTED_MODULE_1__foundation__["a"]; });
+/* unused harmony reexport util */
+var _createClass = function () { function defineProperties(target, props) { for (var i = 0; i < props.length; i++) { var descriptor = props[i]; descriptor.enumerable = descriptor.enumerable || false; descriptor.configurable = true; if ("value" in descriptor) descriptor.writable = true; Object.defineProperty(target, descriptor.key, descriptor); } } return function (Constructor, protoProps, staticProps) { if (protoProps) defineProperties(Constructor.prototype, protoProps); if (staticProps) defineProperties(Constructor, staticProps); return Constructor; }; }();
+
+function _classCallCheck(instance, Constructor) { if (!(instance instanceof Constructor)) { throw new TypeError("Cannot call a class as a function"); } }
+
+function _possibleConstructorReturn(self, call) { if (!self) { throw new ReferenceError("this hasn't been initialised - super() hasn't been called"); } return call && (typeof call === "object" || typeof call === "function") ? call : self; }
+
+function _inherits(subClass, superClass) { if (typeof superClass !== "function" && superClass !== null) { throw new TypeError("Super expression must either be null or a function, not " + typeof superClass); } subClass.prototype = Object.create(superClass && superClass.prototype, { constructor: { value: subClass, enumerable: false, writable: true, configurable: true } }); if (superClass) Object.setPrototypeOf ? Object.setPrototypeOf(subClass, superClass) : subClass.__proto__ = superClass; }
+
+/**
+ * Copyright 2016 Google Inc. All Rights Reserved.
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *      http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+
+
+
+
+
+
+
+
+var MDCTemporaryDrawer = function (_MDCComponent) {
+  _inherits(MDCTemporaryDrawer, _MDCComponent);
+
+  function MDCTemporaryDrawer() {
+    _classCallCheck(this, MDCTemporaryDrawer);
+
+    return _possibleConstructorReturn(this, (MDCTemporaryDrawer.__proto__ || Object.getPrototypeOf(MDCTemporaryDrawer)).apply(this, arguments));
+  }
+
+  _createClass(MDCTemporaryDrawer, [{
+    key: 'getDefaultFoundation',
+    value: function getDefaultFoundation() {
+      var _this2 = this;
+
+      var _MDCTemporaryDrawerFo = __WEBPACK_IMPORTED_MODULE_1__foundation__["a" /* default */].strings,
+          FOCUSABLE_ELEMENTS = _MDCTemporaryDrawerFo.FOCUSABLE_ELEMENTS,
+          OPACITY_VAR_NAME = _MDCTemporaryDrawerFo.OPACITY_VAR_NAME;
+
+
+      return new __WEBPACK_IMPORTED_MODULE_1__foundation__["a" /* default */]({
+        addClass: function addClass(className) {
+          return _this2.root_.classList.add(className);
+        },
+        removeClass: function removeClass(className) {
+          return _this2.root_.classList.remove(className);
+        },
+        hasClass: function hasClass(className) {
+          return _this2.root_.classList.contains(className);
+        },
+        addBodyClass: function addBodyClass(className) {
+          return document.body.classList.add(className);
+        },
+        removeBodyClass: function removeBodyClass(className) {
+          return document.body.classList.remove(className);
+        },
+        hasNecessaryDom: function hasNecessaryDom() {
+          return Boolean(_this2.drawer);
+        },
+        registerInteractionHandler: function registerInteractionHandler(evt, handler) {
+          return _this2.root_.addEventListener(__WEBPACK_IMPORTED_MODULE_2__util__["remapEvent"](evt), handler, __WEBPACK_IMPORTED_MODULE_2__util__["applyPassive"]());
+        },
+        deregisterInteractionHandler: function deregisterInteractionHandler(evt, handler) {
+          return _this2.root_.removeEventListener(__WEBPACK_IMPORTED_MODULE_2__util__["remapEvent"](evt), handler, __WEBPACK_IMPORTED_MODULE_2__util__["applyPassive"]());
+        },
+        registerDrawerInteractionHandler: function registerDrawerInteractionHandler(evt, handler) {
+          return _this2.drawer.addEventListener(__WEBPACK_IMPORTED_MODULE_2__util__["remapEvent"](evt), handler);
+        },
+        deregisterDrawerInteractionHandler: function deregisterDrawerInteractionHandler(evt, handler) {
+          return _this2.drawer.removeEventListener(__WEBPACK_IMPORTED_MODULE_2__util__["remapEvent"](evt), handler);
+        },
+        registerTransitionEndHandler: function registerTransitionEndHandler(handler) {
+          return _this2.drawer.addEventListener('transitionend', handler);
+        },
+        deregisterTransitionEndHandler: function deregisterTransitionEndHandler(handler) {
+          return _this2.drawer.removeEventListener('transitionend', handler);
+        },
+        registerDocumentKeydownHandler: function registerDocumentKeydownHandler(handler) {
+          return document.addEventListener('keydown', handler);
+        },
+        deregisterDocumentKeydownHandler: function deregisterDocumentKeydownHandler(handler) {
+          return document.removeEventListener('keydown', handler);
+        },
+        getDrawerWidth: function getDrawerWidth() {
+          return _this2.drawer.offsetWidth;
+        },
+        setTranslateX: function setTranslateX(value) {
+          return _this2.drawer.style.setProperty(__WEBPACK_IMPORTED_MODULE_2__util__["getTransformPropertyName"](), value === null ? null : 'translateX(' + value + 'px)');
+        },
+        updateCssVariable: function updateCssVariable(value) {
+          if (__WEBPACK_IMPORTED_MODULE_2__util__["supportsCssCustomProperties"]()) {
+            _this2.root_.style.setProperty(OPACITY_VAR_NAME, value);
+          }
+        },
+        getFocusableElements: function getFocusableElements() {
+          return _this2.drawer.querySelectorAll(FOCUSABLE_ELEMENTS);
+        },
+        saveElementTabState: function saveElementTabState(el) {
+          return __WEBPACK_IMPORTED_MODULE_2__util__["saveElementTabState"](el);
+        },
+        restoreElementTabState: function restoreElementTabState(el) {
+          return __WEBPACK_IMPORTED_MODULE_2__util__["restoreElementTabState"](el);
+        },
+        makeElementUntabbable: function makeElementUntabbable(el) {
+          return el.setAttribute('tabindex', -1);
+        },
+        notifyOpen: function notifyOpen() {
+          return _this2.emit(__WEBPACK_IMPORTED_MODULE_1__foundation__["a" /* default */].strings.OPEN_EVENT);
+        },
+        notifyClose: function notifyClose() {
+          return _this2.emit(__WEBPACK_IMPORTED_MODULE_1__foundation__["a" /* default */].strings.CLOSE_EVENT);
+        },
+        isRtl: function isRtl() {
+          return getComputedStyle(_this2.root_).getPropertyValue('direction') === 'rtl';
+        },
+        isDrawer: function isDrawer(el) {
+          return el === _this2.drawer;
+        }
+      });
+    }
+  }, {
+    key: 'open',
+    get: function get() {
+      return this.foundation_.isOpen();
+    },
+    set: function set(value) {
+      if (value) {
+        this.foundation_.open();
+      } else {
+        this.foundation_.close();
+      }
+    }
+
+    /* Return the drawer element inside the component. */
+
+  }, {
+    key: 'drawer',
+    get: function get() {
+      return this.root_.querySelector(__WEBPACK_IMPORTED_MODULE_1__foundation__["a" /* default */].strings.DRAWER_SELECTOR);
+    }
+  }], [{
+    key: 'attachTo',
+    value: function attachTo(root) {
+      return new MDCTemporaryDrawer(root);
+    }
+  }]);
+
+  return MDCTemporaryDrawer;
+}(__WEBPACK_IMPORTED_MODULE_0__material_base__["MDCComponent"]);
+
+/***/ }),
+
+/***/ 86:
+/***/ (function(module, exports, __webpack_require__) {
+
+module.exports = __webpack_require__(26);
+
+
+/***/ })
+
+/******/ });
+});

+ 143 - 0
support/client/lib/vwf/view/lib/mdc/dist/mdc.elevation.css

@@ -0,0 +1,143 @@
+/*!
+ Material Components for the web
+ Copyright (c) 2017 Google Inc.
+ License: Apache-2.0
+*/
+/**
+ * The css property used for elevation. In most cases this should not be changed. It is exposed
+ * as a variable for abstraction / easy use when needing to reference the property directly, for
+ * example in a `will-change` rule.
+ */
+/**
+ * The default duration value for elevation transitions.
+ */
+/**
+ * The default easing value for elevation transitions.
+ */
+/**
+ * Applies the correct css rules to an element to give it the elevation specified by $z-value.
+ * The $z-value must be between 0 and 24.
+ */
+/**
+ * Returns a string that can be used as the value for a `transition` property for elevation.
+ * Calling this function directly is useful in situations where a component needs to transition
+ * more than one property.
+ *
+ * ```scss
+ * .foo {
+ *   transition: mdc-elevation-transition-rule(), opacity 100ms ease;
+ *   will-change: $mdc-elevation-property, opacity;
+ * }
+ * ```
+ */
+/**
+ * Applies the correct css rules needed to have an element transition between elevations.
+ * This mixin should be applied to elements whose elevation values will change depending on their
+ * context (e.g. when active or disabled).
+ */
+.mdc-elevation--z0 {
+  -webkit-box-shadow: 0px 0px 0px 0px rgba(0, 0, 0, 0.2), 0px 0px 0px 0px rgba(0, 0, 0, 0.14), 0px 0px 0px 0px rgba(0, 0, 0, 0.12);
+          box-shadow: 0px 0px 0px 0px rgba(0, 0, 0, 0.2), 0px 0px 0px 0px rgba(0, 0, 0, 0.14), 0px 0px 0px 0px rgba(0, 0, 0, 0.12); }
+
+.mdc-elevation--z1 {
+  -webkit-box-shadow: 0px 2px 1px -1px rgba(0, 0, 0, 0.2), 0px 1px 1px 0px rgba(0, 0, 0, 0.14), 0px 1px 3px 0px rgba(0, 0, 0, 0.12);
+          box-shadow: 0px 2px 1px -1px rgba(0, 0, 0, 0.2), 0px 1px 1px 0px rgba(0, 0, 0, 0.14), 0px 1px 3px 0px rgba(0, 0, 0, 0.12); }
+
+.mdc-elevation--z2 {
+  -webkit-box-shadow: 0px 3px 1px -2px rgba(0, 0, 0, 0.2), 0px 2px 2px 0px rgba(0, 0, 0, 0.14), 0px 1px 5px 0px rgba(0, 0, 0, 0.12);
+          box-shadow: 0px 3px 1px -2px rgba(0, 0, 0, 0.2), 0px 2px 2px 0px rgba(0, 0, 0, 0.14), 0px 1px 5px 0px rgba(0, 0, 0, 0.12); }
+
+.mdc-elevation--z3 {
+  -webkit-box-shadow: 0px 3px 3px -2px rgba(0, 0, 0, 0.2), 0px 3px 4px 0px rgba(0, 0, 0, 0.14), 0px 1px 8px 0px rgba(0, 0, 0, 0.12);
+          box-shadow: 0px 3px 3px -2px rgba(0, 0, 0, 0.2), 0px 3px 4px 0px rgba(0, 0, 0, 0.14), 0px 1px 8px 0px rgba(0, 0, 0, 0.12); }
+
+.mdc-elevation--z4 {
+  -webkit-box-shadow: 0px 2px 4px -1px rgba(0, 0, 0, 0.2), 0px 4px 5px 0px rgba(0, 0, 0, 0.14), 0px 1px 10px 0px rgba(0, 0, 0, 0.12);
+          box-shadow: 0px 2px 4px -1px rgba(0, 0, 0, 0.2), 0px 4px 5px 0px rgba(0, 0, 0, 0.14), 0px 1px 10px 0px rgba(0, 0, 0, 0.12); }
+
+.mdc-elevation--z5 {
+  -webkit-box-shadow: 0px 3px 5px -1px rgba(0, 0, 0, 0.2), 0px 5px 8px 0px rgba(0, 0, 0, 0.14), 0px 1px 14px 0px rgba(0, 0, 0, 0.12);
+          box-shadow: 0px 3px 5px -1px rgba(0, 0, 0, 0.2), 0px 5px 8px 0px rgba(0, 0, 0, 0.14), 0px 1px 14px 0px rgba(0, 0, 0, 0.12); }
+
+.mdc-elevation--z6 {
+  -webkit-box-shadow: 0px 3px 5px -1px rgba(0, 0, 0, 0.2), 0px 6px 10px 0px rgba(0, 0, 0, 0.14), 0px 1px 18px 0px rgba(0, 0, 0, 0.12);
+          box-shadow: 0px 3px 5px -1px rgba(0, 0, 0, 0.2), 0px 6px 10px 0px rgba(0, 0, 0, 0.14), 0px 1px 18px 0px rgba(0, 0, 0, 0.12); }
+
+.mdc-elevation--z7 {
+  -webkit-box-shadow: 0px 4px 5px -2px rgba(0, 0, 0, 0.2), 0px 7px 10px 1px rgba(0, 0, 0, 0.14), 0px 2px 16px 1px rgba(0, 0, 0, 0.12);
+          box-shadow: 0px 4px 5px -2px rgba(0, 0, 0, 0.2), 0px 7px 10px 1px rgba(0, 0, 0, 0.14), 0px 2px 16px 1px rgba(0, 0, 0, 0.12); }
+
+.mdc-elevation--z8 {
+  -webkit-box-shadow: 0px 5px 5px -3px rgba(0, 0, 0, 0.2), 0px 8px 10px 1px rgba(0, 0, 0, 0.14), 0px 3px 14px 2px rgba(0, 0, 0, 0.12);
+          box-shadow: 0px 5px 5px -3px rgba(0, 0, 0, 0.2), 0px 8px 10px 1px rgba(0, 0, 0, 0.14), 0px 3px 14px 2px rgba(0, 0, 0, 0.12); }
+
+.mdc-elevation--z9 {
+  -webkit-box-shadow: 0px 5px 6px -3px rgba(0, 0, 0, 0.2), 0px 9px 12px 1px rgba(0, 0, 0, 0.14), 0px 3px 16px 2px rgba(0, 0, 0, 0.12);
+          box-shadow: 0px 5px 6px -3px rgba(0, 0, 0, 0.2), 0px 9px 12px 1px rgba(0, 0, 0, 0.14), 0px 3px 16px 2px rgba(0, 0, 0, 0.12); }
+
+.mdc-elevation--z10 {
+  -webkit-box-shadow: 0px 6px 6px -3px rgba(0, 0, 0, 0.2), 0px 10px 14px 1px rgba(0, 0, 0, 0.14), 0px 4px 18px 3px rgba(0, 0, 0, 0.12);
+          box-shadow: 0px 6px 6px -3px rgba(0, 0, 0, 0.2), 0px 10px 14px 1px rgba(0, 0, 0, 0.14), 0px 4px 18px 3px rgba(0, 0, 0, 0.12); }
+
+.mdc-elevation--z11 {
+  -webkit-box-shadow: 0px 6px 7px -4px rgba(0, 0, 0, 0.2), 0px 11px 15px 1px rgba(0, 0, 0, 0.14), 0px 4px 20px 3px rgba(0, 0, 0, 0.12);
+          box-shadow: 0px 6px 7px -4px rgba(0, 0, 0, 0.2), 0px 11px 15px 1px rgba(0, 0, 0, 0.14), 0px 4px 20px 3px rgba(0, 0, 0, 0.12); }
+
+.mdc-elevation--z12 {
+  -webkit-box-shadow: 0px 7px 8px -4px rgba(0, 0, 0, 0.2), 0px 12px 17px 2px rgba(0, 0, 0, 0.14), 0px 5px 22px 4px rgba(0, 0, 0, 0.12);
+          box-shadow: 0px 7px 8px -4px rgba(0, 0, 0, 0.2), 0px 12px 17px 2px rgba(0, 0, 0, 0.14), 0px 5px 22px 4px rgba(0, 0, 0, 0.12); }
+
+.mdc-elevation--z13 {
+  -webkit-box-shadow: 0px 7px 8px -4px rgba(0, 0, 0, 0.2), 0px 13px 19px 2px rgba(0, 0, 0, 0.14), 0px 5px 24px 4px rgba(0, 0, 0, 0.12);
+          box-shadow: 0px 7px 8px -4px rgba(0, 0, 0, 0.2), 0px 13px 19px 2px rgba(0, 0, 0, 0.14), 0px 5px 24px 4px rgba(0, 0, 0, 0.12); }
+
+.mdc-elevation--z14 {
+  -webkit-box-shadow: 0px 7px 9px -4px rgba(0, 0, 0, 0.2), 0px 14px 21px 2px rgba(0, 0, 0, 0.14), 0px 5px 26px 4px rgba(0, 0, 0, 0.12);
+          box-shadow: 0px 7px 9px -4px rgba(0, 0, 0, 0.2), 0px 14px 21px 2px rgba(0, 0, 0, 0.14), 0px 5px 26px 4px rgba(0, 0, 0, 0.12); }
+
+.mdc-elevation--z15 {
+  -webkit-box-shadow: 0px 8px 9px -5px rgba(0, 0, 0, 0.2), 0px 15px 22px 2px rgba(0, 0, 0, 0.14), 0px 6px 28px 5px rgba(0, 0, 0, 0.12);
+          box-shadow: 0px 8px 9px -5px rgba(0, 0, 0, 0.2), 0px 15px 22px 2px rgba(0, 0, 0, 0.14), 0px 6px 28px 5px rgba(0, 0, 0, 0.12); }
+
+.mdc-elevation--z16 {
+  -webkit-box-shadow: 0px 8px 10px -5px rgba(0, 0, 0, 0.2), 0px 16px 24px 2px rgba(0, 0, 0, 0.14), 0px 6px 30px 5px rgba(0, 0, 0, 0.12);
+          box-shadow: 0px 8px 10px -5px rgba(0, 0, 0, 0.2), 0px 16px 24px 2px rgba(0, 0, 0, 0.14), 0px 6px 30px 5px rgba(0, 0, 0, 0.12); }
+
+.mdc-elevation--z17 {
+  -webkit-box-shadow: 0px 8px 11px -5px rgba(0, 0, 0, 0.2), 0px 17px 26px 2px rgba(0, 0, 0, 0.14), 0px 6px 32px 5px rgba(0, 0, 0, 0.12);
+          box-shadow: 0px 8px 11px -5px rgba(0, 0, 0, 0.2), 0px 17px 26px 2px rgba(0, 0, 0, 0.14), 0px 6px 32px 5px rgba(0, 0, 0, 0.12); }
+
+.mdc-elevation--z18 {
+  -webkit-box-shadow: 0px 9px 11px -5px rgba(0, 0, 0, 0.2), 0px 18px 28px 2px rgba(0, 0, 0, 0.14), 0px 7px 34px 6px rgba(0, 0, 0, 0.12);
+          box-shadow: 0px 9px 11px -5px rgba(0, 0, 0, 0.2), 0px 18px 28px 2px rgba(0, 0, 0, 0.14), 0px 7px 34px 6px rgba(0, 0, 0, 0.12); }
+
+.mdc-elevation--z19 {
+  -webkit-box-shadow: 0px 9px 12px -6px rgba(0, 0, 0, 0.2), 0px 19px 29px 2px rgba(0, 0, 0, 0.14), 0px 7px 36px 6px rgba(0, 0, 0, 0.12);
+          box-shadow: 0px 9px 12px -6px rgba(0, 0, 0, 0.2), 0px 19px 29px 2px rgba(0, 0, 0, 0.14), 0px 7px 36px 6px rgba(0, 0, 0, 0.12); }
+
+.mdc-elevation--z20 {
+  -webkit-box-shadow: 0px 10px 13px -6px rgba(0, 0, 0, 0.2), 0px 20px 31px 3px rgba(0, 0, 0, 0.14), 0px 8px 38px 7px rgba(0, 0, 0, 0.12);
+          box-shadow: 0px 10px 13px -6px rgba(0, 0, 0, 0.2), 0px 20px 31px 3px rgba(0, 0, 0, 0.14), 0px 8px 38px 7px rgba(0, 0, 0, 0.12); }
+
+.mdc-elevation--z21 {
+  -webkit-box-shadow: 0px 10px 13px -6px rgba(0, 0, 0, 0.2), 0px 21px 33px 3px rgba(0, 0, 0, 0.14), 0px 8px 40px 7px rgba(0, 0, 0, 0.12);
+          box-shadow: 0px 10px 13px -6px rgba(0, 0, 0, 0.2), 0px 21px 33px 3px rgba(0, 0, 0, 0.14), 0px 8px 40px 7px rgba(0, 0, 0, 0.12); }
+
+.mdc-elevation--z22 {
+  -webkit-box-shadow: 0px 10px 14px -6px rgba(0, 0, 0, 0.2), 0px 22px 35px 3px rgba(0, 0, 0, 0.14), 0px 8px 42px 7px rgba(0, 0, 0, 0.12);
+          box-shadow: 0px 10px 14px -6px rgba(0, 0, 0, 0.2), 0px 22px 35px 3px rgba(0, 0, 0, 0.14), 0px 8px 42px 7px rgba(0, 0, 0, 0.12); }
+
+.mdc-elevation--z23 {
+  -webkit-box-shadow: 0px 11px 14px -7px rgba(0, 0, 0, 0.2), 0px 23px 36px 3px rgba(0, 0, 0, 0.14), 0px 9px 44px 8px rgba(0, 0, 0, 0.12);
+          box-shadow: 0px 11px 14px -7px rgba(0, 0, 0, 0.2), 0px 23px 36px 3px rgba(0, 0, 0, 0.14), 0px 9px 44px 8px rgba(0, 0, 0, 0.12); }
+
+.mdc-elevation--z24 {
+  -webkit-box-shadow: 0px 11px 15px -7px rgba(0, 0, 0, 0.2), 0px 24px 38px 3px rgba(0, 0, 0, 0.14), 0px 9px 46px 8px rgba(0, 0, 0, 0.12);
+          box-shadow: 0px 11px 15px -7px rgba(0, 0, 0, 0.2), 0px 24px 38px 3px rgba(0, 0, 0, 0.14), 0px 9px 46px 8px rgba(0, 0, 0, 0.12); }
+
+.mdc-elevation-transition {
+  -webkit-transition: -webkit-box-shadow 280ms cubic-bezier(0.4, 0, 0.2, 1);
+  transition: -webkit-box-shadow 280ms cubic-bezier(0.4, 0, 0.2, 1);
+  transition: box-shadow 280ms cubic-bezier(0.4, 0, 0.2, 1);
+  transition: box-shadow 280ms cubic-bezier(0.4, 0, 0.2, 1), -webkit-box-shadow 280ms cubic-bezier(0.4, 0, 0.2, 1);
+  will-change: box-shadow; }

+ 83 - 0
support/client/lib/vwf/view/lib/mdc/dist/mdc.elevation.css-entry

@@ -0,0 +1,83 @@
+/*!
+ Material Components for the web
+ Copyright (c) 2017 Google Inc.
+ License: Apache-2.0
+*/
+/******/ (function(modules) { // webpackBootstrap
+/******/ 	// The module cache
+/******/ 	var installedModules = {};
+/******/
+/******/ 	// The require function
+/******/ 	function __webpack_require__(moduleId) {
+/******/
+/******/ 		// Check if module is in cache
+/******/ 		if(installedModules[moduleId]) {
+/******/ 			return installedModules[moduleId].exports;
+/******/ 		}
+/******/ 		// Create a new module (and put it into the cache)
+/******/ 		var module = installedModules[moduleId] = {
+/******/ 			i: moduleId,
+/******/ 			l: false,
+/******/ 			exports: {}
+/******/ 		};
+/******/
+/******/ 		// Execute the module function
+/******/ 		modules[moduleId].call(module.exports, module, module.exports, __webpack_require__);
+/******/
+/******/ 		// Flag the module as loaded
+/******/ 		module.l = true;
+/******/
+/******/ 		// Return the exports of the module
+/******/ 		return module.exports;
+/******/ 	}
+/******/
+/******/
+/******/ 	// expose the modules object (__webpack_modules__)
+/******/ 	__webpack_require__.m = modules;
+/******/
+/******/ 	// expose the module cache
+/******/ 	__webpack_require__.c = installedModules;
+/******/
+/******/ 	// identity function for calling harmony imports with the correct context
+/******/ 	__webpack_require__.i = function(value) { return value; };
+/******/
+/******/ 	// define getter function for harmony exports
+/******/ 	__webpack_require__.d = function(exports, name, getter) {
+/******/ 		if(!__webpack_require__.o(exports, name)) {
+/******/ 			Object.defineProperty(exports, name, {
+/******/ 				configurable: false,
+/******/ 				enumerable: true,
+/******/ 				get: getter
+/******/ 			});
+/******/ 		}
+/******/ 	};
+/******/
+/******/ 	// getDefaultExport function for compatibility with non-harmony modules
+/******/ 	__webpack_require__.n = function(module) {
+/******/ 		var getter = module && module.__esModule ?
+/******/ 			function getDefault() { return module['default']; } :
+/******/ 			function getModuleExports() { return module; };
+/******/ 		__webpack_require__.d(getter, 'a', getter);
+/******/ 		return getter;
+/******/ 	};
+/******/
+/******/ 	// Object.prototype.hasOwnProperty.call
+/******/ 	__webpack_require__.o = function(object, property) { return Object.prototype.hasOwnProperty.call(object, property); };
+/******/
+/******/ 	// __webpack_public_path__
+/******/ 	__webpack_require__.p = "/assets/";
+/******/
+/******/ 	// Load entry module and return exports
+/******/ 	return __webpack_require__(__webpack_require__.s = 7);
+/******/ })
+/************************************************************************/
+/******/ ({
+
+/***/ 7:
+/***/ (function(module, exports) {
+
+// removed by extract-text-webpack-plugin
+
+/***/ })
+
+/******/ });

+ 489 - 0
support/client/lib/vwf/view/lib/mdc/dist/mdc.fab.css

@@ -0,0 +1,489 @@
+/*!
+ Material Components for the web
+ Copyright (c) 2017 Google Inc.
+ License: Apache-2.0
+*/
+/**
+ * The css property used for elevation. In most cases this should not be changed. It is exposed
+ * as a variable for abstraction / easy use when needing to reference the property directly, for
+ * example in a `will-change` rule.
+ */
+/**
+ * The default duration value for elevation transitions.
+ */
+/**
+ * The default easing value for elevation transitions.
+ */
+/**
+ * Applies the correct css rules to an element to give it the elevation specified by $z-value.
+ * The $z-value must be between 0 and 24.
+ */
+/**
+ * Returns a string that can be used as the value for a `transition` property for elevation.
+ * Calling this function directly is useful in situations where a component needs to transition
+ * more than one property.
+ *
+ * ```scss
+ * .foo {
+ *   transition: mdc-elevation-transition-rule(), opacity 100ms ease;
+ *   will-change: $mdc-elevation-property, opacity;
+ * }
+ * ```
+ */
+/**
+ * Applies the correct css rules needed to have an element transition between elevations.
+ * This mixin should be applied to elements whose elevation values will change depending on their
+ * context (e.g. when active or disabled).
+ */
+/*
+  Precomputed linear color channel values, for use in contrast calculations.
+  See https://www.w3.org/TR/WCAG20-TECHS/G17.html#G17-tests
+
+  Algorithm, for c in 0 to 255:
+  f(c) {
+    c = c / 255;
+    return c < 0.03928 ? c / 12.92 : Math.pow((c + 0.055) / 1.055, 2.4);
+  }
+
+  This lookup table is needed since there is no `pow` in SASS.
+*/
+/**
+ * Calculate the luminance for a color.
+ * See https://www.w3.org/TR/WCAG20-TECHS/G17.html#G17-tests
+ */
+/**
+ * Calculate the contrast ratio between two colors.
+ * See https://www.w3.org/TR/WCAG20-TECHS/G17.html#G17-tests
+ */
+/**
+ * Determine whether to use dark or light text on top of given color.
+ * Returns "dark" for dark text and "light" for light text.
+ */
+/*
+  Main theme colors.
+  If you're a user customizing your color scheme in SASS, these are probably the only variables you need to change.
+*/
+/* Indigo 500 */
+/* Pink A200 */
+/* White */
+/* Which set of text colors to use for each main theme color (light or dark) */
+/* Text colors according to light vs dark and text type */
+/* Primary text colors for each of the theme colors */
+/** MDC Ripple keyframes are split into their own file so that _mixins.scss can rely on them. */
+@-webkit-keyframes mdc-ripple-fg-radius-in {
+  from {
+    -webkit-transform: translate(var(--mdc-ripple-fg-translate-start, 0)) scale(1);
+            transform: translate(var(--mdc-ripple-fg-translate-start, 0)) scale(1);
+    -webkit-animation-timing-function: cubic-bezier(0.4, 0, 0.2, 1);
+            animation-timing-function: cubic-bezier(0.4, 0, 0.2, 1); }
+  to {
+    -webkit-transform: translate(var(--mdc-ripple-fg-translate-end, 0)) scale(var(--mdc-ripple-fg-scale, 1));
+            transform: translate(var(--mdc-ripple-fg-translate-end, 0)) scale(var(--mdc-ripple-fg-scale, 1)); } }
+@keyframes mdc-ripple-fg-radius-in {
+  from {
+    -webkit-transform: translate(var(--mdc-ripple-fg-translate-start, 0)) scale(1);
+            transform: translate(var(--mdc-ripple-fg-translate-start, 0)) scale(1);
+    -webkit-animation-timing-function: cubic-bezier(0.4, 0, 0.2, 1);
+            animation-timing-function: cubic-bezier(0.4, 0, 0.2, 1); }
+  to {
+    -webkit-transform: translate(var(--mdc-ripple-fg-translate-end, 0)) scale(var(--mdc-ripple-fg-scale, 1));
+            transform: translate(var(--mdc-ripple-fg-translate-end, 0)) scale(var(--mdc-ripple-fg-scale, 1)); } }
+
+@-webkit-keyframes mdc-ripple-fg-opacity-in {
+  from {
+    opacity: 0;
+    -webkit-animation-timing-function: linear;
+            animation-timing-function: linear; }
+  to {
+    opacity: 1; } }
+
+@keyframes mdc-ripple-fg-opacity-in {
+  from {
+    opacity: 0;
+    -webkit-animation-timing-function: linear;
+            animation-timing-function: linear; }
+  to {
+    opacity: 1; } }
+
+@-webkit-keyframes mdc-ripple-fg-opacity-out {
+  from {
+    opacity: 1;
+    -webkit-animation-timing-function: linear;
+            animation-timing-function: linear; }
+  to {
+    opacity: 0; } }
+
+@keyframes mdc-ripple-fg-opacity-out {
+  from {
+    opacity: 1;
+    -webkit-animation-timing-function: linear;
+            animation-timing-function: linear; }
+  to {
+    opacity: 0; } }
+
+/*
+  Precomputed linear color channel values, for use in contrast calculations.
+  See https://www.w3.org/TR/WCAG20-TECHS/G17.html#G17-tests
+
+  Algorithm, for c in 0 to 255:
+  f(c) {
+    c = c / 255;
+    return c < 0.03928 ? c / 12.92 : Math.pow((c + 0.055) / 1.055, 2.4);
+  }
+
+  This lookup table is needed since there is no `pow` in SASS.
+*/
+/**
+ * Calculate the luminance for a color.
+ * See https://www.w3.org/TR/WCAG20-TECHS/G17.html#G17-tests
+ */
+/**
+ * Calculate the contrast ratio between two colors.
+ * See https://www.w3.org/TR/WCAG20-TECHS/G17.html#G17-tests
+ */
+/**
+ * Determine whether to use dark or light text on top of given color.
+ * Returns "dark" for dark text and "light" for light text.
+ */
+/*
+  Main theme colors.
+  If you're a user customizing your color scheme in SASS, these are probably the only variables you need to change.
+*/
+/* Indigo 500 */
+/* Pink A200 */
+/* White */
+/* Which set of text colors to use for each main theme color (light or dark) */
+/* Text colors according to light vs dark and text type */
+/* Primary text colors for each of the theme colors */
+/**
+ * Applies the correct theme color style to the specified property.
+ * $property is typically color or background-color, but can be any CSS property that accepts color values.
+ * $style should be one of the map keys in $mdc-theme-property-values (_variables.scss).
+ */
+/**
+ * Creates a rule to be used in MDC-Web components for dark theming, and applies the provided contents.
+ * Should provide the $root-selector option if applied to anything other than the root selector.
+ * When used with a modifier class, provide a second argument of `true` for the $compound parameter
+ * to specify that this should be attached as a compound class.
+ *
+ * Usage example:
+ *
+ * ```scss
+ * .mdc-foo {
+ *   color: black;
+ *
+ *   @include mdc-theme-dark {
+ *     color: white;
+ *   }
+ *
+ *   &__bar {
+ *     background: black;
+ *
+ *     @include mdc-theme-dark(".mdc-foo") {
+ *       background: white;
+ *     }
+ *   }
+ * }
+ *
+ * .mdc-foo--disabled {
+ *   opacity: .38;
+ *
+ *   @include mdc-theme-dark(".mdc-foo", true) {
+ *     opacity: .5;
+ *   }
+ * }
+ * ```
+ */
+.mdc-fab {
+  --mdc-ripple-surface-width: 0;
+  --mdc-ripple-surface-height: 0;
+  --mdc-ripple-fg-size: 0;
+  --mdc-ripple-left: 0;
+  --mdc-ripple-top: 0;
+  --mdc-ripple-fg-scale: 1;
+  --mdc-ripple-fg-translate-end: 0;
+  --mdc-ripple-fg-translate-start: 0;
+  will-change: transform, opacity;
+  -webkit-tap-highlight-color: transparent;
+  display: -webkit-inline-box;
+  display: -ms-inline-flexbox;
+  display: inline-flex;
+  position: relative;
+  -webkit-box-pack: center;
+      -ms-flex-pack: center;
+          justify-content: center;
+  width: 56px;
+  height: 56px;
+  padding: 0;
+  -webkit-transition: -webkit-box-shadow 280ms cubic-bezier(0.4, 0, 0.2, 1);
+  transition: -webkit-box-shadow 280ms cubic-bezier(0.4, 0, 0.2, 1);
+  transition: box-shadow 280ms cubic-bezier(0.4, 0, 0.2, 1);
+  transition: box-shadow 280ms cubic-bezier(0.4, 0, 0.2, 1), -webkit-box-shadow 280ms cubic-bezier(0.4, 0, 0.2, 1);
+  border: none;
+  border-radius: 50%;
+  cursor: pointer;
+  -webkit-user-select: none;
+     -moz-user-select: none;
+      -ms-user-select: none;
+          user-select: none;
+  -webkit-box-sizing: border-box;
+          box-sizing: border-box;
+  fill: currentColor;
+  -moz-appearance: none;
+  -webkit-appearance: none;
+  overflow: hidden;
+  /* @alternate */
+  background-color: #ff4081;
+  background-color: var(--mdc-theme-accent, #ff4081);
+  /* @alternate */
+  color: white;
+  color: var(--mdc-theme-text-primary-on-accent, white);
+  -webkit-box-shadow: 0px 3px 5px -1px rgba(0, 0, 0, 0.2), 0px 6px 10px 0px rgba(0, 0, 0, 0.14), 0px 1px 18px 0px rgba(0, 0, 0, 0.12);
+          box-shadow: 0px 3px 5px -1px rgba(0, 0, 0, 0.2), 0px 6px 10px 0px rgba(0, 0, 0, 0.14), 0px 1px 18px 0px rgba(0, 0, 0, 0.12); }
+  .mdc-fab:not(.mdc-ripple-upgraded):hover::before, .mdc-fab:not(.mdc-ripple-upgraded):focus::before, .mdc-fab:not(.mdc-ripple-upgraded):active::after {
+    -webkit-transition-duration: 85ms;
+            transition-duration: 85ms;
+    opacity: .6; }
+  .mdc-fab::before {
+    background-color: rgba(255, 255, 255, 0.16);
+    position: absolute;
+    top: calc(50% - 100%);
+    left: calc(50% - 100%);
+    width: 200%;
+    height: 200%;
+    -webkit-transition: opacity 250ms linear;
+    transition: opacity 250ms linear;
+    border-radius: 50%;
+    opacity: 0;
+    pointer-events: none;
+    content: ""; }
+  .mdc-fab.mdc-ripple-upgraded::before {
+    top: calc(50% - 100%);
+    left: calc(50% - 100%);
+    width: 200%;
+    height: 200%;
+    /* @alternate */
+    -webkit-transform: scale(0);
+            transform: scale(0);
+    -webkit-transform: scale(var(--mdc-ripple-fg-scale, 0));
+            transform: scale(var(--mdc-ripple-fg-scale, 0)); }
+  .mdc-fab.mdc-ripple-upgraded--background-focused::before {
+    opacity: .99999; }
+  .mdc-fab.mdc-ripple-upgraded--background-active-fill::before {
+    -webkit-transition-duration: 120ms;
+            transition-duration: 120ms;
+    opacity: 1; }
+  .mdc-fab.mdc-ripple-upgraded--unbounded::before {
+    /* @alternate */
+    top: calc(50% - 50%);
+    top: var(--mdc-ripple-top, calc(50% - 50%));
+    /* @alternate */
+    left: calc(50% - 50%);
+    left: var(--mdc-ripple-left, calc(50% - 50%));
+    /* @alternate */
+    width: 100%;
+    width: var(--mdc-ripple-fg-size, 100%);
+    /* @alternate */
+    height: 100%;
+    height: var(--mdc-ripple-fg-size, 100%);
+    /* @alternate */
+    -webkit-transform: scale(0);
+            transform: scale(0);
+    -webkit-transform: scale(var(--mdc-ripple-fg-scale, 0));
+            transform: scale(var(--mdc-ripple-fg-scale, 0)); }
+  .mdc-fab::after {
+    background-color: rgba(255, 255, 255, 0.16);
+    position: absolute;
+    top: calc(50% - 100%);
+    left: calc(50% - 100%);
+    width: 200%;
+    height: 200%;
+    -webkit-transition: opacity 250ms linear;
+    transition: opacity 250ms linear;
+    border-radius: 50%;
+    opacity: 0;
+    pointer-events: none;
+    content: ""; }
+  .mdc-fab.mdc-ripple-upgraded::after {
+    top: 0;
+    left: 0;
+    /* @alternate */
+    width: 100%;
+    width: var(--mdc-ripple-fg-size, 100%);
+    /* @alternate */
+    height: 100%;
+    height: var(--mdc-ripple-fg-size, 100%);
+    -webkit-transform: scale(0);
+            transform: scale(0);
+    -webkit-transform-origin: center center;
+            transform-origin: center center;
+    opacity: 0; }
+  .mdc-fab:not(.mdc-ripple-upgraded--unbounded)::after {
+    -webkit-transform-origin: center center;
+            transform-origin: center center; }
+  .mdc-fab.mdc-ripple-upgraded--unbounded::after {
+    /* @alternate */
+    top: 0;
+    top: var(--mdc-ripple-top, 0);
+    /* @alternate */
+    left: 0;
+    left: var(--mdc-ripple-left, 0);
+    /* @alternate */
+    width: 100%;
+    width: var(--mdc-ripple-fg-size, 100%);
+    /* @alternate */
+    height: 100%;
+    height: var(--mdc-ripple-fg-size, 100%);
+    -webkit-transform: scale(0);
+            transform: scale(0);
+    -webkit-transform-origin: center center;
+            transform-origin: center center; }
+  .mdc-fab.mdc-ripple-upgraded--foreground-activation::after {
+    -webkit-animation: 300ms mdc-ripple-fg-radius-in forwards, 83ms mdc-ripple-fg-opacity-in forwards;
+            animation: 300ms mdc-ripple-fg-radius-in forwards, 83ms mdc-ripple-fg-opacity-in forwards; }
+  .mdc-fab.mdc-ripple-upgraded--foreground-deactivation::after {
+    -webkit-transform: translate(var(--mdc-ripple-fg-translate-end, 0)) scale(var(--mdc-ripple-fg-scale, 1));
+            transform: translate(var(--mdc-ripple-fg-translate-end, 0)) scale(var(--mdc-ripple-fg-scale, 1));
+    -webkit-animation: 83ms mdc-ripple-fg-opacity-out;
+            animation: 83ms mdc-ripple-fg-opacity-out; }
+  .mdc-fab:not(.mdc-ripple-upgraded) {
+    -webkit-tap-highlight-color: rgba(0, 0, 0, 0.18); }
+  .mdc-fab--mini {
+    width: 40px;
+    height: 40px; }
+  .mdc-fab--plain {
+    background-color: white;
+    /* @alternate */
+    color: rgba(0, 0, 0, 0.87);
+    color: var(--mdc-theme-text-primary-on-light, rgba(0, 0, 0, 0.87)); }
+    .mdc-fab--plain::before {
+      background-color: rgba(0, 0, 0, 0.06);
+      position: absolute;
+      top: calc(50% - 100%);
+      left: calc(50% - 100%);
+      width: 200%;
+      height: 200%;
+      -webkit-transition: opacity 250ms linear;
+      transition: opacity 250ms linear;
+      border-radius: 50%;
+      opacity: 0;
+      pointer-events: none;
+      content: ""; }
+    .mdc-fab--plain.mdc-ripple-upgraded::before {
+      top: calc(50% - 100%);
+      left: calc(50% - 100%);
+      width: 200%;
+      height: 200%;
+      /* @alternate */
+      -webkit-transform: scale(0);
+              transform: scale(0);
+      -webkit-transform: scale(var(--mdc-ripple-fg-scale, 0));
+              transform: scale(var(--mdc-ripple-fg-scale, 0)); }
+    .mdc-fab--plain.mdc-ripple-upgraded--background-focused::before {
+      opacity: .99999; }
+    .mdc-fab--plain.mdc-ripple-upgraded--background-active-fill::before {
+      -webkit-transition-duration: 120ms;
+              transition-duration: 120ms;
+      opacity: 1; }
+    .mdc-fab--plain.mdc-ripple-upgraded--unbounded::before {
+      /* @alternate */
+      top: calc(50% - 50%);
+      top: var(--mdc-ripple-top, calc(50% - 50%));
+      /* @alternate */
+      left: calc(50% - 50%);
+      left: var(--mdc-ripple-left, calc(50% - 50%));
+      /* @alternate */
+      width: 100%;
+      width: var(--mdc-ripple-fg-size, 100%);
+      /* @alternate */
+      height: 100%;
+      height: var(--mdc-ripple-fg-size, 100%);
+      /* @alternate */
+      -webkit-transform: scale(0);
+              transform: scale(0);
+      -webkit-transform: scale(var(--mdc-ripple-fg-scale, 0));
+              transform: scale(var(--mdc-ripple-fg-scale, 0)); }
+    .mdc-fab--plain::after {
+      background-color: rgba(0, 0, 0, 0.06);
+      position: absolute;
+      top: calc(50% - 100%);
+      left: calc(50% - 100%);
+      width: 200%;
+      height: 200%;
+      -webkit-transition: opacity 250ms linear;
+      transition: opacity 250ms linear;
+      border-radius: 50%;
+      opacity: 0;
+      pointer-events: none;
+      content: ""; }
+    .mdc-fab--plain.mdc-ripple-upgraded::after {
+      top: 0;
+      left: 0;
+      /* @alternate */
+      width: 100%;
+      width: var(--mdc-ripple-fg-size, 100%);
+      /* @alternate */
+      height: 100%;
+      height: var(--mdc-ripple-fg-size, 100%);
+      -webkit-transform: scale(0);
+              transform: scale(0);
+      -webkit-transform-origin: center center;
+              transform-origin: center center;
+      opacity: 0; }
+    .mdc-fab--plain:not(.mdc-ripple-upgraded--unbounded)::after {
+      -webkit-transform-origin: center center;
+              transform-origin: center center; }
+    .mdc-fab--plain.mdc-ripple-upgraded--unbounded::after {
+      /* @alternate */
+      top: 0;
+      top: var(--mdc-ripple-top, 0);
+      /* @alternate */
+      left: 0;
+      left: var(--mdc-ripple-left, 0);
+      /* @alternate */
+      width: 100%;
+      width: var(--mdc-ripple-fg-size, 100%);
+      /* @alternate */
+      height: 100%;
+      height: var(--mdc-ripple-fg-size, 100%);
+      -webkit-transform: scale(0);
+              transform: scale(0);
+      -webkit-transform-origin: center center;
+              transform-origin: center center; }
+    .mdc-fab--plain.mdc-ripple-upgraded--foreground-activation::after {
+      -webkit-animation: 300ms mdc-ripple-fg-radius-in forwards, 83ms mdc-ripple-fg-opacity-in forwards;
+              animation: 300ms mdc-ripple-fg-radius-in forwards, 83ms mdc-ripple-fg-opacity-in forwards; }
+    .mdc-fab--plain.mdc-ripple-upgraded--foreground-deactivation::after {
+      -webkit-transform: translate(var(--mdc-ripple-fg-translate-end, 0)) scale(var(--mdc-ripple-fg-scale, 1));
+              transform: translate(var(--mdc-ripple-fg-translate-end, 0)) scale(var(--mdc-ripple-fg-scale, 1));
+      -webkit-animation: 83ms mdc-ripple-fg-opacity-out;
+              animation: 83ms mdc-ripple-fg-opacity-out; }
+  .mdc-fab:active, .mdc-fab:focus {
+    outline: none; }
+  .mdc-fab:active {
+    -webkit-box-shadow: 0px 7px 8px -4px rgba(0, 0, 0, 0.2), 0px 12px 17px 2px rgba(0, 0, 0, 0.14), 0px 5px 22px 4px rgba(0, 0, 0, 0.12);
+            box-shadow: 0px 7px 8px -4px rgba(0, 0, 0, 0.2), 0px 12px 17px 2px rgba(0, 0, 0, 0.14), 0px 5px 22px 4px rgba(0, 0, 0, 0.12); }
+  .mdc-fab:hover {
+    cursor: pointer; }
+  .mdc-fab::-moz-focus-inner {
+    padding: 0;
+    border: 0; }
+  .mdc-fab > svg {
+    width: 100%; }
+  fieldset:disabled .mdc-fab, .mdc-fab:disabled {
+    background-color: rgba(0, 0, 0, 0.12);
+    color: rgba(0, 0, 0, 0.26);
+    cursor: default;
+    pointer-events: none; }
+
+.mdc-fab__icon {
+  display: -webkit-box;
+  display: -ms-flexbox;
+  display: flex;
+  -webkit-box-align: center;
+      -ms-flex-align: center;
+          align-items: center;
+  -webkit-box-pack: center;
+      -ms-flex-pack: center;
+          justify-content: center;
+  width: 100%; }

+ 83 - 0
support/client/lib/vwf/view/lib/mdc/dist/mdc.fab.css-entry

@@ -0,0 +1,83 @@
+/*!
+ Material Components for the web
+ Copyright (c) 2017 Google Inc.
+ License: Apache-2.0
+*/
+/******/ (function(modules) { // webpackBootstrap
+/******/ 	// The module cache
+/******/ 	var installedModules = {};
+/******/
+/******/ 	// The require function
+/******/ 	function __webpack_require__(moduleId) {
+/******/
+/******/ 		// Check if module is in cache
+/******/ 		if(installedModules[moduleId]) {
+/******/ 			return installedModules[moduleId].exports;
+/******/ 		}
+/******/ 		// Create a new module (and put it into the cache)
+/******/ 		var module = installedModules[moduleId] = {
+/******/ 			i: moduleId,
+/******/ 			l: false,
+/******/ 			exports: {}
+/******/ 		};
+/******/
+/******/ 		// Execute the module function
+/******/ 		modules[moduleId].call(module.exports, module, module.exports, __webpack_require__);
+/******/
+/******/ 		// Flag the module as loaded
+/******/ 		module.l = true;
+/******/
+/******/ 		// Return the exports of the module
+/******/ 		return module.exports;
+/******/ 	}
+/******/
+/******/
+/******/ 	// expose the modules object (__webpack_modules__)
+/******/ 	__webpack_require__.m = modules;
+/******/
+/******/ 	// expose the module cache
+/******/ 	__webpack_require__.c = installedModules;
+/******/
+/******/ 	// identity function for calling harmony imports with the correct context
+/******/ 	__webpack_require__.i = function(value) { return value; };
+/******/
+/******/ 	// define getter function for harmony exports
+/******/ 	__webpack_require__.d = function(exports, name, getter) {
+/******/ 		if(!__webpack_require__.o(exports, name)) {
+/******/ 			Object.defineProperty(exports, name, {
+/******/ 				configurable: false,
+/******/ 				enumerable: true,
+/******/ 				get: getter
+/******/ 			});
+/******/ 		}
+/******/ 	};
+/******/
+/******/ 	// getDefaultExport function for compatibility with non-harmony modules
+/******/ 	__webpack_require__.n = function(module) {
+/******/ 		var getter = module && module.__esModule ?
+/******/ 			function getDefault() { return module['default']; } :
+/******/ 			function getModuleExports() { return module; };
+/******/ 		__webpack_require__.d(getter, 'a', getter);
+/******/ 		return getter;
+/******/ 	};
+/******/
+/******/ 	// Object.prototype.hasOwnProperty.call
+/******/ 	__webpack_require__.o = function(object, property) { return Object.prototype.hasOwnProperty.call(object, property); };
+/******/
+/******/ 	// __webpack_public_path__
+/******/ 	__webpack_require__.p = "/assets/";
+/******/
+/******/ 	// Load entry module and return exports
+/******/ 	return __webpack_require__(__webpack_require__.s = 8);
+/******/ })
+/************************************************************************/
+/******/ ({
+
+/***/ 8:
+/***/ (function(module, exports) {
+
+// removed by extract-text-webpack-plugin
+
+/***/ })
+
+/******/ });

+ 279 - 0
support/client/lib/vwf/view/lib/mdc/dist/mdc.form-field.css

@@ -0,0 +1,279 @@
+/*!
+ Material Components for the web
+ Copyright (c) 2017 Google Inc.
+ License: Apache-2.0
+*/
+/**
+ * Creates a rule that will be applied when an MDC-Web component is within the context of an RTL layout.
+ *
+ * Usage Example:
+ * ```scss
+ * .mdc-foo {
+ *   position: absolute;
+ *   left: 0;
+ *
+ *   @include mdc-rtl {
+ *     left: auto;
+ *     right: 0;
+ *   }
+ *
+ *   &__bar {
+ *     margin-left: 4px;
+ *     @include mdc-rtl(".mdc-foo") {
+ *       margin-left: auto;
+ *       margin-right: 4px;
+ *     }
+ *   }
+ * }
+ *
+ * .mdc-foo--mod {
+ *   padding-left: 4px;
+ *
+ *   @include mdc-rtl {
+ *     padding-left: auto;
+ *     padding-right: 4px;
+ *   }
+ * }
+ * ```
+ *
+ * Note that this works by checking for [dir="rtl"] on an ancestor element. While this will work
+ * in most cases, it will in some cases lead to false negatives, e.g.
+ *
+ * ```html
+ * <html dir="rtl">
+ *   <!-- ... -->
+ *   <div dir="ltr">
+ *     <div class="mdc-foo">Styled incorrectly as RTL!</div>
+ *   </div>
+ * </html>
+ * ```
+ *
+ * In the future, selectors such as :dir (http://mdn.io/:dir) will help us mitigate this.
+ */
+/**
+ * Takes a base box-model property - e.g. margin / border / padding - along with a default
+ * direction and value, and emits rules which apply the value to the
+ * "<base-property>-<default-direction>" property by default, but flips the direction
+ * when within an RTL context.
+ *
+ * For example:
+ *
+ * ```scss
+ * .mdc-foo {
+ *   @include mdc-rtl-reflexive-box(margin, left, 8px);
+ * }
+ * ```
+ * is equivalent to:
+ *
+ * ```scss
+ * .mdc-foo {
+ *   margin-left: 8px;
+ *
+ *   @include mdc-rtl {
+ *     margin-right: 8px;
+ *     margin-left: 0;
+ *   }
+ * }
+ * ```
+ * whereas:
+ *
+ * ```scss
+ * .mdc-foo {
+ *   @include mdc-rtl-reflexive-box(margin, right, 8px);
+ * }
+ * ```
+ * is equivalent to:
+ *
+ * ```scss
+ * .mdc-foo {
+ *   margin-right: 8px;
+ *
+ *   @include mdc-rtl {
+ *     margin-right: 0;
+ *     margin-left: 8px;
+ *   }
+ * }
+ * ```
+ *
+ * You can also pass a 4th optional $root-selector argument which will be forwarded to `mdc-rtl`,
+ * e.g. `@include mdc-rtl-reflexive-box(margin, left, 8px, ".mdc-component")`.
+ *
+ * Note that this function will always zero out the original value in an RTL context. If you're
+ * trying to flip the values, use mdc-rtl-reflexive-property().
+ */
+/**
+ * Takes a base property and emits rules that assign <base-property>-left to <left-value> and
+ * <base-property>-right to <right-value> in a LTR context, and vice versa in a RTL context.
+ * For example:
+ *
+ * ```scss
+ * .mdc-foo {
+ *   @include mdc-rtl-reflexive-property(margin, auto, 12px);
+ * }
+ * ```
+ * is equivalent to:
+ *
+ * ```scss
+ * .mdc-foo {
+ *   margin-left: auto;
+ *   margin-right: 12px;
+ *
+ *   @include mdc-rtl {
+ *     margin-left: 12px;
+ *     margin-right: auto;
+ *   }
+ * }
+ * ```
+ *
+ * A 4th optional $root-selector argument can be given, which will be passed to `mdc-rtl`.
+ */
+/**
+ * Takes an argument specifying a horizontal position property (either "left" or "right") as well
+ * as a value, and applies that value to the specified position in a LTR context, and flips it in a
+ * RTL context. For example:
+ *
+ * ```scss
+ * .mdc-foo {
+ *   @include mdc-rtl-reflexive-position(left, 0);
+ *   position: absolute;
+ * }
+ * ```
+ * is equivalent to:
+ *
+ * ```scss
+ *  .mdc-foo {
+ *    position: absolute;
+ *    left: 0;
+ *    right: initial;
+ *
+ *    @include mdc-rtl {
+ *      right: 0;
+ *      left: initial;
+ *    }
+ *  }
+ * ```
+ * An optional third $root-selector argument may also be given, which is passed to `mdc-rtl`.
+ */
+/*
+  Precomputed linear color channel values, for use in contrast calculations.
+  See https://www.w3.org/TR/WCAG20-TECHS/G17.html#G17-tests
+
+  Algorithm, for c in 0 to 255:
+  f(c) {
+    c = c / 255;
+    return c < 0.03928 ? c / 12.92 : Math.pow((c + 0.055) / 1.055, 2.4);
+  }
+
+  This lookup table is needed since there is no `pow` in SASS.
+*/
+/**
+ * Calculate the luminance for a color.
+ * See https://www.w3.org/TR/WCAG20-TECHS/G17.html#G17-tests
+ */
+/**
+ * Calculate the contrast ratio between two colors.
+ * See https://www.w3.org/TR/WCAG20-TECHS/G17.html#G17-tests
+ */
+/**
+ * Determine whether to use dark or light text on top of given color.
+ * Returns "dark" for dark text and "light" for light text.
+ */
+/*
+  Main theme colors.
+  If you're a user customizing your color scheme in SASS, these are probably the only variables you need to change.
+*/
+/* Indigo 500 */
+/* Pink A200 */
+/* White */
+/* Which set of text colors to use for each main theme color (light or dark) */
+/* Text colors according to light vs dark and text type */
+/* Primary text colors for each of the theme colors */
+/**
+ * Applies the correct theme color style to the specified property.
+ * $property is typically color or background-color, but can be any CSS property that accepts color values.
+ * $style should be one of the map keys in $mdc-theme-property-values (_variables.scss).
+ */
+/**
+ * Creates a rule to be used in MDC-Web components for dark theming, and applies the provided contents.
+ * Should provide the $root-selector option if applied to anything other than the root selector.
+ * When used with a modifier class, provide a second argument of `true` for the $compound parameter
+ * to specify that this should be attached as a compound class.
+ *
+ * Usage example:
+ *
+ * ```scss
+ * .mdc-foo {
+ *   color: black;
+ *
+ *   @include mdc-theme-dark {
+ *     color: white;
+ *   }
+ *
+ *   &__bar {
+ *     background: black;
+ *
+ *     @include mdc-theme-dark(".mdc-foo") {
+ *       background: white;
+ *     }
+ *   }
+ * }
+ *
+ * .mdc-foo--disabled {
+ *   opacity: .38;
+ *
+ *   @include mdc-theme-dark(".mdc-foo", true) {
+ *     opacity: .5;
+ *   }
+ * }
+ * ```
+ */
+/* TODO(sgomes): Figure out what to do about desktop font sizes. */
+/* TODO(sgomes): Figure out what to do about i18n and i18n font sizes. */
+/* stylelint-disable selector-max-type */
+.mdc-form-field {
+  font-family: Roboto, sans-serif;
+  -moz-osx-font-smoothing: grayscale;
+  -webkit-font-smoothing: antialiased;
+  font-size: 0.875rem;
+  font-weight: 400;
+  letter-spacing: 0.04em;
+  line-height: 1.25rem;
+  text-decoration: inherit;
+  text-transform: inherit;
+  /* @alternate */
+  color: rgba(0, 0, 0, 0.87);
+  color: var(--mdc-theme-text-primary-on-light, rgba(0, 0, 0, 0.87));
+  display: -webkit-inline-box;
+  display: -ms-inline-flexbox;
+  display: inline-flex;
+  -webkit-box-align: center;
+      -ms-flex-align: center;
+          align-items: center;
+  vertical-align: middle; }
+  .mdc-form-field--theme-dark,
+  .mdc-theme--dark .mdc-form-field {
+    /* @alternate */
+    color: white;
+    color: var(--mdc-theme-text-primary-on-dark, white); }
+  .mdc-form-field > label {
+    -webkit-box-ordinal-group: 1;
+        -ms-flex-order: 0;
+            order: 0;
+    margin-right: auto;
+    padding-left: 4px; }
+  [dir="rtl"] .mdc-form-field > label, .mdc-form-field[dir="rtl"] > label {
+    margin-left: auto;
+    padding-right: 4px; }
+
+.mdc-form-field--align-end > label {
+  -webkit-box-ordinal-group: 0;
+      -ms-flex-order: -1;
+          order: -1;
+  margin-left: auto;
+  padding-right: 4px; }
+
+[dir="rtl"] .mdc-form-field--align-end > label, .mdc-form-field--align-end[dir="rtl"] > label {
+  margin-right: auto;
+  padding-left: 4px; }
+
+/* stylelint-enable selector-max-type */

+ 83 - 0
support/client/lib/vwf/view/lib/mdc/dist/mdc.form-field.css-entry

@@ -0,0 +1,83 @@
+/*!
+ Material Components for the web
+ Copyright (c) 2017 Google Inc.
+ License: Apache-2.0
+*/
+/******/ (function(modules) { // webpackBootstrap
+/******/ 	// The module cache
+/******/ 	var installedModules = {};
+/******/
+/******/ 	// The require function
+/******/ 	function __webpack_require__(moduleId) {
+/******/
+/******/ 		// Check if module is in cache
+/******/ 		if(installedModules[moduleId]) {
+/******/ 			return installedModules[moduleId].exports;
+/******/ 		}
+/******/ 		// Create a new module (and put it into the cache)
+/******/ 		var module = installedModules[moduleId] = {
+/******/ 			i: moduleId,
+/******/ 			l: false,
+/******/ 			exports: {}
+/******/ 		};
+/******/
+/******/ 		// Execute the module function
+/******/ 		modules[moduleId].call(module.exports, module, module.exports, __webpack_require__);
+/******/
+/******/ 		// Flag the module as loaded
+/******/ 		module.l = true;
+/******/
+/******/ 		// Return the exports of the module
+/******/ 		return module.exports;
+/******/ 	}
+/******/
+/******/
+/******/ 	// expose the modules object (__webpack_modules__)
+/******/ 	__webpack_require__.m = modules;
+/******/
+/******/ 	// expose the module cache
+/******/ 	__webpack_require__.c = installedModules;
+/******/
+/******/ 	// identity function for calling harmony imports with the correct context
+/******/ 	__webpack_require__.i = function(value) { return value; };
+/******/
+/******/ 	// define getter function for harmony exports
+/******/ 	__webpack_require__.d = function(exports, name, getter) {
+/******/ 		if(!__webpack_require__.o(exports, name)) {
+/******/ 			Object.defineProperty(exports, name, {
+/******/ 				configurable: false,
+/******/ 				enumerable: true,
+/******/ 				get: getter
+/******/ 			});
+/******/ 		}
+/******/ 	};
+/******/
+/******/ 	// getDefaultExport function for compatibility with non-harmony modules
+/******/ 	__webpack_require__.n = function(module) {
+/******/ 		var getter = module && module.__esModule ?
+/******/ 			function getDefault() { return module['default']; } :
+/******/ 			function getModuleExports() { return module; };
+/******/ 		__webpack_require__.d(getter, 'a', getter);
+/******/ 		return getter;
+/******/ 	};
+/******/
+/******/ 	// Object.prototype.hasOwnProperty.call
+/******/ 	__webpack_require__.o = function(object, property) { return Object.prototype.hasOwnProperty.call(object, property); };
+/******/
+/******/ 	// __webpack_public_path__
+/******/ 	__webpack_require__.p = "/assets/";
+/******/
+/******/ 	// Load entry module and return exports
+/******/ 	return __webpack_require__(__webpack_require__.s = 9);
+/******/ })
+/************************************************************************/
+/******/ ({
+
+/***/ 9:
+/***/ (function(module, exports) {
+
+// removed by extract-text-webpack-plugin
+
+/***/ })
+
+/******/ });

+ 666 - 0
support/client/lib/vwf/view/lib/mdc/dist/mdc.formField.js

@@ -0,0 +1,666 @@
+/*!
+ Material Components for the web
+ Copyright (c) 2017 Google Inc.
+ License: Apache-2.0
+*/
+(function webpackUniversalModuleDefinition(root, factory) {
+	if(typeof exports === 'object' && typeof module === 'object')
+		module.exports = factory();
+	else if(typeof define === 'function' && define.amd)
+		define([], factory);
+	else if(typeof exports === 'object')
+		exports["formField"] = factory();
+	else
+		root["mdc"] = root["mdc"] || {}, root["mdc"]["formField"] = factory();
+})(this, function() {
+return /******/ (function(modules) { // webpackBootstrap
+/******/ 	// The module cache
+/******/ 	var installedModules = {};
+/******/
+/******/ 	// The require function
+/******/ 	function __webpack_require__(moduleId) {
+/******/
+/******/ 		// Check if module is in cache
+/******/ 		if(installedModules[moduleId]) {
+/******/ 			return installedModules[moduleId].exports;
+/******/ 		}
+/******/ 		// Create a new module (and put it into the cache)
+/******/ 		var module = installedModules[moduleId] = {
+/******/ 			i: moduleId,
+/******/ 			l: false,
+/******/ 			exports: {}
+/******/ 		};
+/******/
+/******/ 		// Execute the module function
+/******/ 		modules[moduleId].call(module.exports, module, module.exports, __webpack_require__);
+/******/
+/******/ 		// Flag the module as loaded
+/******/ 		module.l = true;
+/******/
+/******/ 		// Return the exports of the module
+/******/ 		return module.exports;
+/******/ 	}
+/******/
+/******/
+/******/ 	// expose the modules object (__webpack_modules__)
+/******/ 	__webpack_require__.m = modules;
+/******/
+/******/ 	// expose the module cache
+/******/ 	__webpack_require__.c = installedModules;
+/******/
+/******/ 	// identity function for calling harmony imports with the correct context
+/******/ 	__webpack_require__.i = function(value) { return value; };
+/******/
+/******/ 	// define getter function for harmony exports
+/******/ 	__webpack_require__.d = function(exports, name, getter) {
+/******/ 		if(!__webpack_require__.o(exports, name)) {
+/******/ 			Object.defineProperty(exports, name, {
+/******/ 				configurable: false,
+/******/ 				enumerable: true,
+/******/ 				get: getter
+/******/ 			});
+/******/ 		}
+/******/ 	};
+/******/
+/******/ 	// getDefaultExport function for compatibility with non-harmony modules
+/******/ 	__webpack_require__.n = function(module) {
+/******/ 		var getter = module && module.__esModule ?
+/******/ 			function getDefault() { return module['default']; } :
+/******/ 			function getModuleExports() { return module; };
+/******/ 		__webpack_require__.d(getter, 'a', getter);
+/******/ 		return getter;
+/******/ 	};
+/******/
+/******/ 	// Object.prototype.hasOwnProperty.call
+/******/ 	__webpack_require__.o = function(object, property) { return Object.prototype.hasOwnProperty.call(object, property); };
+/******/
+/******/ 	// __webpack_public_path__
+/******/ 	__webpack_require__.p = "/assets/";
+/******/
+/******/ 	// Load entry module and return exports
+/******/ 	return __webpack_require__(__webpack_require__.s = 87);
+/******/ })
+/************************************************************************/
+/******/ ({
+
+/***/ 0:
+/***/ (function(module, __webpack_exports__, __webpack_require__) {
+
+"use strict";
+var _createClass = function () { function defineProperties(target, props) { for (var i = 0; i < props.length; i++) { var descriptor = props[i]; descriptor.enumerable = descriptor.enumerable || false; descriptor.configurable = true; if ("value" in descriptor) descriptor.writable = true; Object.defineProperty(target, descriptor.key, descriptor); } } return function (Constructor, protoProps, staticProps) { if (protoProps) defineProperties(Constructor.prototype, protoProps); if (staticProps) defineProperties(Constructor, staticProps); return Constructor; }; }();
+
+function _classCallCheck(instance, Constructor) { if (!(instance instanceof Constructor)) { throw new TypeError("Cannot call a class as a function"); } }
+
+/**
+ * Copyright 2016 Google Inc.
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *   http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+
+/**
+ * @template A
+ */
+var MDCFoundation = function () {
+  _createClass(MDCFoundation, null, [{
+    key: "cssClasses",
+
+    /** @return enum{cssClasses} */
+    get: function get() {
+      // Classes extending MDCFoundation should implement this method to return an object which exports every
+      // CSS class the foundation class needs as a property. e.g. {ACTIVE: 'mdc-component--active'}
+      return {};
+    }
+
+    /** @return enum{strings} */
+
+  }, {
+    key: "strings",
+    get: function get() {
+      // Classes extending MDCFoundation should implement this method to return an object which exports all
+      // semantic strings as constants. e.g. {ARIA_ROLE: 'tablist'}
+      return {};
+    }
+
+    /** @return enum{numbers} */
+
+  }, {
+    key: "numbers",
+    get: function get() {
+      // Classes extending MDCFoundation should implement this method to return an object which exports all
+      // of its semantic numbers as constants. e.g. {ANIMATION_DELAY_MS: 350}
+      return {};
+    }
+
+    /** @return {!Object} */
+
+  }, {
+    key: "defaultAdapter",
+    get: function get() {
+      // Classes extending MDCFoundation may choose to implement this getter in order to provide a convenient
+      // way of viewing the necessary methods of an adapter. In the future, this could also be used for adapter
+      // validation.
+      return {};
+    }
+
+    /**
+     * @param {A=} adapter
+     */
+
+  }]);
+
+  function MDCFoundation() {
+    var adapter = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : {};
+
+    _classCallCheck(this, MDCFoundation);
+
+    /** @protected {!A} */
+    this.adapter_ = adapter;
+  }
+
+  _createClass(MDCFoundation, [{
+    key: "init",
+    value: function init() {
+      // Subclasses should override this method to perform initialization routines (registering events, etc.)
+    }
+  }, {
+    key: "destroy",
+    value: function destroy() {
+      // Subclasses should override this method to perform de-initialization routines (de-registering events, etc.)
+    }
+  }]);
+
+  return MDCFoundation;
+}();
+
+/* harmony default export */ __webpack_exports__["a"] = (MDCFoundation);
+
+/***/ }),
+
+/***/ 1:
+/***/ (function(module, __webpack_exports__, __webpack_require__) {
+
+"use strict";
+/* harmony import */ var __WEBPACK_IMPORTED_MODULE_0__foundation__ = __webpack_require__(0);
+var _createClass = function () { function defineProperties(target, props) { for (var i = 0; i < props.length; i++) { var descriptor = props[i]; descriptor.enumerable = descriptor.enumerable || false; descriptor.configurable = true; if ("value" in descriptor) descriptor.writable = true; Object.defineProperty(target, descriptor.key, descriptor); } } return function (Constructor, protoProps, staticProps) { if (protoProps) defineProperties(Constructor.prototype, protoProps); if (staticProps) defineProperties(Constructor, staticProps); return Constructor; }; }();
+
+function _classCallCheck(instance, Constructor) { if (!(instance instanceof Constructor)) { throw new TypeError("Cannot call a class as a function"); } }
+
+/**
+ * Copyright 2016 Google Inc.
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *   http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+
+
+
+/**
+ * @template F
+ */
+
+var MDCComponent = function () {
+  _createClass(MDCComponent, null, [{
+    key: 'attachTo',
+
+    /**
+     * @param {!Element} root
+     * @return {!MDCComponent}
+     */
+    value: function attachTo(root) {
+      // Subclasses which extend MDCBase should provide an attachTo() method that takes a root element and
+      // returns an instantiated component with its root set to that element. Also note that in the cases of
+      // subclasses, an explicit foundation class will not have to be passed in; it will simply be initialized
+      // from getDefaultFoundation().
+      return new MDCComponent(root, new __WEBPACK_IMPORTED_MODULE_0__foundation__["a" /* default */]());
+    }
+
+    /**
+     * @param {!Element} root
+     * @param {F=} foundation
+     * @param {...?} args
+     */
+
+  }]);
+
+  function MDCComponent(root) {
+    var foundation = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : undefined;
+
+    _classCallCheck(this, MDCComponent);
+
+    /** @protected {!Element} */
+    this.root_ = root;
+
+    for (var _len = arguments.length, args = Array(_len > 2 ? _len - 2 : 0), _key = 2; _key < _len; _key++) {
+      args[_key - 2] = arguments[_key];
+    }
+
+    this.initialize.apply(this, args);
+    // Note that we initialize foundation here and not within the constructor's default param so that
+    // this.root_ is defined and can be used within the foundation class.
+    /** @protected {!F} */
+    this.foundation_ = foundation === undefined ? this.getDefaultFoundation() : foundation;
+    this.foundation_.init();
+    this.initialSyncWithDOM();
+  }
+
+  _createClass(MDCComponent, [{
+    key: 'initialize',
+    value: function initialize() /* ...args */{}
+    // Subclasses can override this to do any additional setup work that would be considered part of a
+    // "constructor". Essentially, it is a hook into the parent constructor before the foundation is
+    // initialized. Any additional arguments besides root and foundation will be passed in here.
+
+
+    /**
+     * @return {!F} foundation
+     */
+
+  }, {
+    key: 'getDefaultFoundation',
+    value: function getDefaultFoundation() {
+      // Subclasses must override this method to return a properly configured foundation class for the
+      // component.
+      throw new Error('Subclasses must override getDefaultFoundation to return a properly configured ' + 'foundation class');
+    }
+  }, {
+    key: 'initialSyncWithDOM',
+    value: function initialSyncWithDOM() {
+      // Subclasses should override this method if they need to perform work to synchronize with a host DOM
+      // object. An example of this would be a form control wrapper that needs to synchronize its internal state
+      // to some property or attribute of the host DOM. Please note: this is *not* the place to perform DOM
+      // reads/writes that would cause layout / paint, as this is called synchronously from within the constructor.
+    }
+  }, {
+    key: 'destroy',
+    value: function destroy() {
+      // Subclasses may implement this method to release any resources / deregister any listeners they have
+      // attached. An example of this might be deregistering a resize event from the window object.
+      this.foundation_.destroy();
+    }
+
+    /**
+     * Wrapper method to add an event listener to the component's root element. This is most useful when
+     * listening for custom events.
+     * @param {string} evtType
+     * @param {!Function} handler
+     */
+
+  }, {
+    key: 'listen',
+    value: function listen(evtType, handler) {
+      this.root_.addEventListener(evtType, handler);
+    }
+
+    /**
+     * Wrapper method to remove an event listener to the component's root element. This is most useful when
+     * unlistening for custom events.
+     * @param {string} evtType
+     * @param {!Function} handler
+     */
+
+  }, {
+    key: 'unlisten',
+    value: function unlisten(evtType, handler) {
+      this.root_.removeEventListener(evtType, handler);
+    }
+
+    /**
+     * Fires a cross-browser-compatible custom event from the component root of the given type,
+     * with the given data.
+     * @param {string} evtType
+     * @param {!Object} evtData
+     * @param {boolean=} shouldBubble
+     */
+
+  }, {
+    key: 'emit',
+    value: function emit(evtType, evtData) {
+      var shouldBubble = arguments.length > 2 && arguments[2] !== undefined ? arguments[2] : false;
+
+      var evt = void 0;
+      if (typeof CustomEvent === 'function') {
+        evt = new CustomEvent(evtType, {
+          detail: evtData,
+          bubbles: shouldBubble
+        });
+      } else {
+        evt = document.createEvent('CustomEvent');
+        evt.initCustomEvent(evtType, shouldBubble, false, evtData);
+      }
+
+      this.root_.dispatchEvent(evt);
+    }
+  }]);
+
+  return MDCComponent;
+}();
+
+/* harmony default export */ __webpack_exports__["a"] = (MDCComponent);
+
+/***/ }),
+
+/***/ 2:
+/***/ (function(module, __webpack_exports__, __webpack_require__) {
+
+"use strict";
+Object.defineProperty(__webpack_exports__, "__esModule", { value: true });
+/* harmony import */ var __WEBPACK_IMPORTED_MODULE_0__foundation__ = __webpack_require__(0);
+/* harmony import */ var __WEBPACK_IMPORTED_MODULE_1__component__ = __webpack_require__(1);
+/* harmony import */ var __WEBPACK_IMPORTED_MODULE_2__selection_control__ = __webpack_require__(3);
+/* harmony reexport (binding) */ __webpack_require__.d(__webpack_exports__, "MDCFoundation", function() { return __WEBPACK_IMPORTED_MODULE_0__foundation__["a"]; });
+/* harmony reexport (binding) */ __webpack_require__.d(__webpack_exports__, "MDCComponent", function() { return __WEBPACK_IMPORTED_MODULE_1__component__["a"]; });
+/* harmony reexport (binding) */ __webpack_require__.d(__webpack_exports__, "SelectionControlState", function() { return __WEBPACK_IMPORTED_MODULE_2__selection_control__["a"]; });
+/**
+ * Copyright 2016 Google Inc.
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *   http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+
+
+
+
+
+
+
+/***/ }),
+
+/***/ 27:
+/***/ (function(module, __webpack_exports__, __webpack_require__) {
+
+"use strict";
+Object.defineProperty(__webpack_exports__, "__esModule", { value: true });
+/* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, "MDCFormField", function() { return MDCFormField; });
+/* harmony import */ var __WEBPACK_IMPORTED_MODULE_0__material_base__ = __webpack_require__(2);
+/* harmony import */ var __WEBPACK_IMPORTED_MODULE_1__foundation__ = __webpack_require__(53);
+/* harmony reexport (binding) */ __webpack_require__.d(__webpack_exports__, "MDCFormFieldFoundation", function() { return __WEBPACK_IMPORTED_MODULE_1__foundation__["a"]; });
+var _createClass = function () { function defineProperties(target, props) { for (var i = 0; i < props.length; i++) { var descriptor = props[i]; descriptor.enumerable = descriptor.enumerable || false; descriptor.configurable = true; if ("value" in descriptor) descriptor.writable = true; Object.defineProperty(target, descriptor.key, descriptor); } } return function (Constructor, protoProps, staticProps) { if (protoProps) defineProperties(Constructor.prototype, protoProps); if (staticProps) defineProperties(Constructor, staticProps); return Constructor; }; }();
+
+function _classCallCheck(instance, Constructor) { if (!(instance instanceof Constructor)) { throw new TypeError("Cannot call a class as a function"); } }
+
+function _possibleConstructorReturn(self, call) { if (!self) { throw new ReferenceError("this hasn't been initialised - super() hasn't been called"); } return call && (typeof call === "object" || typeof call === "function") ? call : self; }
+
+function _inherits(subClass, superClass) { if (typeof superClass !== "function" && superClass !== null) { throw new TypeError("Super expression must either be null or a function, not " + typeof superClass); } subClass.prototype = Object.create(superClass && superClass.prototype, { constructor: { value: subClass, enumerable: false, writable: true, configurable: true } }); if (superClass) Object.setPrototypeOf ? Object.setPrototypeOf(subClass, superClass) : subClass.__proto__ = superClass; }
+
+/**
+ * Copyright 2017 Google Inc. All Rights Reserved.
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *      http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+
+
+
+
+
+
+var MDCFormField = function (_MDCComponent) {
+  _inherits(MDCFormField, _MDCComponent);
+
+  function MDCFormField() {
+    _classCallCheck(this, MDCFormField);
+
+    return _possibleConstructorReturn(this, (MDCFormField.__proto__ || Object.getPrototypeOf(MDCFormField)).apply(this, arguments));
+  }
+
+  _createClass(MDCFormField, [{
+    key: 'getDefaultFoundation',
+    value: function getDefaultFoundation() {
+      var _this2 = this;
+
+      return new __WEBPACK_IMPORTED_MODULE_1__foundation__["a" /* default */]({
+        registerInteractionHandler: function registerInteractionHandler(type, handler) {
+          return _this2.label_.addEventListener(type, handler);
+        },
+        deregisterInteractionHandler: function deregisterInteractionHandler(type, handler) {
+          return _this2.label_.removeEventListener(type, handler);
+        },
+        activateInputRipple: function activateInputRipple() {
+          if (_this2.input_ && _this2.input_.ripple) {
+            _this2.input_.ripple.activate();
+          }
+        },
+        deactivateInputRipple: function deactivateInputRipple() {
+          if (_this2.input_ && _this2.input_.ripple) {
+            _this2.input_.ripple.deactivate();
+          }
+        }
+      });
+    }
+  }, {
+    key: 'input',
+    set: function set(input) {
+      this.input_ = input;
+    },
+    get: function get() {
+      return this.input_;
+    }
+  }, {
+    key: 'label_',
+    get: function get() {
+      return this.root_.querySelector(__WEBPACK_IMPORTED_MODULE_1__foundation__["a" /* default */].strings.LABEL_SELECTOR);
+    }
+  }], [{
+    key: 'attachTo',
+    value: function attachTo(root) {
+      return new MDCFormField(root);
+    }
+  }]);
+
+  return MDCFormField;
+}(__WEBPACK_IMPORTED_MODULE_0__material_base__["MDCComponent"]);
+
+/***/ }),
+
+/***/ 3:
+/***/ (function(module, __webpack_exports__, __webpack_require__) {
+
+"use strict";
+/* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, "a", function() { return SelectionControlState; });
+/**
+ * Copyright 2017 Google Inc. All Rights Reserved.
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *      http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+
+/**
+ * @typedef {!{
+ *   checked: boolean,
+ *   indeterminate: boolean,
+ *   disabled: boolean,
+ *   value: ?string
+ * }}
+ */
+var SelectionControlState = void 0;
+
+/***/ }),
+
+/***/ 52:
+/***/ (function(module, __webpack_exports__, __webpack_require__) {
+
+"use strict";
+/* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, "a", function() { return cssClasses; });
+/* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, "b", function() { return strings; });
+/**
+ * Copyright 2017 Google Inc. All Rights Reserved.
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *      http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+
+var cssClasses = {
+  ROOT: 'mdc-form-field'
+};
+
+var strings = {
+  LABEL_SELECTOR: '.mdc-form-field > label'
+};
+
+/***/ }),
+
+/***/ 53:
+/***/ (function(module, __webpack_exports__, __webpack_require__) {
+
+"use strict";
+/* harmony import */ var __WEBPACK_IMPORTED_MODULE_0__material_base__ = __webpack_require__(2);
+/* harmony import */ var __WEBPACK_IMPORTED_MODULE_1__constants__ = __webpack_require__(52);
+var _extends = Object.assign || function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; };
+
+var _createClass = function () { function defineProperties(target, props) { for (var i = 0; i < props.length; i++) { var descriptor = props[i]; descriptor.enumerable = descriptor.enumerable || false; descriptor.configurable = true; if ("value" in descriptor) descriptor.writable = true; Object.defineProperty(target, descriptor.key, descriptor); } } return function (Constructor, protoProps, staticProps) { if (protoProps) defineProperties(Constructor.prototype, protoProps); if (staticProps) defineProperties(Constructor, staticProps); return Constructor; }; }();
+
+function _classCallCheck(instance, Constructor) { if (!(instance instanceof Constructor)) { throw new TypeError("Cannot call a class as a function"); } }
+
+function _possibleConstructorReturn(self, call) { if (!self) { throw new ReferenceError("this hasn't been initialised - super() hasn't been called"); } return call && (typeof call === "object" || typeof call === "function") ? call : self; }
+
+function _inherits(subClass, superClass) { if (typeof superClass !== "function" && superClass !== null) { throw new TypeError("Super expression must either be null or a function, not " + typeof superClass); } subClass.prototype = Object.create(superClass && superClass.prototype, { constructor: { value: subClass, enumerable: false, writable: true, configurable: true } }); if (superClass) Object.setPrototypeOf ? Object.setPrototypeOf(subClass, superClass) : subClass.__proto__ = superClass; }
+
+/**
+ * Copyright 2017 Google Inc. All Rights Reserved.
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *      http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+
+
+
+
+var MDCFormFieldFoundation = function (_MDCFoundation) {
+  _inherits(MDCFormFieldFoundation, _MDCFoundation);
+
+  _createClass(MDCFormFieldFoundation, null, [{
+    key: 'cssClasses',
+    get: function get() {
+      return __WEBPACK_IMPORTED_MODULE_1__constants__["a" /* cssClasses */];
+    }
+  }, {
+    key: 'strings',
+    get: function get() {
+      return __WEBPACK_IMPORTED_MODULE_1__constants__["b" /* strings */];
+    }
+  }, {
+    key: 'defaultAdapter',
+    get: function get() {
+      return {
+        registerInteractionHandler: function registerInteractionHandler() /* type: string, handler: EventListener */{},
+        deregisterInteractionHandler: function deregisterInteractionHandler() /* type: string, handler: EventListener */{},
+        activateInputRipple: function activateInputRipple() {},
+        deactivateInputRipple: function deactivateInputRipple() {}
+      };
+    }
+  }]);
+
+  function MDCFormFieldFoundation(adapter) {
+    _classCallCheck(this, MDCFormFieldFoundation);
+
+    var _this = _possibleConstructorReturn(this, (MDCFormFieldFoundation.__proto__ || Object.getPrototypeOf(MDCFormFieldFoundation)).call(this, _extends(MDCFormFieldFoundation.defaultAdapter, adapter)));
+
+    _this.clickHandler_ = function (evt) {
+      return _this.handleClick_(evt);
+    };
+    return _this;
+  }
+
+  _createClass(MDCFormFieldFoundation, [{
+    key: 'init',
+    value: function init() {
+      this.adapter_.registerInteractionHandler('click', this.clickHandler_);
+    }
+  }, {
+    key: 'destroy',
+    value: function destroy() {
+      this.adapter_.deregisterInteractionHandler('click', this.clickHandler_);
+    }
+  }, {
+    key: 'handleClick_',
+    value: function handleClick_() {
+      var _this2 = this;
+
+      this.adapter_.activateInputRipple();
+      requestAnimationFrame(function () {
+        return _this2.adapter_.deactivateInputRipple();
+      });
+    }
+  }]);
+
+  return MDCFormFieldFoundation;
+}(__WEBPACK_IMPORTED_MODULE_0__material_base__["MDCFoundation"]);
+
+/* harmony default export */ __webpack_exports__["a"] = (MDCFormFieldFoundation);
+
+/***/ }),
+
+/***/ 87:
+/***/ (function(module, exports, __webpack_require__) {
+
+module.exports = __webpack_require__(27);
+
+
+/***/ })
+
+/******/ });
+});

+ 389 - 0
support/client/lib/vwf/view/lib/mdc/dist/mdc.grid-list.css

@@ -0,0 +1,389 @@
+/*!
+ Material Components for the web
+ Copyright (c) 2017 Google Inc.
+ License: Apache-2.0
+*/
+/**
+ * Creates a rule that will be applied when an MDC-Web component is within the context of an RTL layout.
+ *
+ * Usage Example:
+ * ```scss
+ * .mdc-foo {
+ *   position: absolute;
+ *   left: 0;
+ *
+ *   @include mdc-rtl {
+ *     left: auto;
+ *     right: 0;
+ *   }
+ *
+ *   &__bar {
+ *     margin-left: 4px;
+ *     @include mdc-rtl(".mdc-foo") {
+ *       margin-left: auto;
+ *       margin-right: 4px;
+ *     }
+ *   }
+ * }
+ *
+ * .mdc-foo--mod {
+ *   padding-left: 4px;
+ *
+ *   @include mdc-rtl {
+ *     padding-left: auto;
+ *     padding-right: 4px;
+ *   }
+ * }
+ * ```
+ *
+ * Note that this works by checking for [dir="rtl"] on an ancestor element. While this will work
+ * in most cases, it will in some cases lead to false negatives, e.g.
+ *
+ * ```html
+ * <html dir="rtl">
+ *   <!-- ... -->
+ *   <div dir="ltr">
+ *     <div class="mdc-foo">Styled incorrectly as RTL!</div>
+ *   </div>
+ * </html>
+ * ```
+ *
+ * In the future, selectors such as :dir (http://mdn.io/:dir) will help us mitigate this.
+ */
+/**
+ * Takes a base box-model property - e.g. margin / border / padding - along with a default
+ * direction and value, and emits rules which apply the value to the
+ * "<base-property>-<default-direction>" property by default, but flips the direction
+ * when within an RTL context.
+ *
+ * For example:
+ *
+ * ```scss
+ * .mdc-foo {
+ *   @include mdc-rtl-reflexive-box(margin, left, 8px);
+ * }
+ * ```
+ * is equivalent to:
+ *
+ * ```scss
+ * .mdc-foo {
+ *   margin-left: 8px;
+ *
+ *   @include mdc-rtl {
+ *     margin-right: 8px;
+ *     margin-left: 0;
+ *   }
+ * }
+ * ```
+ * whereas:
+ *
+ * ```scss
+ * .mdc-foo {
+ *   @include mdc-rtl-reflexive-box(margin, right, 8px);
+ * }
+ * ```
+ * is equivalent to:
+ *
+ * ```scss
+ * .mdc-foo {
+ *   margin-right: 8px;
+ *
+ *   @include mdc-rtl {
+ *     margin-right: 0;
+ *     margin-left: 8px;
+ *   }
+ * }
+ * ```
+ *
+ * You can also pass a 4th optional $root-selector argument which will be forwarded to `mdc-rtl`,
+ * e.g. `@include mdc-rtl-reflexive-box(margin, left, 8px, ".mdc-component")`.
+ *
+ * Note that this function will always zero out the original value in an RTL context. If you're
+ * trying to flip the values, use mdc-rtl-reflexive-property().
+ */
+/**
+ * Takes a base property and emits rules that assign <base-property>-left to <left-value> and
+ * <base-property>-right to <right-value> in a LTR context, and vice versa in a RTL context.
+ * For example:
+ *
+ * ```scss
+ * .mdc-foo {
+ *   @include mdc-rtl-reflexive-property(margin, auto, 12px);
+ * }
+ * ```
+ * is equivalent to:
+ *
+ * ```scss
+ * .mdc-foo {
+ *   margin-left: auto;
+ *   margin-right: 12px;
+ *
+ *   @include mdc-rtl {
+ *     margin-left: 12px;
+ *     margin-right: auto;
+ *   }
+ * }
+ * ```
+ *
+ * A 4th optional $root-selector argument can be given, which will be passed to `mdc-rtl`.
+ */
+/**
+ * Takes an argument specifying a horizontal position property (either "left" or "right") as well
+ * as a value, and applies that value to the specified position in a LTR context, and flips it in a
+ * RTL context. For example:
+ *
+ * ```scss
+ * .mdc-foo {
+ *   @include mdc-rtl-reflexive-position(left, 0);
+ *   position: absolute;
+ * }
+ * ```
+ * is equivalent to:
+ *
+ * ```scss
+ *  .mdc-foo {
+ *    position: absolute;
+ *    left: 0;
+ *    right: initial;
+ *
+ *    @include mdc-rtl {
+ *      right: 0;
+ *      left: initial;
+ *    }
+ *  }
+ * ```
+ * An optional third $root-selector argument may also be given, which is passed to `mdc-rtl`.
+ */
+/*
+  Precomputed linear color channel values, for use in contrast calculations.
+  See https://www.w3.org/TR/WCAG20-TECHS/G17.html#G17-tests
+
+  Algorithm, for c in 0 to 255:
+  f(c) {
+    c = c / 255;
+    return c < 0.03928 ? c / 12.92 : Math.pow((c + 0.055) / 1.055, 2.4);
+  }
+
+  This lookup table is needed since there is no `pow` in SASS.
+*/
+/**
+ * Calculate the luminance for a color.
+ * See https://www.w3.org/TR/WCAG20-TECHS/G17.html#G17-tests
+ */
+/**
+ * Calculate the contrast ratio between two colors.
+ * See https://www.w3.org/TR/WCAG20-TECHS/G17.html#G17-tests
+ */
+/**
+ * Determine whether to use dark or light text on top of given color.
+ * Returns "dark" for dark text and "light" for light text.
+ */
+/*
+  Main theme colors.
+  If you're a user customizing your color scheme in SASS, these are probably the only variables you need to change.
+*/
+/* Indigo 500 */
+/* Pink A200 */
+/* White */
+/* Which set of text colors to use for each main theme color (light or dark) */
+/* Text colors according to light vs dark and text type */
+/* Primary text colors for each of the theme colors */
+/**
+ * Applies the correct theme color style to the specified property.
+ * $property is typically color or background-color, but can be any CSS property that accepts color values.
+ * $style should be one of the map keys in $mdc-theme-property-values (_variables.scss).
+ */
+/**
+ * Creates a rule to be used in MDC-Web components for dark theming, and applies the provided contents.
+ * Should provide the $root-selector option if applied to anything other than the root selector.
+ * When used with a modifier class, provide a second argument of `true` for the $compound parameter
+ * to specify that this should be attached as a compound class.
+ *
+ * Usage example:
+ *
+ * ```scss
+ * .mdc-foo {
+ *   color: black;
+ *
+ *   @include mdc-theme-dark {
+ *     color: white;
+ *   }
+ *
+ *   &__bar {
+ *     background: black;
+ *
+ *     @include mdc-theme-dark(".mdc-foo") {
+ *       background: white;
+ *     }
+ *   }
+ * }
+ *
+ * .mdc-foo--disabled {
+ *   opacity: .38;
+ *
+ *   @include mdc-theme-dark(".mdc-foo", true) {
+ *     opacity: .5;
+ *   }
+ * }
+ * ```
+ */
+/* TODO(sgomes): Figure out what to do about desktop font sizes. */
+/* TODO(sgomes): Figure out what to do about i18n and i18n font sizes. */
+.mdc-grid-list .mdc-grid-tile__primary {
+  padding-bottom: calc(100% / 1); }
+
+.mdc-grid-list .mdc-grid-tile {
+  margin: 2px 0;
+  padding: 0 2px; }
+  .mdc-grid-list .mdc-grid-tile__secondary {
+    left: 2px;
+    width: calc(100% - 4px); }
+
+.mdc-grid-list .mdc-grid-list__tiles {
+  margin: 2px auto; }
+
+.mdc-grid-list__tiles {
+  display: -webkit-box;
+  display: -ms-flexbox;
+  display: flex;
+  -webkit-box-orient: horizontal;
+  -webkit-box-direction: normal;
+      -ms-flex-flow: row wrap;
+          flex-flow: row wrap;
+  margin: 0;
+  padding: 0; }
+
+.mdc-grid-list--tile-gutter-1 .mdc-grid-tile {
+  margin: 0.5px 0;
+  padding: 0 0.5px; }
+  .mdc-grid-list--tile-gutter-1 .mdc-grid-tile__secondary {
+    left: 0.5px;
+    width: calc(100% - 1px); }
+
+.mdc-grid-list--tile-gutter-1 .mdc-grid-list__tiles {
+  margin: 0.5px auto; }
+
+.mdc-grid-list--tile-aspect-16x9 .mdc-grid-tile__primary {
+  padding-bottom: calc(100% / 1.77778); }
+
+.mdc-grid-list--tile-aspect-3x2 .mdc-grid-tile__primary {
+  padding-bottom: calc(100% / 1.5); }
+
+.mdc-grid-list--tile-aspect-2x3 .mdc-grid-tile__primary {
+  padding-bottom: calc(100% / 0.66667); }
+
+.mdc-grid-list--tile-aspect-4x3 .mdc-grid-tile__primary {
+  padding-bottom: calc(100% / 1.33333); }
+
+.mdc-grid-list--tile-aspect-3x4 .mdc-grid-tile__primary {
+  padding-bottom: calc(100% / 0.75); }
+
+.mdc-grid-list--twoline-caption .mdc-grid-tile__secondary {
+  height: 68px; }
+
+.mdc-grid-list--header-caption .mdc-grid-tile__secondary {
+  top: 0;
+  bottom: auto; }
+
+.mdc-grid-list--with-icon-align-start .mdc-grid-tile__secondary {
+  padding-left: 56px;
+  padding-right: 8px; }
+  [dir="rtl"] .mdc-grid-list .mdc-grid-list--with-icon-align-start .mdc-grid-tile__secondary,
+  .mdc-grid-list[dir="rtl"] .mdc-grid-list--with-icon-align-start .mdc-grid-tile__secondary {
+    padding-left: 8px;
+    padding-right: 56px; }
+
+.mdc-grid-list--with-icon-align-start .mdc-grid-tile__icon {
+  left: 16px;
+  right: initial;
+  font-size: 24px; }
+  [dir="rtl"] .mdc-grid-list .mdc-grid-list--with-icon-align-start .mdc-grid-tile__icon,
+  .mdc-grid-list[dir="rtl"] .mdc-grid-list--with-icon-align-start .mdc-grid-tile__icon {
+    left: initial;
+    right: 16px; }
+
+.mdc-grid-list--with-icon-align-end .mdc-grid-tile__secondary {
+  padding-left: 16px;
+  padding-right: 56px; }
+  [dir="rtl"] .mdc-grid-list .mdc-grid-list--with-icon-align-end .mdc-grid-tile__secondary,
+  .mdc-grid-list[dir="rtl"] .mdc-grid-list--with-icon-align-end .mdc-grid-tile__secondary {
+    padding-left: 56px;
+    padding-right: 16px; }
+
+.mdc-grid-list--with-icon-align-end .mdc-grid-tile__icon {
+  left: initial;
+  right: 16px;
+  font-size: 24px; }
+  [dir="rtl"] .mdc-grid-list .mdc-grid-list--with-icon-align-end .mdc-grid-tile__icon,
+  .mdc-grid-list[dir="rtl"] .mdc-grid-list--with-icon-align-end .mdc-grid-tile__icon {
+    left: 16px;
+    right: initial; }
+
+.mdc-grid-tile {
+  display: block;
+  position: relative;
+  width: var(--mdc-grid-list-tile-width, 200px); }
+  .mdc-grid-tile__primary {
+    position: relative;
+    height: 0;
+    /* @alternate */
+    background-color: #fff;
+    background-color: var(--mdc-theme-background, #fff);
+    /* @alternate */
+    color: rgba(0, 0, 0, 0.87);
+    color: var(--mdc-theme-text-primary-on-background, rgba(0, 0, 0, 0.87)); }
+    .mdc-grid-tile__primary-content {
+      position: absolute;
+      top: 0;
+      right: 0;
+      bottom: 0;
+      left: 0;
+      width: 100%;
+      height: 100%;
+      background-repeat: no-repeat;
+      background-position: center;
+      background-size: cover; }
+  .mdc-grid-tile__secondary {
+    position: absolute;
+    -webkit-box-sizing: border-box;
+            box-sizing: border-box;
+    bottom: 0;
+    height: 48px;
+    padding: 16px;
+    /* @alternate */
+    background-color: #3f51b5;
+    background-color: var(--mdc-theme-primary, #3f51b5);
+    /* @alternate */
+    color: white;
+    color: var(--mdc-theme-text-primary-on-primary, white); }
+  .mdc-grid-tile__title {
+    display: block;
+    margin: 0;
+    padding: 0;
+    font-size: 1rem;
+    font-weight: 500;
+    line-height: 1rem;
+    text-overflow: ellipsis;
+    white-space: nowrap;
+    overflow: hidden; }
+  .mdc-grid-tile__support-text {
+    font-family: Roboto, sans-serif;
+    -moz-osx-font-smoothing: grayscale;
+    -webkit-font-smoothing: antialiased;
+    font-size: 0.875rem;
+    font-weight: 400;
+    letter-spacing: 0.04em;
+    line-height: 1.25rem;
+    text-decoration: inherit;
+    text-transform: inherit;
+    text-overflow: ellipsis;
+    white-space: nowrap;
+    overflow: hidden;
+    display: block;
+    margin: 0;
+    margin-top: 4px;
+    padding: 0; }
+  .mdc-grid-tile__icon {
+    position: absolute;
+    top: calc(50% - 24px / 2);
+    font-size: 0; }

+ 83 - 0
support/client/lib/vwf/view/lib/mdc/dist/mdc.grid-list.css-entry

@@ -0,0 +1,83 @@
+/*!
+ Material Components for the web
+ Copyright (c) 2017 Google Inc.
+ License: Apache-2.0
+*/
+/******/ (function(modules) { // webpackBootstrap
+/******/ 	// The module cache
+/******/ 	var installedModules = {};
+/******/
+/******/ 	// The require function
+/******/ 	function __webpack_require__(moduleId) {
+/******/
+/******/ 		// Check if module is in cache
+/******/ 		if(installedModules[moduleId]) {
+/******/ 			return installedModules[moduleId].exports;
+/******/ 		}
+/******/ 		// Create a new module (and put it into the cache)
+/******/ 		var module = installedModules[moduleId] = {
+/******/ 			i: moduleId,
+/******/ 			l: false,
+/******/ 			exports: {}
+/******/ 		};
+/******/
+/******/ 		// Execute the module function
+/******/ 		modules[moduleId].call(module.exports, module, module.exports, __webpack_require__);
+/******/
+/******/ 		// Flag the module as loaded
+/******/ 		module.l = true;
+/******/
+/******/ 		// Return the exports of the module
+/******/ 		return module.exports;
+/******/ 	}
+/******/
+/******/
+/******/ 	// expose the modules object (__webpack_modules__)
+/******/ 	__webpack_require__.m = modules;
+/******/
+/******/ 	// expose the module cache
+/******/ 	__webpack_require__.c = installedModules;
+/******/
+/******/ 	// identity function for calling harmony imports with the correct context
+/******/ 	__webpack_require__.i = function(value) { return value; };
+/******/
+/******/ 	// define getter function for harmony exports
+/******/ 	__webpack_require__.d = function(exports, name, getter) {
+/******/ 		if(!__webpack_require__.o(exports, name)) {
+/******/ 			Object.defineProperty(exports, name, {
+/******/ 				configurable: false,
+/******/ 				enumerable: true,
+/******/ 				get: getter
+/******/ 			});
+/******/ 		}
+/******/ 	};
+/******/
+/******/ 	// getDefaultExport function for compatibility with non-harmony modules
+/******/ 	__webpack_require__.n = function(module) {
+/******/ 		var getter = module && module.__esModule ?
+/******/ 			function getDefault() { return module['default']; } :
+/******/ 			function getModuleExports() { return module; };
+/******/ 		__webpack_require__.d(getter, 'a', getter);
+/******/ 		return getter;
+/******/ 	};
+/******/
+/******/ 	// Object.prototype.hasOwnProperty.call
+/******/ 	__webpack_require__.o = function(object, property) { return Object.prototype.hasOwnProperty.call(object, property); };
+/******/
+/******/ 	// __webpack_public_path__
+/******/ 	__webpack_require__.p = "/assets/";
+/******/
+/******/ 	// Load entry module and return exports
+/******/ 	return __webpack_require__(__webpack_require__.s = 10);
+/******/ })
+/************************************************************************/
+/******/ ({
+
+/***/ 10:
+/***/ (function(module, exports) {
+
+// removed by extract-text-webpack-plugin
+
+/***/ })
+
+/******/ });

+ 673 - 0
support/client/lib/vwf/view/lib/mdc/dist/mdc.gridList.js

@@ -0,0 +1,673 @@
+/*!
+ Material Components for the web
+ Copyright (c) 2017 Google Inc.
+ License: Apache-2.0
+*/
+(function webpackUniversalModuleDefinition(root, factory) {
+	if(typeof exports === 'object' && typeof module === 'object')
+		module.exports = factory();
+	else if(typeof define === 'function' && define.amd)
+		define([], factory);
+	else if(typeof exports === 'object')
+		exports["gridList"] = factory();
+	else
+		root["mdc"] = root["mdc"] || {}, root["mdc"]["gridList"] = factory();
+})(this, function() {
+return /******/ (function(modules) { // webpackBootstrap
+/******/ 	// The module cache
+/******/ 	var installedModules = {};
+/******/
+/******/ 	// The require function
+/******/ 	function __webpack_require__(moduleId) {
+/******/
+/******/ 		// Check if module is in cache
+/******/ 		if(installedModules[moduleId]) {
+/******/ 			return installedModules[moduleId].exports;
+/******/ 		}
+/******/ 		// Create a new module (and put it into the cache)
+/******/ 		var module = installedModules[moduleId] = {
+/******/ 			i: moduleId,
+/******/ 			l: false,
+/******/ 			exports: {}
+/******/ 		};
+/******/
+/******/ 		// Execute the module function
+/******/ 		modules[moduleId].call(module.exports, module, module.exports, __webpack_require__);
+/******/
+/******/ 		// Flag the module as loaded
+/******/ 		module.l = true;
+/******/
+/******/ 		// Return the exports of the module
+/******/ 		return module.exports;
+/******/ 	}
+/******/
+/******/
+/******/ 	// expose the modules object (__webpack_modules__)
+/******/ 	__webpack_require__.m = modules;
+/******/
+/******/ 	// expose the module cache
+/******/ 	__webpack_require__.c = installedModules;
+/******/
+/******/ 	// identity function for calling harmony imports with the correct context
+/******/ 	__webpack_require__.i = function(value) { return value; };
+/******/
+/******/ 	// define getter function for harmony exports
+/******/ 	__webpack_require__.d = function(exports, name, getter) {
+/******/ 		if(!__webpack_require__.o(exports, name)) {
+/******/ 			Object.defineProperty(exports, name, {
+/******/ 				configurable: false,
+/******/ 				enumerable: true,
+/******/ 				get: getter
+/******/ 			});
+/******/ 		}
+/******/ 	};
+/******/
+/******/ 	// getDefaultExport function for compatibility with non-harmony modules
+/******/ 	__webpack_require__.n = function(module) {
+/******/ 		var getter = module && module.__esModule ?
+/******/ 			function getDefault() { return module['default']; } :
+/******/ 			function getModuleExports() { return module; };
+/******/ 		__webpack_require__.d(getter, 'a', getter);
+/******/ 		return getter;
+/******/ 	};
+/******/
+/******/ 	// Object.prototype.hasOwnProperty.call
+/******/ 	__webpack_require__.o = function(object, property) { return Object.prototype.hasOwnProperty.call(object, property); };
+/******/
+/******/ 	// __webpack_public_path__
+/******/ 	__webpack_require__.p = "/assets/";
+/******/
+/******/ 	// Load entry module and return exports
+/******/ 	return __webpack_require__(__webpack_require__.s = 88);
+/******/ })
+/************************************************************************/
+/******/ ({
+
+/***/ 0:
+/***/ (function(module, __webpack_exports__, __webpack_require__) {
+
+"use strict";
+var _createClass = function () { function defineProperties(target, props) { for (var i = 0; i < props.length; i++) { var descriptor = props[i]; descriptor.enumerable = descriptor.enumerable || false; descriptor.configurable = true; if ("value" in descriptor) descriptor.writable = true; Object.defineProperty(target, descriptor.key, descriptor); } } return function (Constructor, protoProps, staticProps) { if (protoProps) defineProperties(Constructor.prototype, protoProps); if (staticProps) defineProperties(Constructor, staticProps); return Constructor; }; }();
+
+function _classCallCheck(instance, Constructor) { if (!(instance instanceof Constructor)) { throw new TypeError("Cannot call a class as a function"); } }
+
+/**
+ * Copyright 2016 Google Inc.
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *   http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+
+/**
+ * @template A
+ */
+var MDCFoundation = function () {
+  _createClass(MDCFoundation, null, [{
+    key: "cssClasses",
+
+    /** @return enum{cssClasses} */
+    get: function get() {
+      // Classes extending MDCFoundation should implement this method to return an object which exports every
+      // CSS class the foundation class needs as a property. e.g. {ACTIVE: 'mdc-component--active'}
+      return {};
+    }
+
+    /** @return enum{strings} */
+
+  }, {
+    key: "strings",
+    get: function get() {
+      // Classes extending MDCFoundation should implement this method to return an object which exports all
+      // semantic strings as constants. e.g. {ARIA_ROLE: 'tablist'}
+      return {};
+    }
+
+    /** @return enum{numbers} */
+
+  }, {
+    key: "numbers",
+    get: function get() {
+      // Classes extending MDCFoundation should implement this method to return an object which exports all
+      // of its semantic numbers as constants. e.g. {ANIMATION_DELAY_MS: 350}
+      return {};
+    }
+
+    /** @return {!Object} */
+
+  }, {
+    key: "defaultAdapter",
+    get: function get() {
+      // Classes extending MDCFoundation may choose to implement this getter in order to provide a convenient
+      // way of viewing the necessary methods of an adapter. In the future, this could also be used for adapter
+      // validation.
+      return {};
+    }
+
+    /**
+     * @param {A=} adapter
+     */
+
+  }]);
+
+  function MDCFoundation() {
+    var adapter = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : {};
+
+    _classCallCheck(this, MDCFoundation);
+
+    /** @protected {!A} */
+    this.adapter_ = adapter;
+  }
+
+  _createClass(MDCFoundation, [{
+    key: "init",
+    value: function init() {
+      // Subclasses should override this method to perform initialization routines (registering events, etc.)
+    }
+  }, {
+    key: "destroy",
+    value: function destroy() {
+      // Subclasses should override this method to perform de-initialization routines (de-registering events, etc.)
+    }
+  }]);
+
+  return MDCFoundation;
+}();
+
+/* harmony default export */ __webpack_exports__["a"] = (MDCFoundation);
+
+/***/ }),
+
+/***/ 1:
+/***/ (function(module, __webpack_exports__, __webpack_require__) {
+
+"use strict";
+/* harmony import */ var __WEBPACK_IMPORTED_MODULE_0__foundation__ = __webpack_require__(0);
+var _createClass = function () { function defineProperties(target, props) { for (var i = 0; i < props.length; i++) { var descriptor = props[i]; descriptor.enumerable = descriptor.enumerable || false; descriptor.configurable = true; if ("value" in descriptor) descriptor.writable = true; Object.defineProperty(target, descriptor.key, descriptor); } } return function (Constructor, protoProps, staticProps) { if (protoProps) defineProperties(Constructor.prototype, protoProps); if (staticProps) defineProperties(Constructor, staticProps); return Constructor; }; }();
+
+function _classCallCheck(instance, Constructor) { if (!(instance instanceof Constructor)) { throw new TypeError("Cannot call a class as a function"); } }
+
+/**
+ * Copyright 2016 Google Inc.
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *   http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+
+
+
+/**
+ * @template F
+ */
+
+var MDCComponent = function () {
+  _createClass(MDCComponent, null, [{
+    key: 'attachTo',
+
+    /**
+     * @param {!Element} root
+     * @return {!MDCComponent}
+     */
+    value: function attachTo(root) {
+      // Subclasses which extend MDCBase should provide an attachTo() method that takes a root element and
+      // returns an instantiated component with its root set to that element. Also note that in the cases of
+      // subclasses, an explicit foundation class will not have to be passed in; it will simply be initialized
+      // from getDefaultFoundation().
+      return new MDCComponent(root, new __WEBPACK_IMPORTED_MODULE_0__foundation__["a" /* default */]());
+    }
+
+    /**
+     * @param {!Element} root
+     * @param {F=} foundation
+     * @param {...?} args
+     */
+
+  }]);
+
+  function MDCComponent(root) {
+    var foundation = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : undefined;
+
+    _classCallCheck(this, MDCComponent);
+
+    /** @protected {!Element} */
+    this.root_ = root;
+
+    for (var _len = arguments.length, args = Array(_len > 2 ? _len - 2 : 0), _key = 2; _key < _len; _key++) {
+      args[_key - 2] = arguments[_key];
+    }
+
+    this.initialize.apply(this, args);
+    // Note that we initialize foundation here and not within the constructor's default param so that
+    // this.root_ is defined and can be used within the foundation class.
+    /** @protected {!F} */
+    this.foundation_ = foundation === undefined ? this.getDefaultFoundation() : foundation;
+    this.foundation_.init();
+    this.initialSyncWithDOM();
+  }
+
+  _createClass(MDCComponent, [{
+    key: 'initialize',
+    value: function initialize() /* ...args */{}
+    // Subclasses can override this to do any additional setup work that would be considered part of a
+    // "constructor". Essentially, it is a hook into the parent constructor before the foundation is
+    // initialized. Any additional arguments besides root and foundation will be passed in here.
+
+
+    /**
+     * @return {!F} foundation
+     */
+
+  }, {
+    key: 'getDefaultFoundation',
+    value: function getDefaultFoundation() {
+      // Subclasses must override this method to return a properly configured foundation class for the
+      // component.
+      throw new Error('Subclasses must override getDefaultFoundation to return a properly configured ' + 'foundation class');
+    }
+  }, {
+    key: 'initialSyncWithDOM',
+    value: function initialSyncWithDOM() {
+      // Subclasses should override this method if they need to perform work to synchronize with a host DOM
+      // object. An example of this would be a form control wrapper that needs to synchronize its internal state
+      // to some property or attribute of the host DOM. Please note: this is *not* the place to perform DOM
+      // reads/writes that would cause layout / paint, as this is called synchronously from within the constructor.
+    }
+  }, {
+    key: 'destroy',
+    value: function destroy() {
+      // Subclasses may implement this method to release any resources / deregister any listeners they have
+      // attached. An example of this might be deregistering a resize event from the window object.
+      this.foundation_.destroy();
+    }
+
+    /**
+     * Wrapper method to add an event listener to the component's root element. This is most useful when
+     * listening for custom events.
+     * @param {string} evtType
+     * @param {!Function} handler
+     */
+
+  }, {
+    key: 'listen',
+    value: function listen(evtType, handler) {
+      this.root_.addEventListener(evtType, handler);
+    }
+
+    /**
+     * Wrapper method to remove an event listener to the component's root element. This is most useful when
+     * unlistening for custom events.
+     * @param {string} evtType
+     * @param {!Function} handler
+     */
+
+  }, {
+    key: 'unlisten',
+    value: function unlisten(evtType, handler) {
+      this.root_.removeEventListener(evtType, handler);
+    }
+
+    /**
+     * Fires a cross-browser-compatible custom event from the component root of the given type,
+     * with the given data.
+     * @param {string} evtType
+     * @param {!Object} evtData
+     * @param {boolean=} shouldBubble
+     */
+
+  }, {
+    key: 'emit',
+    value: function emit(evtType, evtData) {
+      var shouldBubble = arguments.length > 2 && arguments[2] !== undefined ? arguments[2] : false;
+
+      var evt = void 0;
+      if (typeof CustomEvent === 'function') {
+        evt = new CustomEvent(evtType, {
+          detail: evtData,
+          bubbles: shouldBubble
+        });
+      } else {
+        evt = document.createEvent('CustomEvent');
+        evt.initCustomEvent(evtType, shouldBubble, false, evtData);
+      }
+
+      this.root_.dispatchEvent(evt);
+    }
+  }]);
+
+  return MDCComponent;
+}();
+
+/* harmony default export */ __webpack_exports__["a"] = (MDCComponent);
+
+/***/ }),
+
+/***/ 2:
+/***/ (function(module, __webpack_exports__, __webpack_require__) {
+
+"use strict";
+Object.defineProperty(__webpack_exports__, "__esModule", { value: true });
+/* harmony import */ var __WEBPACK_IMPORTED_MODULE_0__foundation__ = __webpack_require__(0);
+/* harmony import */ var __WEBPACK_IMPORTED_MODULE_1__component__ = __webpack_require__(1);
+/* harmony import */ var __WEBPACK_IMPORTED_MODULE_2__selection_control__ = __webpack_require__(3);
+/* harmony reexport (binding) */ __webpack_require__.d(__webpack_exports__, "MDCFoundation", function() { return __WEBPACK_IMPORTED_MODULE_0__foundation__["a"]; });
+/* harmony reexport (binding) */ __webpack_require__.d(__webpack_exports__, "MDCComponent", function() { return __WEBPACK_IMPORTED_MODULE_1__component__["a"]; });
+/* harmony reexport (binding) */ __webpack_require__.d(__webpack_exports__, "SelectionControlState", function() { return __WEBPACK_IMPORTED_MODULE_2__selection_control__["a"]; });
+/**
+ * Copyright 2016 Google Inc.
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *   http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+
+
+
+
+
+
+
+/***/ }),
+
+/***/ 28:
+/***/ (function(module, __webpack_exports__, __webpack_require__) {
+
+"use strict";
+Object.defineProperty(__webpack_exports__, "__esModule", { value: true });
+/* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, "MDCGridList", function() { return MDCGridList; });
+/* harmony import */ var __WEBPACK_IMPORTED_MODULE_0__material_base__ = __webpack_require__(2);
+/* harmony import */ var __WEBPACK_IMPORTED_MODULE_1__foundation__ = __webpack_require__(55);
+/* harmony reexport (binding) */ __webpack_require__.d(__webpack_exports__, "MDCGridListFoundation", function() { return __WEBPACK_IMPORTED_MODULE_1__foundation__["a"]; });
+var _createClass = function () { function defineProperties(target, props) { for (var i = 0; i < props.length; i++) { var descriptor = props[i]; descriptor.enumerable = descriptor.enumerable || false; descriptor.configurable = true; if ("value" in descriptor) descriptor.writable = true; Object.defineProperty(target, descriptor.key, descriptor); } } return function (Constructor, protoProps, staticProps) { if (protoProps) defineProperties(Constructor.prototype, protoProps); if (staticProps) defineProperties(Constructor, staticProps); return Constructor; }; }();
+
+function _classCallCheck(instance, Constructor) { if (!(instance instanceof Constructor)) { throw new TypeError("Cannot call a class as a function"); } }
+
+function _possibleConstructorReturn(self, call) { if (!self) { throw new ReferenceError("this hasn't been initialised - super() hasn't been called"); } return call && (typeof call === "object" || typeof call === "function") ? call : self; }
+
+function _inherits(subClass, superClass) { if (typeof superClass !== "function" && superClass !== null) { throw new TypeError("Super expression must either be null or a function, not " + typeof superClass); } subClass.prototype = Object.create(superClass && superClass.prototype, { constructor: { value: subClass, enumerable: false, writable: true, configurable: true } }); if (superClass) Object.setPrototypeOf ? Object.setPrototypeOf(subClass, superClass) : subClass.__proto__ = superClass; }
+
+/**
+ * Copyright 2016 Google Inc. All Rights Reserved.
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *      http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+
+
+
+
+
+
+
+var MDCGridList = function (_MDCComponent) {
+  _inherits(MDCGridList, _MDCComponent);
+
+  function MDCGridList() {
+    _classCallCheck(this, MDCGridList);
+
+    return _possibleConstructorReturn(this, (MDCGridList.__proto__ || Object.getPrototypeOf(MDCGridList)).apply(this, arguments));
+  }
+
+  _createClass(MDCGridList, [{
+    key: 'getDefaultFoundation',
+    value: function getDefaultFoundation() {
+      var _this2 = this;
+
+      return new __WEBPACK_IMPORTED_MODULE_1__foundation__["a" /* default */]({
+        getOffsetWidth: function getOffsetWidth() {
+          return _this2.root_.offsetWidth;
+        },
+        getNumberOfTiles: function getNumberOfTiles() {
+          return _this2.root_.querySelectorAll(__WEBPACK_IMPORTED_MODULE_1__foundation__["a" /* default */].strings.TILE_SELECTOR).length;
+        },
+        getOffsetWidthForTileAtIndex: function getOffsetWidthForTileAtIndex(index) {
+          return _this2.root_.querySelectorAll(__WEBPACK_IMPORTED_MODULE_1__foundation__["a" /* default */].strings.TILE_SELECTOR)[index].offsetWidth;
+        },
+        setStyleForTilesElement: function setStyleForTilesElement(property, value) {
+          _this2.root_.querySelector(__WEBPACK_IMPORTED_MODULE_1__foundation__["a" /* default */].strings.TILES_SELECTOR).style[property] = value;
+        },
+        registerResizeHandler: function registerResizeHandler(handler) {
+          return window.addEventListener('resize', handler);
+        },
+        deregisterResizeHandler: function deregisterResizeHandler(handler) {
+          return window.removeEventListener('resize', handler);
+        }
+      });
+    }
+  }], [{
+    key: 'attachTo',
+    value: function attachTo(root) {
+      return new MDCGridList(root);
+    }
+  }]);
+
+  return MDCGridList;
+}(__WEBPACK_IMPORTED_MODULE_0__material_base__["MDCComponent"]);
+
+/***/ }),
+
+/***/ 3:
+/***/ (function(module, __webpack_exports__, __webpack_require__) {
+
+"use strict";
+/* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, "a", function() { return SelectionControlState; });
+/**
+ * Copyright 2017 Google Inc. All Rights Reserved.
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *      http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+
+/**
+ * @typedef {!{
+ *   checked: boolean,
+ *   indeterminate: boolean,
+ *   disabled: boolean,
+ *   value: ?string
+ * }}
+ */
+var SelectionControlState = void 0;
+
+/***/ }),
+
+/***/ 54:
+/***/ (function(module, __webpack_exports__, __webpack_require__) {
+
+"use strict";
+/* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, "a", function() { return strings; });
+/**
+ * Copyright 2016 Google Inc. All Rights Reserved.
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *      http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+var strings = {
+  TILES_SELECTOR: '.mdc-grid-list__tiles',
+  TILE_SELECTOR: '.mdc-grid-tile'
+};
+
+/***/ }),
+
+/***/ 55:
+/***/ (function(module, __webpack_exports__, __webpack_require__) {
+
+"use strict";
+/* harmony import */ var __WEBPACK_IMPORTED_MODULE_0__material_base__ = __webpack_require__(2);
+/* harmony import */ var __WEBPACK_IMPORTED_MODULE_1__constants__ = __webpack_require__(54);
+var _extends = Object.assign || function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; };
+
+var _createClass = function () { function defineProperties(target, props) { for (var i = 0; i < props.length; i++) { var descriptor = props[i]; descriptor.enumerable = descriptor.enumerable || false; descriptor.configurable = true; if ("value" in descriptor) descriptor.writable = true; Object.defineProperty(target, descriptor.key, descriptor); } } return function (Constructor, protoProps, staticProps) { if (protoProps) defineProperties(Constructor.prototype, protoProps); if (staticProps) defineProperties(Constructor, staticProps); return Constructor; }; }();
+
+function _classCallCheck(instance, Constructor) { if (!(instance instanceof Constructor)) { throw new TypeError("Cannot call a class as a function"); } }
+
+function _possibleConstructorReturn(self, call) { if (!self) { throw new ReferenceError("this hasn't been initialised - super() hasn't been called"); } return call && (typeof call === "object" || typeof call === "function") ? call : self; }
+
+function _inherits(subClass, superClass) { if (typeof superClass !== "function" && superClass !== null) { throw new TypeError("Super expression must either be null or a function, not " + typeof superClass); } subClass.prototype = Object.create(superClass && superClass.prototype, { constructor: { value: subClass, enumerable: false, writable: true, configurable: true } }); if (superClass) Object.setPrototypeOf ? Object.setPrototypeOf(subClass, superClass) : subClass.__proto__ = superClass; }
+
+/**
+ * Copyright 2016 Google Inc. All Rights Reserved.
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *      http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+
+
+
+
+var MDCGridListFoundation = function (_MDCFoundation) {
+  _inherits(MDCGridListFoundation, _MDCFoundation);
+
+  _createClass(MDCGridListFoundation, null, [{
+    key: 'strings',
+    get: function get() {
+      return __WEBPACK_IMPORTED_MODULE_1__constants__["a" /* strings */];
+    }
+  }, {
+    key: 'defaultAdapter',
+    get: function get() {
+      return {
+        getOffsetWidth: function getOffsetWidth() {
+          return (/* number */0
+          );
+        },
+        getNumberOfTiles: function getNumberOfTiles() {
+          return (/* number */0
+          );
+        },
+        getOffsetWidthForTileAtIndex: function getOffsetWidthForTileAtIndex() {
+          return (/* index: number */ /* number */0
+          );
+        },
+        setStyleForTilesElement: function setStyleForTilesElement() /* property: string, value: string */{},
+        registerResizeHandler: function registerResizeHandler() /* handler: EventListener */{},
+        deregisterResizeHandler: function deregisterResizeHandler() /* handler: EventListener */{}
+      };
+    }
+  }]);
+
+  function MDCGridListFoundation(adapter) {
+    _classCallCheck(this, MDCGridListFoundation);
+
+    var _this = _possibleConstructorReturn(this, (MDCGridListFoundation.__proto__ || Object.getPrototypeOf(MDCGridListFoundation)).call(this, _extends(MDCGridListFoundation.defaultAdapter, adapter)));
+
+    _this.resizeHandler_ = function () {
+      return _this.alignCenter();
+    };
+    _this.resizeFrame_ = 0;
+    return _this;
+  }
+
+  _createClass(MDCGridListFoundation, [{
+    key: 'init',
+    value: function init() {
+      this.alignCenter();
+      this.adapter_.registerResizeHandler(this.resizeHandler_);
+    }
+  }, {
+    key: 'destroy',
+    value: function destroy() {
+      this.adapter_.deregisterResizeHandler(this.resizeHandler_);
+    }
+  }, {
+    key: 'alignCenter',
+    value: function alignCenter() {
+      var _this2 = this;
+
+      if (this.resizeFrame_ !== 0) {
+        cancelAnimationFrame(this.resizeFrame_);
+      }
+      this.resizeFrame_ = requestAnimationFrame(function () {
+        _this2.alignCenter_();
+        _this2.resizeFrame_ = 0;
+      });
+    }
+  }, {
+    key: 'alignCenter_',
+    value: function alignCenter_() {
+      if (this.adapter_.getNumberOfTiles() == 0) {
+        return;
+      }
+      var gridWidth = this.adapter_.getOffsetWidth();
+      var itemWidth = this.adapter_.getOffsetWidthForTileAtIndex(0);
+      var tilesWidth = itemWidth * Math.floor(gridWidth / itemWidth);
+      this.adapter_.setStyleForTilesElement('width', tilesWidth + 'px');
+    }
+  }]);
+
+  return MDCGridListFoundation;
+}(__WEBPACK_IMPORTED_MODULE_0__material_base__["MDCFoundation"]);
+
+/* harmony default export */ __webpack_exports__["a"] = (MDCGridListFoundation);
+
+/***/ }),
+
+/***/ 88:
+/***/ (function(module, exports, __webpack_require__) {
+
+module.exports = __webpack_require__(28);
+
+
+/***/ })
+
+/******/ });
+});

+ 675 - 0
support/client/lib/vwf/view/lib/mdc/dist/mdc.icon-toggle.css

@@ -0,0 +1,675 @@
+/*!
+ Material Components for the web
+ Copyright (c) 2017 Google Inc.
+ License: Apache-2.0
+*/
+/** postcss-bem-linter: define icon-toggle */
+/*
+  Precomputed linear color channel values, for use in contrast calculations.
+  See https://www.w3.org/TR/WCAG20-TECHS/G17.html#G17-tests
+
+  Algorithm, for c in 0 to 255:
+  f(c) {
+    c = c / 255;
+    return c < 0.03928 ? c / 12.92 : Math.pow((c + 0.055) / 1.055, 2.4);
+  }
+
+  This lookup table is needed since there is no `pow` in SASS.
+*/
+/**
+ * Calculate the luminance for a color.
+ * See https://www.w3.org/TR/WCAG20-TECHS/G17.html#G17-tests
+ */
+/**
+ * Calculate the contrast ratio between two colors.
+ * See https://www.w3.org/TR/WCAG20-TECHS/G17.html#G17-tests
+ */
+/**
+ * Determine whether to use dark or light text on top of given color.
+ * Returns "dark" for dark text and "light" for light text.
+ */
+/*
+  Main theme colors.
+  If you're a user customizing your color scheme in SASS, these are probably the only variables you need to change.
+*/
+/* Indigo 500 */
+/* Pink A200 */
+/* White */
+/* Which set of text colors to use for each main theme color (light or dark) */
+/* Text colors according to light vs dark and text type */
+/* Primary text colors for each of the theme colors */
+/** MDC Ripple keyframes are split into their own file so that _mixins.scss can rely on them. */
+@-webkit-keyframes mdc-ripple-fg-radius-in {
+  from {
+    -webkit-transform: translate(var(--mdc-ripple-fg-translate-start, 0)) scale(1);
+            transform: translate(var(--mdc-ripple-fg-translate-start, 0)) scale(1);
+    -webkit-animation-timing-function: cubic-bezier(0.4, 0, 0.2, 1);
+            animation-timing-function: cubic-bezier(0.4, 0, 0.2, 1); }
+  to {
+    -webkit-transform: translate(var(--mdc-ripple-fg-translate-end, 0)) scale(var(--mdc-ripple-fg-scale, 1));
+            transform: translate(var(--mdc-ripple-fg-translate-end, 0)) scale(var(--mdc-ripple-fg-scale, 1)); } }
+@keyframes mdc-ripple-fg-radius-in {
+  from {
+    -webkit-transform: translate(var(--mdc-ripple-fg-translate-start, 0)) scale(1);
+            transform: translate(var(--mdc-ripple-fg-translate-start, 0)) scale(1);
+    -webkit-animation-timing-function: cubic-bezier(0.4, 0, 0.2, 1);
+            animation-timing-function: cubic-bezier(0.4, 0, 0.2, 1); }
+  to {
+    -webkit-transform: translate(var(--mdc-ripple-fg-translate-end, 0)) scale(var(--mdc-ripple-fg-scale, 1));
+            transform: translate(var(--mdc-ripple-fg-translate-end, 0)) scale(var(--mdc-ripple-fg-scale, 1)); } }
+
+@-webkit-keyframes mdc-ripple-fg-opacity-in {
+  from {
+    opacity: 0;
+    -webkit-animation-timing-function: linear;
+            animation-timing-function: linear; }
+  to {
+    opacity: 1; } }
+
+@keyframes mdc-ripple-fg-opacity-in {
+  from {
+    opacity: 0;
+    -webkit-animation-timing-function: linear;
+            animation-timing-function: linear; }
+  to {
+    opacity: 1; } }
+
+@-webkit-keyframes mdc-ripple-fg-opacity-out {
+  from {
+    opacity: 1;
+    -webkit-animation-timing-function: linear;
+            animation-timing-function: linear; }
+  to {
+    opacity: 0; } }
+
+@keyframes mdc-ripple-fg-opacity-out {
+  from {
+    opacity: 1;
+    -webkit-animation-timing-function: linear;
+            animation-timing-function: linear; }
+  to {
+    opacity: 0; } }
+
+/*
+  Precomputed linear color channel values, for use in contrast calculations.
+  See https://www.w3.org/TR/WCAG20-TECHS/G17.html#G17-tests
+
+  Algorithm, for c in 0 to 255:
+  f(c) {
+    c = c / 255;
+    return c < 0.03928 ? c / 12.92 : Math.pow((c + 0.055) / 1.055, 2.4);
+  }
+
+  This lookup table is needed since there is no `pow` in SASS.
+*/
+/**
+ * Calculate the luminance for a color.
+ * See https://www.w3.org/TR/WCAG20-TECHS/G17.html#G17-tests
+ */
+/**
+ * Calculate the contrast ratio between two colors.
+ * See https://www.w3.org/TR/WCAG20-TECHS/G17.html#G17-tests
+ */
+/**
+ * Determine whether to use dark or light text on top of given color.
+ * Returns "dark" for dark text and "light" for light text.
+ */
+/*
+  Main theme colors.
+  If you're a user customizing your color scheme in SASS, these are probably the only variables you need to change.
+*/
+/* Indigo 500 */
+/* Pink A200 */
+/* White */
+/* Which set of text colors to use for each main theme color (light or dark) */
+/* Text colors according to light vs dark and text type */
+/* Primary text colors for each of the theme colors */
+/**
+ * Applies the correct theme color style to the specified property.
+ * $property is typically color or background-color, but can be any CSS property that accepts color values.
+ * $style should be one of the map keys in $mdc-theme-property-values (_variables.scss).
+ */
+/**
+ * Creates a rule to be used in MDC-Web components for dark theming, and applies the provided contents.
+ * Should provide the $root-selector option if applied to anything other than the root selector.
+ * When used with a modifier class, provide a second argument of `true` for the $compound parameter
+ * to specify that this should be attached as a compound class.
+ *
+ * Usage example:
+ *
+ * ```scss
+ * .mdc-foo {
+ *   color: black;
+ *
+ *   @include mdc-theme-dark {
+ *     color: white;
+ *   }
+ *
+ *   &__bar {
+ *     background: black;
+ *
+ *     @include mdc-theme-dark(".mdc-foo") {
+ *       background: white;
+ *     }
+ *   }
+ * }
+ *
+ * .mdc-foo--disabled {
+ *   opacity: .38;
+ *
+ *   @include mdc-theme-dark(".mdc-foo", true) {
+ *     opacity: .5;
+ *   }
+ * }
+ * ```
+ */
+.mdc-icon-toggle {
+  /* @alternate */
+  color: rgba(0, 0, 0, 0.54);
+  color: var(--mdc-theme-text-secondary-on-light, rgba(0, 0, 0, 0.54));
+  --mdc-ripple-surface-width: 0;
+  --mdc-ripple-surface-height: 0;
+  --mdc-ripple-fg-size: 0;
+  --mdc-ripple-left: 0;
+  --mdc-ripple-top: 0;
+  --mdc-ripple-fg-scale: 1;
+  --mdc-ripple-fg-translate-end: 0;
+  --mdc-ripple-fg-translate-start: 0;
+  will-change: transform, opacity;
+  -webkit-tap-highlight-color: transparent;
+  will-change: initial;
+  display: -webkit-box;
+  display: -ms-flexbox;
+  display: flex;
+  position: relative;
+  -webkit-box-sizing: border-box;
+          box-sizing: border-box;
+  -webkit-box-align: center;
+      -ms-flex-align: center;
+          align-items: center;
+  -webkit-box-pack: center;
+      -ms-flex-pack: center;
+          justify-content: center;
+  width: 48px;
+  height: 48px;
+  padding: 12px;
+  outline: none;
+  font-size: 1.5rem;
+  cursor: pointer;
+  -webkit-user-select: none;
+     -moz-user-select: none;
+      -ms-user-select: none;
+          user-select: none; }
+  .mdc-icon-toggle:not(.mdc-ripple-upgraded):hover::before, .mdc-icon-toggle:not(.mdc-ripple-upgraded):focus::before, .mdc-icon-toggle:not(.mdc-ripple-upgraded):active::after {
+    -webkit-transition-duration: 85ms;
+            transition-duration: 85ms;
+    opacity: .6; }
+  .mdc-icon-toggle::before {
+    background-color: rgba(0, 0, 0, 0.062);
+    position: absolute;
+    top: calc(50% - 100%);
+    left: calc(50% - 100%);
+    width: 200%;
+    height: 200%;
+    -webkit-transition: opacity 250ms linear;
+    transition: opacity 250ms linear;
+    border-radius: 50%;
+    opacity: 0;
+    pointer-events: none;
+    content: ""; }
+  .mdc-icon-toggle.mdc-ripple-upgraded::before {
+    top: calc(50% - 100%);
+    left: calc(50% - 100%);
+    width: 200%;
+    height: 200%;
+    /* @alternate */
+    -webkit-transform: scale(0);
+            transform: scale(0);
+    -webkit-transform: scale(var(--mdc-ripple-fg-scale, 0));
+            transform: scale(var(--mdc-ripple-fg-scale, 0)); }
+  .mdc-icon-toggle.mdc-ripple-upgraded--background-focused::before {
+    opacity: .99999; }
+  .mdc-icon-toggle.mdc-ripple-upgraded--background-active-fill::before {
+    -webkit-transition-duration: 120ms;
+            transition-duration: 120ms;
+    opacity: 1; }
+  .mdc-icon-toggle.mdc-ripple-upgraded--unbounded::before {
+    /* @alternate */
+    top: calc(50% - 50%);
+    top: var(--mdc-ripple-top, calc(50% - 50%));
+    /* @alternate */
+    left: calc(50% - 50%);
+    left: var(--mdc-ripple-left, calc(50% - 50%));
+    /* @alternate */
+    width: 100%;
+    width: var(--mdc-ripple-fg-size, 100%);
+    /* @alternate */
+    height: 100%;
+    height: var(--mdc-ripple-fg-size, 100%);
+    /* @alternate */
+    -webkit-transform: scale(0);
+            transform: scale(0);
+    -webkit-transform: scale(var(--mdc-ripple-fg-scale, 0));
+            transform: scale(var(--mdc-ripple-fg-scale, 0)); }
+  .mdc-icon-toggle::after {
+    background-color: rgba(0, 0, 0, 0.062);
+    position: absolute;
+    top: calc(50% - 100%);
+    left: calc(50% - 100%);
+    width: 200%;
+    height: 200%;
+    -webkit-transition: opacity 250ms linear;
+    transition: opacity 250ms linear;
+    border-radius: 50%;
+    opacity: 0;
+    pointer-events: none;
+    content: ""; }
+  .mdc-icon-toggle.mdc-ripple-upgraded::after {
+    top: 0;
+    left: 0;
+    /* @alternate */
+    width: 100%;
+    width: var(--mdc-ripple-fg-size, 100%);
+    /* @alternate */
+    height: 100%;
+    height: var(--mdc-ripple-fg-size, 100%);
+    -webkit-transform: scale(0);
+            transform: scale(0);
+    -webkit-transform-origin: center center;
+            transform-origin: center center;
+    opacity: 0; }
+  .mdc-icon-toggle:not(.mdc-ripple-upgraded--unbounded)::after {
+    -webkit-transform-origin: center center;
+            transform-origin: center center; }
+  .mdc-icon-toggle.mdc-ripple-upgraded--unbounded::after {
+    /* @alternate */
+    top: 0;
+    top: var(--mdc-ripple-top, 0);
+    /* @alternate */
+    left: 0;
+    left: var(--mdc-ripple-left, 0);
+    /* @alternate */
+    width: 100%;
+    width: var(--mdc-ripple-fg-size, 100%);
+    /* @alternate */
+    height: 100%;
+    height: var(--mdc-ripple-fg-size, 100%);
+    -webkit-transform: scale(0);
+            transform: scale(0);
+    -webkit-transform-origin: center center;
+            transform-origin: center center; }
+  .mdc-icon-toggle.mdc-ripple-upgraded--foreground-activation::after {
+    -webkit-animation: 300ms mdc-ripple-fg-radius-in forwards, 83ms mdc-ripple-fg-opacity-in forwards;
+            animation: 300ms mdc-ripple-fg-radius-in forwards, 83ms mdc-ripple-fg-opacity-in forwards; }
+  .mdc-icon-toggle.mdc-ripple-upgraded--foreground-deactivation::after {
+    -webkit-transform: translate(var(--mdc-ripple-fg-translate-end, 0)) scale(var(--mdc-ripple-fg-scale, 1));
+            transform: translate(var(--mdc-ripple-fg-translate-end, 0)) scale(var(--mdc-ripple-fg-scale, 1));
+    -webkit-animation: 83ms mdc-ripple-fg-opacity-out;
+            animation: 83ms mdc-ripple-fg-opacity-out; }
+  .mdc-icon-toggle--theme-dark.mdc-icon-toggle::before,
+  .mdc-theme--dark .mdc-icon-toggle::before {
+    background-color: rgba(255, 255, 255, 0.16);
+    position: absolute;
+    top: calc(50% - 100%);
+    left: calc(50% - 100%);
+    width: 200%;
+    height: 200%;
+    -webkit-transition: opacity 250ms linear;
+    transition: opacity 250ms linear;
+    border-radius: 50%;
+    opacity: 0;
+    pointer-events: none;
+    content: ""; }
+  .mdc-icon-toggle--theme-dark.mdc-icon-toggle.mdc-ripple-upgraded::before,
+  .mdc-theme--dark .mdc-icon-toggle.mdc-ripple-upgraded::before {
+    top: calc(50% - 100%);
+    left: calc(50% - 100%);
+    width: 200%;
+    height: 200%;
+    /* @alternate */
+    -webkit-transform: scale(0);
+            transform: scale(0);
+    -webkit-transform: scale(var(--mdc-ripple-fg-scale, 0));
+            transform: scale(var(--mdc-ripple-fg-scale, 0)); }
+  .mdc-icon-toggle--theme-dark.mdc-icon-toggle.mdc-ripple-upgraded--background-focused::before,
+  .mdc-theme--dark .mdc-icon-toggle.mdc-ripple-upgraded--background-focused::before {
+    opacity: .99999; }
+  .mdc-icon-toggle--theme-dark.mdc-icon-toggle.mdc-ripple-upgraded--background-active-fill::before,
+  .mdc-theme--dark .mdc-icon-toggle.mdc-ripple-upgraded--background-active-fill::before {
+    -webkit-transition-duration: 120ms;
+            transition-duration: 120ms;
+    opacity: 1; }
+  .mdc-icon-toggle--theme-dark.mdc-icon-toggle.mdc-ripple-upgraded--unbounded::before,
+  .mdc-theme--dark .mdc-icon-toggle.mdc-ripple-upgraded--unbounded::before {
+    /* @alternate */
+    top: calc(50% - 50%);
+    top: var(--mdc-ripple-top, calc(50% - 50%));
+    /* @alternate */
+    left: calc(50% - 50%);
+    left: var(--mdc-ripple-left, calc(50% - 50%));
+    /* @alternate */
+    width: 100%;
+    width: var(--mdc-ripple-fg-size, 100%);
+    /* @alternate */
+    height: 100%;
+    height: var(--mdc-ripple-fg-size, 100%);
+    /* @alternate */
+    -webkit-transform: scale(0);
+            transform: scale(0);
+    -webkit-transform: scale(var(--mdc-ripple-fg-scale, 0));
+            transform: scale(var(--mdc-ripple-fg-scale, 0)); }
+  .mdc-icon-toggle--theme-dark.mdc-icon-toggle::after,
+  .mdc-theme--dark .mdc-icon-toggle::after {
+    background-color: rgba(255, 255, 255, 0.16);
+    position: absolute;
+    top: calc(50% - 100%);
+    left: calc(50% - 100%);
+    width: 200%;
+    height: 200%;
+    -webkit-transition: opacity 250ms linear;
+    transition: opacity 250ms linear;
+    border-radius: 50%;
+    opacity: 0;
+    pointer-events: none;
+    content: ""; }
+  .mdc-icon-toggle--theme-dark.mdc-icon-toggle.mdc-ripple-upgraded::after,
+  .mdc-theme--dark .mdc-icon-toggle.mdc-ripple-upgraded::after {
+    top: 0;
+    left: 0;
+    /* @alternate */
+    width: 100%;
+    width: var(--mdc-ripple-fg-size, 100%);
+    /* @alternate */
+    height: 100%;
+    height: var(--mdc-ripple-fg-size, 100%);
+    -webkit-transform: scale(0);
+            transform: scale(0);
+    -webkit-transform-origin: center center;
+            transform-origin: center center;
+    opacity: 0; }
+  .mdc-icon-toggle--theme-dark.mdc-icon-toggle:not(.mdc-ripple-upgraded--unbounded)::after,
+  .mdc-theme--dark .mdc-icon-toggle:not(.mdc-ripple-upgraded--unbounded)::after {
+    -webkit-transform-origin: center center;
+            transform-origin: center center; }
+  .mdc-icon-toggle--theme-dark.mdc-icon-toggle.mdc-ripple-upgraded--unbounded::after,
+  .mdc-theme--dark .mdc-icon-toggle.mdc-ripple-upgraded--unbounded::after {
+    /* @alternate */
+    top: 0;
+    top: var(--mdc-ripple-top, 0);
+    /* @alternate */
+    left: 0;
+    left: var(--mdc-ripple-left, 0);
+    /* @alternate */
+    width: 100%;
+    width: var(--mdc-ripple-fg-size, 100%);
+    /* @alternate */
+    height: 100%;
+    height: var(--mdc-ripple-fg-size, 100%);
+    -webkit-transform: scale(0);
+            transform: scale(0);
+    -webkit-transform-origin: center center;
+            transform-origin: center center; }
+  .mdc-icon-toggle--theme-dark.mdc-icon-toggle.mdc-ripple-upgraded--foreground-activation::after,
+  .mdc-theme--dark .mdc-icon-toggle.mdc-ripple-upgraded--foreground-activation::after {
+    -webkit-animation: 300ms mdc-ripple-fg-radius-in forwards, 83ms mdc-ripple-fg-opacity-in forwards;
+            animation: 300ms mdc-ripple-fg-radius-in forwards, 83ms mdc-ripple-fg-opacity-in forwards; }
+  .mdc-icon-toggle--theme-dark.mdc-icon-toggle.mdc-ripple-upgraded--foreground-deactivation::after,
+  .mdc-theme--dark .mdc-icon-toggle.mdc-ripple-upgraded--foreground-deactivation::after {
+    -webkit-transform: translate(var(--mdc-ripple-fg-translate-end, 0)) scale(var(--mdc-ripple-fg-scale, 1));
+            transform: translate(var(--mdc-ripple-fg-translate-end, 0)) scale(var(--mdc-ripple-fg-scale, 1));
+    -webkit-animation: 83ms mdc-ripple-fg-opacity-out;
+            animation: 83ms mdc-ripple-fg-opacity-out; }
+  .mdc-icon-toggle::after {
+    position: absolute;
+    border-radius: 50%;
+    content: "";
+    opacity: 0;
+    pointer-events: none; }
+  .mdc-icon-toggle--theme-dark,
+  .mdc-theme--dark .mdc-icon-toggle {
+    /* @alternate */
+    color: white;
+    color: var(--mdc-theme-text-primary-on-dark, white); }
+
+.mdc-icon-toggle--primary {
+  /* @alternate */
+  color: #3f51b5;
+  color: var(--mdc-theme-primary, #3f51b5); }
+  .mdc-icon-toggle--primary::before {
+    /* @alternate */
+    background-color: rgba(63, 81, 181, 0.14);
+    position: absolute;
+    top: calc(50% - 100%);
+    left: calc(50% - 100%);
+    width: 200%;
+    height: 200%;
+    -webkit-transition: opacity 250ms linear;
+    transition: opacity 250ms linear;
+    border-radius: 50%;
+    opacity: 0;
+    pointer-events: none;
+    content: ""; }
+    @supports (background-color: color(green a(10%))) {
+      .mdc-icon-toggle--primary::before {
+        background-color: color(var(--mdc-theme-primary, #3f51b5) a(14%)); } }
+  .mdc-icon-toggle--primary.mdc-ripple-upgraded::before {
+    top: calc(50% - 100%);
+    left: calc(50% - 100%);
+    width: 200%;
+    height: 200%;
+    /* @alternate */
+    -webkit-transform: scale(0);
+            transform: scale(0);
+    -webkit-transform: scale(var(--mdc-ripple-fg-scale, 0));
+            transform: scale(var(--mdc-ripple-fg-scale, 0)); }
+  .mdc-icon-toggle--primary.mdc-ripple-upgraded--background-focused::before {
+    opacity: .99999; }
+  .mdc-icon-toggle--primary.mdc-ripple-upgraded--background-active-fill::before {
+    -webkit-transition-duration: 120ms;
+            transition-duration: 120ms;
+    opacity: 1; }
+  .mdc-icon-toggle--primary.mdc-ripple-upgraded--unbounded::before {
+    /* @alternate */
+    top: calc(50% - 50%);
+    top: var(--mdc-ripple-top, calc(50% - 50%));
+    /* @alternate */
+    left: calc(50% - 50%);
+    left: var(--mdc-ripple-left, calc(50% - 50%));
+    /* @alternate */
+    width: 100%;
+    width: var(--mdc-ripple-fg-size, 100%);
+    /* @alternate */
+    height: 100%;
+    height: var(--mdc-ripple-fg-size, 100%);
+    /* @alternate */
+    -webkit-transform: scale(0);
+            transform: scale(0);
+    -webkit-transform: scale(var(--mdc-ripple-fg-scale, 0));
+            transform: scale(var(--mdc-ripple-fg-scale, 0)); }
+  .mdc-icon-toggle--primary::after {
+    /* @alternate */
+    background-color: rgba(63, 81, 181, 0.14);
+    position: absolute;
+    top: calc(50% - 100%);
+    left: calc(50% - 100%);
+    width: 200%;
+    height: 200%;
+    -webkit-transition: opacity 250ms linear;
+    transition: opacity 250ms linear;
+    border-radius: 50%;
+    opacity: 0;
+    pointer-events: none;
+    content: ""; }
+    @supports (background-color: color(green a(10%))) {
+      .mdc-icon-toggle--primary::after {
+        background-color: color(var(--mdc-theme-primary, #3f51b5) a(14%)); } }
+  .mdc-icon-toggle--primary.mdc-ripple-upgraded::after {
+    top: 0;
+    left: 0;
+    /* @alternate */
+    width: 100%;
+    width: var(--mdc-ripple-fg-size, 100%);
+    /* @alternate */
+    height: 100%;
+    height: var(--mdc-ripple-fg-size, 100%);
+    -webkit-transform: scale(0);
+            transform: scale(0);
+    -webkit-transform-origin: center center;
+            transform-origin: center center;
+    opacity: 0; }
+  .mdc-icon-toggle--primary:not(.mdc-ripple-upgraded--unbounded)::after {
+    -webkit-transform-origin: center center;
+            transform-origin: center center; }
+  .mdc-icon-toggle--primary.mdc-ripple-upgraded--unbounded::after {
+    /* @alternate */
+    top: 0;
+    top: var(--mdc-ripple-top, 0);
+    /* @alternate */
+    left: 0;
+    left: var(--mdc-ripple-left, 0);
+    /* @alternate */
+    width: 100%;
+    width: var(--mdc-ripple-fg-size, 100%);
+    /* @alternate */
+    height: 100%;
+    height: var(--mdc-ripple-fg-size, 100%);
+    -webkit-transform: scale(0);
+            transform: scale(0);
+    -webkit-transform-origin: center center;
+            transform-origin: center center; }
+  .mdc-icon-toggle--primary.mdc-ripple-upgraded--foreground-activation::after {
+    -webkit-animation: 300ms mdc-ripple-fg-radius-in forwards, 83ms mdc-ripple-fg-opacity-in forwards;
+            animation: 300ms mdc-ripple-fg-radius-in forwards, 83ms mdc-ripple-fg-opacity-in forwards; }
+  .mdc-icon-toggle--primary.mdc-ripple-upgraded--foreground-deactivation::after {
+    -webkit-transform: translate(var(--mdc-ripple-fg-translate-end, 0)) scale(var(--mdc-ripple-fg-scale, 1));
+            transform: translate(var(--mdc-ripple-fg-translate-end, 0)) scale(var(--mdc-ripple-fg-scale, 1));
+    -webkit-animation: 83ms mdc-ripple-fg-opacity-out;
+            animation: 83ms mdc-ripple-fg-opacity-out; }
+
+.mdc-icon-toggle--accent {
+  /* @alternate */
+  color: #ff4081;
+  color: var(--mdc-theme-accent, #ff4081); }
+  .mdc-icon-toggle--accent::before {
+    /* @alternate */
+    background-color: rgba(255, 64, 129, 0.14);
+    position: absolute;
+    top: calc(50% - 100%);
+    left: calc(50% - 100%);
+    width: 200%;
+    height: 200%;
+    -webkit-transition: opacity 250ms linear;
+    transition: opacity 250ms linear;
+    border-radius: 50%;
+    opacity: 0;
+    pointer-events: none;
+    content: ""; }
+    @supports (background-color: color(green a(10%))) {
+      .mdc-icon-toggle--accent::before {
+        background-color: color(var(--mdc-theme-accent, #ff4081) a(14%)); } }
+  .mdc-icon-toggle--accent.mdc-ripple-upgraded::before {
+    top: calc(50% - 100%);
+    left: calc(50% - 100%);
+    width: 200%;
+    height: 200%;
+    /* @alternate */
+    -webkit-transform: scale(0);
+            transform: scale(0);
+    -webkit-transform: scale(var(--mdc-ripple-fg-scale, 0));
+            transform: scale(var(--mdc-ripple-fg-scale, 0)); }
+  .mdc-icon-toggle--accent.mdc-ripple-upgraded--background-focused::before {
+    opacity: .99999; }
+  .mdc-icon-toggle--accent.mdc-ripple-upgraded--background-active-fill::before {
+    -webkit-transition-duration: 120ms;
+            transition-duration: 120ms;
+    opacity: 1; }
+  .mdc-icon-toggle--accent.mdc-ripple-upgraded--unbounded::before {
+    /* @alternate */
+    top: calc(50% - 50%);
+    top: var(--mdc-ripple-top, calc(50% - 50%));
+    /* @alternate */
+    left: calc(50% - 50%);
+    left: var(--mdc-ripple-left, calc(50% - 50%));
+    /* @alternate */
+    width: 100%;
+    width: var(--mdc-ripple-fg-size, 100%);
+    /* @alternate */
+    height: 100%;
+    height: var(--mdc-ripple-fg-size, 100%);
+    /* @alternate */
+    -webkit-transform: scale(0);
+            transform: scale(0);
+    -webkit-transform: scale(var(--mdc-ripple-fg-scale, 0));
+            transform: scale(var(--mdc-ripple-fg-scale, 0)); }
+  .mdc-icon-toggle--accent::after {
+    /* @alternate */
+    background-color: rgba(255, 64, 129, 0.14);
+    position: absolute;
+    top: calc(50% - 100%);
+    left: calc(50% - 100%);
+    width: 200%;
+    height: 200%;
+    -webkit-transition: opacity 250ms linear;
+    transition: opacity 250ms linear;
+    border-radius: 50%;
+    opacity: 0;
+    pointer-events: none;
+    content: ""; }
+    @supports (background-color: color(green a(10%))) {
+      .mdc-icon-toggle--accent::after {
+        background-color: color(var(--mdc-theme-accent, #ff4081) a(14%)); } }
+  .mdc-icon-toggle--accent.mdc-ripple-upgraded::after {
+    top: 0;
+    left: 0;
+    /* @alternate */
+    width: 100%;
+    width: var(--mdc-ripple-fg-size, 100%);
+    /* @alternate */
+    height: 100%;
+    height: var(--mdc-ripple-fg-size, 100%);
+    -webkit-transform: scale(0);
+            transform: scale(0);
+    -webkit-transform-origin: center center;
+            transform-origin: center center;
+    opacity: 0; }
+  .mdc-icon-toggle--accent:not(.mdc-ripple-upgraded--unbounded)::after {
+    -webkit-transform-origin: center center;
+            transform-origin: center center; }
+  .mdc-icon-toggle--accent.mdc-ripple-upgraded--unbounded::after {
+    /* @alternate */
+    top: 0;
+    top: var(--mdc-ripple-top, 0);
+    /* @alternate */
+    left: 0;
+    left: var(--mdc-ripple-left, 0);
+    /* @alternate */
+    width: 100%;
+    width: var(--mdc-ripple-fg-size, 100%);
+    /* @alternate */
+    height: 100%;
+    height: var(--mdc-ripple-fg-size, 100%);
+    -webkit-transform: scale(0);
+            transform: scale(0);
+    -webkit-transform-origin: center center;
+            transform-origin: center center; }
+  .mdc-icon-toggle--accent.mdc-ripple-upgraded--foreground-activation::after {
+    -webkit-animation: 300ms mdc-ripple-fg-radius-in forwards, 83ms mdc-ripple-fg-opacity-in forwards;
+            animation: 300ms mdc-ripple-fg-radius-in forwards, 83ms mdc-ripple-fg-opacity-in forwards; }
+  .mdc-icon-toggle--accent.mdc-ripple-upgraded--foreground-deactivation::after {
+    -webkit-transform: translate(var(--mdc-ripple-fg-translate-end, 0)) scale(var(--mdc-ripple-fg-scale, 1));
+            transform: translate(var(--mdc-ripple-fg-translate-end, 0)) scale(var(--mdc-ripple-fg-scale, 1));
+    -webkit-animation: 83ms mdc-ripple-fg-opacity-out;
+            animation: 83ms mdc-ripple-fg-opacity-out; }
+
+.mdc-icon-toggle--disabled {
+  /* @alternate */
+  color: rgba(0, 0, 0, 0.38);
+  color: var(--mdc-theme-text-disabled-on-light, rgba(0, 0, 0, 0.38));
+  pointer-events: none; }
+  .mdc-icon-toggle--theme-dark.mdc-icon-toggle--disabled,
+  .mdc-theme--dark .mdc-icon-toggle--disabled {
+    /* @alternate */
+    color: rgba(255, 255, 255, 0.5);
+    color: var(--mdc-theme-text-disabled-on-dark, rgba(255, 255, 255, 0.5)); }
+
+/** postcss-bem-linter: end */

+ 83 - 0
support/client/lib/vwf/view/lib/mdc/dist/mdc.icon-toggle.css-entry

@@ -0,0 +1,83 @@
+/*!
+ Material Components for the web
+ Copyright (c) 2017 Google Inc.
+ License: Apache-2.0
+*/
+/******/ (function(modules) { // webpackBootstrap
+/******/ 	// The module cache
+/******/ 	var installedModules = {};
+/******/
+/******/ 	// The require function
+/******/ 	function __webpack_require__(moduleId) {
+/******/
+/******/ 		// Check if module is in cache
+/******/ 		if(installedModules[moduleId]) {
+/******/ 			return installedModules[moduleId].exports;
+/******/ 		}
+/******/ 		// Create a new module (and put it into the cache)
+/******/ 		var module = installedModules[moduleId] = {
+/******/ 			i: moduleId,
+/******/ 			l: false,
+/******/ 			exports: {}
+/******/ 		};
+/******/
+/******/ 		// Execute the module function
+/******/ 		modules[moduleId].call(module.exports, module, module.exports, __webpack_require__);
+/******/
+/******/ 		// Flag the module as loaded
+/******/ 		module.l = true;
+/******/
+/******/ 		// Return the exports of the module
+/******/ 		return module.exports;
+/******/ 	}
+/******/
+/******/
+/******/ 	// expose the modules object (__webpack_modules__)
+/******/ 	__webpack_require__.m = modules;
+/******/
+/******/ 	// expose the module cache
+/******/ 	__webpack_require__.c = installedModules;
+/******/
+/******/ 	// identity function for calling harmony imports with the correct context
+/******/ 	__webpack_require__.i = function(value) { return value; };
+/******/
+/******/ 	// define getter function for harmony exports
+/******/ 	__webpack_require__.d = function(exports, name, getter) {
+/******/ 		if(!__webpack_require__.o(exports, name)) {
+/******/ 			Object.defineProperty(exports, name, {
+/******/ 				configurable: false,
+/******/ 				enumerable: true,
+/******/ 				get: getter
+/******/ 			});
+/******/ 		}
+/******/ 	};
+/******/
+/******/ 	// getDefaultExport function for compatibility with non-harmony modules
+/******/ 	__webpack_require__.n = function(module) {
+/******/ 		var getter = module && module.__esModule ?
+/******/ 			function getDefault() { return module['default']; } :
+/******/ 			function getModuleExports() { return module; };
+/******/ 		__webpack_require__.d(getter, 'a', getter);
+/******/ 		return getter;
+/******/ 	};
+/******/
+/******/ 	// Object.prototype.hasOwnProperty.call
+/******/ 	__webpack_require__.o = function(object, property) { return Object.prototype.hasOwnProperty.call(object, property); };
+/******/
+/******/ 	// __webpack_public_path__
+/******/ 	__webpack_require__.p = "/assets/";
+/******/
+/******/ 	// Load entry module and return exports
+/******/ 	return __webpack_require__(__webpack_require__.s = 11);
+/******/ })
+/************************************************************************/
+/******/ ({
+
+/***/ 11:
+/***/ (function(module, exports) {
+
+// removed by extract-text-webpack-plugin
+
+/***/ })
+
+/******/ });

+ 2332 - 0
support/client/lib/vwf/view/lib/mdc/dist/mdc.iconToggle.js

@@ -0,0 +1,2332 @@
+/*!
+ Material Components for the web
+ Copyright (c) 2017 Google Inc.
+ License: Apache-2.0
+*/
+(function webpackUniversalModuleDefinition(root, factory) {
+	if(typeof exports === 'object' && typeof module === 'object')
+		module.exports = factory();
+	else if(typeof define === 'function' && define.amd)
+		define([], factory);
+	else if(typeof exports === 'object')
+		exports["iconToggle"] = factory();
+	else
+		root["mdc"] = root["mdc"] || {}, root["mdc"]["iconToggle"] = factory();
+})(this, function() {
+return /******/ (function(modules) { // webpackBootstrap
+/******/ 	// The module cache
+/******/ 	var installedModules = {};
+/******/
+/******/ 	// The require function
+/******/ 	function __webpack_require__(moduleId) {
+/******/
+/******/ 		// Check if module is in cache
+/******/ 		if(installedModules[moduleId]) {
+/******/ 			return installedModules[moduleId].exports;
+/******/ 		}
+/******/ 		// Create a new module (and put it into the cache)
+/******/ 		var module = installedModules[moduleId] = {
+/******/ 			i: moduleId,
+/******/ 			l: false,
+/******/ 			exports: {}
+/******/ 		};
+/******/
+/******/ 		// Execute the module function
+/******/ 		modules[moduleId].call(module.exports, module, module.exports, __webpack_require__);
+/******/
+/******/ 		// Flag the module as loaded
+/******/ 		module.l = true;
+/******/
+/******/ 		// Return the exports of the module
+/******/ 		return module.exports;
+/******/ 	}
+/******/
+/******/
+/******/ 	// expose the modules object (__webpack_modules__)
+/******/ 	__webpack_require__.m = modules;
+/******/
+/******/ 	// expose the module cache
+/******/ 	__webpack_require__.c = installedModules;
+/******/
+/******/ 	// identity function for calling harmony imports with the correct context
+/******/ 	__webpack_require__.i = function(value) { return value; };
+/******/
+/******/ 	// define getter function for harmony exports
+/******/ 	__webpack_require__.d = function(exports, name, getter) {
+/******/ 		if(!__webpack_require__.o(exports, name)) {
+/******/ 			Object.defineProperty(exports, name, {
+/******/ 				configurable: false,
+/******/ 				enumerable: true,
+/******/ 				get: getter
+/******/ 			});
+/******/ 		}
+/******/ 	};
+/******/
+/******/ 	// getDefaultExport function for compatibility with non-harmony modules
+/******/ 	__webpack_require__.n = function(module) {
+/******/ 		var getter = module && module.__esModule ?
+/******/ 			function getDefault() { return module['default']; } :
+/******/ 			function getModuleExports() { return module; };
+/******/ 		__webpack_require__.d(getter, 'a', getter);
+/******/ 		return getter;
+/******/ 	};
+/******/
+/******/ 	// Object.prototype.hasOwnProperty.call
+/******/ 	__webpack_require__.o = function(object, property) { return Object.prototype.hasOwnProperty.call(object, property); };
+/******/
+/******/ 	// __webpack_public_path__
+/******/ 	__webpack_require__.p = "/assets/";
+/******/
+/******/ 	// Load entry module and return exports
+/******/ 	return __webpack_require__(__webpack_require__.s = 89);
+/******/ })
+/************************************************************************/
+/******/ ({
+
+/***/ 0:
+/***/ (function(module, __webpack_exports__, __webpack_require__) {
+
+"use strict";
+var _createClass = function () { function defineProperties(target, props) { for (var i = 0; i < props.length; i++) { var descriptor = props[i]; descriptor.enumerable = descriptor.enumerable || false; descriptor.configurable = true; if ("value" in descriptor) descriptor.writable = true; Object.defineProperty(target, descriptor.key, descriptor); } } return function (Constructor, protoProps, staticProps) { if (protoProps) defineProperties(Constructor.prototype, protoProps); if (staticProps) defineProperties(Constructor, staticProps); return Constructor; }; }();
+
+function _classCallCheck(instance, Constructor) { if (!(instance instanceof Constructor)) { throw new TypeError("Cannot call a class as a function"); } }
+
+/**
+ * Copyright 2016 Google Inc.
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *   http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+
+/**
+ * @template A
+ */
+var MDCFoundation = function () {
+  _createClass(MDCFoundation, null, [{
+    key: "cssClasses",
+
+    /** @return enum{cssClasses} */
+    get: function get() {
+      // Classes extending MDCFoundation should implement this method to return an object which exports every
+      // CSS class the foundation class needs as a property. e.g. {ACTIVE: 'mdc-component--active'}
+      return {};
+    }
+
+    /** @return enum{strings} */
+
+  }, {
+    key: "strings",
+    get: function get() {
+      // Classes extending MDCFoundation should implement this method to return an object which exports all
+      // semantic strings as constants. e.g. {ARIA_ROLE: 'tablist'}
+      return {};
+    }
+
+    /** @return enum{numbers} */
+
+  }, {
+    key: "numbers",
+    get: function get() {
+      // Classes extending MDCFoundation should implement this method to return an object which exports all
+      // of its semantic numbers as constants. e.g. {ANIMATION_DELAY_MS: 350}
+      return {};
+    }
+
+    /** @return {!Object} */
+
+  }, {
+    key: "defaultAdapter",
+    get: function get() {
+      // Classes extending MDCFoundation may choose to implement this getter in order to provide a convenient
+      // way of viewing the necessary methods of an adapter. In the future, this could also be used for adapter
+      // validation.
+      return {};
+    }
+
+    /**
+     * @param {A=} adapter
+     */
+
+  }]);
+
+  function MDCFoundation() {
+    var adapter = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : {};
+
+    _classCallCheck(this, MDCFoundation);
+
+    /** @protected {!A} */
+    this.adapter_ = adapter;
+  }
+
+  _createClass(MDCFoundation, [{
+    key: "init",
+    value: function init() {
+      // Subclasses should override this method to perform initialization routines (registering events, etc.)
+    }
+  }, {
+    key: "destroy",
+    value: function destroy() {
+      // Subclasses should override this method to perform de-initialization routines (de-registering events, etc.)
+    }
+  }]);
+
+  return MDCFoundation;
+}();
+
+/* harmony default export */ __webpack_exports__["a"] = (MDCFoundation);
+
+/***/ }),
+
+/***/ 1:
+/***/ (function(module, __webpack_exports__, __webpack_require__) {
+
+"use strict";
+/* harmony import */ var __WEBPACK_IMPORTED_MODULE_0__foundation__ = __webpack_require__(0);
+var _createClass = function () { function defineProperties(target, props) { for (var i = 0; i < props.length; i++) { var descriptor = props[i]; descriptor.enumerable = descriptor.enumerable || false; descriptor.configurable = true; if ("value" in descriptor) descriptor.writable = true; Object.defineProperty(target, descriptor.key, descriptor); } } return function (Constructor, protoProps, staticProps) { if (protoProps) defineProperties(Constructor.prototype, protoProps); if (staticProps) defineProperties(Constructor, staticProps); return Constructor; }; }();
+
+function _classCallCheck(instance, Constructor) { if (!(instance instanceof Constructor)) { throw new TypeError("Cannot call a class as a function"); } }
+
+/**
+ * Copyright 2016 Google Inc.
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *   http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+
+
+
+/**
+ * @template F
+ */
+
+var MDCComponent = function () {
+  _createClass(MDCComponent, null, [{
+    key: 'attachTo',
+
+    /**
+     * @param {!Element} root
+     * @return {!MDCComponent}
+     */
+    value: function attachTo(root) {
+      // Subclasses which extend MDCBase should provide an attachTo() method that takes a root element and
+      // returns an instantiated component with its root set to that element. Also note that in the cases of
+      // subclasses, an explicit foundation class will not have to be passed in; it will simply be initialized
+      // from getDefaultFoundation().
+      return new MDCComponent(root, new __WEBPACK_IMPORTED_MODULE_0__foundation__["a" /* default */]());
+    }
+
+    /**
+     * @param {!Element} root
+     * @param {F=} foundation
+     * @param {...?} args
+     */
+
+  }]);
+
+  function MDCComponent(root) {
+    var foundation = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : undefined;
+
+    _classCallCheck(this, MDCComponent);
+
+    /** @protected {!Element} */
+    this.root_ = root;
+
+    for (var _len = arguments.length, args = Array(_len > 2 ? _len - 2 : 0), _key = 2; _key < _len; _key++) {
+      args[_key - 2] = arguments[_key];
+    }
+
+    this.initialize.apply(this, args);
+    // Note that we initialize foundation here and not within the constructor's default param so that
+    // this.root_ is defined and can be used within the foundation class.
+    /** @protected {!F} */
+    this.foundation_ = foundation === undefined ? this.getDefaultFoundation() : foundation;
+    this.foundation_.init();
+    this.initialSyncWithDOM();
+  }
+
+  _createClass(MDCComponent, [{
+    key: 'initialize',
+    value: function initialize() /* ...args */{}
+    // Subclasses can override this to do any additional setup work that would be considered part of a
+    // "constructor". Essentially, it is a hook into the parent constructor before the foundation is
+    // initialized. Any additional arguments besides root and foundation will be passed in here.
+
+
+    /**
+     * @return {!F} foundation
+     */
+
+  }, {
+    key: 'getDefaultFoundation',
+    value: function getDefaultFoundation() {
+      // Subclasses must override this method to return a properly configured foundation class for the
+      // component.
+      throw new Error('Subclasses must override getDefaultFoundation to return a properly configured ' + 'foundation class');
+    }
+  }, {
+    key: 'initialSyncWithDOM',
+    value: function initialSyncWithDOM() {
+      // Subclasses should override this method if they need to perform work to synchronize with a host DOM
+      // object. An example of this would be a form control wrapper that needs to synchronize its internal state
+      // to some property or attribute of the host DOM. Please note: this is *not* the place to perform DOM
+      // reads/writes that would cause layout / paint, as this is called synchronously from within the constructor.
+    }
+  }, {
+    key: 'destroy',
+    value: function destroy() {
+      // Subclasses may implement this method to release any resources / deregister any listeners they have
+      // attached. An example of this might be deregistering a resize event from the window object.
+      this.foundation_.destroy();
+    }
+
+    /**
+     * Wrapper method to add an event listener to the component's root element. This is most useful when
+     * listening for custom events.
+     * @param {string} evtType
+     * @param {!Function} handler
+     */
+
+  }, {
+    key: 'listen',
+    value: function listen(evtType, handler) {
+      this.root_.addEventListener(evtType, handler);
+    }
+
+    /**
+     * Wrapper method to remove an event listener to the component's root element. This is most useful when
+     * unlistening for custom events.
+     * @param {string} evtType
+     * @param {!Function} handler
+     */
+
+  }, {
+    key: 'unlisten',
+    value: function unlisten(evtType, handler) {
+      this.root_.removeEventListener(evtType, handler);
+    }
+
+    /**
+     * Fires a cross-browser-compatible custom event from the component root of the given type,
+     * with the given data.
+     * @param {string} evtType
+     * @param {!Object} evtData
+     * @param {boolean=} shouldBubble
+     */
+
+  }, {
+    key: 'emit',
+    value: function emit(evtType, evtData) {
+      var shouldBubble = arguments.length > 2 && arguments[2] !== undefined ? arguments[2] : false;
+
+      var evt = void 0;
+      if (typeof CustomEvent === 'function') {
+        evt = new CustomEvent(evtType, {
+          detail: evtData,
+          bubbles: shouldBubble
+        });
+      } else {
+        evt = document.createEvent('CustomEvent');
+        evt.initCustomEvent(evtType, shouldBubble, false, evtData);
+      }
+
+      this.root_.dispatchEvent(evt);
+    }
+  }]);
+
+  return MDCComponent;
+}();
+
+/* harmony default export */ __webpack_exports__["a"] = (MDCComponent);
+
+/***/ }),
+
+/***/ 29:
+/***/ (function(module, __webpack_exports__, __webpack_require__) {
+
+"use strict";
+Object.defineProperty(__webpack_exports__, "__esModule", { value: true });
+/* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, "MDCIconToggle", function() { return MDCIconToggle; });
+/* harmony import */ var __WEBPACK_IMPORTED_MODULE_0__material_base_component__ = __webpack_require__(1);
+/* harmony import */ var __WEBPACK_IMPORTED_MODULE_1__foundation__ = __webpack_require__(58);
+/* harmony import */ var __WEBPACK_IMPORTED_MODULE_2__material_ripple_adapter__ = __webpack_require__(4);
+/* harmony import */ var __WEBPACK_IMPORTED_MODULE_3__material_ripple__ = __webpack_require__(6);
+/* harmony reexport (binding) */ __webpack_require__.d(__webpack_exports__, "MDCIconToggleFoundation", function() { return __WEBPACK_IMPORTED_MODULE_1__foundation__["a"]; });
+var _extends = Object.assign || function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; };
+
+var _get = function get(object, property, receiver) { if (object === null) object = Function.prototype; var desc = Object.getOwnPropertyDescriptor(object, property); if (desc === undefined) { var parent = Object.getPrototypeOf(object); if (parent === null) { return undefined; } else { return get(parent, property, receiver); } } else if ("value" in desc) { return desc.value; } else { var getter = desc.get; if (getter === undefined) { return undefined; } return getter.call(receiver); } };
+
+var _createClass = function () { function defineProperties(target, props) { for (var i = 0; i < props.length; i++) { var descriptor = props[i]; descriptor.enumerable = descriptor.enumerable || false; descriptor.configurable = true; if ("value" in descriptor) descriptor.writable = true; Object.defineProperty(target, descriptor.key, descriptor); } } return function (Constructor, protoProps, staticProps) { if (protoProps) defineProperties(Constructor.prototype, protoProps); if (staticProps) defineProperties(Constructor, staticProps); return Constructor; }; }();
+
+function _classCallCheck(instance, Constructor) { if (!(instance instanceof Constructor)) { throw new TypeError("Cannot call a class as a function"); } }
+
+function _possibleConstructorReturn(self, call) { if (!self) { throw new ReferenceError("this hasn't been initialised - super() hasn't been called"); } return call && (typeof call === "object" || typeof call === "function") ? call : self; }
+
+function _inherits(subClass, superClass) { if (typeof superClass !== "function" && superClass !== null) { throw new TypeError("Super expression must either be null or a function, not " + typeof superClass); } subClass.prototype = Object.create(superClass && superClass.prototype, { constructor: { value: subClass, enumerable: false, writable: true, configurable: true } }); if (superClass) Object.setPrototypeOf ? Object.setPrototypeOf(subClass, superClass) : subClass.__proto__ = superClass; }
+
+/**
+ * Copyright 2016 Google Inc. All Rights Reserved.
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *      http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+
+
+
+/* eslint-disable no-unused-vars */
+
+/* eslint-enable no-unused-vars */
+
+
+
+
+/**
+ * @extends {MDCComponent<!MDCIconToggleFoundation>}
+ */
+var MDCIconToggle = function (_MDCComponent) {
+  _inherits(MDCIconToggle, _MDCComponent);
+
+  _createClass(MDCIconToggle, null, [{
+    key: 'attachTo',
+    value: function attachTo(root) {
+      return new MDCIconToggle(root);
+    }
+  }]);
+
+  function MDCIconToggle() {
+    var _ref;
+
+    _classCallCheck(this, MDCIconToggle);
+
+    for (var _len = arguments.length, args = Array(_len), _key = 0; _key < _len; _key++) {
+      args[_key] = arguments[_key];
+    }
+
+    /** @private {!MDCRipple} */
+    var _this = _possibleConstructorReturn(this, (_ref = MDCIconToggle.__proto__ || Object.getPrototypeOf(MDCIconToggle)).call.apply(_ref, [this].concat(args)));
+
+    _this.ripple_ = _this.initRipple_();
+    return _this;
+  }
+
+  /** @return {!Element} */
+
+
+  _createClass(MDCIconToggle, [{
+    key: 'initRipple_',
+
+
+    /**
+     * @return {!MDCRipple}
+     * @private
+     */
+    value: function initRipple_() {
+      var _this2 = this;
+
+      var adapter = _extends(__WEBPACK_IMPORTED_MODULE_3__material_ripple__["MDCRipple"].createAdapter(this), {
+        isUnbounded: function isUnbounded() {
+          return true;
+        },
+        isSurfaceActive: function isSurfaceActive() {
+          return _this2.foundation_.isKeyboardActivated();
+        },
+        computeBoundingRect: function computeBoundingRect() {
+          var dim = 48;
+
+          var _root_$getBoundingCli = _this2.root_.getBoundingClientRect(),
+              left = _root_$getBoundingCli.left,
+              top = _root_$getBoundingCli.top;
+
+          return {
+            left: left,
+            top: top,
+            width: dim,
+            height: dim,
+            right: left + dim,
+            bottom: left + dim
+          };
+        }
+      });
+      var foundation = new __WEBPACK_IMPORTED_MODULE_3__material_ripple__["MDCRippleFoundation"](adapter);
+      return new __WEBPACK_IMPORTED_MODULE_3__material_ripple__["MDCRipple"](this.root_, foundation);
+    }
+  }, {
+    key: 'destroy',
+    value: function destroy() {
+      this.ripple_.destroy();
+      _get(MDCIconToggle.prototype.__proto__ || Object.getPrototypeOf(MDCIconToggle.prototype), 'destroy', this).call(this);
+    }
+
+    /** @return {!MDCIconToggleFoundation} */
+
+  }, {
+    key: 'getDefaultFoundation',
+    value: function getDefaultFoundation() {
+      var _this3 = this;
+
+      return new __WEBPACK_IMPORTED_MODULE_1__foundation__["a" /* default */]({
+        addClass: function addClass(className) {
+          return _this3.iconEl_.classList.add(className);
+        },
+        removeClass: function removeClass(className) {
+          return _this3.iconEl_.classList.remove(className);
+        },
+        registerInteractionHandler: function registerInteractionHandler(type, handler) {
+          return _this3.root_.addEventListener(type, handler);
+        },
+        deregisterInteractionHandler: function deregisterInteractionHandler(type, handler) {
+          return _this3.root_.removeEventListener(type, handler);
+        },
+        setText: function setText(text) {
+          return _this3.iconEl_.textContent = text;
+        },
+        getTabIndex: function getTabIndex() {
+          return (/* number */_this3.root_.tabIndex
+          );
+        },
+        setTabIndex: function setTabIndex(tabIndex) {
+          return _this3.root_.tabIndex = tabIndex;
+        },
+        getAttr: function getAttr(name, value) {
+          return _this3.root_.getAttribute(name, value);
+        },
+        setAttr: function setAttr(name, value) {
+          return _this3.root_.setAttribute(name, value);
+        },
+        rmAttr: function rmAttr(name) {
+          return _this3.root_.removeAttribute(name);
+        },
+        notifyChange: function notifyChange(evtData) {
+          return _this3.emit(__WEBPACK_IMPORTED_MODULE_1__foundation__["a" /* default */].strings.CHANGE_EVENT, evtData);
+        }
+      });
+    }
+  }, {
+    key: 'initialSyncWithDOM',
+    value: function initialSyncWithDOM() {
+      this.on = this.root_.getAttribute(__WEBPACK_IMPORTED_MODULE_1__foundation__["a" /* default */].strings.ARIA_PRESSED) === 'true';
+      this.disabled = this.root_.getAttribute(__WEBPACK_IMPORTED_MODULE_1__foundation__["a" /* default */].strings.ARIA_DISABLED) === 'true';
+    }
+
+    /** @return {boolean} */
+
+  }, {
+    key: 'refreshToggleData',
+    value: function refreshToggleData() {
+      this.foundation_.refreshToggleData();
+    }
+  }, {
+    key: 'iconEl_',
+    get: function get() {
+      var sel = this.root_.dataset['iconInnerSelector'];
+
+      return sel ?
+      /** @type {!Element} */this.root_.querySelector(sel) : this.root_;
+    }
+  }, {
+    key: 'on',
+    get: function get() {
+      return this.foundation_.isOn();
+    }
+
+    /** @param {boolean} isOn */
+    ,
+    set: function set(isOn) {
+      this.foundation_.toggle(isOn);
+    }
+
+    /** @return {boolean} */
+
+  }, {
+    key: 'disabled',
+    get: function get() {
+      return this.foundation_.isDisabled();
+    }
+
+    /** @param {boolean} isDisabled */
+    ,
+    set: function set(isDisabled) {
+      this.foundation_.setDisabled(isDisabled);
+    }
+  }]);
+
+  return MDCIconToggle;
+}(__WEBPACK_IMPORTED_MODULE_0__material_base_component__["a" /* default */]);
+
+/***/ }),
+
+/***/ 4:
+/***/ (function(module, __webpack_exports__, __webpack_require__) {
+
+"use strict";
+var _createClass = function () { function defineProperties(target, props) { for (var i = 0; i < props.length; i++) { var descriptor = props[i]; descriptor.enumerable = descriptor.enumerable || false; descriptor.configurable = true; if ("value" in descriptor) descriptor.writable = true; Object.defineProperty(target, descriptor.key, descriptor); } } return function (Constructor, protoProps, staticProps) { if (protoProps) defineProperties(Constructor.prototype, protoProps); if (staticProps) defineProperties(Constructor, staticProps); return Constructor; }; }();
+
+function _classCallCheck(instance, Constructor) { if (!(instance instanceof Constructor)) { throw new TypeError("Cannot call a class as a function"); } }
+
+/**
+ * Copyright 2016 Google Inc. All Rights Reserved.
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *      http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+
+/* eslint no-unused-vars: [2, {"args": "none"}] */
+
+/**
+ * Adapter for MDC Ripple. Provides an interface for managing
+ * - classes
+ * - dom
+ * - CSS variables
+ * - position
+ * - dimensions
+ * - scroll position
+ * - event handlers
+ * - unbounded, active and disabled states
+ *
+ * Additionally, provides type information for the adapter to the Closure
+ * compiler.
+ *
+ * Implement this adapter for your framework of choice to delegate updates to
+ * the component in your framework of choice. See architecture documentation
+ * for more details.
+ * https://github.com/material-components/material-components-web/blob/master/docs/architecture.md
+ *
+ * @record
+ */
+var MDCRippleAdapter = function () {
+  function MDCRippleAdapter() {
+    _classCallCheck(this, MDCRippleAdapter);
+  }
+
+  _createClass(MDCRippleAdapter, [{
+    key: "browserSupportsCssVars",
+
+    /** @return {boolean} */
+    value: function browserSupportsCssVars() {}
+
+    /** @return {boolean} */
+
+  }, {
+    key: "isUnbounded",
+    value: function isUnbounded() {}
+
+    /** @return {boolean} */
+
+  }, {
+    key: "isSurfaceActive",
+    value: function isSurfaceActive() {}
+
+    /** @return {boolean} */
+
+  }, {
+    key: "isSurfaceDisabled",
+    value: function isSurfaceDisabled() {}
+
+    /** @param {string} className */
+
+  }, {
+    key: "addClass",
+    value: function addClass(className) {}
+
+    /** @param {string} className */
+
+  }, {
+    key: "removeClass",
+    value: function removeClass(className) {}
+
+    /**
+     * @param {string} evtType
+     * @param {!Function} handler
+     */
+
+  }, {
+    key: "registerInteractionHandler",
+    value: function registerInteractionHandler(evtType, handler) {}
+
+    /**
+     * @param {string} evtType
+     * @param {!Function} handler
+     */
+
+  }, {
+    key: "deregisterInteractionHandler",
+    value: function deregisterInteractionHandler(evtType, handler) {}
+
+    /**
+     * @param {!Function} handler
+     */
+
+  }, {
+    key: "registerResizeHandler",
+    value: function registerResizeHandler(handler) {}
+
+    /**
+     * @param {!Function} handler
+     */
+
+  }, {
+    key: "deregisterResizeHandler",
+    value: function deregisterResizeHandler(handler) {}
+
+    /**
+     * @param {string} varName
+     * @param {?number|string} value
+     */
+
+  }, {
+    key: "updateCssVariable",
+    value: function updateCssVariable(varName, value) {}
+
+    /** @return {!ClientRect} */
+
+  }, {
+    key: "computeBoundingRect",
+    value: function computeBoundingRect() {}
+
+    /** @return {{x: number, y: number}} */
+
+  }, {
+    key: "getWindowPageOffset",
+    value: function getWindowPageOffset() {}
+  }]);
+
+  return MDCRippleAdapter;
+}();
+
+/* unused harmony default export */ var _unused_webpack_default_export = (MDCRippleAdapter);
+
+/***/ }),
+
+/***/ 5:
+/***/ (function(module, __webpack_exports__, __webpack_require__) {
+
+"use strict";
+Object.defineProperty(__webpack_exports__, "__esModule", { value: true });
+/* harmony export (immutable) */ __webpack_exports__["supportsCssVariables"] = supportsCssVariables;
+/* harmony export (immutable) */ __webpack_exports__["applyPassive"] = applyPassive;
+/* harmony export (immutable) */ __webpack_exports__["getMatchesProperty"] = getMatchesProperty;
+/* harmony export (immutable) */ __webpack_exports__["getNormalizedEventCoords"] = getNormalizedEventCoords;
+/**
+ * Copyright 2016 Google Inc. All Rights Reserved.
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *      http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+
+/**
+ * Stores result from supportsCssVariables to avoid redundant processing to detect CSS custom variable support.
+ * @private {boolean|undefined}
+ */
+var supportsCssVariables_ = void 0;
+
+/**
+ * Stores result from applyPassive to avoid redundant processing to detect passive event listener support.
+ * @private {boolean|undefined}
+ */
+var supportsPassive_ = void 0;
+
+/**
+ * @param {!Window} windowObj
+ * @return {boolean}
+ */
+function detectEdgePseudoVarBug(windowObj) {
+  // Detect versions of Edge with buggy var() support
+  // See: https://developer.microsoft.com/en-us/microsoft-edge/platform/issues/11495448/
+  var document = windowObj.document;
+  var className = 'test-edge-css-var';
+  var styleNode = document.createElement('style');
+  document.head.appendChild(styleNode);
+  var sheet = styleNode.sheet;
+  // Internet Explorer 11 requires indices to always be specified to insertRule
+  sheet.insertRule(':root { --' + className + ': 1px solid #000; }', 0);
+  sheet.insertRule('.' + className + ' { visibility: hidden; }', 1);
+  sheet.insertRule('.' + className + '::before { border: var(--' + className + '); }', 2);
+  var node = document.createElement('div');
+  node.className = className;
+  document.body.appendChild(node);
+  // Bug exists if ::before style ends up propagating to the parent element
+  var hasPseudoVarBug = windowObj.getComputedStyle(node).borderTopStyle === 'solid';
+  node.remove();
+  styleNode.remove();
+  return hasPseudoVarBug;
+}
+
+/**
+ * @param {!Window} windowObj
+ * @param {boolean=} forceRefresh
+ * @return {boolean|undefined}
+ */
+function supportsCssVariables(windowObj) {
+  var forceRefresh = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : false;
+
+  if (typeof supportsCssVariables_ === 'boolean' && !forceRefresh) {
+    return supportsCssVariables_;
+  }
+
+  var supportsFunctionPresent = windowObj.CSS && typeof windowObj.CSS.supports === 'function';
+  if (!supportsFunctionPresent) {
+    return;
+  }
+
+  var explicitlySupportsCssVars = windowObj.CSS.supports('--css-vars', 'yes');
+  // See: https://bugs.webkit.org/show_bug.cgi?id=154669
+  // See: README section on Safari
+  var weAreFeatureDetectingSafari10plus = windowObj.CSS.supports('(--css-vars: yes)') && windowObj.CSS.supports('color', '#00000000');
+
+  if (explicitlySupportsCssVars || weAreFeatureDetectingSafari10plus) {
+    supportsCssVariables_ = !detectEdgePseudoVarBug(windowObj);
+  } else {
+    supportsCssVariables_ = false;
+  }
+  return supportsCssVariables_;
+}
+
+//
+/**
+ * Determine whether the current browser supports passive event listeners, and if so, use them.
+ * @param {!Window=} globalObj
+ * @param {boolean=} forceRefresh
+ * @return {boolean|{passive: boolean}}
+ */
+function applyPassive() {
+  var globalObj = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : window;
+  var forceRefresh = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : false;
+
+  if (supportsPassive_ === undefined || forceRefresh) {
+    var isSupported = false;
+    try {
+      globalObj.document.addEventListener('test', null, { get passive() {
+          isSupported = true;
+        } });
+    } catch (e) {}
+
+    supportsPassive_ = isSupported;
+  }
+
+  return supportsPassive_ ? { passive: true } : false;
+}
+
+/**
+ * @param {!Object} HTMLElementPrototype
+ * @return {!Array<string>}
+ */
+function getMatchesProperty(HTMLElementPrototype) {
+  return ['webkitMatchesSelector', 'msMatchesSelector', 'matches'].filter(function (p) {
+    return p in HTMLElementPrototype;
+  }).pop();
+}
+
+/**
+ * @param {!Event} ev
+ * @param {!{x: number, y: number}} pageOffset
+ * @param {!ClientRect} clientRect
+ * @return {!{x: number, y: number}}
+ */
+function getNormalizedEventCoords(ev, pageOffset, clientRect) {
+  var x = pageOffset.x,
+      y = pageOffset.y;
+
+  var documentX = x + clientRect.left;
+  var documentY = y + clientRect.top;
+
+  var normalizedX = void 0;
+  var normalizedY = void 0;
+  // Determine touch point relative to the ripple container.
+  if (ev.type === 'touchstart') {
+    normalizedX = ev.changedTouches[0].pageX - documentX;
+    normalizedY = ev.changedTouches[0].pageY - documentY;
+  } else {
+    normalizedX = ev.pageX - documentX;
+    normalizedY = ev.pageY - documentY;
+  }
+
+  return { x: normalizedX, y: normalizedY };
+}
+
+/***/ }),
+
+/***/ 56:
+/***/ (function(module, __webpack_exports__, __webpack_require__) {
+
+"use strict";
+/* unused harmony export IconToggleEvent */
+var _createClass = function () { function defineProperties(target, props) { for (var i = 0; i < props.length; i++) { var descriptor = props[i]; descriptor.enumerable = descriptor.enumerable || false; descriptor.configurable = true; if ("value" in descriptor) descriptor.writable = true; Object.defineProperty(target, descriptor.key, descriptor); } } return function (Constructor, protoProps, staticProps) { if (protoProps) defineProperties(Constructor.prototype, protoProps); if (staticProps) defineProperties(Constructor, staticProps); return Constructor; }; }();
+
+function _classCallCheck(instance, Constructor) { if (!(instance instanceof Constructor)) { throw new TypeError("Cannot call a class as a function"); } }
+
+/**
+ * Copyright 2017 Google Inc. All Rights Reserved.
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *      http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+
+/* eslint no-unused-vars: [2, {"args": "none"}] */
+
+/**
+ * Adapter for MDC Icon Toggle. Provides an interface for managing
+ * - classes
+ * - dom
+ * - inner text
+ * - event handlers
+ * - event dispatch
+ *
+ * Additionally, provides type information for the adapter to the Closure
+ * compiler.
+ *
+ * Implement this adapter for your framework of choice to delegate updates to
+ * the component in your framework of choice. See architecture documentation
+ * for more details.
+ * https://github.com/material-components/material-components-web/blob/master/docs/architecture.md
+ *
+ * @record
+ */
+var MDCIconToggleAdapter = function () {
+  function MDCIconToggleAdapter() {
+    _classCallCheck(this, MDCIconToggleAdapter);
+  }
+
+  _createClass(MDCIconToggleAdapter, [{
+    key: "addClass",
+
+    /** @param {string} className */
+    value: function addClass(className) {}
+
+    /** @param {string} className */
+
+  }, {
+    key: "removeClass",
+    value: function removeClass(className) {}
+
+    /**
+     * @param {string} type
+     * @param {!EventListener} handler
+     */
+
+  }, {
+    key: "registerInteractionHandler",
+    value: function registerInteractionHandler(type, handler) {}
+
+    /**
+     * @param {string} type
+     * @param {!EventListener} handler
+     */
+
+  }, {
+    key: "deregisterInteractionHandler",
+    value: function deregisterInteractionHandler(type, handler) {}
+
+    /** @param {string} text */
+
+  }, {
+    key: "setText",
+    value: function setText(text) {}
+
+    /** @return {number} */
+
+  }, {
+    key: "getTabIndex",
+    value: function getTabIndex() {}
+
+    /** @param {number} tabIndex */
+
+  }, {
+    key: "setTabIndex",
+    value: function setTabIndex(tabIndex) {}
+
+    /**
+     * @param {string} name
+     * @return {string}
+     */
+
+  }, {
+    key: "getAttr",
+    value: function getAttr(name) {}
+
+    /**
+     * @param {string} name
+     * @param {string} value
+     */
+
+  }, {
+    key: "setAttr",
+    value: function setAttr(name, value) {}
+
+    /** @param {string} name */
+
+  }, {
+    key: "rmAttr",
+    value: function rmAttr(name) {}
+
+    /** @param {!IconToggleEvent} evtData */
+
+  }, {
+    key: "notifyChange",
+    value: function notifyChange(evtData) {}
+  }]);
+
+  return MDCIconToggleAdapter;
+}();
+
+/**
+ * @typedef {!{
+ *   isOn: boolean,
+ * }}
+ */
+
+
+/* unused harmony default export */ var _unused_webpack_default_export = (MDCIconToggleAdapter);
+var IconToggleEvent = void 0;
+
+/***/ }),
+
+/***/ 57:
+/***/ (function(module, __webpack_exports__, __webpack_require__) {
+
+"use strict";
+/* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, "a", function() { return cssClasses; });
+/* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, "b", function() { return strings; });
+/**
+ * Copyright 2016 Google Inc. All Rights Reserved.
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *      http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+
+/** @enum {string} */
+var cssClasses = {
+  ROOT: 'mdc-icon-toggle',
+  DISABLED: 'mdc-icon-toggle--disabled'
+};
+
+/** @enum {string} */
+var strings = {
+  DATA_TOGGLE_ON: 'data-toggle-on',
+  DATA_TOGGLE_OFF: 'data-toggle-off',
+  ARIA_PRESSED: 'aria-pressed',
+  ARIA_DISABLED: 'aria-disabled',
+  ARIA_LABEL: 'aria-label',
+  CHANGE_EVENT: 'MDCIconToggle:change'
+};
+
+/***/ }),
+
+/***/ 58:
+/***/ (function(module, __webpack_exports__, __webpack_require__) {
+
+"use strict";
+/* unused harmony export KeyboardKey */
+/* harmony import */ var __WEBPACK_IMPORTED_MODULE_0__material_base_foundation__ = __webpack_require__(0);
+/* harmony import */ var __WEBPACK_IMPORTED_MODULE_1__adapter__ = __webpack_require__(56);
+/* harmony import */ var __WEBPACK_IMPORTED_MODULE_2__constants__ = __webpack_require__(57);
+var _extends = Object.assign || function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; };
+
+var _createClass = function () { function defineProperties(target, props) { for (var i = 0; i < props.length; i++) { var descriptor = props[i]; descriptor.enumerable = descriptor.enumerable || false; descriptor.configurable = true; if ("value" in descriptor) descriptor.writable = true; Object.defineProperty(target, descriptor.key, descriptor); } } return function (Constructor, protoProps, staticProps) { if (protoProps) defineProperties(Constructor.prototype, protoProps); if (staticProps) defineProperties(Constructor, staticProps); return Constructor; }; }();
+
+function _classCallCheck(instance, Constructor) { if (!(instance instanceof Constructor)) { throw new TypeError("Cannot call a class as a function"); } }
+
+function _possibleConstructorReturn(self, call) { if (!self) { throw new ReferenceError("this hasn't been initialised - super() hasn't been called"); } return call && (typeof call === "object" || typeof call === "function") ? call : self; }
+
+function _inherits(subClass, superClass) { if (typeof superClass !== "function" && superClass !== null) { throw new TypeError("Super expression must either be null or a function, not " + typeof superClass); } subClass.prototype = Object.create(superClass && superClass.prototype, { constructor: { value: subClass, enumerable: false, writable: true, configurable: true } }); if (superClass) Object.setPrototypeOf ? Object.setPrototypeOf(subClass, superClass) : subClass.__proto__ = superClass; }
+
+/**
+ * Copyright 2016 Google Inc. All Rights Reserved.
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *      http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+
+
+/* eslint-disable no-unused-vars */
+
+
+
+/**
+ * @extends {MDCFoundation<!MDCIconToggleAdapter>}
+ */
+
+var MDCIconToggleFoundation = function (_MDCFoundation) {
+  _inherits(MDCIconToggleFoundation, _MDCFoundation);
+
+  _createClass(MDCIconToggleFoundation, null, [{
+    key: 'cssClasses',
+    get: function get() {
+      return __WEBPACK_IMPORTED_MODULE_2__constants__["a" /* cssClasses */];
+    }
+  }, {
+    key: 'strings',
+    get: function get() {
+      return __WEBPACK_IMPORTED_MODULE_2__constants__["b" /* strings */];
+    }
+  }, {
+    key: 'defaultAdapter',
+    get: function get() {
+      return {
+        addClass: function addClass() /* className: string */{},
+        removeClass: function removeClass() /* className: string */{},
+        registerInteractionHandler: function registerInteractionHandler() /* type: string, handler: EventListener */{},
+        deregisterInteractionHandler: function deregisterInteractionHandler() /* type: string, handler: EventListener */{},
+        setText: function setText() /* text: string */{},
+        getTabIndex: function getTabIndex() {
+          return (/* number */0
+          );
+        },
+        setTabIndex: function setTabIndex() /* tabIndex: number */{},
+        getAttr: function getAttr() {
+          return (/* name: string */ /* string */''
+          );
+        },
+        setAttr: function setAttr() /* name: string, value: string */{},
+        rmAttr: function rmAttr() /* name: string */{},
+        notifyChange: function notifyChange() /* evtData: IconToggleEvent */{}
+      };
+    }
+  }]);
+
+  function MDCIconToggleFoundation(adapter) {
+    _classCallCheck(this, MDCIconToggleFoundation);
+
+    /** @private {boolean} */
+    var _this = _possibleConstructorReturn(this, (MDCIconToggleFoundation.__proto__ || Object.getPrototypeOf(MDCIconToggleFoundation)).call(this, _extends(MDCIconToggleFoundation.defaultAdapter, adapter)));
+
+    _this.on_ = false;
+
+    /** @private {boolean} */
+    _this.disabled_ = false;
+
+    /** @private {number} */
+    _this.savedTabIndex_ = -1;
+
+    /** @private {?IconToggleState} */
+    _this.toggleOnData_ = null;
+
+    /** @private {?IconToggleState} */
+    _this.toggleOffData_ = null;
+
+    _this.clickHandler_ = /** @private {!EventListener} */function () {
+      return _this.toggleFromEvt_();
+    };
+
+    /** @private {boolean} */
+    _this.isHandlingKeydown_ = false;
+
+    _this.keydownHandler_ = /** @private {!EventListener} */function ( /** @type {!KeyboardKey} */evt) {
+      if (isSpace(evt)) {
+        _this.isHandlingKeydown_ = true;
+        return evt.preventDefault();
+      }
+    };
+
+    _this.keyupHandler_ = /** @private {!EventListener} */function ( /** @type {!KeyboardKey} */evt) {
+      if (isSpace(evt)) {
+        _this.isHandlingKeydown_ = false;
+        _this.toggleFromEvt_();
+      }
+    };
+    return _this;
+  }
+
+  _createClass(MDCIconToggleFoundation, [{
+    key: 'init',
+    value: function init() {
+      this.refreshToggleData();
+      this.adapter_.registerInteractionHandler('click', this.clickHandler_);
+      this.adapter_.registerInteractionHandler('keydown', this.keydownHandler_);
+      this.adapter_.registerInteractionHandler('keyup', this.keyupHandler_);
+    }
+  }, {
+    key: 'refreshToggleData',
+    value: function refreshToggleData() {
+      var _MDCIconToggleFoundat = MDCIconToggleFoundation.strings,
+          DATA_TOGGLE_ON = _MDCIconToggleFoundat.DATA_TOGGLE_ON,
+          DATA_TOGGLE_OFF = _MDCIconToggleFoundat.DATA_TOGGLE_OFF;
+
+      this.toggleOnData_ = this.parseJsonDataAttr_(DATA_TOGGLE_ON);
+      this.toggleOffData_ = this.parseJsonDataAttr_(DATA_TOGGLE_OFF);
+    }
+  }, {
+    key: 'destroy',
+    value: function destroy() {
+      this.adapter_.deregisterInteractionHandler('click', this.clickHandler_);
+      this.adapter_.deregisterInteractionHandler('keydown', this.keydownHandler_);
+      this.adapter_.deregisterInteractionHandler('keyup', this.keyupHandler_);
+    }
+
+    /** @private */
+
+  }, {
+    key: 'toggleFromEvt_',
+    value: function toggleFromEvt_() {
+      this.toggle();
+      var isOn = this.on_;
+
+      this.adapter_.notifyChange( /** @type {!IconToggleEvent} */{ isOn: isOn });
+    }
+
+    /** @return {boolean} */
+
+  }, {
+    key: 'isOn',
+    value: function isOn() {
+      return this.on_;
+    }
+
+    /** @param {boolean=} isOn */
+
+  }, {
+    key: 'toggle',
+    value: function toggle() {
+      var isOn = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : !this.on_;
+
+      this.on_ = isOn;
+
+      var _MDCIconToggleFoundat2 = MDCIconToggleFoundation.strings,
+          ARIA_LABEL = _MDCIconToggleFoundat2.ARIA_LABEL,
+          ARIA_PRESSED = _MDCIconToggleFoundat2.ARIA_PRESSED;
+
+
+      if (this.on_) {
+        this.adapter_.setAttr(ARIA_PRESSED, 'true');
+      } else {
+        this.adapter_.setAttr(ARIA_PRESSED, 'false');
+      }
+
+      var _ref = this.on_ ? this.toggleOffData_ : this.toggleOnData_,
+          classToRemove = _ref.cssClass;
+
+      if (classToRemove) {
+        this.adapter_.removeClass(classToRemove);
+      }
+
+      var _ref2 = this.on_ ? this.toggleOnData_ : this.toggleOffData_,
+          content = _ref2.content,
+          label = _ref2.label,
+          cssClass = _ref2.cssClass;
+
+      if (cssClass) {
+        this.adapter_.addClass(cssClass);
+      }
+      if (content) {
+        this.adapter_.setText(content);
+      }
+      if (label) {
+        this.adapter_.setAttr(ARIA_LABEL, label);
+      }
+    }
+
+    /**
+     * @param {string} dataAttr
+     * @return {!IconToggleState}
+     */
+
+  }, {
+    key: 'parseJsonDataAttr_',
+    value: function parseJsonDataAttr_(dataAttr) {
+      var val = this.adapter_.getAttr(dataAttr);
+      if (!val) {
+        return {};
+      }
+      return (/** @type {!IconToggleState} */JSON.parse(val)
+      );
+    }
+
+    /** @return {boolean} */
+
+  }, {
+    key: 'isDisabled',
+    value: function isDisabled() {
+      return this.disabled_;
+    }
+
+    /** @param {boolean} isDisabled */
+
+  }, {
+    key: 'setDisabled',
+    value: function setDisabled(isDisabled) {
+      this.disabled_ = isDisabled;
+
+      var DISABLED = MDCIconToggleFoundation.cssClasses.DISABLED;
+      var ARIA_DISABLED = MDCIconToggleFoundation.strings.ARIA_DISABLED;
+
+
+      if (this.disabled_) {
+        this.savedTabIndex_ = this.adapter_.getTabIndex();
+        this.adapter_.setTabIndex(-1);
+        this.adapter_.setAttr(ARIA_DISABLED, 'true');
+        this.adapter_.addClass(DISABLED);
+      } else {
+        this.adapter_.setTabIndex(this.savedTabIndex_);
+        this.adapter_.rmAttr(ARIA_DISABLED);
+        this.adapter_.removeClass(DISABLED);
+      }
+    }
+
+    /** @return {boolean} */
+
+  }, {
+    key: 'isKeyboardActivated',
+    value: function isKeyboardActivated() {
+      return this.isHandlingKeydown_;
+    }
+  }]);
+
+  return MDCIconToggleFoundation;
+}(__WEBPACK_IMPORTED_MODULE_0__material_base_foundation__["a" /* default */]);
+
+/**
+ * @typedef {!{
+ *   key: string,
+ *   keyCode: number
+ * }}
+ */
+
+
+/* harmony default export */ __webpack_exports__["a"] = (MDCIconToggleFoundation);
+var KeyboardKey = void 0;
+
+/**
+ * @param {!KeyboardKey} keyboardKey
+ * @return {boolean}
+ */
+function isSpace(keyboardKey) {
+  return keyboardKey.key === 'Space' || keyboardKey.keyCode === 32;
+}
+
+/** @record */
+
+var IconToggleState = function IconToggleState() {
+  _classCallCheck(this, IconToggleState);
+};
+
+/**
+ * The aria-label value of the icon toggle, or undefined if there is no aria-label.
+ * @export {string|undefined}
+ */
+
+
+IconToggleState.prototype.label;
+
+/**
+ * The text for the icon toggle, or undefined if there is no text.
+ * @export {string|undefined}
+ */
+IconToggleState.prototype.content;
+
+/**
+ * The CSS class to add to the icon toggle, or undefined if there is no CSS class.
+ * @export {string|undefined}
+ */
+IconToggleState.prototype.cssClass;
+
+/***/ }),
+
+/***/ 6:
+/***/ (function(module, __webpack_exports__, __webpack_require__) {
+
+"use strict";
+Object.defineProperty(__webpack_exports__, "__esModule", { value: true });
+/* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, "MDCRipple", function() { return MDCRipple; });
+/* harmony import */ var __WEBPACK_IMPORTED_MODULE_0__material_base_component__ = __webpack_require__(1);
+/* harmony import */ var __WEBPACK_IMPORTED_MODULE_1__adapter__ = __webpack_require__(4);
+/* harmony import */ var __WEBPACK_IMPORTED_MODULE_2__foundation__ = __webpack_require__(8);
+/* harmony import */ var __WEBPACK_IMPORTED_MODULE_3__util__ = __webpack_require__(5);
+/* harmony reexport (binding) */ __webpack_require__.d(__webpack_exports__, "MDCRippleFoundation", function() { return __WEBPACK_IMPORTED_MODULE_2__foundation__["a"]; });
+/* harmony reexport (module object) */ __webpack_require__.d(__webpack_exports__, "util", function() { return __WEBPACK_IMPORTED_MODULE_3__util__; });
+var _createClass = function () { function defineProperties(target, props) { for (var i = 0; i < props.length; i++) { var descriptor = props[i]; descriptor.enumerable = descriptor.enumerable || false; descriptor.configurable = true; if ("value" in descriptor) descriptor.writable = true; Object.defineProperty(target, descriptor.key, descriptor); } } return function (Constructor, protoProps, staticProps) { if (protoProps) defineProperties(Constructor.prototype, protoProps); if (staticProps) defineProperties(Constructor, staticProps); return Constructor; }; }();
+
+function _classCallCheck(instance, Constructor) { if (!(instance instanceof Constructor)) { throw new TypeError("Cannot call a class as a function"); } }
+
+function _possibleConstructorReturn(self, call) { if (!self) { throw new ReferenceError("this hasn't been initialised - super() hasn't been called"); } return call && (typeof call === "object" || typeof call === "function") ? call : self; }
+
+function _inherits(subClass, superClass) { if (typeof superClass !== "function" && superClass !== null) { throw new TypeError("Super expression must either be null or a function, not " + typeof superClass); } subClass.prototype = Object.create(superClass && superClass.prototype, { constructor: { value: subClass, enumerable: false, writable: true, configurable: true } }); if (superClass) Object.setPrototypeOf ? Object.setPrototypeOf(subClass, superClass) : subClass.__proto__ = superClass; }
+
+/**
+ * Copyright 2016 Google Inc. All Rights Reserved.
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *      http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+
+
+
+
+
+
+
+
+
+/**
+ * @extends MDCComponent<!MDCRippleFoundation>
+ */
+var MDCRipple = function (_MDCComponent) {
+  _inherits(MDCRipple, _MDCComponent);
+
+  /** @param {...?} args */
+  function MDCRipple() {
+    var _ref;
+
+    _classCallCheck(this, MDCRipple);
+
+    for (var _len = arguments.length, args = Array(_len), _key = 0; _key < _len; _key++) {
+      args[_key] = arguments[_key];
+    }
+
+    /** @type {boolean} */
+    var _this = _possibleConstructorReturn(this, (_ref = MDCRipple.__proto__ || Object.getPrototypeOf(MDCRipple)).call.apply(_ref, [this].concat(args)));
+
+    _this.disabled = false;
+
+    /** @private {boolean} */
+    _this.unbounded_;
+    return _this;
+  }
+
+  /**
+   * @param {!Element} root
+   * @param {{isUnbounded: (boolean|undefined)}=} options
+   * @return {!MDCRipple}
+   */
+
+
+  _createClass(MDCRipple, [{
+    key: 'activate',
+    value: function activate() {
+      this.foundation_.activate();
+    }
+  }, {
+    key: 'deactivate',
+    value: function deactivate() {
+      this.foundation_.deactivate();
+    }
+  }, {
+    key: 'layout',
+    value: function layout() {
+      this.foundation_.layout();
+    }
+
+    /** @return {!MDCRippleFoundation} */
+
+  }, {
+    key: 'getDefaultFoundation',
+    value: function getDefaultFoundation() {
+      return new __WEBPACK_IMPORTED_MODULE_2__foundation__["a" /* default */](MDCRipple.createAdapter(this));
+    }
+  }, {
+    key: 'initialSyncWithDOM',
+    value: function initialSyncWithDOM() {
+      this.unbounded = 'mdcRippleIsUnbounded' in this.root_.dataset;
+    }
+  }, {
+    key: 'unbounded',
+
+
+    /** @return {boolean} */
+    get: function get() {
+      return this.unbounded_;
+    }
+
+    /** @param {boolean} unbounded */
+    ,
+    set: function set(unbounded) {
+      var UNBOUNDED = __WEBPACK_IMPORTED_MODULE_2__foundation__["a" /* default */].cssClasses.UNBOUNDED;
+
+      this.unbounded_ = Boolean(unbounded);
+      if (this.unbounded_) {
+        this.root_.classList.add(UNBOUNDED);
+      } else {
+        this.root_.classList.remove(UNBOUNDED);
+      }
+    }
+  }], [{
+    key: 'attachTo',
+    value: function attachTo(root) {
+      var _ref2 = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : {},
+          _ref2$isUnbounded = _ref2.isUnbounded,
+          isUnbounded = _ref2$isUnbounded === undefined ? undefined : _ref2$isUnbounded;
+
+      var ripple = new MDCRipple(root);
+      // Only override unbounded behavior if option is explicitly specified
+      if (isUnbounded !== undefined) {
+        ripple.unbounded = /** @type {boolean} */isUnbounded;
+      }
+      return ripple;
+    }
+
+    /**
+     * @param {!RippleCapableSurface} instance
+     * @return {!MDCRippleAdapter}
+     */
+
+  }, {
+    key: 'createAdapter',
+    value: function createAdapter(instance) {
+      var MATCHES = __WEBPACK_IMPORTED_MODULE_3__util__["getMatchesProperty"](HTMLElement.prototype);
+
+      return {
+        browserSupportsCssVars: function browserSupportsCssVars() {
+          return __WEBPACK_IMPORTED_MODULE_3__util__["supportsCssVariables"](window);
+        },
+        isUnbounded: function isUnbounded() {
+          return instance.unbounded;
+        },
+        isSurfaceActive: function isSurfaceActive() {
+          return instance.root_[MATCHES](':active');
+        },
+        isSurfaceDisabled: function isSurfaceDisabled() {
+          return instance.disabled;
+        },
+        addClass: function addClass(className) {
+          return instance.root_.classList.add(className);
+        },
+        removeClass: function removeClass(className) {
+          return instance.root_.classList.remove(className);
+        },
+        registerInteractionHandler: function registerInteractionHandler(evtType, handler) {
+          return instance.root_.addEventListener(evtType, handler, __WEBPACK_IMPORTED_MODULE_3__util__["applyPassive"]());
+        },
+        deregisterInteractionHandler: function deregisterInteractionHandler(evtType, handler) {
+          return instance.root_.removeEventListener(evtType, handler, __WEBPACK_IMPORTED_MODULE_3__util__["applyPassive"]());
+        },
+        registerResizeHandler: function registerResizeHandler(handler) {
+          return window.addEventListener('resize', handler);
+        },
+        deregisterResizeHandler: function deregisterResizeHandler(handler) {
+          return window.removeEventListener('resize', handler);
+        },
+        updateCssVariable: function updateCssVariable(varName, value) {
+          return instance.root_.style.setProperty(varName, value);
+        },
+        computeBoundingRect: function computeBoundingRect() {
+          return instance.root_.getBoundingClientRect();
+        },
+        getWindowPageOffset: function getWindowPageOffset() {
+          return { x: window.pageXOffset, y: window.pageYOffset };
+        }
+      };
+    }
+  }]);
+
+  return MDCRipple;
+}(__WEBPACK_IMPORTED_MODULE_0__material_base_component__["a" /* default */]);
+
+/**
+ * See Material Design spec for more details on when to use ripples.
+ * https://material.io/guidelines/motion/choreography.html#choreography-creation
+ * @record
+ */
+
+var RippleCapableSurface = function RippleCapableSurface() {
+  _classCallCheck(this, RippleCapableSurface);
+};
+
+/** @protected {!Element} */
+
+
+RippleCapableSurface.prototype.root_;
+
+/**
+ * Whether or not the ripple bleeds out of the bounds of the element.
+ * @type {boolean|undefined}
+ */
+RippleCapableSurface.prototype.unbounded;
+
+/**
+ * Whether or not the ripple is attached to a disabled component.
+ * @type {boolean|undefined}
+ */
+RippleCapableSurface.prototype.disabled;
+
+/***/ }),
+
+/***/ 7:
+/***/ (function(module, __webpack_exports__, __webpack_require__) {
+
+"use strict";
+/* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, "a", function() { return cssClasses; });
+/* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, "b", function() { return strings; });
+/* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, "c", function() { return numbers; });
+/**
+ * Copyright 2016 Google Inc. All Rights Reserved.
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *      http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+
+var cssClasses = {
+  // Ripple is a special case where the "root" component is really a "mixin" of sorts,
+  // given that it's an 'upgrade' to an existing component. That being said it is the root
+  // CSS class that all other CSS classes derive from.
+  ROOT: 'mdc-ripple-upgraded',
+  UNBOUNDED: 'mdc-ripple-upgraded--unbounded',
+  BG_FOCUSED: 'mdc-ripple-upgraded--background-focused',
+  BG_ACTIVE_FILL: 'mdc-ripple-upgraded--background-active-fill',
+  FG_ACTIVATION: 'mdc-ripple-upgraded--foreground-activation',
+  FG_DEACTIVATION: 'mdc-ripple-upgraded--foreground-deactivation'
+};
+
+var strings = {
+  VAR_SURFACE_WIDTH: '--mdc-ripple-surface-width',
+  VAR_SURFACE_HEIGHT: '--mdc-ripple-surface-height',
+  VAR_FG_SIZE: '--mdc-ripple-fg-size',
+  VAR_LEFT: '--mdc-ripple-left',
+  VAR_TOP: '--mdc-ripple-top',
+  VAR_FG_SCALE: '--mdc-ripple-fg-scale',
+  VAR_FG_TRANSLATE_START: '--mdc-ripple-fg-translate-start',
+  VAR_FG_TRANSLATE_END: '--mdc-ripple-fg-translate-end'
+};
+
+var numbers = {
+  PADDING: 10,
+  INITIAL_ORIGIN_SCALE: 0.6,
+  DEACTIVATION_TIMEOUT_MS: 300,
+  FG_DEACTIVATION_MS: 83
+};
+
+/***/ }),
+
+/***/ 8:
+/***/ (function(module, __webpack_exports__, __webpack_require__) {
+
+"use strict";
+/* harmony import */ var __WEBPACK_IMPORTED_MODULE_0__material_base_foundation__ = __webpack_require__(0);
+/* harmony import */ var __WEBPACK_IMPORTED_MODULE_1__adapter__ = __webpack_require__(4);
+/* harmony import */ var __WEBPACK_IMPORTED_MODULE_2__constants__ = __webpack_require__(7);
+/* harmony import */ var __WEBPACK_IMPORTED_MODULE_3__util__ = __webpack_require__(5);
+var _extends = Object.assign || function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; };
+
+var _createClass = function () { function defineProperties(target, props) { for (var i = 0; i < props.length; i++) { var descriptor = props[i]; descriptor.enumerable = descriptor.enumerable || false; descriptor.configurable = true; if ("value" in descriptor) descriptor.writable = true; Object.defineProperty(target, descriptor.key, descriptor); } } return function (Constructor, protoProps, staticProps) { if (protoProps) defineProperties(Constructor.prototype, protoProps); if (staticProps) defineProperties(Constructor, staticProps); return Constructor; }; }();
+
+function _classCallCheck(instance, Constructor) { if (!(instance instanceof Constructor)) { throw new TypeError("Cannot call a class as a function"); } }
+
+function _possibleConstructorReturn(self, call) { if (!self) { throw new ReferenceError("this hasn't been initialised - super() hasn't been called"); } return call && (typeof call === "object" || typeof call === "function") ? call : self; }
+
+function _inherits(subClass, superClass) { if (typeof superClass !== "function" && superClass !== null) { throw new TypeError("Super expression must either be null or a function, not " + typeof superClass); } subClass.prototype = Object.create(superClass && superClass.prototype, { constructor: { value: subClass, enumerable: false, writable: true, configurable: true } }); if (superClass) Object.setPrototypeOf ? Object.setPrototypeOf(subClass, superClass) : subClass.__proto__ = superClass; }
+
+/**
+ * Copyright 2016 Google Inc. All Rights Reserved.
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *      http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+
+
+
+
+
+
+/**
+ * @typedef {!{
+ *   isActivated: (boolean|undefined),
+ *   hasDeactivationUXRun: (boolean|undefined),
+ *   wasActivatedByPointer: (boolean|undefined),
+ *   wasElementMadeActive: (boolean|undefined),
+ *   activationStartTime: (number|undefined),
+ *   activationEvent: Event,
+ *   isProgrammatic: (boolean|undefined)
+ * }}
+ */
+var ActivationStateType = void 0;
+
+/**
+ * @typedef {!{
+ *   activate: (string|undefined),
+ *   deactivate: (string|undefined),
+ *   focus: (string|undefined),
+ *   blur: (string|undefined)
+ * }}
+ */
+var ListenerInfoType = void 0;
+
+/**
+ * @typedef {!{
+ *   activate: function(!Event),
+ *   deactivate: function(!Event),
+ *   focus: function(),
+ *   blur: function()
+ * }}
+ */
+var ListenersType = void 0;
+
+/**
+ * @typedef {!{
+ *   x: number,
+ *   y: number
+ * }}
+ */
+var PointType = void 0;
+
+/**
+ * @enum {string}
+ */
+var DEACTIVATION_ACTIVATION_PAIRS = {
+  mouseup: 'mousedown',
+  pointerup: 'pointerdown',
+  touchend: 'touchstart',
+  keyup: 'keydown',
+  blur: 'focus'
+};
+
+/**
+ * @extends {MDCFoundation<!MDCRippleAdapter>}
+ */
+
+var MDCRippleFoundation = function (_MDCFoundation) {
+  _inherits(MDCRippleFoundation, _MDCFoundation);
+
+  _createClass(MDCRippleFoundation, [{
+    key: 'isSupported_',
+
+
+    /**
+     * We compute this property so that we are not querying information about the client
+     * until the point in time where the foundation requests it. This prevents scenarios where
+     * client-side feature-detection may happen too early, such as when components are rendered on the server
+     * and then initialized at mount time on the client.
+     * @return {boolean}
+     */
+    get: function get() {
+      return this.adapter_.browserSupportsCssVars();
+    }
+  }], [{
+    key: 'cssClasses',
+    get: function get() {
+      return __WEBPACK_IMPORTED_MODULE_2__constants__["a" /* cssClasses */];
+    }
+  }, {
+    key: 'strings',
+    get: function get() {
+      return __WEBPACK_IMPORTED_MODULE_2__constants__["b" /* strings */];
+    }
+  }, {
+    key: 'numbers',
+    get: function get() {
+      return __WEBPACK_IMPORTED_MODULE_2__constants__["c" /* numbers */];
+    }
+  }, {
+    key: 'defaultAdapter',
+    get: function get() {
+      return {
+        browserSupportsCssVars: function browserSupportsCssVars() /* boolean - cached */{},
+        isUnbounded: function isUnbounded() /* boolean */{},
+        isSurfaceActive: function isSurfaceActive() /* boolean */{},
+        isSurfaceDisabled: function isSurfaceDisabled() /* boolean */{},
+        addClass: function addClass() /* className: string */{},
+        removeClass: function removeClass() /* className: string */{},
+        registerInteractionHandler: function registerInteractionHandler() /* evtType: string, handler: EventListener */{},
+        deregisterInteractionHandler: function deregisterInteractionHandler() /* evtType: string, handler: EventListener */{},
+        registerResizeHandler: function registerResizeHandler() /* handler: EventListener */{},
+        deregisterResizeHandler: function deregisterResizeHandler() /* handler: EventListener */{},
+        updateCssVariable: function updateCssVariable() /* varName: string, value: string */{},
+        computeBoundingRect: function computeBoundingRect() /* ClientRect */{},
+        getWindowPageOffset: function getWindowPageOffset() /* {x: number, y: number} */{}
+      };
+    }
+  }]);
+
+  function MDCRippleFoundation(adapter) {
+    _classCallCheck(this, MDCRippleFoundation);
+
+    /** @private {number} */
+    var _this = _possibleConstructorReturn(this, (MDCRippleFoundation.__proto__ || Object.getPrototypeOf(MDCRippleFoundation)).call(this, _extends(MDCRippleFoundation.defaultAdapter, adapter)));
+
+    _this.layoutFrame_ = 0;
+
+    /** @private {!ClientRect} */
+    _this.frame_ = /** @type {!ClientRect} */{ width: 0, height: 0 };
+
+    /** @private {!ActivationStateType} */
+    _this.activationState_ = _this.defaultActivationState_();
+
+    /** @private {number} */
+    _this.xfDuration_ = 0;
+
+    /** @private {number} */
+    _this.initialSize_ = 0;
+
+    /** @private {number} */
+    _this.maxRadius_ = 0;
+
+    /** @private {!Array<{ListenerInfoType}>} */
+    _this.listenerInfos_ = [{ activate: 'touchstart', deactivate: 'touchend' }, { activate: 'pointerdown', deactivate: 'pointerup' }, { activate: 'mousedown', deactivate: 'mouseup' }, { activate: 'keydown', deactivate: 'keyup' }, { focus: 'focus', blur: 'blur' }];
+
+    /** @private {!ListenersType} */
+    _this.listeners_ = {
+      activate: function activate(e) {
+        return _this.activate_(e);
+      },
+      deactivate: function deactivate(e) {
+        return _this.deactivate_(e);
+      },
+      focus: function focus() {
+        return requestAnimationFrame(function () {
+          return _this.adapter_.addClass(MDCRippleFoundation.cssClasses.BG_FOCUSED);
+        });
+      },
+      blur: function blur() {
+        return requestAnimationFrame(function () {
+          return _this.adapter_.removeClass(MDCRippleFoundation.cssClasses.BG_FOCUSED);
+        });
+      }
+    };
+
+    /** @private {!Function} */
+    _this.resizeHandler_ = function () {
+      return _this.layout();
+    };
+
+    /** @private {!{left: number, top:number}} */
+    _this.unboundedCoords_ = {
+      left: 0,
+      top: 0
+    };
+
+    /** @private {number} */
+    _this.fgScale_ = 0;
+
+    /** @private {number} */
+    _this.activationTimer_ = 0;
+
+    /** @private {number} */
+    _this.fgDeactivationRemovalTimer_ = 0;
+
+    /** @private {boolean} */
+    _this.activationAnimationHasEnded_ = false;
+
+    /** @private {!Function} */
+    _this.activationTimerCallback_ = function () {
+      _this.activationAnimationHasEnded_ = true;
+      _this.runDeactivationUXLogicIfReady_();
+    };
+    return _this;
+  }
+
+  /**
+   * @return {!ActivationStateType}
+   */
+
+
+  _createClass(MDCRippleFoundation, [{
+    key: 'defaultActivationState_',
+    value: function defaultActivationState_() {
+      return {
+        isActivated: false,
+        hasDeactivationUXRun: false,
+        wasActivatedByPointer: false,
+        wasElementMadeActive: false,
+        activationStartTime: 0,
+        activationEvent: null,
+        isProgrammatic: false
+      };
+    }
+  }, {
+    key: 'init',
+    value: function init() {
+      var _this2 = this;
+
+      if (!this.isSupported_) {
+        return;
+      }
+      this.addEventListeners_();
+
+      var _MDCRippleFoundation$ = MDCRippleFoundation.cssClasses,
+          ROOT = _MDCRippleFoundation$.ROOT,
+          UNBOUNDED = _MDCRippleFoundation$.UNBOUNDED;
+
+      requestAnimationFrame(function () {
+        _this2.adapter_.addClass(ROOT);
+        if (_this2.adapter_.isUnbounded()) {
+          _this2.adapter_.addClass(UNBOUNDED);
+        }
+        _this2.layoutInternal_();
+      });
+    }
+
+    /** @private */
+
+  }, {
+    key: 'addEventListeners_',
+    value: function addEventListeners_() {
+      var _this3 = this;
+
+      this.listenerInfos_.forEach(function (info) {
+        Object.keys(info).forEach(function (k) {
+          _this3.adapter_.registerInteractionHandler(info[k], _this3.listeners_[k]);
+        });
+      });
+      this.adapter_.registerResizeHandler(this.resizeHandler_);
+    }
+
+    /**
+     * @param {Event} e
+     * @private
+     */
+
+  }, {
+    key: 'activate_',
+    value: function activate_(e) {
+      var _this4 = this;
+
+      if (this.adapter_.isSurfaceDisabled()) {
+        return;
+      }
+
+      var activationState = this.activationState_;
+
+      if (activationState.isActivated) {
+        return;
+      }
+
+      activationState.isActivated = true;
+      activationState.isProgrammatic = e === null;
+      activationState.activationEvent = e;
+      activationState.wasActivatedByPointer = activationState.isProgrammatic ? false : e.type === 'mousedown' || e.type === 'touchstart' || e.type === 'pointerdown';
+      activationState.activationStartTime = Date.now();
+
+      requestAnimationFrame(function () {
+        // This needs to be wrapped in an rAF call b/c web browsers
+        // report active states inconsistently when they're called within
+        // event handling code:
+        // - https://bugs.chromium.org/p/chromium/issues/detail?id=635971
+        // - https://bugzilla.mozilla.org/show_bug.cgi?id=1293741
+        activationState.wasElementMadeActive = e && e.type === 'keydown' ? _this4.adapter_.isSurfaceActive() : true;
+        if (activationState.wasElementMadeActive) {
+          _this4.animateActivation_();
+        } else {
+          // Reset activation state immediately if element was not made active.
+          _this4.activationState_ = _this4.defaultActivationState_();
+        }
+      });
+    }
+  }, {
+    key: 'activate',
+    value: function activate() {
+      this.activate_(null);
+    }
+
+    /** @private */
+
+  }, {
+    key: 'animateActivation_',
+    value: function animateActivation_() {
+      var _this5 = this;
+
+      var _MDCRippleFoundation$2 = MDCRippleFoundation.strings,
+          VAR_FG_TRANSLATE_START = _MDCRippleFoundation$2.VAR_FG_TRANSLATE_START,
+          VAR_FG_TRANSLATE_END = _MDCRippleFoundation$2.VAR_FG_TRANSLATE_END;
+      var _MDCRippleFoundation$3 = MDCRippleFoundation.cssClasses,
+          BG_ACTIVE_FILL = _MDCRippleFoundation$3.BG_ACTIVE_FILL,
+          FG_DEACTIVATION = _MDCRippleFoundation$3.FG_DEACTIVATION,
+          FG_ACTIVATION = _MDCRippleFoundation$3.FG_ACTIVATION;
+      var DEACTIVATION_TIMEOUT_MS = MDCRippleFoundation.numbers.DEACTIVATION_TIMEOUT_MS;
+
+
+      var translateStart = '';
+      var translateEnd = '';
+
+      if (!this.adapter_.isUnbounded()) {
+        var _getFgTranslationCoor = this.getFgTranslationCoordinates_(),
+            startPoint = _getFgTranslationCoor.startPoint,
+            endPoint = _getFgTranslationCoor.endPoint;
+
+        translateStart = startPoint.x + 'px, ' + startPoint.y + 'px';
+        translateEnd = endPoint.x + 'px, ' + endPoint.y + 'px';
+      }
+
+      this.adapter_.updateCssVariable(VAR_FG_TRANSLATE_START, translateStart);
+      this.adapter_.updateCssVariable(VAR_FG_TRANSLATE_END, translateEnd);
+      // Cancel any ongoing activation/deactivation animations
+      clearTimeout(this.activationTimer_);
+      clearTimeout(this.fgDeactivationRemovalTimer_);
+      this.rmBoundedActivationClasses_();
+      this.adapter_.removeClass(FG_DEACTIVATION);
+
+      // Force layout in order to re-trigger the animation.
+      this.adapter_.computeBoundingRect();
+      this.adapter_.addClass(BG_ACTIVE_FILL);
+      this.adapter_.addClass(FG_ACTIVATION);
+      this.activationTimer_ = setTimeout(function () {
+        return _this5.activationTimerCallback_();
+      }, DEACTIVATION_TIMEOUT_MS);
+    }
+
+    /**
+     * @private
+     * @return {{startPoint: PointType, endPoint: PointType}}
+     */
+
+  }, {
+    key: 'getFgTranslationCoordinates_',
+    value: function getFgTranslationCoordinates_() {
+      var activationState = this.activationState_;
+      var activationEvent = activationState.activationEvent,
+          wasActivatedByPointer = activationState.wasActivatedByPointer;
+
+
+      var startPoint = void 0;
+      if (wasActivatedByPointer) {
+        startPoint = __webpack_require__.i(__WEBPACK_IMPORTED_MODULE_3__util__["getNormalizedEventCoords"])(
+        /** @type {!Event} */activationEvent, this.adapter_.getWindowPageOffset(), this.adapter_.computeBoundingRect());
+      } else {
+        startPoint = {
+          x: this.frame_.width / 2,
+          y: this.frame_.height / 2
+        };
+      }
+      // Center the element around the start point.
+      startPoint = {
+        x: startPoint.x - this.initialSize_ / 2,
+        y: startPoint.y - this.initialSize_ / 2
+      };
+
+      var endPoint = {
+        x: this.frame_.width / 2 - this.initialSize_ / 2,
+        y: this.frame_.height / 2 - this.initialSize_ / 2
+      };
+
+      return { startPoint: startPoint, endPoint: endPoint };
+    }
+
+    /** @private */
+
+  }, {
+    key: 'runDeactivationUXLogicIfReady_',
+    value: function runDeactivationUXLogicIfReady_() {
+      var _this6 = this;
+
+      var FG_DEACTIVATION = MDCRippleFoundation.cssClasses.FG_DEACTIVATION;
+      var _activationState_ = this.activationState_,
+          hasDeactivationUXRun = _activationState_.hasDeactivationUXRun,
+          isActivated = _activationState_.isActivated;
+
+      var activationHasEnded = hasDeactivationUXRun || !isActivated;
+      if (activationHasEnded && this.activationAnimationHasEnded_) {
+        this.rmBoundedActivationClasses_();
+        this.adapter_.addClass(FG_DEACTIVATION);
+        this.fgDeactivationRemovalTimer_ = setTimeout(function () {
+          _this6.adapter_.removeClass(FG_DEACTIVATION);
+        }, __WEBPACK_IMPORTED_MODULE_2__constants__["c" /* numbers */].FG_DEACTIVATION_MS);
+      }
+    }
+
+    /** @private */
+
+  }, {
+    key: 'rmBoundedActivationClasses_',
+    value: function rmBoundedActivationClasses_() {
+      var _MDCRippleFoundation$4 = MDCRippleFoundation.cssClasses,
+          BG_ACTIVE_FILL = _MDCRippleFoundation$4.BG_ACTIVE_FILL,
+          FG_ACTIVATION = _MDCRippleFoundation$4.FG_ACTIVATION;
+
+      this.adapter_.removeClass(BG_ACTIVE_FILL);
+      this.adapter_.removeClass(FG_ACTIVATION);
+      this.activationAnimationHasEnded_ = false;
+      this.adapter_.computeBoundingRect();
+    }
+
+    /**
+     * @param {Event} e
+     * @private
+     */
+
+  }, {
+    key: 'deactivate_',
+    value: function deactivate_(e) {
+      var _this7 = this;
+
+      var activationState = this.activationState_;
+      // This can happen in scenarios such as when you have a keyup event that blurs the element.
+
+      if (!activationState.isActivated) {
+        return;
+      }
+      // Programmatic deactivation.
+      if (activationState.isProgrammatic) {
+        var evtObject = null;
+        var _state = /** @type {!ActivationStateType} */_extends({}, activationState);
+        requestAnimationFrame(function () {
+          return _this7.animateDeactivation_(evtObject, _state);
+        });
+        this.activationState_ = this.defaultActivationState_();
+        return;
+      }
+
+      var actualActivationType = DEACTIVATION_ACTIVATION_PAIRS[e.type];
+      var expectedActivationType = activationState.activationEvent.type;
+      // NOTE: Pointer events are tricky - https://patrickhlauke.github.io/touch/tests/results/
+      // Essentially, what we need to do here is decouple the deactivation UX from the actual
+      // deactivation state itself. This way, touch/pointer events in sequence do not trample one
+      // another.
+      var needsDeactivationUX = actualActivationType === expectedActivationType;
+      var needsActualDeactivation = needsDeactivationUX;
+      if (activationState.wasActivatedByPointer) {
+        needsActualDeactivation = e.type === 'mouseup';
+      }
+
+      var state = /** @type {!ActivationStateType} */_extends({}, activationState);
+      requestAnimationFrame(function () {
+        if (needsDeactivationUX) {
+          _this7.activationState_.hasDeactivationUXRun = true;
+          _this7.animateDeactivation_(e, state);
+        }
+
+        if (needsActualDeactivation) {
+          _this7.activationState_ = _this7.defaultActivationState_();
+        }
+      });
+    }
+  }, {
+    key: 'deactivate',
+    value: function deactivate() {
+      this.deactivate_(null);
+    }
+
+    /**
+     * @param {Event} e
+     * @param {!ActivationStateType} options
+     * @private
+     */
+
+  }, {
+    key: 'animateDeactivation_',
+    value: function animateDeactivation_(e, _ref) {
+      var wasActivatedByPointer = _ref.wasActivatedByPointer,
+          wasElementMadeActive = _ref.wasElementMadeActive;
+      var BG_FOCUSED = MDCRippleFoundation.cssClasses.BG_FOCUSED;
+
+      if (wasActivatedByPointer || wasElementMadeActive) {
+        // Remove class left over by element being focused
+        this.adapter_.removeClass(BG_FOCUSED);
+        this.runDeactivationUXLogicIfReady_();
+      }
+    }
+  }, {
+    key: 'destroy',
+    value: function destroy() {
+      var _this8 = this;
+
+      if (!this.isSupported_) {
+        return;
+      }
+      this.removeEventListeners_();
+
+      var _MDCRippleFoundation$5 = MDCRippleFoundation.cssClasses,
+          ROOT = _MDCRippleFoundation$5.ROOT,
+          UNBOUNDED = _MDCRippleFoundation$5.UNBOUNDED;
+
+      requestAnimationFrame(function () {
+        _this8.adapter_.removeClass(ROOT);
+        _this8.adapter_.removeClass(UNBOUNDED);
+        _this8.removeCssVars_();
+      });
+    }
+
+    /** @private */
+
+  }, {
+    key: 'removeEventListeners_',
+    value: function removeEventListeners_() {
+      var _this9 = this;
+
+      this.listenerInfos_.forEach(function (info) {
+        Object.keys(info).forEach(function (k) {
+          _this9.adapter_.deregisterInteractionHandler(info[k], _this9.listeners_[k]);
+        });
+      });
+      this.adapter_.deregisterResizeHandler(this.resizeHandler_);
+    }
+
+    /** @private */
+
+  }, {
+    key: 'removeCssVars_',
+    value: function removeCssVars_() {
+      var _this10 = this;
+
+      var strings = MDCRippleFoundation.strings;
+
+      Object.keys(strings).forEach(function (k) {
+        if (k.indexOf('VAR_') === 0) {
+          _this10.adapter_.updateCssVariable(strings[k], null);
+        }
+      });
+    }
+  }, {
+    key: 'layout',
+    value: function layout() {
+      var _this11 = this;
+
+      if (this.layoutFrame_) {
+        cancelAnimationFrame(this.layoutFrame_);
+      }
+      this.layoutFrame_ = requestAnimationFrame(function () {
+        _this11.layoutInternal_();
+        _this11.layoutFrame_ = 0;
+      });
+    }
+
+    /** @private */
+
+  }, {
+    key: 'layoutInternal_',
+    value: function layoutInternal_() {
+      this.frame_ = this.adapter_.computeBoundingRect();
+
+      var maxDim = Math.max(this.frame_.height, this.frame_.width);
+      var surfaceDiameter = Math.sqrt(Math.pow(this.frame_.width, 2) + Math.pow(this.frame_.height, 2));
+
+      // 60% of the largest dimension of the surface
+      this.initialSize_ = maxDim * MDCRippleFoundation.numbers.INITIAL_ORIGIN_SCALE;
+
+      // Diameter of the surface + 10px
+      this.maxRadius_ = surfaceDiameter + MDCRippleFoundation.numbers.PADDING;
+      this.fgScale_ = this.maxRadius_ / this.initialSize_;
+      this.xfDuration_ = 1000 * Math.sqrt(this.maxRadius_ / 1024);
+      this.updateLayoutCssVars_();
+    }
+
+    /** @private */
+
+  }, {
+    key: 'updateLayoutCssVars_',
+    value: function updateLayoutCssVars_() {
+      var _MDCRippleFoundation$6 = MDCRippleFoundation.strings,
+          VAR_SURFACE_WIDTH = _MDCRippleFoundation$6.VAR_SURFACE_WIDTH,
+          VAR_SURFACE_HEIGHT = _MDCRippleFoundation$6.VAR_SURFACE_HEIGHT,
+          VAR_FG_SIZE = _MDCRippleFoundation$6.VAR_FG_SIZE,
+          VAR_LEFT = _MDCRippleFoundation$6.VAR_LEFT,
+          VAR_TOP = _MDCRippleFoundation$6.VAR_TOP,
+          VAR_FG_SCALE = _MDCRippleFoundation$6.VAR_FG_SCALE;
+
+
+      this.adapter_.updateCssVariable(VAR_SURFACE_WIDTH, this.frame_.width + 'px');
+      this.adapter_.updateCssVariable(VAR_SURFACE_HEIGHT, this.frame_.height + 'px');
+      this.adapter_.updateCssVariable(VAR_FG_SIZE, this.initialSize_ + 'px');
+      this.adapter_.updateCssVariable(VAR_FG_SCALE, this.fgScale_);
+
+      if (this.adapter_.isUnbounded()) {
+        this.unboundedCoords_ = {
+          left: Math.round(this.frame_.width / 2 - this.initialSize_ / 2),
+          top: Math.round(this.frame_.height / 2 - this.initialSize_ / 2)
+        };
+
+        this.adapter_.updateCssVariable(VAR_LEFT, this.unboundedCoords_.left + 'px');
+        this.adapter_.updateCssVariable(VAR_TOP, this.unboundedCoords_.top + 'px');
+      }
+    }
+  }]);
+
+  return MDCRippleFoundation;
+}(__WEBPACK_IMPORTED_MODULE_0__material_base_foundation__["a" /* default */]);
+
+/* harmony default export */ __webpack_exports__["a"] = (MDCRippleFoundation);
+
+/***/ }),
+
+/***/ 89:
+/***/ (function(module, exports, __webpack_require__) {
+
+module.exports = __webpack_require__(29);
+
+
+/***/ })
+
+/******/ });
+});

+ 508 - 0
support/client/lib/vwf/view/lib/mdc/dist/mdc.layout-grid.css

@@ -0,0 +1,508 @@
+/*!
+ Material Components for the web
+ Copyright (c) 2017 Google Inc.
+ License: Apache-2.0
+*/
+:root {
+  --mdc-layout-grid-margin-desktop: 24px;
+  --mdc-layout-grid-gutter-desktop: 24px;
+  --mdc-layout-grid-column-width-desktop: 72px;
+  --mdc-layout-grid-margin-tablet: 16px;
+  --mdc-layout-grid-gutter-tablet: 16px;
+  --mdc-layout-grid-column-width-tablet: 72px;
+  --mdc-layout-grid-margin-phone: 16px;
+  --mdc-layout-grid-gutter-phone: 16px;
+  --mdc-layout-grid-column-width-phone: 72px; }
+
+@media (min-width: 840px) {
+  .mdc-layout-grid {
+    -webkit-box-sizing: border-box;
+            box-sizing: border-box;
+    margin: 0 auto;
+    padding: 24px;
+    padding: var(--mdc-layout-grid-margin-desktop, 24px); } }
+
+@media (min-width: 480px) and (max-width: 839px) {
+  .mdc-layout-grid {
+    -webkit-box-sizing: border-box;
+            box-sizing: border-box;
+    margin: 0 auto;
+    padding: 16px;
+    padding: var(--mdc-layout-grid-margin-tablet, 16px); } }
+
+@media (max-width: 479px) {
+  .mdc-layout-grid {
+    -webkit-box-sizing: border-box;
+            box-sizing: border-box;
+    margin: 0 auto;
+    padding: 16px;
+    padding: var(--mdc-layout-grid-margin-phone, 16px); } }
+
+@media (min-width: 840px) {
+  .mdc-layout-grid__inner {
+    display: -webkit-box;
+    display: -ms-flexbox;
+    display: flex;
+    -webkit-box-orient: horizontal;
+    -webkit-box-direction: normal;
+        -ms-flex-flow: row wrap;
+            flex-flow: row wrap;
+    -webkit-box-align: stretch;
+        -ms-flex-align: stretch;
+            align-items: stretch;
+    margin: -12px;
+    margin: calc(var(--mdc-layout-grid-gutter-desktop, 24px) / 2 * -1); }
+    @supports (display: grid) {
+      .mdc-layout-grid__inner {
+        display: grid;
+        grid-gap: 24px;
+        grid-gap: var(--mdc-layout-grid-gutter-desktop, 24px);
+        margin: 0;
+        grid-template-columns: repeat(12, minmax(0, 1fr)); } } }
+
+@media (min-width: 480px) and (max-width: 839px) {
+  .mdc-layout-grid__inner {
+    display: -webkit-box;
+    display: -ms-flexbox;
+    display: flex;
+    -webkit-box-orient: horizontal;
+    -webkit-box-direction: normal;
+        -ms-flex-flow: row wrap;
+            flex-flow: row wrap;
+    -webkit-box-align: stretch;
+        -ms-flex-align: stretch;
+            align-items: stretch;
+    margin: -8px;
+    margin: calc(var(--mdc-layout-grid-gutter-tablet, 16px) / 2 * -1); }
+    @supports (display: grid) {
+      .mdc-layout-grid__inner {
+        display: grid;
+        grid-gap: 16px;
+        grid-gap: var(--mdc-layout-grid-gutter-tablet, 16px);
+        margin: 0;
+        grid-template-columns: repeat(8, minmax(0, 1fr)); } } }
+
+@media (max-width: 479px) {
+  .mdc-layout-grid__inner {
+    display: -webkit-box;
+    display: -ms-flexbox;
+    display: flex;
+    -webkit-box-orient: horizontal;
+    -webkit-box-direction: normal;
+        -ms-flex-flow: row wrap;
+            flex-flow: row wrap;
+    -webkit-box-align: stretch;
+        -ms-flex-align: stretch;
+            align-items: stretch;
+    margin: -8px;
+    margin: calc(var(--mdc-layout-grid-gutter-phone, 16px) / 2 * -1); }
+    @supports (display: grid) {
+      .mdc-layout-grid__inner {
+        display: grid;
+        grid-gap: 16px;
+        grid-gap: var(--mdc-layout-grid-gutter-phone, 16px);
+        margin: 0;
+        grid-template-columns: repeat(4, minmax(0, 1fr)); } } }
+
+@media (min-width: 840px) {
+  .mdc-layout-grid__cell {
+    -webkit-box-sizing: border-box;
+            box-sizing: border-box;
+    margin: 12px;
+    margin: calc(var(--mdc-layout-grid-gutter-desktop, 24px) / 2);
+    width: calc(33.33333% - 24px);
+    width: calc(33.33333% - var(--mdc-layout-grid-gutter-desktop, 24px)); }
+    @supports (display: grid) {
+      .mdc-layout-grid__cell {
+        margin: 0; } }
+    @supports (display: grid) {
+      .mdc-layout-grid__cell {
+        width: auto;
+        grid-column-end: span 4; } }
+    .mdc-layout-grid__cell--span-1, .mdc-layout-grid__cell--span-1-desktop {
+      width: calc(8.33333% - 24px);
+      width: calc(8.33333% - var(--mdc-layout-grid-gutter-desktop, 24px)); }
+      @supports (display: grid) {
+        .mdc-layout-grid__cell--span-1, .mdc-layout-grid__cell--span-1-desktop {
+          width: auto;
+          grid-column-end: span 1; } }
+    .mdc-layout-grid__cell--span-2, .mdc-layout-grid__cell--span-2-desktop {
+      width: calc(16.66667% - 24px);
+      width: calc(16.66667% - var(--mdc-layout-grid-gutter-desktop, 24px)); }
+      @supports (display: grid) {
+        .mdc-layout-grid__cell--span-2, .mdc-layout-grid__cell--span-2-desktop {
+          width: auto;
+          grid-column-end: span 2; } }
+    .mdc-layout-grid__cell--span-3, .mdc-layout-grid__cell--span-3-desktop {
+      width: calc(25% - 24px);
+      width: calc(25% - var(--mdc-layout-grid-gutter-desktop, 24px)); }
+      @supports (display: grid) {
+        .mdc-layout-grid__cell--span-3, .mdc-layout-grid__cell--span-3-desktop {
+          width: auto;
+          grid-column-end: span 3; } }
+    .mdc-layout-grid__cell--span-4, .mdc-layout-grid__cell--span-4-desktop {
+      width: calc(33.33333% - 24px);
+      width: calc(33.33333% - var(--mdc-layout-grid-gutter-desktop, 24px)); }
+      @supports (display: grid) {
+        .mdc-layout-grid__cell--span-4, .mdc-layout-grid__cell--span-4-desktop {
+          width: auto;
+          grid-column-end: span 4; } }
+    .mdc-layout-grid__cell--span-5, .mdc-layout-grid__cell--span-5-desktop {
+      width: calc(41.66667% - 24px);
+      width: calc(41.66667% - var(--mdc-layout-grid-gutter-desktop, 24px)); }
+      @supports (display: grid) {
+        .mdc-layout-grid__cell--span-5, .mdc-layout-grid__cell--span-5-desktop {
+          width: auto;
+          grid-column-end: span 5; } }
+    .mdc-layout-grid__cell--span-6, .mdc-layout-grid__cell--span-6-desktop {
+      width: calc(50% - 24px);
+      width: calc(50% - var(--mdc-layout-grid-gutter-desktop, 24px)); }
+      @supports (display: grid) {
+        .mdc-layout-grid__cell--span-6, .mdc-layout-grid__cell--span-6-desktop {
+          width: auto;
+          grid-column-end: span 6; } }
+    .mdc-layout-grid__cell--span-7, .mdc-layout-grid__cell--span-7-desktop {
+      width: calc(58.33333% - 24px);
+      width: calc(58.33333% - var(--mdc-layout-grid-gutter-desktop, 24px)); }
+      @supports (display: grid) {
+        .mdc-layout-grid__cell--span-7, .mdc-layout-grid__cell--span-7-desktop {
+          width: auto;
+          grid-column-end: span 7; } }
+    .mdc-layout-grid__cell--span-8, .mdc-layout-grid__cell--span-8-desktop {
+      width: calc(66.66667% - 24px);
+      width: calc(66.66667% - var(--mdc-layout-grid-gutter-desktop, 24px)); }
+      @supports (display: grid) {
+        .mdc-layout-grid__cell--span-8, .mdc-layout-grid__cell--span-8-desktop {
+          width: auto;
+          grid-column-end: span 8; } }
+    .mdc-layout-grid__cell--span-9, .mdc-layout-grid__cell--span-9-desktop {
+      width: calc(75% - 24px);
+      width: calc(75% - var(--mdc-layout-grid-gutter-desktop, 24px)); }
+      @supports (display: grid) {
+        .mdc-layout-grid__cell--span-9, .mdc-layout-grid__cell--span-9-desktop {
+          width: auto;
+          grid-column-end: span 9; } }
+    .mdc-layout-grid__cell--span-10, .mdc-layout-grid__cell--span-10-desktop {
+      width: calc(83.33333% - 24px);
+      width: calc(83.33333% - var(--mdc-layout-grid-gutter-desktop, 24px)); }
+      @supports (display: grid) {
+        .mdc-layout-grid__cell--span-10, .mdc-layout-grid__cell--span-10-desktop {
+          width: auto;
+          grid-column-end: span 10; } }
+    .mdc-layout-grid__cell--span-11, .mdc-layout-grid__cell--span-11-desktop {
+      width: calc(91.66667% - 24px);
+      width: calc(91.66667% - var(--mdc-layout-grid-gutter-desktop, 24px)); }
+      @supports (display: grid) {
+        .mdc-layout-grid__cell--span-11, .mdc-layout-grid__cell--span-11-desktop {
+          width: auto;
+          grid-column-end: span 11; } }
+    .mdc-layout-grid__cell--span-12, .mdc-layout-grid__cell--span-12-desktop {
+      width: calc(100% - 24px);
+      width: calc(100% - var(--mdc-layout-grid-gutter-desktop, 24px)); }
+      @supports (display: grid) {
+        .mdc-layout-grid__cell--span-12, .mdc-layout-grid__cell--span-12-desktop {
+          width: auto;
+          grid-column-end: span 12; } } }
+
+@media (min-width: 480px) and (max-width: 839px) {
+  .mdc-layout-grid__cell {
+    -webkit-box-sizing: border-box;
+            box-sizing: border-box;
+    margin: 8px;
+    margin: calc(var(--mdc-layout-grid-gutter-tablet, 16px) / 2);
+    width: calc(50% - 16px);
+    width: calc(50% - var(--mdc-layout-grid-gutter-tablet, 16px)); }
+    @supports (display: grid) {
+      .mdc-layout-grid__cell {
+        margin: 0; } }
+    @supports (display: grid) {
+      .mdc-layout-grid__cell {
+        width: auto;
+        grid-column-end: span 4; } }
+    .mdc-layout-grid__cell--span-1, .mdc-layout-grid__cell--span-1-tablet {
+      width: calc(12.5% - 16px);
+      width: calc(12.5% - var(--mdc-layout-grid-gutter-tablet, 16px)); }
+      @supports (display: grid) {
+        .mdc-layout-grid__cell--span-1, .mdc-layout-grid__cell--span-1-tablet {
+          width: auto;
+          grid-column-end: span 1; } }
+    .mdc-layout-grid__cell--span-2, .mdc-layout-grid__cell--span-2-tablet {
+      width: calc(25% - 16px);
+      width: calc(25% - var(--mdc-layout-grid-gutter-tablet, 16px)); }
+      @supports (display: grid) {
+        .mdc-layout-grid__cell--span-2, .mdc-layout-grid__cell--span-2-tablet {
+          width: auto;
+          grid-column-end: span 2; } }
+    .mdc-layout-grid__cell--span-3, .mdc-layout-grid__cell--span-3-tablet {
+      width: calc(37.5% - 16px);
+      width: calc(37.5% - var(--mdc-layout-grid-gutter-tablet, 16px)); }
+      @supports (display: grid) {
+        .mdc-layout-grid__cell--span-3, .mdc-layout-grid__cell--span-3-tablet {
+          width: auto;
+          grid-column-end: span 3; } }
+    .mdc-layout-grid__cell--span-4, .mdc-layout-grid__cell--span-4-tablet {
+      width: calc(50% - 16px);
+      width: calc(50% - var(--mdc-layout-grid-gutter-tablet, 16px)); }
+      @supports (display: grid) {
+        .mdc-layout-grid__cell--span-4, .mdc-layout-grid__cell--span-4-tablet {
+          width: auto;
+          grid-column-end: span 4; } }
+    .mdc-layout-grid__cell--span-5, .mdc-layout-grid__cell--span-5-tablet {
+      width: calc(62.5% - 16px);
+      width: calc(62.5% - var(--mdc-layout-grid-gutter-tablet, 16px)); }
+      @supports (display: grid) {
+        .mdc-layout-grid__cell--span-5, .mdc-layout-grid__cell--span-5-tablet {
+          width: auto;
+          grid-column-end: span 5; } }
+    .mdc-layout-grid__cell--span-6, .mdc-layout-grid__cell--span-6-tablet {
+      width: calc(75% - 16px);
+      width: calc(75% - var(--mdc-layout-grid-gutter-tablet, 16px)); }
+      @supports (display: grid) {
+        .mdc-layout-grid__cell--span-6, .mdc-layout-grid__cell--span-6-tablet {
+          width: auto;
+          grid-column-end: span 6; } }
+    .mdc-layout-grid__cell--span-7, .mdc-layout-grid__cell--span-7-tablet {
+      width: calc(87.5% - 16px);
+      width: calc(87.5% - var(--mdc-layout-grid-gutter-tablet, 16px)); }
+      @supports (display: grid) {
+        .mdc-layout-grid__cell--span-7, .mdc-layout-grid__cell--span-7-tablet {
+          width: auto;
+          grid-column-end: span 7; } }
+    .mdc-layout-grid__cell--span-8, .mdc-layout-grid__cell--span-8-tablet {
+      width: calc(100% - 16px);
+      width: calc(100% - var(--mdc-layout-grid-gutter-tablet, 16px)); }
+      @supports (display: grid) {
+        .mdc-layout-grid__cell--span-8, .mdc-layout-grid__cell--span-8-tablet {
+          width: auto;
+          grid-column-end: span 8; } }
+    .mdc-layout-grid__cell--span-9, .mdc-layout-grid__cell--span-9-tablet {
+      width: calc(100% - 16px);
+      width: calc(100% - var(--mdc-layout-grid-gutter-tablet, 16px)); }
+      @supports (display: grid) {
+        .mdc-layout-grid__cell--span-9, .mdc-layout-grid__cell--span-9-tablet {
+          width: auto;
+          grid-column-end: span 8; } }
+    .mdc-layout-grid__cell--span-10, .mdc-layout-grid__cell--span-10-tablet {
+      width: calc(100% - 16px);
+      width: calc(100% - var(--mdc-layout-grid-gutter-tablet, 16px)); }
+      @supports (display: grid) {
+        .mdc-layout-grid__cell--span-10, .mdc-layout-grid__cell--span-10-tablet {
+          width: auto;
+          grid-column-end: span 8; } }
+    .mdc-layout-grid__cell--span-11, .mdc-layout-grid__cell--span-11-tablet {
+      width: calc(100% - 16px);
+      width: calc(100% - var(--mdc-layout-grid-gutter-tablet, 16px)); }
+      @supports (display: grid) {
+        .mdc-layout-grid__cell--span-11, .mdc-layout-grid__cell--span-11-tablet {
+          width: auto;
+          grid-column-end: span 8; } }
+    .mdc-layout-grid__cell--span-12, .mdc-layout-grid__cell--span-12-tablet {
+      width: calc(100% - 16px);
+      width: calc(100% - var(--mdc-layout-grid-gutter-tablet, 16px)); }
+      @supports (display: grid) {
+        .mdc-layout-grid__cell--span-12, .mdc-layout-grid__cell--span-12-tablet {
+          width: auto;
+          grid-column-end: span 8; } } }
+
+@media (max-width: 479px) {
+  .mdc-layout-grid__cell {
+    -webkit-box-sizing: border-box;
+            box-sizing: border-box;
+    margin: 8px;
+    margin: calc(var(--mdc-layout-grid-gutter-phone, 16px) / 2);
+    width: calc(100% - 16px);
+    width: calc(100% - var(--mdc-layout-grid-gutter-phone, 16px)); }
+    @supports (display: grid) {
+      .mdc-layout-grid__cell {
+        margin: 0; } }
+    @supports (display: grid) {
+      .mdc-layout-grid__cell {
+        width: auto;
+        grid-column-end: span 4; } }
+    .mdc-layout-grid__cell--span-1, .mdc-layout-grid__cell--span-1-phone {
+      width: calc(25% - 16px);
+      width: calc(25% - var(--mdc-layout-grid-gutter-phone, 16px)); }
+      @supports (display: grid) {
+        .mdc-layout-grid__cell--span-1, .mdc-layout-grid__cell--span-1-phone {
+          width: auto;
+          grid-column-end: span 1; } }
+    .mdc-layout-grid__cell--span-2, .mdc-layout-grid__cell--span-2-phone {
+      width: calc(50% - 16px);
+      width: calc(50% - var(--mdc-layout-grid-gutter-phone, 16px)); }
+      @supports (display: grid) {
+        .mdc-layout-grid__cell--span-2, .mdc-layout-grid__cell--span-2-phone {
+          width: auto;
+          grid-column-end: span 2; } }
+    .mdc-layout-grid__cell--span-3, .mdc-layout-grid__cell--span-3-phone {
+      width: calc(75% - 16px);
+      width: calc(75% - var(--mdc-layout-grid-gutter-phone, 16px)); }
+      @supports (display: grid) {
+        .mdc-layout-grid__cell--span-3, .mdc-layout-grid__cell--span-3-phone {
+          width: auto;
+          grid-column-end: span 3; } }
+    .mdc-layout-grid__cell--span-4, .mdc-layout-grid__cell--span-4-phone {
+      width: calc(100% - 16px);
+      width: calc(100% - var(--mdc-layout-grid-gutter-phone, 16px)); }
+      @supports (display: grid) {
+        .mdc-layout-grid__cell--span-4, .mdc-layout-grid__cell--span-4-phone {
+          width: auto;
+          grid-column-end: span 4; } }
+    .mdc-layout-grid__cell--span-5, .mdc-layout-grid__cell--span-5-phone {
+      width: calc(100% - 16px);
+      width: calc(100% - var(--mdc-layout-grid-gutter-phone, 16px)); }
+      @supports (display: grid) {
+        .mdc-layout-grid__cell--span-5, .mdc-layout-grid__cell--span-5-phone {
+          width: auto;
+          grid-column-end: span 4; } }
+    .mdc-layout-grid__cell--span-6, .mdc-layout-grid__cell--span-6-phone {
+      width: calc(100% - 16px);
+      width: calc(100% - var(--mdc-layout-grid-gutter-phone, 16px)); }
+      @supports (display: grid) {
+        .mdc-layout-grid__cell--span-6, .mdc-layout-grid__cell--span-6-phone {
+          width: auto;
+          grid-column-end: span 4; } }
+    .mdc-layout-grid__cell--span-7, .mdc-layout-grid__cell--span-7-phone {
+      width: calc(100% - 16px);
+      width: calc(100% - var(--mdc-layout-grid-gutter-phone, 16px)); }
+      @supports (display: grid) {
+        .mdc-layout-grid__cell--span-7, .mdc-layout-grid__cell--span-7-phone {
+          width: auto;
+          grid-column-end: span 4; } }
+    .mdc-layout-grid__cell--span-8, .mdc-layout-grid__cell--span-8-phone {
+      width: calc(100% - 16px);
+      width: calc(100% - var(--mdc-layout-grid-gutter-phone, 16px)); }
+      @supports (display: grid) {
+        .mdc-layout-grid__cell--span-8, .mdc-layout-grid__cell--span-8-phone {
+          width: auto;
+          grid-column-end: span 4; } }
+    .mdc-layout-grid__cell--span-9, .mdc-layout-grid__cell--span-9-phone {
+      width: calc(100% - 16px);
+      width: calc(100% - var(--mdc-layout-grid-gutter-phone, 16px)); }
+      @supports (display: grid) {
+        .mdc-layout-grid__cell--span-9, .mdc-layout-grid__cell--span-9-phone {
+          width: auto;
+          grid-column-end: span 4; } }
+    .mdc-layout-grid__cell--span-10, .mdc-layout-grid__cell--span-10-phone {
+      width: calc(100% - 16px);
+      width: calc(100% - var(--mdc-layout-grid-gutter-phone, 16px)); }
+      @supports (display: grid) {
+        .mdc-layout-grid__cell--span-10, .mdc-layout-grid__cell--span-10-phone {
+          width: auto;
+          grid-column-end: span 4; } }
+    .mdc-layout-grid__cell--span-11, .mdc-layout-grid__cell--span-11-phone {
+      width: calc(100% - 16px);
+      width: calc(100% - var(--mdc-layout-grid-gutter-phone, 16px)); }
+      @supports (display: grid) {
+        .mdc-layout-grid__cell--span-11, .mdc-layout-grid__cell--span-11-phone {
+          width: auto;
+          grid-column-end: span 4; } }
+    .mdc-layout-grid__cell--span-12, .mdc-layout-grid__cell--span-12-phone {
+      width: calc(100% - 16px);
+      width: calc(100% - var(--mdc-layout-grid-gutter-phone, 16px)); }
+      @supports (display: grid) {
+        .mdc-layout-grid__cell--span-12, .mdc-layout-grid__cell--span-12-phone {
+          width: auto;
+          grid-column-end: span 4; } } }
+
+.mdc-layout-grid__cell--order-1 {
+  -webkit-box-ordinal-group: 2;
+      -ms-flex-order: 1;
+          order: 1; }
+
+.mdc-layout-grid__cell--order-2 {
+  -webkit-box-ordinal-group: 3;
+      -ms-flex-order: 2;
+          order: 2; }
+
+.mdc-layout-grid__cell--order-3 {
+  -webkit-box-ordinal-group: 4;
+      -ms-flex-order: 3;
+          order: 3; }
+
+.mdc-layout-grid__cell--order-4 {
+  -webkit-box-ordinal-group: 5;
+      -ms-flex-order: 4;
+          order: 4; }
+
+.mdc-layout-grid__cell--order-5 {
+  -webkit-box-ordinal-group: 6;
+      -ms-flex-order: 5;
+          order: 5; }
+
+.mdc-layout-grid__cell--order-6 {
+  -webkit-box-ordinal-group: 7;
+      -ms-flex-order: 6;
+          order: 6; }
+
+.mdc-layout-grid__cell--order-7 {
+  -webkit-box-ordinal-group: 8;
+      -ms-flex-order: 7;
+          order: 7; }
+
+.mdc-layout-grid__cell--order-8 {
+  -webkit-box-ordinal-group: 9;
+      -ms-flex-order: 8;
+          order: 8; }
+
+.mdc-layout-grid__cell--order-9 {
+  -webkit-box-ordinal-group: 10;
+      -ms-flex-order: 9;
+          order: 9; }
+
+.mdc-layout-grid__cell--order-10 {
+  -webkit-box-ordinal-group: 11;
+      -ms-flex-order: 10;
+          order: 10; }
+
+.mdc-layout-grid__cell--order-11 {
+  -webkit-box-ordinal-group: 12;
+      -ms-flex-order: 11;
+          order: 11; }
+
+.mdc-layout-grid__cell--order-12 {
+  -webkit-box-ordinal-group: 13;
+      -ms-flex-order: 12;
+          order: 12; }
+
+.mdc-layout-grid__cell--align-top {
+  -ms-flex-item-align: start;
+      align-self: flex-start; }
+  @supports (display: grid) {
+    .mdc-layout-grid__cell--align-top {
+      -ms-flex-item-align: start;
+          align-self: start; } }
+
+.mdc-layout-grid__cell--align-middle {
+  -ms-flex-item-align: center;
+      align-self: center; }
+
+.mdc-layout-grid__cell--align-bottom {
+  -ms-flex-item-align: end;
+      align-self: flex-end; }
+  @supports (display: grid) {
+    .mdc-layout-grid__cell--align-bottom {
+      -ms-flex-item-align: end;
+          align-self: end; } }
+
+@media (min-width: 840px) {
+  .mdc-layout-grid--fixed-column-width {
+    width: 1176px;
+    width: calc( var(--mdc-layout-grid-column-width-desktop, 72px) * 12 + var(--mdc-layout-grid-gutter-desktop, 24px) * 11 + var(--mdc-layout-grid-margin-desktop, 24px) * 2); } }
+
+@media (min-width: 480px) and (max-width: 839px) {
+  .mdc-layout-grid--fixed-column-width {
+    width: 720px;
+    width: calc( var(--mdc-layout-grid-column-width-tablet, 72px) * 8 + var(--mdc-layout-grid-gutter-tablet, 16px) * 7 + var(--mdc-layout-grid-margin-tablet, 16px) * 2); } }
+
+@media (max-width: 479px) {
+  .mdc-layout-grid--fixed-column-width {
+    width: 368px;
+    width: calc( var(--mdc-layout-grid-column-width-phone, 72px) * 4 + var(--mdc-layout-grid-gutter-phone, 16px) * 3 + var(--mdc-layout-grid-margin-phone, 16px) * 2); } }
+
+.mdc-layout-grid--align-left {
+  margin-right: auto;
+  margin-left: 0; }
+
+.mdc-layout-grid--align-right {
+  margin-right: 0;
+  margin-left: auto; }

+ 83 - 0
support/client/lib/vwf/view/lib/mdc/dist/mdc.layout-grid.css-entry

@@ -0,0 +1,83 @@
+/*!
+ Material Components for the web
+ Copyright (c) 2017 Google Inc.
+ License: Apache-2.0
+*/
+/******/ (function(modules) { // webpackBootstrap
+/******/ 	// The module cache
+/******/ 	var installedModules = {};
+/******/
+/******/ 	// The require function
+/******/ 	function __webpack_require__(moduleId) {
+/******/
+/******/ 		// Check if module is in cache
+/******/ 		if(installedModules[moduleId]) {
+/******/ 			return installedModules[moduleId].exports;
+/******/ 		}
+/******/ 		// Create a new module (and put it into the cache)
+/******/ 		var module = installedModules[moduleId] = {
+/******/ 			i: moduleId,
+/******/ 			l: false,
+/******/ 			exports: {}
+/******/ 		};
+/******/
+/******/ 		// Execute the module function
+/******/ 		modules[moduleId].call(module.exports, module, module.exports, __webpack_require__);
+/******/
+/******/ 		// Flag the module as loaded
+/******/ 		module.l = true;
+/******/
+/******/ 		// Return the exports of the module
+/******/ 		return module.exports;
+/******/ 	}
+/******/
+/******/
+/******/ 	// expose the modules object (__webpack_modules__)
+/******/ 	__webpack_require__.m = modules;
+/******/
+/******/ 	// expose the module cache
+/******/ 	__webpack_require__.c = installedModules;
+/******/
+/******/ 	// identity function for calling harmony imports with the correct context
+/******/ 	__webpack_require__.i = function(value) { return value; };
+/******/
+/******/ 	// define getter function for harmony exports
+/******/ 	__webpack_require__.d = function(exports, name, getter) {
+/******/ 		if(!__webpack_require__.o(exports, name)) {
+/******/ 			Object.defineProperty(exports, name, {
+/******/ 				configurable: false,
+/******/ 				enumerable: true,
+/******/ 				get: getter
+/******/ 			});
+/******/ 		}
+/******/ 	};
+/******/
+/******/ 	// getDefaultExport function for compatibility with non-harmony modules
+/******/ 	__webpack_require__.n = function(module) {
+/******/ 		var getter = module && module.__esModule ?
+/******/ 			function getDefault() { return module['default']; } :
+/******/ 			function getModuleExports() { return module; };
+/******/ 		__webpack_require__.d(getter, 'a', getter);
+/******/ 		return getter;
+/******/ 	};
+/******/
+/******/ 	// Object.prototype.hasOwnProperty.call
+/******/ 	__webpack_require__.o = function(object, property) { return Object.prototype.hasOwnProperty.call(object, property); };
+/******/
+/******/ 	// __webpack_public_path__
+/******/ 	__webpack_require__.p = "/assets/";
+/******/
+/******/ 	// Load entry module and return exports
+/******/ 	return __webpack_require__(__webpack_require__.s = 12);
+/******/ })
+/************************************************************************/
+/******/ ({
+
+/***/ 12:
+/***/ (function(module, exports) {
+
+// removed by extract-text-webpack-plugin
+
+/***/ })
+
+/******/ });

+ 424 - 0
support/client/lib/vwf/view/lib/mdc/dist/mdc.linear-progress.css

@@ -0,0 +1,424 @@
+/*!
+ Material Components for the web
+ Copyright (c) 2017 Google Inc.
+ License: Apache-2.0
+*/
+/*
+  Precomputed linear color channel values, for use in contrast calculations.
+  See https://www.w3.org/TR/WCAG20-TECHS/G17.html#G17-tests
+
+  Algorithm, for c in 0 to 255:
+  f(c) {
+    c = c / 255;
+    return c < 0.03928 ? c / 12.92 : Math.pow((c + 0.055) / 1.055, 2.4);
+  }
+
+  This lookup table is needed since there is no `pow` in SASS.
+*/
+/**
+ * Calculate the luminance for a color.
+ * See https://www.w3.org/TR/WCAG20-TECHS/G17.html#G17-tests
+ */
+/**
+ * Calculate the contrast ratio between two colors.
+ * See https://www.w3.org/TR/WCAG20-TECHS/G17.html#G17-tests
+ */
+/**
+ * Determine whether to use dark or light text on top of given color.
+ * Returns "dark" for dark text and "light" for light text.
+ */
+/*
+  Main theme colors.
+  If you're a user customizing your color scheme in SASS, these are probably the only variables you need to change.
+*/
+/* Indigo 500 */
+/* Pink A200 */
+/* White */
+/* Which set of text colors to use for each main theme color (light or dark) */
+/* Text colors according to light vs dark and text type */
+/* Primary text colors for each of the theme colors */
+/**
+ * Applies the correct theme color style to the specified property.
+ * $property is typically color or background-color, but can be any CSS property that accepts color values.
+ * $style should be one of the map keys in $mdc-theme-property-values (_variables.scss).
+ */
+/**
+ * Creates a rule to be used in MDC-Web components for dark theming, and applies the provided contents.
+ * Should provide the $root-selector option if applied to anything other than the root selector.
+ * When used with a modifier class, provide a second argument of `true` for the $compound parameter
+ * to specify that this should be attached as a compound class.
+ *
+ * Usage example:
+ *
+ * ```scss
+ * .mdc-foo {
+ *   color: black;
+ *
+ *   @include mdc-theme-dark {
+ *     color: white;
+ *   }
+ *
+ *   &__bar {
+ *     background: black;
+ *
+ *     @include mdc-theme-dark(".mdc-foo") {
+ *       background: white;
+ *     }
+ *   }
+ * }
+ *
+ * .mdc-foo--disabled {
+ *   opacity: .38;
+ *
+ *   @include mdc-theme-dark(".mdc-foo", true) {
+ *     opacity: .5;
+ *   }
+ * }
+ * ```
+ */
+@-webkit-keyframes primary-indeterminate-translate {
+  0% {
+    -webkit-transform: translateX(0);
+            transform: translateX(0); }
+  20% {
+    -webkit-animation-timing-function: cubic-bezier(0.5, 0, 0.70173, 0.49582);
+            animation-timing-function: cubic-bezier(0.5, 0, 0.70173, 0.49582);
+    -webkit-transform: translateX(0);
+            transform: translateX(0); }
+  59.15% {
+    -webkit-animation-timing-function: cubic-bezier(0.30244, 0.38135, 0.55, 0.95635);
+            animation-timing-function: cubic-bezier(0.30244, 0.38135, 0.55, 0.95635);
+    -webkit-transform: translateX(83.67142%);
+            transform: translateX(83.67142%); }
+  100% {
+    -webkit-transform: translateX(200.61106%);
+            transform: translateX(200.61106%); } }
+@keyframes primary-indeterminate-translate {
+  0% {
+    -webkit-transform: translateX(0);
+            transform: translateX(0); }
+  20% {
+    -webkit-animation-timing-function: cubic-bezier(0.5, 0, 0.70173, 0.49582);
+            animation-timing-function: cubic-bezier(0.5, 0, 0.70173, 0.49582);
+    -webkit-transform: translateX(0);
+            transform: translateX(0); }
+  59.15% {
+    -webkit-animation-timing-function: cubic-bezier(0.30244, 0.38135, 0.55, 0.95635);
+            animation-timing-function: cubic-bezier(0.30244, 0.38135, 0.55, 0.95635);
+    -webkit-transform: translateX(83.67142%);
+            transform: translateX(83.67142%); }
+  100% {
+    -webkit-transform: translateX(200.61106%);
+            transform: translateX(200.61106%); } }
+
+@-webkit-keyframes primary-indeterminate-scale {
+  0% {
+    -webkit-transform: scaleX(0.08);
+            transform: scaleX(0.08); }
+  36.65% {
+    -webkit-animation-timing-function: cubic-bezier(0.33473, 0.12482, 0.78584, 1);
+            animation-timing-function: cubic-bezier(0.33473, 0.12482, 0.78584, 1);
+    -webkit-transform: scaleX(0.08);
+            transform: scaleX(0.08); }
+  69.15% {
+    -webkit-animation-timing-function: cubic-bezier(0.06, 0.11, 0.6, 1);
+            animation-timing-function: cubic-bezier(0.06, 0.11, 0.6, 1);
+    -webkit-transform: scaleX(0.66148);
+            transform: scaleX(0.66148); }
+  100% {
+    -webkit-transform: scaleX(0.08);
+            transform: scaleX(0.08); } }
+
+@keyframes primary-indeterminate-scale {
+  0% {
+    -webkit-transform: scaleX(0.08);
+            transform: scaleX(0.08); }
+  36.65% {
+    -webkit-animation-timing-function: cubic-bezier(0.33473, 0.12482, 0.78584, 1);
+            animation-timing-function: cubic-bezier(0.33473, 0.12482, 0.78584, 1);
+    -webkit-transform: scaleX(0.08);
+            transform: scaleX(0.08); }
+  69.15% {
+    -webkit-animation-timing-function: cubic-bezier(0.06, 0.11, 0.6, 1);
+            animation-timing-function: cubic-bezier(0.06, 0.11, 0.6, 1);
+    -webkit-transform: scaleX(0.66148);
+            transform: scaleX(0.66148); }
+  100% {
+    -webkit-transform: scaleX(0.08);
+            transform: scaleX(0.08); } }
+
+@-webkit-keyframes secondary-indeterminate-translate {
+  0% {
+    -webkit-animation-timing-function: cubic-bezier(0.15, 0, 0.51506, 0.40969);
+            animation-timing-function: cubic-bezier(0.15, 0, 0.51506, 0.40969);
+    -webkit-transform: translateX(0);
+            transform: translateX(0); }
+  25% {
+    -webkit-animation-timing-function: cubic-bezier(0.31033, 0.28406, 0.8, 0.73371);
+            animation-timing-function: cubic-bezier(0.31033, 0.28406, 0.8, 0.73371);
+    -webkit-transform: translateX(37.65191%);
+            transform: translateX(37.65191%); }
+  48.35% {
+    -webkit-animation-timing-function: cubic-bezier(0.4, 0.62704, 0.6, 0.90203);
+            animation-timing-function: cubic-bezier(0.4, 0.62704, 0.6, 0.90203);
+    -webkit-transform: translateX(84.38617%);
+            transform: translateX(84.38617%); }
+  100% {
+    -webkit-transform: translateX(160.27778%);
+            transform: translateX(160.27778%); } }
+
+@keyframes secondary-indeterminate-translate {
+  0% {
+    -webkit-animation-timing-function: cubic-bezier(0.15, 0, 0.51506, 0.40969);
+            animation-timing-function: cubic-bezier(0.15, 0, 0.51506, 0.40969);
+    -webkit-transform: translateX(0);
+            transform: translateX(0); }
+  25% {
+    -webkit-animation-timing-function: cubic-bezier(0.31033, 0.28406, 0.8, 0.73371);
+            animation-timing-function: cubic-bezier(0.31033, 0.28406, 0.8, 0.73371);
+    -webkit-transform: translateX(37.65191%);
+            transform: translateX(37.65191%); }
+  48.35% {
+    -webkit-animation-timing-function: cubic-bezier(0.4, 0.62704, 0.6, 0.90203);
+            animation-timing-function: cubic-bezier(0.4, 0.62704, 0.6, 0.90203);
+    -webkit-transform: translateX(84.38617%);
+            transform: translateX(84.38617%); }
+  100% {
+    -webkit-transform: translateX(160.27778%);
+            transform: translateX(160.27778%); } }
+
+@-webkit-keyframes secondary-indeterminate-scale {
+  0% {
+    -webkit-animation-timing-function: cubic-bezier(0.20503, 0.05705, 0.57661, 0.45397);
+            animation-timing-function: cubic-bezier(0.20503, 0.05705, 0.57661, 0.45397);
+    -webkit-transform: scaleX(0.08);
+            transform: scaleX(0.08); }
+  19.15% {
+    -webkit-animation-timing-function: cubic-bezier(0.15231, 0.19643, 0.64837, 1.00432);
+            animation-timing-function: cubic-bezier(0.15231, 0.19643, 0.64837, 1.00432);
+    -webkit-transform: scaleX(0.4571);
+            transform: scaleX(0.4571); }
+  44.15% {
+    -webkit-animation-timing-function: cubic-bezier(0.25776, -0.00316, 0.21176, 1.38179);
+            animation-timing-function: cubic-bezier(0.25776, -0.00316, 0.21176, 1.38179);
+    -webkit-transform: scaleX(0.72796);
+            transform: scaleX(0.72796); }
+  100% {
+    -webkit-transform: scaleX(0.08);
+            transform: scaleX(0.08); } }
+
+@keyframes secondary-indeterminate-scale {
+  0% {
+    -webkit-animation-timing-function: cubic-bezier(0.20503, 0.05705, 0.57661, 0.45397);
+            animation-timing-function: cubic-bezier(0.20503, 0.05705, 0.57661, 0.45397);
+    -webkit-transform: scaleX(0.08);
+            transform: scaleX(0.08); }
+  19.15% {
+    -webkit-animation-timing-function: cubic-bezier(0.15231, 0.19643, 0.64837, 1.00432);
+            animation-timing-function: cubic-bezier(0.15231, 0.19643, 0.64837, 1.00432);
+    -webkit-transform: scaleX(0.4571);
+            transform: scaleX(0.4571); }
+  44.15% {
+    -webkit-animation-timing-function: cubic-bezier(0.25776, -0.00316, 0.21176, 1.38179);
+            animation-timing-function: cubic-bezier(0.25776, -0.00316, 0.21176, 1.38179);
+    -webkit-transform: scaleX(0.72796);
+            transform: scaleX(0.72796); }
+  100% {
+    -webkit-transform: scaleX(0.08);
+            transform: scaleX(0.08); } }
+
+@-webkit-keyframes buffering {
+  to {
+    -webkit-transform: translateX(-10px);
+            transform: translateX(-10px); } }
+
+@keyframes buffering {
+  to {
+    -webkit-transform: translateX(-10px);
+            transform: translateX(-10px); } }
+
+@-webkit-keyframes primary-indeterminate-translate-reverse {
+  0% {
+    -webkit-transform: translateX(0);
+            transform: translateX(0); }
+  20% {
+    -webkit-animation-timing-function: cubic-bezier(0.5, 0, 0.70173, 0.49582);
+            animation-timing-function: cubic-bezier(0.5, 0, 0.70173, 0.49582);
+    -webkit-transform: translateX(0);
+            transform: translateX(0); }
+  59.15% {
+    -webkit-animation-timing-function: cubic-bezier(0.30244, 0.38135, 0.55, 0.95635);
+            animation-timing-function: cubic-bezier(0.30244, 0.38135, 0.55, 0.95635);
+    -webkit-transform: translateX(-83.67142%);
+            transform: translateX(-83.67142%); }
+  100% {
+    -webkit-transform: translateX(-200.61106%);
+            transform: translateX(-200.61106%); } }
+
+@keyframes primary-indeterminate-translate-reverse {
+  0% {
+    -webkit-transform: translateX(0);
+            transform: translateX(0); }
+  20% {
+    -webkit-animation-timing-function: cubic-bezier(0.5, 0, 0.70173, 0.49582);
+            animation-timing-function: cubic-bezier(0.5, 0, 0.70173, 0.49582);
+    -webkit-transform: translateX(0);
+            transform: translateX(0); }
+  59.15% {
+    -webkit-animation-timing-function: cubic-bezier(0.30244, 0.38135, 0.55, 0.95635);
+            animation-timing-function: cubic-bezier(0.30244, 0.38135, 0.55, 0.95635);
+    -webkit-transform: translateX(-83.67142%);
+            transform: translateX(-83.67142%); }
+  100% {
+    -webkit-transform: translateX(-200.61106%);
+            transform: translateX(-200.61106%); } }
+
+@-webkit-keyframes secondary-indeterminate-translate-reverse {
+  0% {
+    -webkit-animation-timing-function: cubic-bezier(0.15, 0, 0.51506, 0.40969);
+            animation-timing-function: cubic-bezier(0.15, 0, 0.51506, 0.40969);
+    -webkit-transform: translateX(0);
+            transform: translateX(0); }
+  25% {
+    -webkit-animation-timing-function: cubic-bezier(0.31033, 0.28406, 0.8, 0.73371);
+            animation-timing-function: cubic-bezier(0.31033, 0.28406, 0.8, 0.73371);
+    -webkit-transform: translateX(-37.65191%);
+            transform: translateX(-37.65191%); }
+  48.35% {
+    -webkit-animation-timing-function: cubic-bezier(0.4, 0.62704, 0.6, 0.90203);
+            animation-timing-function: cubic-bezier(0.4, 0.62704, 0.6, 0.90203);
+    -webkit-transform: translateX(-84.38617%);
+            transform: translateX(-84.38617%); }
+  100% {
+    -webkit-transform: translateX(-160.27778%);
+            transform: translateX(-160.27778%); } }
+
+@keyframes secondary-indeterminate-translate-reverse {
+  0% {
+    -webkit-animation-timing-function: cubic-bezier(0.15, 0, 0.51506, 0.40969);
+            animation-timing-function: cubic-bezier(0.15, 0, 0.51506, 0.40969);
+    -webkit-transform: translateX(0);
+            transform: translateX(0); }
+  25% {
+    -webkit-animation-timing-function: cubic-bezier(0.31033, 0.28406, 0.8, 0.73371);
+            animation-timing-function: cubic-bezier(0.31033, 0.28406, 0.8, 0.73371);
+    -webkit-transform: translateX(-37.65191%);
+            transform: translateX(-37.65191%); }
+  48.35% {
+    -webkit-animation-timing-function: cubic-bezier(0.4, 0.62704, 0.6, 0.90203);
+            animation-timing-function: cubic-bezier(0.4, 0.62704, 0.6, 0.90203);
+    -webkit-transform: translateX(-84.38617%);
+            transform: translateX(-84.38617%); }
+  100% {
+    -webkit-transform: translateX(-160.27778%);
+            transform: translateX(-160.27778%); } }
+
+@-webkit-keyframes buffering-reverse {
+  to {
+    -webkit-transform: translateX(10px);
+            transform: translateX(10px); } }
+
+@keyframes buffering-reverse {
+  to {
+    -webkit-transform: translateX(10px);
+            transform: translateX(10px); } }
+
+.mdc-linear-progress {
+  position: relative;
+  width: 100%;
+  height: 4px;
+  -webkit-transform: translateZ(0);
+          transform: translateZ(0);
+  -webkit-transition: opacity 250ms 0ms cubic-bezier(0.4, 0, 0.6, 1);
+  transition: opacity 250ms 0ms cubic-bezier(0.4, 0, 0.6, 1);
+  overflow: hidden; }
+  .mdc-linear-progress__bar {
+    -webkit-animation: none;
+            animation: none;
+    position: absolute;
+    width: 100%;
+    height: 100%;
+    -webkit-transform-origin: top left;
+            transform-origin: top left;
+    -webkit-transition: -webkit-transform 250ms 0ms cubic-bezier(0.4, 0, 0.6, 1);
+    transition: -webkit-transform 250ms 0ms cubic-bezier(0.4, 0, 0.6, 1);
+    transition: transform 250ms 0ms cubic-bezier(0.4, 0, 0.6, 1);
+    transition: transform 250ms 0ms cubic-bezier(0.4, 0, 0.6, 1), -webkit-transform 250ms 0ms cubic-bezier(0.4, 0, 0.6, 1); }
+  .mdc-linear-progress__bar-inner {
+    /* @alternate */
+    background-color: #3f51b5;
+    background-color: var(--mdc-theme-primary, #3f51b5);
+    -webkit-animation: none;
+            animation: none;
+    display: inline-block;
+    position: absolute;
+    width: 100%;
+    height: 100%; }
+  .mdc-linear-progress--accent .mdc-linear-progress__bar-inner {
+    /* @alternate */
+    background-color: #ff4081;
+    background-color: var(--mdc-theme-accent, #ff4081); }
+  .mdc-linear-progress__buffering-dots {
+    position: absolute;
+    width: 100%;
+    height: 100%;
+    background-image: url("data:image/svg+xml,%3Csvg version='1.1' xmlns='http://www.w3.org/2000/svg' xmlns:xlink='http://www.w3.org/1999/xlink' x='0px' y='0px' enable-background='new 0 0 5 2' xml:space='preserve' viewBox='0 0 5 2' preserveAspectRatio='none slice'%3E%3Ccircle cx='1' cy='1' r='1' fill='%23e6e6e6'/%3E%3C/svg%3E");
+    background-repeat: repeat-x;
+    background-size: 10px 4px;
+    -webkit-animation: buffering 250ms infinite linear;
+            animation: buffering 250ms infinite linear; }
+  .mdc-linear-progress__buffer {
+    position: absolute;
+    width: 100%;
+    height: 100%;
+    -webkit-transform-origin: top left;
+            transform-origin: top left;
+    -webkit-transition: -webkit-transform 250ms 0ms cubic-bezier(0.4, 0, 0.6, 1);
+    transition: -webkit-transform 250ms 0ms cubic-bezier(0.4, 0, 0.6, 1);
+    transition: transform 250ms 0ms cubic-bezier(0.4, 0, 0.6, 1);
+    transition: transform 250ms 0ms cubic-bezier(0.4, 0, 0.6, 1), -webkit-transform 250ms 0ms cubic-bezier(0.4, 0, 0.6, 1);
+    background-color: #e6e6e6; }
+  .mdc-linear-progress__secondary-bar {
+    visibility: hidden; }
+  .mdc-linear-progress--indeterminate .mdc-linear-progress__bar {
+    -webkit-transition: none;
+    transition: none; }
+  .mdc-linear-progress--indeterminate .mdc-linear-progress__primary-bar {
+    -webkit-animation: primary-indeterminate-translate 2s infinite linear;
+            animation: primary-indeterminate-translate 2s infinite linear;
+    left: -145.166611%; }
+    .mdc-linear-progress--indeterminate .mdc-linear-progress__primary-bar > .mdc-linear-progress__bar-inner {
+      -webkit-animation: primary-indeterminate-scale 2s infinite linear;
+              animation: primary-indeterminate-scale 2s infinite linear; }
+  .mdc-linear-progress--indeterminate .mdc-linear-progress__secondary-bar {
+    -webkit-animation: secondary-indeterminate-translate 2s infinite linear;
+            animation: secondary-indeterminate-translate 2s infinite linear;
+    left: -54.888891%;
+    visibility: visible; }
+    .mdc-linear-progress--indeterminate .mdc-linear-progress__secondary-bar > .mdc-linear-progress__bar-inner {
+      -webkit-animation: secondary-indeterminate-scale 2s infinite linear;
+              animation: secondary-indeterminate-scale 2s infinite linear; }
+  .mdc-linear-progress--reversed .mdc-linear-progress__bar,
+  .mdc-linear-progress--reversed .mdc-linear-progress__buffer {
+    right: 0;
+    -webkit-transform-origin: center right;
+            transform-origin: center right; }
+  .mdc-linear-progress--reversed .mdc-linear-progress__primary-bar {
+    -webkit-animation-name: primary-indeterminate-translate-reverse;
+            animation-name: primary-indeterminate-translate-reverse; }
+  .mdc-linear-progress--reversed .mdc-linear-progress__secondary-bar {
+    -webkit-animation-name: secondary-indeterminate-translate-reverse;
+            animation-name: secondary-indeterminate-translate-reverse; }
+  .mdc-linear-progress--reversed .mdc-linear-progress__buffering-dots {
+    -webkit-animation: buffering-reverse 250ms infinite linear;
+            animation: buffering-reverse 250ms infinite linear; }
+  .mdc-linear-progress--closed {
+    opacity: 0; }
+
+.mdc-linear-progress--indeterminate.mdc-linear-progress--reversed .mdc-linear-progress__primary-bar {
+  right: -145.166611%;
+  left: auto; }
+
+.mdc-linear-progress--indeterminate.mdc-linear-progress--reversed .mdc-linear-progress__secondary-bar {
+  right: -54.888891%;
+  left: auto; }

+ 83 - 0
support/client/lib/vwf/view/lib/mdc/dist/mdc.linear-progress.css-entry

@@ -0,0 +1,83 @@
+/*!
+ Material Components for the web
+ Copyright (c) 2017 Google Inc.
+ License: Apache-2.0
+*/
+/******/ (function(modules) { // webpackBootstrap
+/******/ 	// The module cache
+/******/ 	var installedModules = {};
+/******/
+/******/ 	// The require function
+/******/ 	function __webpack_require__(moduleId) {
+/******/
+/******/ 		// Check if module is in cache
+/******/ 		if(installedModules[moduleId]) {
+/******/ 			return installedModules[moduleId].exports;
+/******/ 		}
+/******/ 		// Create a new module (and put it into the cache)
+/******/ 		var module = installedModules[moduleId] = {
+/******/ 			i: moduleId,
+/******/ 			l: false,
+/******/ 			exports: {}
+/******/ 		};
+/******/
+/******/ 		// Execute the module function
+/******/ 		modules[moduleId].call(module.exports, module, module.exports, __webpack_require__);
+/******/
+/******/ 		// Flag the module as loaded
+/******/ 		module.l = true;
+/******/
+/******/ 		// Return the exports of the module
+/******/ 		return module.exports;
+/******/ 	}
+/******/
+/******/
+/******/ 	// expose the modules object (__webpack_modules__)
+/******/ 	__webpack_require__.m = modules;
+/******/
+/******/ 	// expose the module cache
+/******/ 	__webpack_require__.c = installedModules;
+/******/
+/******/ 	// identity function for calling harmony imports with the correct context
+/******/ 	__webpack_require__.i = function(value) { return value; };
+/******/
+/******/ 	// define getter function for harmony exports
+/******/ 	__webpack_require__.d = function(exports, name, getter) {
+/******/ 		if(!__webpack_require__.o(exports, name)) {
+/******/ 			Object.defineProperty(exports, name, {
+/******/ 				configurable: false,
+/******/ 				enumerable: true,
+/******/ 				get: getter
+/******/ 			});
+/******/ 		}
+/******/ 	};
+/******/
+/******/ 	// getDefaultExport function for compatibility with non-harmony modules
+/******/ 	__webpack_require__.n = function(module) {
+/******/ 		var getter = module && module.__esModule ?
+/******/ 			function getDefault() { return module['default']; } :
+/******/ 			function getModuleExports() { return module; };
+/******/ 		__webpack_require__.d(getter, 'a', getter);
+/******/ 		return getter;
+/******/ 	};
+/******/
+/******/ 	// Object.prototype.hasOwnProperty.call
+/******/ 	__webpack_require__.o = function(object, property) { return Object.prototype.hasOwnProperty.call(object, property); };
+/******/
+/******/ 	// __webpack_public_path__
+/******/ 	__webpack_require__.p = "/assets/";
+/******/
+/******/ 	// Load entry module and return exports
+/******/ 	return __webpack_require__(__webpack_require__.s = 13);
+/******/ })
+/************************************************************************/
+/******/ ({
+
+/***/ 13:
+/***/ (function(module, exports) {
+
+// removed by extract-text-webpack-plugin
+
+/***/ })
+
+/******/ });

+ 881 - 0
support/client/lib/vwf/view/lib/mdc/dist/mdc.linearProgress.js

@@ -0,0 +1,881 @@
+/*!
+ Material Components for the web
+ Copyright (c) 2017 Google Inc.
+ License: Apache-2.0
+*/
+(function webpackUniversalModuleDefinition(root, factory) {
+	if(typeof exports === 'object' && typeof module === 'object')
+		module.exports = factory();
+	else if(typeof define === 'function' && define.amd)
+		define([], factory);
+	else if(typeof exports === 'object')
+		exports["linearProgress"] = factory();
+	else
+		root["mdc"] = root["mdc"] || {}, root["mdc"]["linearProgress"] = factory();
+})(this, function() {
+return /******/ (function(modules) { // webpackBootstrap
+/******/ 	// The module cache
+/******/ 	var installedModules = {};
+/******/
+/******/ 	// The require function
+/******/ 	function __webpack_require__(moduleId) {
+/******/
+/******/ 		// Check if module is in cache
+/******/ 		if(installedModules[moduleId]) {
+/******/ 			return installedModules[moduleId].exports;
+/******/ 		}
+/******/ 		// Create a new module (and put it into the cache)
+/******/ 		var module = installedModules[moduleId] = {
+/******/ 			i: moduleId,
+/******/ 			l: false,
+/******/ 			exports: {}
+/******/ 		};
+/******/
+/******/ 		// Execute the module function
+/******/ 		modules[moduleId].call(module.exports, module, module.exports, __webpack_require__);
+/******/
+/******/ 		// Flag the module as loaded
+/******/ 		module.l = true;
+/******/
+/******/ 		// Return the exports of the module
+/******/ 		return module.exports;
+/******/ 	}
+/******/
+/******/
+/******/ 	// expose the modules object (__webpack_modules__)
+/******/ 	__webpack_require__.m = modules;
+/******/
+/******/ 	// expose the module cache
+/******/ 	__webpack_require__.c = installedModules;
+/******/
+/******/ 	// identity function for calling harmony imports with the correct context
+/******/ 	__webpack_require__.i = function(value) { return value; };
+/******/
+/******/ 	// define getter function for harmony exports
+/******/ 	__webpack_require__.d = function(exports, name, getter) {
+/******/ 		if(!__webpack_require__.o(exports, name)) {
+/******/ 			Object.defineProperty(exports, name, {
+/******/ 				configurable: false,
+/******/ 				enumerable: true,
+/******/ 				get: getter
+/******/ 			});
+/******/ 		}
+/******/ 	};
+/******/
+/******/ 	// getDefaultExport function for compatibility with non-harmony modules
+/******/ 	__webpack_require__.n = function(module) {
+/******/ 		var getter = module && module.__esModule ?
+/******/ 			function getDefault() { return module['default']; } :
+/******/ 			function getModuleExports() { return module; };
+/******/ 		__webpack_require__.d(getter, 'a', getter);
+/******/ 		return getter;
+/******/ 	};
+/******/
+/******/ 	// Object.prototype.hasOwnProperty.call
+/******/ 	__webpack_require__.o = function(object, property) { return Object.prototype.hasOwnProperty.call(object, property); };
+/******/
+/******/ 	// __webpack_public_path__
+/******/ 	__webpack_require__.p = "/assets/";
+/******/
+/******/ 	// Load entry module and return exports
+/******/ 	return __webpack_require__(__webpack_require__.s = 90);
+/******/ })
+/************************************************************************/
+/******/ ({
+
+/***/ 0:
+/***/ (function(module, __webpack_exports__, __webpack_require__) {
+
+"use strict";
+var _createClass = function () { function defineProperties(target, props) { for (var i = 0; i < props.length; i++) { var descriptor = props[i]; descriptor.enumerable = descriptor.enumerable || false; descriptor.configurable = true; if ("value" in descriptor) descriptor.writable = true; Object.defineProperty(target, descriptor.key, descriptor); } } return function (Constructor, protoProps, staticProps) { if (protoProps) defineProperties(Constructor.prototype, protoProps); if (staticProps) defineProperties(Constructor, staticProps); return Constructor; }; }();
+
+function _classCallCheck(instance, Constructor) { if (!(instance instanceof Constructor)) { throw new TypeError("Cannot call a class as a function"); } }
+
+/**
+ * Copyright 2016 Google Inc.
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *   http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+
+/**
+ * @template A
+ */
+var MDCFoundation = function () {
+  _createClass(MDCFoundation, null, [{
+    key: "cssClasses",
+
+    /** @return enum{cssClasses} */
+    get: function get() {
+      // Classes extending MDCFoundation should implement this method to return an object which exports every
+      // CSS class the foundation class needs as a property. e.g. {ACTIVE: 'mdc-component--active'}
+      return {};
+    }
+
+    /** @return enum{strings} */
+
+  }, {
+    key: "strings",
+    get: function get() {
+      // Classes extending MDCFoundation should implement this method to return an object which exports all
+      // semantic strings as constants. e.g. {ARIA_ROLE: 'tablist'}
+      return {};
+    }
+
+    /** @return enum{numbers} */
+
+  }, {
+    key: "numbers",
+    get: function get() {
+      // Classes extending MDCFoundation should implement this method to return an object which exports all
+      // of its semantic numbers as constants. e.g. {ANIMATION_DELAY_MS: 350}
+      return {};
+    }
+
+    /** @return {!Object} */
+
+  }, {
+    key: "defaultAdapter",
+    get: function get() {
+      // Classes extending MDCFoundation may choose to implement this getter in order to provide a convenient
+      // way of viewing the necessary methods of an adapter. In the future, this could also be used for adapter
+      // validation.
+      return {};
+    }
+
+    /**
+     * @param {A=} adapter
+     */
+
+  }]);
+
+  function MDCFoundation() {
+    var adapter = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : {};
+
+    _classCallCheck(this, MDCFoundation);
+
+    /** @protected {!A} */
+    this.adapter_ = adapter;
+  }
+
+  _createClass(MDCFoundation, [{
+    key: "init",
+    value: function init() {
+      // Subclasses should override this method to perform initialization routines (registering events, etc.)
+    }
+  }, {
+    key: "destroy",
+    value: function destroy() {
+      // Subclasses should override this method to perform de-initialization routines (de-registering events, etc.)
+    }
+  }]);
+
+  return MDCFoundation;
+}();
+
+/* harmony default export */ __webpack_exports__["a"] = (MDCFoundation);
+
+/***/ }),
+
+/***/ 1:
+/***/ (function(module, __webpack_exports__, __webpack_require__) {
+
+"use strict";
+/* harmony import */ var __WEBPACK_IMPORTED_MODULE_0__foundation__ = __webpack_require__(0);
+var _createClass = function () { function defineProperties(target, props) { for (var i = 0; i < props.length; i++) { var descriptor = props[i]; descriptor.enumerable = descriptor.enumerable || false; descriptor.configurable = true; if ("value" in descriptor) descriptor.writable = true; Object.defineProperty(target, descriptor.key, descriptor); } } return function (Constructor, protoProps, staticProps) { if (protoProps) defineProperties(Constructor.prototype, protoProps); if (staticProps) defineProperties(Constructor, staticProps); return Constructor; }; }();
+
+function _classCallCheck(instance, Constructor) { if (!(instance instanceof Constructor)) { throw new TypeError("Cannot call a class as a function"); } }
+
+/**
+ * Copyright 2016 Google Inc.
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *   http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+
+
+
+/**
+ * @template F
+ */
+
+var MDCComponent = function () {
+  _createClass(MDCComponent, null, [{
+    key: 'attachTo',
+
+    /**
+     * @param {!Element} root
+     * @return {!MDCComponent}
+     */
+    value: function attachTo(root) {
+      // Subclasses which extend MDCBase should provide an attachTo() method that takes a root element and
+      // returns an instantiated component with its root set to that element. Also note that in the cases of
+      // subclasses, an explicit foundation class will not have to be passed in; it will simply be initialized
+      // from getDefaultFoundation().
+      return new MDCComponent(root, new __WEBPACK_IMPORTED_MODULE_0__foundation__["a" /* default */]());
+    }
+
+    /**
+     * @param {!Element} root
+     * @param {F=} foundation
+     * @param {...?} args
+     */
+
+  }]);
+
+  function MDCComponent(root) {
+    var foundation = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : undefined;
+
+    _classCallCheck(this, MDCComponent);
+
+    /** @protected {!Element} */
+    this.root_ = root;
+
+    for (var _len = arguments.length, args = Array(_len > 2 ? _len - 2 : 0), _key = 2; _key < _len; _key++) {
+      args[_key - 2] = arguments[_key];
+    }
+
+    this.initialize.apply(this, args);
+    // Note that we initialize foundation here and not within the constructor's default param so that
+    // this.root_ is defined and can be used within the foundation class.
+    /** @protected {!F} */
+    this.foundation_ = foundation === undefined ? this.getDefaultFoundation() : foundation;
+    this.foundation_.init();
+    this.initialSyncWithDOM();
+  }
+
+  _createClass(MDCComponent, [{
+    key: 'initialize',
+    value: function initialize() /* ...args */{}
+    // Subclasses can override this to do any additional setup work that would be considered part of a
+    // "constructor". Essentially, it is a hook into the parent constructor before the foundation is
+    // initialized. Any additional arguments besides root and foundation will be passed in here.
+
+
+    /**
+     * @return {!F} foundation
+     */
+
+  }, {
+    key: 'getDefaultFoundation',
+    value: function getDefaultFoundation() {
+      // Subclasses must override this method to return a properly configured foundation class for the
+      // component.
+      throw new Error('Subclasses must override getDefaultFoundation to return a properly configured ' + 'foundation class');
+    }
+  }, {
+    key: 'initialSyncWithDOM',
+    value: function initialSyncWithDOM() {
+      // Subclasses should override this method if they need to perform work to synchronize with a host DOM
+      // object. An example of this would be a form control wrapper that needs to synchronize its internal state
+      // to some property or attribute of the host DOM. Please note: this is *not* the place to perform DOM
+      // reads/writes that would cause layout / paint, as this is called synchronously from within the constructor.
+    }
+  }, {
+    key: 'destroy',
+    value: function destroy() {
+      // Subclasses may implement this method to release any resources / deregister any listeners they have
+      // attached. An example of this might be deregistering a resize event from the window object.
+      this.foundation_.destroy();
+    }
+
+    /**
+     * Wrapper method to add an event listener to the component's root element. This is most useful when
+     * listening for custom events.
+     * @param {string} evtType
+     * @param {!Function} handler
+     */
+
+  }, {
+    key: 'listen',
+    value: function listen(evtType, handler) {
+      this.root_.addEventListener(evtType, handler);
+    }
+
+    /**
+     * Wrapper method to remove an event listener to the component's root element. This is most useful when
+     * unlistening for custom events.
+     * @param {string} evtType
+     * @param {!Function} handler
+     */
+
+  }, {
+    key: 'unlisten',
+    value: function unlisten(evtType, handler) {
+      this.root_.removeEventListener(evtType, handler);
+    }
+
+    /**
+     * Fires a cross-browser-compatible custom event from the component root of the given type,
+     * with the given data.
+     * @param {string} evtType
+     * @param {!Object} evtData
+     * @param {boolean=} shouldBubble
+     */
+
+  }, {
+    key: 'emit',
+    value: function emit(evtType, evtData) {
+      var shouldBubble = arguments.length > 2 && arguments[2] !== undefined ? arguments[2] : false;
+
+      var evt = void 0;
+      if (typeof CustomEvent === 'function') {
+        evt = new CustomEvent(evtType, {
+          detail: evtData,
+          bubbles: shouldBubble
+        });
+      } else {
+        evt = document.createEvent('CustomEvent');
+        evt.initCustomEvent(evtType, shouldBubble, false, evtData);
+      }
+
+      this.root_.dispatchEvent(evt);
+    }
+  }]);
+
+  return MDCComponent;
+}();
+
+/* harmony default export */ __webpack_exports__["a"] = (MDCComponent);
+
+/***/ }),
+
+/***/ 2:
+/***/ (function(module, __webpack_exports__, __webpack_require__) {
+
+"use strict";
+Object.defineProperty(__webpack_exports__, "__esModule", { value: true });
+/* harmony import */ var __WEBPACK_IMPORTED_MODULE_0__foundation__ = __webpack_require__(0);
+/* harmony import */ var __WEBPACK_IMPORTED_MODULE_1__component__ = __webpack_require__(1);
+/* harmony import */ var __WEBPACK_IMPORTED_MODULE_2__selection_control__ = __webpack_require__(3);
+/* harmony reexport (binding) */ __webpack_require__.d(__webpack_exports__, "MDCFoundation", function() { return __WEBPACK_IMPORTED_MODULE_0__foundation__["a"]; });
+/* harmony reexport (binding) */ __webpack_require__.d(__webpack_exports__, "MDCComponent", function() { return __WEBPACK_IMPORTED_MODULE_1__component__["a"]; });
+/* harmony reexport (binding) */ __webpack_require__.d(__webpack_exports__, "SelectionControlState", function() { return __WEBPACK_IMPORTED_MODULE_2__selection_control__["a"]; });
+/**
+ * Copyright 2016 Google Inc.
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *   http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+
+
+
+
+
+
+
+/***/ }),
+
+/***/ 3:
+/***/ (function(module, __webpack_exports__, __webpack_require__) {
+
+"use strict";
+/* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, "a", function() { return SelectionControlState; });
+/**
+ * Copyright 2017 Google Inc. All Rights Reserved.
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *      http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+
+/**
+ * @typedef {!{
+ *   checked: boolean,
+ *   indeterminate: boolean,
+ *   disabled: boolean,
+ *   value: ?string
+ * }}
+ */
+var SelectionControlState = void 0;
+
+/***/ }),
+
+/***/ 30:
+/***/ (function(module, __webpack_exports__, __webpack_require__) {
+
+"use strict";
+Object.defineProperty(__webpack_exports__, "__esModule", { value: true });
+/* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, "MDCLinearProgress", function() { return MDCLinearProgress; });
+/* harmony import */ var __WEBPACK_IMPORTED_MODULE_0__material_base__ = __webpack_require__(2);
+/* harmony import */ var __WEBPACK_IMPORTED_MODULE_1__foundation__ = __webpack_require__(60);
+/* harmony reexport (binding) */ __webpack_require__.d(__webpack_exports__, "MDCLinearProgressFoundation", function() { return __WEBPACK_IMPORTED_MODULE_1__foundation__["a"]; });
+var _createClass = function () { function defineProperties(target, props) { for (var i = 0; i < props.length; i++) { var descriptor = props[i]; descriptor.enumerable = descriptor.enumerable || false; descriptor.configurable = true; if ("value" in descriptor) descriptor.writable = true; Object.defineProperty(target, descriptor.key, descriptor); } } return function (Constructor, protoProps, staticProps) { if (protoProps) defineProperties(Constructor.prototype, protoProps); if (staticProps) defineProperties(Constructor, staticProps); return Constructor; }; }();
+
+function _classCallCheck(instance, Constructor) { if (!(instance instanceof Constructor)) { throw new TypeError("Cannot call a class as a function"); } }
+
+function _possibleConstructorReturn(self, call) { if (!self) { throw new ReferenceError("this hasn't been initialised - super() hasn't been called"); } return call && (typeof call === "object" || typeof call === "function") ? call : self; }
+
+function _inherits(subClass, superClass) { if (typeof superClass !== "function" && superClass !== null) { throw new TypeError("Super expression must either be null or a function, not " + typeof superClass); } subClass.prototype = Object.create(superClass && superClass.prototype, { constructor: { value: subClass, enumerable: false, writable: true, configurable: true } }); if (superClass) Object.setPrototypeOf ? Object.setPrototypeOf(subClass, superClass) : subClass.__proto__ = superClass; }
+
+/**
+ * Copyright 2017 Google Inc. All Rights Reserved.
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *      http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+
+
+
+
+
+
+var MDCLinearProgress = function (_MDCComponent) {
+  _inherits(MDCLinearProgress, _MDCComponent);
+
+  function MDCLinearProgress() {
+    _classCallCheck(this, MDCLinearProgress);
+
+    return _possibleConstructorReturn(this, (MDCLinearProgress.__proto__ || Object.getPrototypeOf(MDCLinearProgress)).apply(this, arguments));
+  }
+
+  _createClass(MDCLinearProgress, [{
+    key: 'open',
+    value: function open() {
+      this.foundation_.open();
+    }
+  }, {
+    key: 'close',
+    value: function close() {
+      this.foundation_.close();
+    }
+  }, {
+    key: 'getDefaultFoundation',
+    value: function getDefaultFoundation() {
+      var _this2 = this;
+
+      return new __WEBPACK_IMPORTED_MODULE_1__foundation__["a" /* default */]({
+        addClass: function addClass(className) {
+          return _this2.root_.classList.add(className);
+        },
+        getPrimaryBar: function getPrimaryBar() {
+          return _this2.root_.querySelector(__WEBPACK_IMPORTED_MODULE_1__foundation__["a" /* default */].strings.PRIMARY_BAR_SELECTOR);
+        },
+        getBuffer: function getBuffer() {
+          return _this2.root_.querySelector(__WEBPACK_IMPORTED_MODULE_1__foundation__["a" /* default */].strings.BUFFER_SELECTOR);
+        },
+        hasClass: function hasClass(className) {
+          return _this2.root_.classList.contains(className);
+        },
+        removeClass: function removeClass(className) {
+          return _this2.root_.classList.remove(className);
+        },
+        setStyle: function setStyle(el, styleProperty, value) {
+          return el.style[styleProperty] = value;
+        }
+      });
+    }
+  }, {
+    key: 'determinate',
+    set: function set(value) {
+      this.foundation_.setDeterminate(value);
+    }
+  }, {
+    key: 'progress',
+    set: function set(value) {
+      this.foundation_.setProgress(value);
+    }
+  }, {
+    key: 'buffer',
+    set: function set(value) {
+      this.foundation_.setBuffer(value);
+    }
+  }, {
+    key: 'reverse',
+    set: function set(value) {
+      this.foundation_.setReverse(value);
+    }
+  }], [{
+    key: 'attachTo',
+    value: function attachTo(root) {
+      return new MDCLinearProgress(root);
+    }
+  }]);
+
+  return MDCLinearProgress;
+}(__WEBPACK_IMPORTED_MODULE_0__material_base__["MDCComponent"]);
+
+/***/ }),
+
+/***/ 59:
+/***/ (function(module, __webpack_exports__, __webpack_require__) {
+
+"use strict";
+/* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, "a", function() { return cssClasses; });
+/* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, "b", function() { return strings; });
+/**
+ * Copyright 2017 Google Inc. All Rights Reserved.
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *      http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+
+var cssClasses = {
+  CLOSED_CLASS: 'mdc-linear-progress--closed',
+  INDETERMINATE_CLASS: 'mdc-linear-progress--indeterminate',
+  REVERSED_CLASS: 'mdc-linear-progress--reversed'
+};
+
+var strings = {
+  PRIMARY_BAR_SELECTOR: '.mdc-linear-progress__primary-bar',
+  BUFFER_SELECTOR: '.mdc-linear-progress__buffer'
+};
+
+/***/ }),
+
+/***/ 60:
+/***/ (function(module, __webpack_exports__, __webpack_require__) {
+
+"use strict";
+/* harmony import */ var __WEBPACK_IMPORTED_MODULE_0__material_base__ = __webpack_require__(2);
+/* harmony import */ var __WEBPACK_IMPORTED_MODULE_1__material_animation__ = __webpack_require__(9);
+/* harmony import */ var __WEBPACK_IMPORTED_MODULE_2__constants__ = __webpack_require__(59);
+var _extends = Object.assign || function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; };
+
+var _createClass = function () { function defineProperties(target, props) { for (var i = 0; i < props.length; i++) { var descriptor = props[i]; descriptor.enumerable = descriptor.enumerable || false; descriptor.configurable = true; if ("value" in descriptor) descriptor.writable = true; Object.defineProperty(target, descriptor.key, descriptor); } } return function (Constructor, protoProps, staticProps) { if (protoProps) defineProperties(Constructor.prototype, protoProps); if (staticProps) defineProperties(Constructor, staticProps); return Constructor; }; }();
+
+function _classCallCheck(instance, Constructor) { if (!(instance instanceof Constructor)) { throw new TypeError("Cannot call a class as a function"); } }
+
+function _possibleConstructorReturn(self, call) { if (!self) { throw new ReferenceError("this hasn't been initialised - super() hasn't been called"); } return call && (typeof call === "object" || typeof call === "function") ? call : self; }
+
+function _inherits(subClass, superClass) { if (typeof superClass !== "function" && superClass !== null) { throw new TypeError("Super expression must either be null or a function, not " + typeof superClass); } subClass.prototype = Object.create(superClass && superClass.prototype, { constructor: { value: subClass, enumerable: false, writable: true, configurable: true } }); if (superClass) Object.setPrototypeOf ? Object.setPrototypeOf(subClass, superClass) : subClass.__proto__ = superClass; }
+
+/**
+ * Copyright 2017 Google Inc. All Rights Reserved.
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *      http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+
+
+
+
+
+
+var MDCLinearProgressFoundation = function (_MDCFoundation) {
+  _inherits(MDCLinearProgressFoundation, _MDCFoundation);
+
+  _createClass(MDCLinearProgressFoundation, null, [{
+    key: 'cssClasses',
+    get: function get() {
+      return __WEBPACK_IMPORTED_MODULE_2__constants__["a" /* cssClasses */];
+    }
+  }, {
+    key: 'strings',
+    get: function get() {
+      return __WEBPACK_IMPORTED_MODULE_2__constants__["b" /* strings */];
+    }
+  }, {
+    key: 'defaultAdapter',
+    get: function get() {
+      return {
+        addClass: function addClass() /* className: string */{},
+        getPrimaryBar: function getPrimaryBar() /* el: Element */{},
+        getBuffer: function getBuffer() /* el: Element */{},
+        hasClass: function hasClass() {
+          return (/* className: string */false
+          );
+        },
+        removeClass: function removeClass() /* className: string */{},
+        setStyle: function setStyle() /* el: Element, styleProperty: string, value: number */{}
+      };
+    }
+  }]);
+
+  function MDCLinearProgressFoundation(adapter) {
+    _classCallCheck(this, MDCLinearProgressFoundation);
+
+    return _possibleConstructorReturn(this, (MDCLinearProgressFoundation.__proto__ || Object.getPrototypeOf(MDCLinearProgressFoundation)).call(this, _extends(MDCLinearProgressFoundation.defaultAdapter, adapter)));
+  }
+
+  _createClass(MDCLinearProgressFoundation, [{
+    key: 'init',
+    value: function init() {
+      this.determinate_ = !this.adapter_.hasClass(__WEBPACK_IMPORTED_MODULE_2__constants__["a" /* cssClasses */].INDETERMINATE_CLASS);
+      this.reverse_ = this.adapter_.hasClass(__WEBPACK_IMPORTED_MODULE_2__constants__["a" /* cssClasses */].REVERSED_CLASS);
+    }
+  }, {
+    key: 'setDeterminate',
+    value: function setDeterminate(isDeterminate) {
+      this.determinate_ = isDeterminate;
+      if (this.determinate_) {
+        this.adapter_.removeClass(__WEBPACK_IMPORTED_MODULE_2__constants__["a" /* cssClasses */].INDETERMINATE_CLASS);
+      } else {
+        this.adapter_.addClass(__WEBPACK_IMPORTED_MODULE_2__constants__["a" /* cssClasses */].INDETERMINATE_CLASS);
+        this.setScale_(this.adapter_.getPrimaryBar(), 1);
+        this.setScale_(this.adapter_.getBuffer(), 1);
+      }
+    }
+  }, {
+    key: 'setProgress',
+    value: function setProgress(value) {
+      if (this.determinate_) {
+        this.setScale_(this.adapter_.getPrimaryBar(), value);
+      }
+    }
+  }, {
+    key: 'setBuffer',
+    value: function setBuffer(value) {
+      if (this.determinate_) {
+        this.setScale_(this.adapter_.getBuffer(), value);
+      }
+    }
+  }, {
+    key: 'setReverse',
+    value: function setReverse(isReversed) {
+      this.reverse_ = isReversed;
+      if (this.reverse_) {
+        this.adapter_.addClass(__WEBPACK_IMPORTED_MODULE_2__constants__["a" /* cssClasses */].REVERSED_CLASS);
+      } else {
+        this.adapter_.removeClass(__WEBPACK_IMPORTED_MODULE_2__constants__["a" /* cssClasses */].REVERSED_CLASS);
+      }
+    }
+  }, {
+    key: 'open',
+    value: function open() {
+      this.adapter_.removeClass(__WEBPACK_IMPORTED_MODULE_2__constants__["a" /* cssClasses */].CLOSED_CLASS);
+    }
+  }, {
+    key: 'close',
+    value: function close() {
+      this.adapter_.addClass(__WEBPACK_IMPORTED_MODULE_2__constants__["a" /* cssClasses */].CLOSED_CLASS);
+    }
+  }, {
+    key: 'setScale_',
+    value: function setScale_(el, scaleValue) {
+      var _this2 = this;
+
+      var value = 'scaleX(' + scaleValue + ')';
+      __WEBPACK_IMPORTED_MODULE_1__material_animation__["transformStyleProperties"].forEach(function (transformStyleProperty) {
+        _this2.adapter_.setStyle(el, transformStyleProperty, value);
+      });
+    }
+  }]);
+
+  return MDCLinearProgressFoundation;
+}(__WEBPACK_IMPORTED_MODULE_0__material_base__["MDCFoundation"]);
+
+/* harmony default export */ __webpack_exports__["a"] = (MDCLinearProgressFoundation);
+
+/***/ }),
+
+/***/ 9:
+/***/ (function(module, __webpack_exports__, __webpack_require__) {
+
+"use strict";
+Object.defineProperty(__webpack_exports__, "__esModule", { value: true });
+/* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, "transformStyleProperties", function() { return transformStyleProperties; });
+/* harmony export (immutable) */ __webpack_exports__["getCorrectEventName"] = getCorrectEventName;
+/* harmony export (immutable) */ __webpack_exports__["getCorrectPropertyName"] = getCorrectPropertyName;
+/**
+ * Copyright 2016 Google Inc. All Rights Reserved.
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *      http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+
+/**
+ * @typedef {{
+ *   noPrefix: string,
+ *   webkitPrefix: string
+ * }}
+ */
+var VendorPropertyMapType = void 0;
+
+/** @const {Object<string, !VendorPropertyMapType>} */
+var eventTypeMap = {
+  'animationstart': {
+    noPrefix: 'animationstart',
+    webkitPrefix: 'webkitAnimationStart',
+    styleProperty: 'animation'
+  },
+  'animationend': {
+    noPrefix: 'animationend',
+    webkitPrefix: 'webkitAnimationEnd',
+    styleProperty: 'animation'
+  },
+  'animationiteration': {
+    noPrefix: 'animationiteration',
+    webkitPrefix: 'webkitAnimationIteration',
+    styleProperty: 'animation'
+  },
+  'transitionend': {
+    noPrefix: 'transitionend',
+    webkitPrefix: 'webkitTransitionEnd',
+    styleProperty: 'transition'
+  }
+};
+
+/** @const {Object<string, !VendorPropertyMapType>} */
+var cssPropertyMap = {
+  'animation': {
+    noPrefix: 'animation',
+    webkitPrefix: '-webkit-animation'
+  },
+  'transform': {
+    noPrefix: 'transform',
+    webkitPrefix: '-webkit-transform'
+  },
+  'transition': {
+    noPrefix: 'transition',
+    webkitPrefix: '-webkit-transition'
+  }
+};
+
+/**
+ * @param {!Object} windowObj
+ * @return {boolean}
+ */
+function hasProperShape(windowObj) {
+  return windowObj['document'] !== undefined && typeof windowObj['document']['createElement'] === 'function';
+}
+
+/**
+ * @param {string} eventType
+ * @return {boolean}
+ */
+function eventFoundInMaps(eventType) {
+  return eventType in eventTypeMap || eventType in cssPropertyMap;
+}
+
+/**
+ * @param {string} eventType
+ * @param {!Object<string, !VendorPropertyMapType>} map
+ * @param {!Element} el
+ * @return {string}
+ */
+function getJavaScriptEventName(eventType, map, el) {
+  return map[eventType].styleProperty in el.style ? map[eventType].noPrefix : map[eventType].webkitPrefix;
+}
+
+/**
+ * Helper function to determine browser prefix for CSS3 animation events
+ * and property names.
+ * @param {!Object} windowObj
+ * @param {string} eventType
+ * @return {string}
+ */
+function getAnimationName(windowObj, eventType) {
+  if (!hasProperShape(windowObj) || !eventFoundInMaps(eventType)) {
+    return eventType;
+  }
+
+  var map = /** @type {!Object<string, !VendorPropertyMapType>} */eventType in eventTypeMap ? eventTypeMap : cssPropertyMap;
+  var el = windowObj['document']['createElement']('div');
+  var eventName = '';
+
+  if (map === eventTypeMap) {
+    eventName = getJavaScriptEventName(eventType, map, el);
+  } else {
+    eventName = map[eventType].noPrefix in el.style ? map[eventType].noPrefix : map[eventType].webkitPrefix;
+  }
+
+  return eventName;
+}
+
+// Public functions to access getAnimationName() for JavaScript events or CSS
+// property names.
+
+var transformStyleProperties = ['transform', 'WebkitTransform', 'MozTransform', 'OTransform', 'MSTransform'];
+
+/**
+ * @param {!Object} windowObj
+ * @param {string} eventType
+ * @return {string}
+ */
+function getCorrectEventName(windowObj, eventType) {
+  return getAnimationName(windowObj, eventType);
+}
+
+/**
+ * @param {!Object} windowObj
+ * @param {string} eventType
+ * @return {string}
+ */
+function getCorrectPropertyName(windowObj, eventType) {
+  return getAnimationName(windowObj, eventType);
+}
+
+/***/ }),
+
+/***/ 90:
+/***/ (function(module, exports, __webpack_require__) {
+
+module.exports = __webpack_require__(30);
+
+
+/***/ })
+
+/******/ });
+});

+ 732 - 0
support/client/lib/vwf/view/lib/mdc/dist/mdc.list.css

@@ -0,0 +1,732 @@
+/*!
+ Material Components for the web
+ Copyright (c) 2017 Google Inc.
+ License: Apache-2.0
+*/
+/*
+  Precomputed linear color channel values, for use in contrast calculations.
+  See https://www.w3.org/TR/WCAG20-TECHS/G17.html#G17-tests
+
+  Algorithm, for c in 0 to 255:
+  f(c) {
+    c = c / 255;
+    return c < 0.03928 ? c / 12.92 : Math.pow((c + 0.055) / 1.055, 2.4);
+  }
+
+  This lookup table is needed since there is no `pow` in SASS.
+*/
+/**
+ * Calculate the luminance for a color.
+ * See https://www.w3.org/TR/WCAG20-TECHS/G17.html#G17-tests
+ */
+/**
+ * Calculate the contrast ratio between two colors.
+ * See https://www.w3.org/TR/WCAG20-TECHS/G17.html#G17-tests
+ */
+/**
+ * Determine whether to use dark or light text on top of given color.
+ * Returns "dark" for dark text and "light" for light text.
+ */
+/*
+  Main theme colors.
+  If you're a user customizing your color scheme in SASS, these are probably the only variables you need to change.
+*/
+/* Indigo 500 */
+/* Pink A200 */
+/* White */
+/* Which set of text colors to use for each main theme color (light or dark) */
+/* Text colors according to light vs dark and text type */
+/* Primary text colors for each of the theme colors */
+/** MDC Ripple keyframes are split into their own file so that _mixins.scss can rely on them. */
+@-webkit-keyframes mdc-ripple-fg-radius-in {
+  from {
+    -webkit-transform: translate(var(--mdc-ripple-fg-translate-start, 0)) scale(1);
+            transform: translate(var(--mdc-ripple-fg-translate-start, 0)) scale(1);
+    -webkit-animation-timing-function: cubic-bezier(0.4, 0, 0.2, 1);
+            animation-timing-function: cubic-bezier(0.4, 0, 0.2, 1); }
+  to {
+    -webkit-transform: translate(var(--mdc-ripple-fg-translate-end, 0)) scale(var(--mdc-ripple-fg-scale, 1));
+            transform: translate(var(--mdc-ripple-fg-translate-end, 0)) scale(var(--mdc-ripple-fg-scale, 1)); } }
+@keyframes mdc-ripple-fg-radius-in {
+  from {
+    -webkit-transform: translate(var(--mdc-ripple-fg-translate-start, 0)) scale(1);
+            transform: translate(var(--mdc-ripple-fg-translate-start, 0)) scale(1);
+    -webkit-animation-timing-function: cubic-bezier(0.4, 0, 0.2, 1);
+            animation-timing-function: cubic-bezier(0.4, 0, 0.2, 1); }
+  to {
+    -webkit-transform: translate(var(--mdc-ripple-fg-translate-end, 0)) scale(var(--mdc-ripple-fg-scale, 1));
+            transform: translate(var(--mdc-ripple-fg-translate-end, 0)) scale(var(--mdc-ripple-fg-scale, 1)); } }
+
+@-webkit-keyframes mdc-ripple-fg-opacity-in {
+  from {
+    opacity: 0;
+    -webkit-animation-timing-function: linear;
+            animation-timing-function: linear; }
+  to {
+    opacity: 1; } }
+
+@keyframes mdc-ripple-fg-opacity-in {
+  from {
+    opacity: 0;
+    -webkit-animation-timing-function: linear;
+            animation-timing-function: linear; }
+  to {
+    opacity: 1; } }
+
+@-webkit-keyframes mdc-ripple-fg-opacity-out {
+  from {
+    opacity: 1;
+    -webkit-animation-timing-function: linear;
+            animation-timing-function: linear; }
+  to {
+    opacity: 0; } }
+
+@keyframes mdc-ripple-fg-opacity-out {
+  from {
+    opacity: 1;
+    -webkit-animation-timing-function: linear;
+            animation-timing-function: linear; }
+  to {
+    opacity: 0; } }
+
+/**
+ * Creates a rule that will be applied when an MDC-Web component is within the context of an RTL layout.
+ *
+ * Usage Example:
+ * ```scss
+ * .mdc-foo {
+ *   position: absolute;
+ *   left: 0;
+ *
+ *   @include mdc-rtl {
+ *     left: auto;
+ *     right: 0;
+ *   }
+ *
+ *   &__bar {
+ *     margin-left: 4px;
+ *     @include mdc-rtl(".mdc-foo") {
+ *       margin-left: auto;
+ *       margin-right: 4px;
+ *     }
+ *   }
+ * }
+ *
+ * .mdc-foo--mod {
+ *   padding-left: 4px;
+ *
+ *   @include mdc-rtl {
+ *     padding-left: auto;
+ *     padding-right: 4px;
+ *   }
+ * }
+ * ```
+ *
+ * Note that this works by checking for [dir="rtl"] on an ancestor element. While this will work
+ * in most cases, it will in some cases lead to false negatives, e.g.
+ *
+ * ```html
+ * <html dir="rtl">
+ *   <!-- ... -->
+ *   <div dir="ltr">
+ *     <div class="mdc-foo">Styled incorrectly as RTL!</div>
+ *   </div>
+ * </html>
+ * ```
+ *
+ * In the future, selectors such as :dir (http://mdn.io/:dir) will help us mitigate this.
+ */
+/**
+ * Takes a base box-model property - e.g. margin / border / padding - along with a default
+ * direction and value, and emits rules which apply the value to the
+ * "<base-property>-<default-direction>" property by default, but flips the direction
+ * when within an RTL context.
+ *
+ * For example:
+ *
+ * ```scss
+ * .mdc-foo {
+ *   @include mdc-rtl-reflexive-box(margin, left, 8px);
+ * }
+ * ```
+ * is equivalent to:
+ *
+ * ```scss
+ * .mdc-foo {
+ *   margin-left: 8px;
+ *
+ *   @include mdc-rtl {
+ *     margin-right: 8px;
+ *     margin-left: 0;
+ *   }
+ * }
+ * ```
+ * whereas:
+ *
+ * ```scss
+ * .mdc-foo {
+ *   @include mdc-rtl-reflexive-box(margin, right, 8px);
+ * }
+ * ```
+ * is equivalent to:
+ *
+ * ```scss
+ * .mdc-foo {
+ *   margin-right: 8px;
+ *
+ *   @include mdc-rtl {
+ *     margin-right: 0;
+ *     margin-left: 8px;
+ *   }
+ * }
+ * ```
+ *
+ * You can also pass a 4th optional $root-selector argument which will be forwarded to `mdc-rtl`,
+ * e.g. `@include mdc-rtl-reflexive-box(margin, left, 8px, ".mdc-component")`.
+ *
+ * Note that this function will always zero out the original value in an RTL context. If you're
+ * trying to flip the values, use mdc-rtl-reflexive-property().
+ */
+/**
+ * Takes a base property and emits rules that assign <base-property>-left to <left-value> and
+ * <base-property>-right to <right-value> in a LTR context, and vice versa in a RTL context.
+ * For example:
+ *
+ * ```scss
+ * .mdc-foo {
+ *   @include mdc-rtl-reflexive-property(margin, auto, 12px);
+ * }
+ * ```
+ * is equivalent to:
+ *
+ * ```scss
+ * .mdc-foo {
+ *   margin-left: auto;
+ *   margin-right: 12px;
+ *
+ *   @include mdc-rtl {
+ *     margin-left: 12px;
+ *     margin-right: auto;
+ *   }
+ * }
+ * ```
+ *
+ * A 4th optional $root-selector argument can be given, which will be passed to `mdc-rtl`.
+ */
+/**
+ * Takes an argument specifying a horizontal position property (either "left" or "right") as well
+ * as a value, and applies that value to the specified position in a LTR context, and flips it in a
+ * RTL context. For example:
+ *
+ * ```scss
+ * .mdc-foo {
+ *   @include mdc-rtl-reflexive-position(left, 0);
+ *   position: absolute;
+ * }
+ * ```
+ * is equivalent to:
+ *
+ * ```scss
+ *  .mdc-foo {
+ *    position: absolute;
+ *    left: 0;
+ *    right: initial;
+ *
+ *    @include mdc-rtl {
+ *      right: 0;
+ *      left: initial;
+ *    }
+ *  }
+ * ```
+ * An optional third $root-selector argument may also be given, which is passed to `mdc-rtl`.
+ */
+/*
+  Precomputed linear color channel values, for use in contrast calculations.
+  See https://www.w3.org/TR/WCAG20-TECHS/G17.html#G17-tests
+
+  Algorithm, for c in 0 to 255:
+  f(c) {
+    c = c / 255;
+    return c < 0.03928 ? c / 12.92 : Math.pow((c + 0.055) / 1.055, 2.4);
+  }
+
+  This lookup table is needed since there is no `pow` in SASS.
+*/
+/**
+ * Calculate the luminance for a color.
+ * See https://www.w3.org/TR/WCAG20-TECHS/G17.html#G17-tests
+ */
+/**
+ * Calculate the contrast ratio between two colors.
+ * See https://www.w3.org/TR/WCAG20-TECHS/G17.html#G17-tests
+ */
+/**
+ * Determine whether to use dark or light text on top of given color.
+ * Returns "dark" for dark text and "light" for light text.
+ */
+/*
+  Main theme colors.
+  If you're a user customizing your color scheme in SASS, these are probably the only variables you need to change.
+*/
+/* Indigo 500 */
+/* Pink A200 */
+/* White */
+/* Which set of text colors to use for each main theme color (light or dark) */
+/* Text colors according to light vs dark and text type */
+/* Primary text colors for each of the theme colors */
+/**
+ * Applies the correct theme color style to the specified property.
+ * $property is typically color or background-color, but can be any CSS property that accepts color values.
+ * $style should be one of the map keys in $mdc-theme-property-values (_variables.scss).
+ */
+/**
+ * Creates a rule to be used in MDC-Web components for dark theming, and applies the provided contents.
+ * Should provide the $root-selector option if applied to anything other than the root selector.
+ * When used with a modifier class, provide a second argument of `true` for the $compound parameter
+ * to specify that this should be attached as a compound class.
+ *
+ * Usage example:
+ *
+ * ```scss
+ * .mdc-foo {
+ *   color: black;
+ *
+ *   @include mdc-theme-dark {
+ *     color: white;
+ *   }
+ *
+ *   &__bar {
+ *     background: black;
+ *
+ *     @include mdc-theme-dark(".mdc-foo") {
+ *       background: white;
+ *     }
+ *   }
+ * }
+ *
+ * .mdc-foo--disabled {
+ *   opacity: .38;
+ *
+ *   @include mdc-theme-dark(".mdc-foo", true) {
+ *     opacity: .5;
+ *   }
+ * }
+ * ```
+ */
+/* TODO(sgomes): Figure out what to do about desktop font sizes. */
+/* TODO(sgomes): Figure out what to do about i18n and i18n font sizes. */
+/* TODO(sgomes): Figure out what to do about desktop font sizes. */
+/* TODO(sgomes): Figure out what to do about i18n and i18n font sizes. */
+.mdc-list {
+  font-family: Roboto, sans-serif;
+  -moz-osx-font-smoothing: grayscale;
+  -webkit-font-smoothing: antialiased;
+  font-size: 1rem;
+  font-weight: 400;
+  letter-spacing: 0.04em;
+  line-height: 1.75rem;
+  text-decoration: inherit;
+  text-transform: inherit;
+  /* @alternate */
+  color: rgba(0, 0, 0, 0.87);
+  color: var(--mdc-theme-text-primary-on-background, rgba(0, 0, 0, 0.87));
+  margin: 0;
+  padding: 8px 16px 0;
+  line-height: 1.5rem;
+  list-style-type: none; }
+  .mdc-list--theme-dark,
+  .mdc-theme--dark .mdc-list {
+    /* @alternate */
+    color: white;
+    color: var(--mdc-theme-text-primary-on-dark, white); }
+
+.mdc-list--dense {
+  padding-top: 4px;
+  font-size: .812rem; }
+
+.mdc-list-item {
+  display: -webkit-box;
+  display: -ms-flexbox;
+  display: flex;
+  -webkit-box-align: center;
+      -ms-flex-align: center;
+          align-items: center;
+  -webkit-box-pack: start;
+      -ms-flex-pack: start;
+          justify-content: flex-start;
+  height: 48px; }
+  .mdc-list-item__start-detail {
+    width: 24px;
+    height: 24px;
+    margin-left: 0;
+    margin-right: 32px; }
+    [dir="rtl"] .mdc-list-item .mdc-list-item__start-detail,
+    .mdc-list-item[dir="rtl"] .mdc-list-item__start-detail {
+      margin-left: 32px;
+      margin-right: 0; }
+  .mdc-list-item__end-detail {
+    width: 24px;
+    height: 24px;
+    margin-left: auto;
+    margin-right: 0; }
+    [dir="rtl"] .mdc-list-item .mdc-list-item__end-detail,
+    .mdc-list-item[dir="rtl"] .mdc-list-item__end-detail {
+      margin-left: 0;
+      margin-right: auto; }
+  .mdc-list-item__text {
+    display: -webkit-inline-box;
+    display: -ms-inline-flexbox;
+    display: inline-flex;
+    -webkit-box-orient: vertical;
+    -webkit-box-direction: normal;
+        -ms-flex-direction: column;
+            flex-direction: column; }
+    .mdc-list-item__text__secondary {
+      font-family: Roboto, sans-serif;
+      -moz-osx-font-smoothing: grayscale;
+      -webkit-font-smoothing: antialiased;
+      font-size: 0.875rem;
+      font-weight: 400;
+      letter-spacing: 0.04em;
+      line-height: 1.25rem;
+      text-decoration: inherit;
+      text-transform: inherit;
+      /* @alternate */
+      color: rgba(0, 0, 0, 0.54);
+      color: var(--mdc-theme-text-secondary-on-background, rgba(0, 0, 0, 0.54)); }
+      .mdc-list-item__text__secondary--theme-dark,
+      .mdc-theme--dark .mdc-list-item__text__secondary {
+        /* @alternate */
+        color: rgba(255, 255, 255, 0.7);
+        color: var(--mdc-theme-text-secondary-on-dark, rgba(255, 255, 255, 0.7)); }
+      .mdc-list--dense .mdc-list-item__text__secondary {
+        font-size: inherit; }
+  .mdc-list--dense .mdc-list-item {
+    height: 40px; }
+    .mdc-list--dense .mdc-list-item__start-detail {
+      width: 20px;
+      height: 20px;
+      margin-left: 0;
+      margin-right: 36px; }
+      [dir="rtl"] .mdc-list-item .mdc-list--dense .mdc-list-item__start-detail,
+      .mdc-list-item[dir="rtl"] .mdc-list--dense .mdc-list-item__start-detail {
+        margin-left: 36px;
+        margin-right: 0; }
+    .mdc-list--dense .mdc-list-item__end-detail {
+      width: 20px;
+      height: 20px; }
+  .mdc-list--avatar-list .mdc-list-item {
+    height: 56px; }
+    .mdc-list--avatar-list .mdc-list-item__start-detail {
+      width: 40px;
+      height: 40px;
+      margin-left: 0;
+      margin-right: 16px;
+      border-radius: 50%; }
+      [dir="rtl"] .mdc-list-item .mdc-list--avatar-list .mdc-list-item__start-detail,
+      .mdc-list-item[dir="rtl"] .mdc-list--avatar-list .mdc-list-item__start-detail {
+        margin-left: 16px;
+        margin-right: 0; }
+  .mdc-list-item .mdc-list--avatar-list.mdc-list--dense .mdc-list__item {
+    height: 48px; }
+    .mdc-list-item .mdc-list--avatar-list.mdc-list--dense .mdc-list__item__start-detail {
+      width: 36px;
+      height: 36px;
+      margin-left: 0;
+      margin-right: 20px; }
+      [dir="rtl"] .mdc-list-item .mdc-list-item .mdc-list--avatar-list.mdc-list--dense .mdc-list__item__start-detail,
+      .mdc-list-item[dir="rtl"] .mdc-list-item .mdc-list--avatar-list.mdc-list--dense .mdc-list__item__start-detail {
+        margin-left: 20px;
+        margin-right: 0; }
+  .mdc-list--two-line .mdc-list-item {
+    height: 72px; }
+  .mdc-list--two-line.mdc-list--dense .mdc-list-item {
+    height: 60px; }
+
+a.mdc-list-item {
+  color: inherit;
+  text-decoration: none; }
+
+.mdc-list-item.mdc-ripple-upgraded {
+  --mdc-ripple-surface-width: 0;
+  --mdc-ripple-surface-height: 0;
+  --mdc-ripple-fg-size: 0;
+  --mdc-ripple-left: 0;
+  --mdc-ripple-top: 0;
+  --mdc-ripple-fg-scale: 1;
+  --mdc-ripple-fg-translate-end: 0;
+  --mdc-ripple-fg-translate-start: 0;
+  will-change: transform, opacity;
+  -webkit-tap-highlight-color: transparent;
+  left: -16px;
+  right: initial;
+  position: relative;
+  width: 100%;
+  padding: 0 16px;
+  overflow: hidden; }
+  .mdc-list-item.mdc-ripple-upgraded:not(.mdc-ripple-upgraded):hover::before, .mdc-list-item.mdc-ripple-upgraded:not(.mdc-ripple-upgraded):focus::before, .mdc-list-item.mdc-ripple-upgraded:not(.mdc-ripple-upgraded):active::after {
+    -webkit-transition-duration: 85ms;
+            transition-duration: 85ms;
+    opacity: .6; }
+  .mdc-list-item.mdc-ripple-upgraded::before {
+    background-color: rgba(0, 0, 0, 0.06);
+    position: absolute;
+    top: calc(50% - 100%);
+    left: calc(50% - 100%);
+    width: 200%;
+    height: 200%;
+    -webkit-transition: opacity 250ms linear;
+    transition: opacity 250ms linear;
+    border-radius: 50%;
+    opacity: 0;
+    pointer-events: none;
+    content: ""; }
+  .mdc-list-item.mdc-ripple-upgraded.mdc-ripple-upgraded::before {
+    top: calc(50% - 100%);
+    left: calc(50% - 100%);
+    width: 200%;
+    height: 200%;
+    /* @alternate */
+    -webkit-transform: scale(0);
+            transform: scale(0);
+    -webkit-transform: scale(var(--mdc-ripple-fg-scale, 0));
+            transform: scale(var(--mdc-ripple-fg-scale, 0)); }
+  .mdc-list-item.mdc-ripple-upgraded.mdc-ripple-upgraded--background-focused::before {
+    opacity: .99999; }
+  .mdc-list-item.mdc-ripple-upgraded.mdc-ripple-upgraded--background-active-fill::before {
+    -webkit-transition-duration: 120ms;
+            transition-duration: 120ms;
+    opacity: 1; }
+  .mdc-list-item.mdc-ripple-upgraded.mdc-ripple-upgraded--unbounded::before {
+    /* @alternate */
+    top: calc(50% - 50%);
+    top: var(--mdc-ripple-top, calc(50% - 50%));
+    /* @alternate */
+    left: calc(50% - 50%);
+    left: var(--mdc-ripple-left, calc(50% - 50%));
+    /* @alternate */
+    width: 100%;
+    width: var(--mdc-ripple-fg-size, 100%);
+    /* @alternate */
+    height: 100%;
+    height: var(--mdc-ripple-fg-size, 100%);
+    /* @alternate */
+    -webkit-transform: scale(0);
+            transform: scale(0);
+    -webkit-transform: scale(var(--mdc-ripple-fg-scale, 0));
+            transform: scale(var(--mdc-ripple-fg-scale, 0)); }
+  .mdc-list-item.mdc-ripple-upgraded::after {
+    background-color: rgba(0, 0, 0, 0.06);
+    position: absolute;
+    top: calc(50% - 100%);
+    left: calc(50% - 100%);
+    width: 200%;
+    height: 200%;
+    -webkit-transition: opacity 250ms linear;
+    transition: opacity 250ms linear;
+    border-radius: 50%;
+    opacity: 0;
+    pointer-events: none;
+    content: ""; }
+  .mdc-list-item.mdc-ripple-upgraded.mdc-ripple-upgraded::after {
+    top: 0;
+    left: 0;
+    /* @alternate */
+    width: 100%;
+    width: var(--mdc-ripple-fg-size, 100%);
+    /* @alternate */
+    height: 100%;
+    height: var(--mdc-ripple-fg-size, 100%);
+    -webkit-transform: scale(0);
+            transform: scale(0);
+    -webkit-transform-origin: center center;
+            transform-origin: center center;
+    opacity: 0; }
+  .mdc-list-item.mdc-ripple-upgraded:not(.mdc-ripple-upgraded--unbounded)::after {
+    -webkit-transform-origin: center center;
+            transform-origin: center center; }
+  .mdc-list-item.mdc-ripple-upgraded.mdc-ripple-upgraded--unbounded::after {
+    /* @alternate */
+    top: 0;
+    top: var(--mdc-ripple-top, 0);
+    /* @alternate */
+    left: 0;
+    left: var(--mdc-ripple-left, 0);
+    /* @alternate */
+    width: 100%;
+    width: var(--mdc-ripple-fg-size, 100%);
+    /* @alternate */
+    height: 100%;
+    height: var(--mdc-ripple-fg-size, 100%);
+    -webkit-transform: scale(0);
+            transform: scale(0);
+    -webkit-transform-origin: center center;
+            transform-origin: center center; }
+  .mdc-list-item.mdc-ripple-upgraded.mdc-ripple-upgraded--foreground-activation::after {
+    -webkit-animation: 300ms mdc-ripple-fg-radius-in forwards, 83ms mdc-ripple-fg-opacity-in forwards;
+            animation: 300ms mdc-ripple-fg-radius-in forwards, 83ms mdc-ripple-fg-opacity-in forwards; }
+  .mdc-list-item.mdc-ripple-upgraded.mdc-ripple-upgraded--foreground-deactivation::after {
+    -webkit-transform: translate(var(--mdc-ripple-fg-translate-end, 0)) scale(var(--mdc-ripple-fg-scale, 1));
+            transform: translate(var(--mdc-ripple-fg-translate-end, 0)) scale(var(--mdc-ripple-fg-scale, 1));
+    -webkit-animation: 83ms mdc-ripple-fg-opacity-out;
+            animation: 83ms mdc-ripple-fg-opacity-out; }
+  [dir="rtl"] .mdc-list-item.mdc-ripple-upgraded, .mdc-list-item.mdc-ripple-upgraded[dir="rtl"] {
+    left: initial;
+    right: -16px; }
+  .mdc-list-item.mdc-ripple-upgraded:focus {
+    outline: none; }
+  .mdc-list--theme-dark .mdc-list-item.mdc-ripple-upgraded::before,
+  .mdc-theme--dark .mdc-list-item.mdc-ripple-upgraded::before {
+    background-color: rgba(255, 255, 255, 0.12);
+    position: absolute;
+    top: calc(50% - 100%);
+    left: calc(50% - 100%);
+    width: 200%;
+    height: 200%;
+    -webkit-transition: opacity 250ms linear;
+    transition: opacity 250ms linear;
+    border-radius: 50%;
+    opacity: 0;
+    pointer-events: none;
+    content: ""; }
+  .mdc-list--theme-dark .mdc-list-item.mdc-ripple-upgraded.mdc-ripple-upgraded::before,
+  .mdc-theme--dark .mdc-list-item.mdc-ripple-upgraded.mdc-ripple-upgraded::before {
+    top: calc(50% - 100%);
+    left: calc(50% - 100%);
+    width: 200%;
+    height: 200%;
+    /* @alternate */
+    -webkit-transform: scale(0);
+            transform: scale(0);
+    -webkit-transform: scale(var(--mdc-ripple-fg-scale, 0));
+            transform: scale(var(--mdc-ripple-fg-scale, 0)); }
+  .mdc-list--theme-dark .mdc-list-item.mdc-ripple-upgraded.mdc-ripple-upgraded--background-focused::before,
+  .mdc-theme--dark .mdc-list-item.mdc-ripple-upgraded.mdc-ripple-upgraded--background-focused::before {
+    opacity: .99999; }
+  .mdc-list--theme-dark .mdc-list-item.mdc-ripple-upgraded.mdc-ripple-upgraded--background-active-fill::before,
+  .mdc-theme--dark .mdc-list-item.mdc-ripple-upgraded.mdc-ripple-upgraded--background-active-fill::before {
+    -webkit-transition-duration: 120ms;
+            transition-duration: 120ms;
+    opacity: 1; }
+  .mdc-list--theme-dark .mdc-list-item.mdc-ripple-upgraded.mdc-ripple-upgraded--unbounded::before,
+  .mdc-theme--dark .mdc-list-item.mdc-ripple-upgraded.mdc-ripple-upgraded--unbounded::before {
+    /* @alternate */
+    top: calc(50% - 50%);
+    top: var(--mdc-ripple-top, calc(50% - 50%));
+    /* @alternate */
+    left: calc(50% - 50%);
+    left: var(--mdc-ripple-left, calc(50% - 50%));
+    /* @alternate */
+    width: 100%;
+    width: var(--mdc-ripple-fg-size, 100%);
+    /* @alternate */
+    height: 100%;
+    height: var(--mdc-ripple-fg-size, 100%);
+    /* @alternate */
+    -webkit-transform: scale(0);
+            transform: scale(0);
+    -webkit-transform: scale(var(--mdc-ripple-fg-scale, 0));
+            transform: scale(var(--mdc-ripple-fg-scale, 0)); }
+  .mdc-list--theme-dark .mdc-list-item.mdc-ripple-upgraded::after,
+  .mdc-theme--dark .mdc-list-item.mdc-ripple-upgraded::after {
+    background-color: rgba(255, 255, 255, 0.12);
+    position: absolute;
+    top: calc(50% - 100%);
+    left: calc(50% - 100%);
+    width: 200%;
+    height: 200%;
+    -webkit-transition: opacity 250ms linear;
+    transition: opacity 250ms linear;
+    border-radius: 50%;
+    opacity: 0;
+    pointer-events: none;
+    content: ""; }
+  .mdc-list--theme-dark .mdc-list-item.mdc-ripple-upgraded.mdc-ripple-upgraded::after,
+  .mdc-theme--dark .mdc-list-item.mdc-ripple-upgraded.mdc-ripple-upgraded::after {
+    top: 0;
+    left: 0;
+    /* @alternate */
+    width: 100%;
+    width: var(--mdc-ripple-fg-size, 100%);
+    /* @alternate */
+    height: 100%;
+    height: var(--mdc-ripple-fg-size, 100%);
+    -webkit-transform: scale(0);
+            transform: scale(0);
+    -webkit-transform-origin: center center;
+            transform-origin: center center;
+    opacity: 0; }
+  .mdc-list--theme-dark .mdc-list-item.mdc-ripple-upgraded:not(.mdc-ripple-upgraded--unbounded)::after,
+  .mdc-theme--dark .mdc-list-item.mdc-ripple-upgraded:not(.mdc-ripple-upgraded--unbounded)::after {
+    -webkit-transform-origin: center center;
+            transform-origin: center center; }
+  .mdc-list--theme-dark .mdc-list-item.mdc-ripple-upgraded.mdc-ripple-upgraded--unbounded::after,
+  .mdc-theme--dark .mdc-list-item.mdc-ripple-upgraded.mdc-ripple-upgraded--unbounded::after {
+    /* @alternate */
+    top: 0;
+    top: var(--mdc-ripple-top, 0);
+    /* @alternate */
+    left: 0;
+    left: var(--mdc-ripple-left, 0);
+    /* @alternate */
+    width: 100%;
+    width: var(--mdc-ripple-fg-size, 100%);
+    /* @alternate */
+    height: 100%;
+    height: var(--mdc-ripple-fg-size, 100%);
+    -webkit-transform: scale(0);
+            transform: scale(0);
+    -webkit-transform-origin: center center;
+            transform-origin: center center; }
+  .mdc-list--theme-dark .mdc-list-item.mdc-ripple-upgraded.mdc-ripple-upgraded--foreground-activation::after,
+  .mdc-theme--dark .mdc-list-item.mdc-ripple-upgraded.mdc-ripple-upgraded--foreground-activation::after {
+    -webkit-animation: 300ms mdc-ripple-fg-radius-in forwards, 83ms mdc-ripple-fg-opacity-in forwards;
+            animation: 300ms mdc-ripple-fg-radius-in forwards, 83ms mdc-ripple-fg-opacity-in forwards; }
+  .mdc-list--theme-dark .mdc-list-item.mdc-ripple-upgraded.mdc-ripple-upgraded--foreground-deactivation::after,
+  .mdc-theme--dark .mdc-list-item.mdc-ripple-upgraded.mdc-ripple-upgraded--foreground-deactivation::after {
+    -webkit-transform: translate(var(--mdc-ripple-fg-translate-end, 0)) scale(var(--mdc-ripple-fg-scale, 1));
+            transform: translate(var(--mdc-ripple-fg-translate-end, 0)) scale(var(--mdc-ripple-fg-scale, 1));
+    -webkit-animation: 83ms mdc-ripple-fg-opacity-out;
+            animation: 83ms mdc-ripple-fg-opacity-out; }
+
+.mdc-list-divider {
+  height: 0;
+  margin: 0;
+  border: none;
+  border-bottom: 1px solid rgba(0, 0, 0, 0.12); }
+  .mdc-list--theme-dark .mdc-list-divider,
+  .mdc-theme--dark .mdc-list-divider {
+    border-bottom-color: rgba(255, 255, 255, 0.2); }
+
+.mdc-list-divider--inset {
+  margin-left: 56px;
+  margin-right: 0;
+  width: calc(100% - 56px); }
+  [dir="rtl"] .mdc-list-group .mdc-list-divider--inset,
+  .mdc-list-group[dir="rtl"] .mdc-list-divider--inset {
+    margin-left: 0;
+    margin-right: 56px; }
+
+.mdc-list-group {
+  padding: 0 16px; }
+  .mdc-list-group__subheader {
+    font-family: Roboto, sans-serif;
+    -moz-osx-font-smoothing: grayscale;
+    -webkit-font-smoothing: antialiased;
+    font-size: 0.875rem;
+    font-weight: 500;
+    letter-spacing: 0.04em;
+    line-height: 1.5rem;
+    text-decoration: inherit;
+    text-transform: inherit;
+    /* @alternate */
+    color: rgba(0, 0, 0, 0.87);
+    color: var(--mdc-theme-text-primary-on-background, rgba(0, 0, 0, 0.87));
+    margin: 0.75rem 0; }
+    .mdc-list-group__subheader--theme-dark,
+    .mdc-theme--dark .mdc-list-group__subheader {
+      /* @alternate */
+      color: white;
+      color: var(--mdc-theme-text-primary-on-dark, white); }
+  .mdc-list-group .mdc-list {
+    padding: 0; }

+ 83 - 0
support/client/lib/vwf/view/lib/mdc/dist/mdc.list.css-entry

@@ -0,0 +1,83 @@
+/*!
+ Material Components for the web
+ Copyright (c) 2017 Google Inc.
+ License: Apache-2.0
+*/
+/******/ (function(modules) { // webpackBootstrap
+/******/ 	// The module cache
+/******/ 	var installedModules = {};
+/******/
+/******/ 	// The require function
+/******/ 	function __webpack_require__(moduleId) {
+/******/
+/******/ 		// Check if module is in cache
+/******/ 		if(installedModules[moduleId]) {
+/******/ 			return installedModules[moduleId].exports;
+/******/ 		}
+/******/ 		// Create a new module (and put it into the cache)
+/******/ 		var module = installedModules[moduleId] = {
+/******/ 			i: moduleId,
+/******/ 			l: false,
+/******/ 			exports: {}
+/******/ 		};
+/******/
+/******/ 		// Execute the module function
+/******/ 		modules[moduleId].call(module.exports, module, module.exports, __webpack_require__);
+/******/
+/******/ 		// Flag the module as loaded
+/******/ 		module.l = true;
+/******/
+/******/ 		// Return the exports of the module
+/******/ 		return module.exports;
+/******/ 	}
+/******/
+/******/
+/******/ 	// expose the modules object (__webpack_modules__)
+/******/ 	__webpack_require__.m = modules;
+/******/
+/******/ 	// expose the module cache
+/******/ 	__webpack_require__.c = installedModules;
+/******/
+/******/ 	// identity function for calling harmony imports with the correct context
+/******/ 	__webpack_require__.i = function(value) { return value; };
+/******/
+/******/ 	// define getter function for harmony exports
+/******/ 	__webpack_require__.d = function(exports, name, getter) {
+/******/ 		if(!__webpack_require__.o(exports, name)) {
+/******/ 			Object.defineProperty(exports, name, {
+/******/ 				configurable: false,
+/******/ 				enumerable: true,
+/******/ 				get: getter
+/******/ 			});
+/******/ 		}
+/******/ 	};
+/******/
+/******/ 	// getDefaultExport function for compatibility with non-harmony modules
+/******/ 	__webpack_require__.n = function(module) {
+/******/ 		var getter = module && module.__esModule ?
+/******/ 			function getDefault() { return module['default']; } :
+/******/ 			function getModuleExports() { return module; };
+/******/ 		__webpack_require__.d(getter, 'a', getter);
+/******/ 		return getter;
+/******/ 	};
+/******/
+/******/ 	// Object.prototype.hasOwnProperty.call
+/******/ 	__webpack_require__.o = function(object, property) { return Object.prototype.hasOwnProperty.call(object, property); };
+/******/
+/******/ 	// __webpack_public_path__
+/******/ 	__webpack_require__.p = "/assets/";
+/******/
+/******/ 	// Load entry module and return exports
+/******/ 	return __webpack_require__(__webpack_require__.s = 14);
+/******/ })
+/************************************************************************/
+/******/ ({
+
+/***/ 14:
+/***/ (function(module, exports) {
+
+// removed by extract-text-webpack-plugin
+
+/***/ })
+
+/******/ });

+ 272 - 0
support/client/lib/vwf/view/lib/mdc/dist/mdc.menu.css

@@ -0,0 +1,272 @@
+/*!
+ Material Components for the web
+ Copyright (c) 2017 Google Inc.
+ License: Apache-2.0
+*/
+/**
+ * The css property used for elevation. In most cases this should not be changed. It is exposed
+ * as a variable for abstraction / easy use when needing to reference the property directly, for
+ * example in a `will-change` rule.
+ */
+/**
+ * The default duration value for elevation transitions.
+ */
+/**
+ * The default easing value for elevation transitions.
+ */
+/**
+ * Applies the correct css rules to an element to give it the elevation specified by $z-value.
+ * The $z-value must be between 0 and 24.
+ */
+/**
+ * Returns a string that can be used as the value for a `transition` property for elevation.
+ * Calling this function directly is useful in situations where a component needs to transition
+ * more than one property.
+ *
+ * ```scss
+ * .foo {
+ *   transition: mdc-elevation-transition-rule(), opacity 100ms ease;
+ *   will-change: $mdc-elevation-property, opacity;
+ * }
+ * ```
+ */
+/**
+ * Applies the correct css rules needed to have an element transition between elevations.
+ * This mixin should be applied to elements whose elevation values will change depending on their
+ * context (e.g. when active or disabled).
+ */
+/*
+  Precomputed linear color channel values, for use in contrast calculations.
+  See https://www.w3.org/TR/WCAG20-TECHS/G17.html#G17-tests
+
+  Algorithm, for c in 0 to 255:
+  f(c) {
+    c = c / 255;
+    return c < 0.03928 ? c / 12.92 : Math.pow((c + 0.055) / 1.055, 2.4);
+  }
+
+  This lookup table is needed since there is no `pow` in SASS.
+*/
+/**
+ * Calculate the luminance for a color.
+ * See https://www.w3.org/TR/WCAG20-TECHS/G17.html#G17-tests
+ */
+/**
+ * Calculate the contrast ratio between two colors.
+ * See https://www.w3.org/TR/WCAG20-TECHS/G17.html#G17-tests
+ */
+/**
+ * Determine whether to use dark or light text on top of given color.
+ * Returns "dark" for dark text and "light" for light text.
+ */
+/*
+  Main theme colors.
+  If you're a user customizing your color scheme in SASS, these are probably the only variables you need to change.
+*/
+/* Indigo 500 */
+/* Pink A200 */
+/* White */
+/* Which set of text colors to use for each main theme color (light or dark) */
+/* Text colors according to light vs dark and text type */
+/* Primary text colors for each of the theme colors */
+/**
+ * Applies the correct theme color style to the specified property.
+ * $property is typically color or background-color, but can be any CSS property that accepts color values.
+ * $style should be one of the map keys in $mdc-theme-property-values (_variables.scss).
+ */
+/**
+ * Creates a rule to be used in MDC-Web components for dark theming, and applies the provided contents.
+ * Should provide the $root-selector option if applied to anything other than the root selector.
+ * When used with a modifier class, provide a second argument of `true` for the $compound parameter
+ * to specify that this should be attached as a compound class.
+ *
+ * Usage example:
+ *
+ * ```scss
+ * .mdc-foo {
+ *   color: black;
+ *
+ *   @include mdc-theme-dark {
+ *     color: white;
+ *   }
+ *
+ *   &__bar {
+ *     background: black;
+ *
+ *     @include mdc-theme-dark(".mdc-foo") {
+ *       background: white;
+ *     }
+ *   }
+ * }
+ *
+ * .mdc-foo--disabled {
+ *   opacity: .38;
+ *
+ *   @include mdc-theme-dark(".mdc-foo", true) {
+ *     opacity: .5;
+ *   }
+ * }
+ * ```
+ */
+/* TODO(sgomes): Figure out what to do about desktop font sizes. */
+/* TODO(sgomes): Figure out what to do about i18n and i18n font sizes. */
+/* postcss-bem-linter: define simple-menu */
+.mdc-simple-menu {
+  display: none;
+  position: absolute;
+  min-width: 170px;
+  max-width: calc(100vw - 32px);
+  max-height: calc(100vh - 32px);
+  margin: 0;
+  padding: 0;
+  -webkit-transform: scale(0);
+          transform: scale(0);
+  -webkit-transform-origin: top left;
+          transform-origin: top left;
+  border-radius: 2px;
+  background-color: white;
+  white-space: nowrap;
+  opacity: 0;
+  overflow: hidden;
+  -webkit-box-sizing: border-box;
+          box-sizing: border-box;
+  will-change: transform, opacity;
+  z-index: 4;
+  -webkit-box-shadow: 0px 3px 1px -2px rgba(0, 0, 0, 0.2), 0px 2px 2px 0px rgba(0, 0, 0, 0.14), 0px 1px 5px 0px rgba(0, 0, 0, 0.12);
+          box-shadow: 0px 3px 1px -2px rgba(0, 0, 0, 0.2), 0px 2px 2px 0px rgba(0, 0, 0, 0.14), 0px 1px 5px 0px rgba(0, 0, 0, 0.12);
+  /* stylelint-disable plugin/selector-bem-pattern */
+  /* stylelint-enable plugin/selector-bem-pattern */
+  /* stylelint-disable plugin/selector-bem-pattern */
+  /* stylelint-disable selector-no-qualifying-type */
+  /* stylelint-enable selector-no-qualifying-type */
+  /* TODO(sgomes): Revisit when we have interactive lists. */
+  /* stylelint-enable plugin/selector-bem-pattern */ }
+  .mdc-simple-menu--theme-dark,
+  .mdc-theme--dark .mdc-simple-menu {
+    background-color: #424242; }
+  .mdc-simple-menu:focus {
+    outline: none; }
+  .mdc-simple-menu--open {
+    display: inline-block;
+    -webkit-transform: scale(1);
+            transform: scale(1);
+    opacity: 1; }
+  .mdc-simple-menu--animating {
+    display: inline-block;
+    -webkit-transition: opacity 0.2s cubic-bezier(0, 0, 0.2, 1);
+    transition: opacity 0.2s cubic-bezier(0, 0, 0.2, 1); }
+  .mdc-simple-menu__items {
+    overflow-x: hidden;
+    overflow-y: auto;
+    -webkit-box-sizing: border-box;
+            box-sizing: border-box;
+    will-change: transform;
+    /* stylelint-disable plugin/selector-bem-pattern, selector-no-universal */
+    /* stylelint-enable plugin/selector-bem-pattern, selector-no-universal */ }
+    .mdc-simple-menu__items > * {
+      opacity: 0; }
+    .mdc-simple-menu__items > .mdc-list-item {
+      cursor: pointer; }
+    .mdc-simple-menu--animating .mdc-simple-menu__items {
+      overflow-y: hidden; }
+      .mdc-simple-menu--animating .mdc-simple-menu__items > * {
+        -webkit-transition-duration: 0.3s;
+                transition-duration: 0.3s;
+        -webkit-transition-property: opacity;
+        transition-property: opacity;
+        -webkit-transition-timing-function: cubic-bezier(0, 0, 0.2, 1);
+                transition-timing-function: cubic-bezier(0, 0, 0.2, 1); }
+    .mdc-simple-menu--open .mdc-simple-menu__items > * {
+      opacity: 1;
+      will-change: opacity; }
+  [dir="rtl"] .mdc-simple-menu {
+    -webkit-transform-origin: top right;
+            transform-origin: top right; }
+  .mdc-simple-menu--open-from-top-left {
+    -webkit-transform-origin: top left !important;
+            transform-origin: top left !important; }
+  .mdc-simple-menu--open-from-top-right {
+    -webkit-transform-origin: top right !important;
+            transform-origin: top right !important; }
+  .mdc-simple-menu--open-from-bottom-left {
+    -webkit-transform-origin: bottom left !important;
+            transform-origin: bottom left !important; }
+  .mdc-simple-menu--open-from-bottom-right {
+    -webkit-transform-origin: bottom right !important;
+            transform-origin: bottom right !important; }
+  .mdc-simple-menu .mdc-list-group,
+  .mdc-simple-menu .mdc-list {
+    padding: 8px 0; }
+  .mdc-simple-menu .mdc-list-item {
+    position: relative;
+    padding: 0 16px;
+    outline: none;
+    color: inherit;
+    text-decoration: none;
+    -webkit-user-select: none;
+       -moz-user-select: none;
+        -ms-user-select: none;
+            user-select: none;
+    font-family: Roboto, sans-serif;
+    -moz-osx-font-smoothing: grayscale;
+    -webkit-font-smoothing: antialiased;
+    font-size: 1rem;
+    font-weight: 400;
+    letter-spacing: 0.04em;
+    line-height: 1.75rem;
+    text-decoration: inherit;
+    text-transform: inherit; }
+    .mdc-simple-menu--theme-dark.mdc-simple-menu .mdc-list-item,
+    .mdc-theme--dark .mdc-simple-menu .mdc-list-item {
+      color: white; }
+  .mdc-simple-menu--theme-dark.mdc-simple-menu .mdc-list-divider,
+  .mdc-theme--dark .mdc-simple-menu .mdc-list-divider {
+    border-color: rgba(255, 255, 255, 0.12); }
+  .mdc-simple-menu .mdc-list-item__start-detail {
+    color: rgba(0, 0, 0, 0.54); }
+    .mdc-simple-menu--theme-dark.mdc-simple-menu .mdc-list-item__start-detail,
+    .mdc-theme--dark .mdc-simple-menu .mdc-list-item__start-detail {
+      color: rgba(255, 255, 255, 0.54); }
+  .mdc-simple-menu--selected.mdc-list-item,
+  .mdc-simple-menu--selected.mdc-list-item .mdc-list-item__start-detail {
+    /* @alternate */
+    color: #3f51b5;
+    color: var(--mdc-theme-primary, #3f51b5); }
+  .mdc-simple-menu .mdc-list-item::before {
+    position: absolute;
+    top: 0;
+    left: 0;
+    width: 100%;
+    height: 100%;
+    -webkit-transition: opacity 120ms cubic-bezier(0, 0, 0.2, 1);
+    transition: opacity 120ms cubic-bezier(0, 0, 0.2, 1);
+    border-radius: inherit;
+    background: currentColor;
+    content: "";
+    opacity: 0; }
+  .mdc-simple-menu .mdc-list-item:focus::before {
+    opacity: .12; }
+  .mdc-simple-menu .mdc-list-item:active::before {
+    /*
+      Slightly darker value for visual distinction.
+      This allows a full base that has distinct modes.
+      Progressive enhancement with ripples will provide complete button spec alignment.
+    */
+    opacity: .18; }
+  .mdc-simple-menu .mdc-list-item[aria-disabled="true"] {
+    cursor: default;
+    /* @alternate */
+    color: rgba(0, 0, 0, 0.38);
+    color: var(--mdc-theme-text-disabled-on-light, rgba(0, 0, 0, 0.38)); }
+    .mdc-select--theme-dark .mdc-simple-menu .mdc-list-item[aria-disabled="true"],
+    .mdc-theme--dark .mdc-simple-menu .mdc-list-item[aria-disabled="true"] {
+      /* @alternate */
+      color: rgba(255, 255, 255, 0.5);
+      color: var(--mdc-theme-text-disabled-on-dark, rgba(255, 255, 255, 0.5)); }
+  .mdc-simple-menu .mdc-list-item[aria-disabled="true"]:focus::before, .mdc-simple-menu .mdc-list-item[aria-disabled="true"]:active::before {
+    opacity: 0; }
+
+/* postcss-bem-linter: end */
+.mdc-menu-anchor {
+  position: relative;
+  overflow: visible; }

+ 83 - 0
support/client/lib/vwf/view/lib/mdc/dist/mdc.menu.css-entry

@@ -0,0 +1,83 @@
+/*!
+ Material Components for the web
+ Copyright (c) 2017 Google Inc.
+ License: Apache-2.0
+*/
+/******/ (function(modules) { // webpackBootstrap
+/******/ 	// The module cache
+/******/ 	var installedModules = {};
+/******/
+/******/ 	// The require function
+/******/ 	function __webpack_require__(moduleId) {
+/******/
+/******/ 		// Check if module is in cache
+/******/ 		if(installedModules[moduleId]) {
+/******/ 			return installedModules[moduleId].exports;
+/******/ 		}
+/******/ 		// Create a new module (and put it into the cache)
+/******/ 		var module = installedModules[moduleId] = {
+/******/ 			i: moduleId,
+/******/ 			l: false,
+/******/ 			exports: {}
+/******/ 		};
+/******/
+/******/ 		// Execute the module function
+/******/ 		modules[moduleId].call(module.exports, module, module.exports, __webpack_require__);
+/******/
+/******/ 		// Flag the module as loaded
+/******/ 		module.l = true;
+/******/
+/******/ 		// Return the exports of the module
+/******/ 		return module.exports;
+/******/ 	}
+/******/
+/******/
+/******/ 	// expose the modules object (__webpack_modules__)
+/******/ 	__webpack_require__.m = modules;
+/******/
+/******/ 	// expose the module cache
+/******/ 	__webpack_require__.c = installedModules;
+/******/
+/******/ 	// identity function for calling harmony imports with the correct context
+/******/ 	__webpack_require__.i = function(value) { return value; };
+/******/
+/******/ 	// define getter function for harmony exports
+/******/ 	__webpack_require__.d = function(exports, name, getter) {
+/******/ 		if(!__webpack_require__.o(exports, name)) {
+/******/ 			Object.defineProperty(exports, name, {
+/******/ 				configurable: false,
+/******/ 				enumerable: true,
+/******/ 				get: getter
+/******/ 			});
+/******/ 		}
+/******/ 	};
+/******/
+/******/ 	// getDefaultExport function for compatibility with non-harmony modules
+/******/ 	__webpack_require__.n = function(module) {
+/******/ 		var getter = module && module.__esModule ?
+/******/ 			function getDefault() { return module['default']; } :
+/******/ 			function getModuleExports() { return module; };
+/******/ 		__webpack_require__.d(getter, 'a', getter);
+/******/ 		return getter;
+/******/ 	};
+/******/
+/******/ 	// Object.prototype.hasOwnProperty.call
+/******/ 	__webpack_require__.o = function(object, property) { return Object.prototype.hasOwnProperty.call(object, property); };
+/******/
+/******/ 	// __webpack_public_path__
+/******/ 	__webpack_require__.p = "/assets/";
+/******/
+/******/ 	// Load entry module and return exports
+/******/ 	return __webpack_require__(__webpack_require__.s = 15);
+/******/ })
+/************************************************************************/
+/******/ ({
+
+/***/ 15:
+/***/ (function(module, exports) {
+
+// removed by extract-text-webpack-plugin
+
+/***/ })
+
+/******/ });

+ 1790 - 0
support/client/lib/vwf/view/lib/mdc/dist/mdc.menu.js

@@ -0,0 +1,1790 @@
+/*!
+ Material Components for the web
+ Copyright (c) 2017 Google Inc.
+ License: Apache-2.0
+*/
+(function webpackUniversalModuleDefinition(root, factory) {
+	if(typeof exports === 'object' && typeof module === 'object')
+		module.exports = factory();
+	else if(typeof define === 'function' && define.amd)
+		define([], factory);
+	else if(typeof exports === 'object')
+		exports["menu"] = factory();
+	else
+		root["mdc"] = root["mdc"] || {}, root["mdc"]["menu"] = factory();
+})(this, function() {
+return /******/ (function(modules) { // webpackBootstrap
+/******/ 	// The module cache
+/******/ 	var installedModules = {};
+/******/
+/******/ 	// The require function
+/******/ 	function __webpack_require__(moduleId) {
+/******/
+/******/ 		// Check if module is in cache
+/******/ 		if(installedModules[moduleId]) {
+/******/ 			return installedModules[moduleId].exports;
+/******/ 		}
+/******/ 		// Create a new module (and put it into the cache)
+/******/ 		var module = installedModules[moduleId] = {
+/******/ 			i: moduleId,
+/******/ 			l: false,
+/******/ 			exports: {}
+/******/ 		};
+/******/
+/******/ 		// Execute the module function
+/******/ 		modules[moduleId].call(module.exports, module, module.exports, __webpack_require__);
+/******/
+/******/ 		// Flag the module as loaded
+/******/ 		module.l = true;
+/******/
+/******/ 		// Return the exports of the module
+/******/ 		return module.exports;
+/******/ 	}
+/******/
+/******/
+/******/ 	// expose the modules object (__webpack_modules__)
+/******/ 	__webpack_require__.m = modules;
+/******/
+/******/ 	// expose the module cache
+/******/ 	__webpack_require__.c = installedModules;
+/******/
+/******/ 	// identity function for calling harmony imports with the correct context
+/******/ 	__webpack_require__.i = function(value) { return value; };
+/******/
+/******/ 	// define getter function for harmony exports
+/******/ 	__webpack_require__.d = function(exports, name, getter) {
+/******/ 		if(!__webpack_require__.o(exports, name)) {
+/******/ 			Object.defineProperty(exports, name, {
+/******/ 				configurable: false,
+/******/ 				enumerable: true,
+/******/ 				get: getter
+/******/ 			});
+/******/ 		}
+/******/ 	};
+/******/
+/******/ 	// getDefaultExport function for compatibility with non-harmony modules
+/******/ 	__webpack_require__.n = function(module) {
+/******/ 		var getter = module && module.__esModule ?
+/******/ 			function getDefault() { return module['default']; } :
+/******/ 			function getModuleExports() { return module; };
+/******/ 		__webpack_require__.d(getter, 'a', getter);
+/******/ 		return getter;
+/******/ 	};
+/******/
+/******/ 	// Object.prototype.hasOwnProperty.call
+/******/ 	__webpack_require__.o = function(object, property) { return Object.prototype.hasOwnProperty.call(object, property); };
+/******/
+/******/ 	// __webpack_public_path__
+/******/ 	__webpack_require__.p = "/assets/";
+/******/
+/******/ 	// Load entry module and return exports
+/******/ 	return __webpack_require__(__webpack_require__.s = 91);
+/******/ })
+/************************************************************************/
+/******/ ({
+
+/***/ 0:
+/***/ (function(module, __webpack_exports__, __webpack_require__) {
+
+"use strict";
+var _createClass = function () { function defineProperties(target, props) { for (var i = 0; i < props.length; i++) { var descriptor = props[i]; descriptor.enumerable = descriptor.enumerable || false; descriptor.configurable = true; if ("value" in descriptor) descriptor.writable = true; Object.defineProperty(target, descriptor.key, descriptor); } } return function (Constructor, protoProps, staticProps) { if (protoProps) defineProperties(Constructor.prototype, protoProps); if (staticProps) defineProperties(Constructor, staticProps); return Constructor; }; }();
+
+function _classCallCheck(instance, Constructor) { if (!(instance instanceof Constructor)) { throw new TypeError("Cannot call a class as a function"); } }
+
+/**
+ * Copyright 2016 Google Inc.
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *   http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+
+/**
+ * @template A
+ */
+var MDCFoundation = function () {
+  _createClass(MDCFoundation, null, [{
+    key: "cssClasses",
+
+    /** @return enum{cssClasses} */
+    get: function get() {
+      // Classes extending MDCFoundation should implement this method to return an object which exports every
+      // CSS class the foundation class needs as a property. e.g. {ACTIVE: 'mdc-component--active'}
+      return {};
+    }
+
+    /** @return enum{strings} */
+
+  }, {
+    key: "strings",
+    get: function get() {
+      // Classes extending MDCFoundation should implement this method to return an object which exports all
+      // semantic strings as constants. e.g. {ARIA_ROLE: 'tablist'}
+      return {};
+    }
+
+    /** @return enum{numbers} */
+
+  }, {
+    key: "numbers",
+    get: function get() {
+      // Classes extending MDCFoundation should implement this method to return an object which exports all
+      // of its semantic numbers as constants. e.g. {ANIMATION_DELAY_MS: 350}
+      return {};
+    }
+
+    /** @return {!Object} */
+
+  }, {
+    key: "defaultAdapter",
+    get: function get() {
+      // Classes extending MDCFoundation may choose to implement this getter in order to provide a convenient
+      // way of viewing the necessary methods of an adapter. In the future, this could also be used for adapter
+      // validation.
+      return {};
+    }
+
+    /**
+     * @param {A=} adapter
+     */
+
+  }]);
+
+  function MDCFoundation() {
+    var adapter = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : {};
+
+    _classCallCheck(this, MDCFoundation);
+
+    /** @protected {!A} */
+    this.adapter_ = adapter;
+  }
+
+  _createClass(MDCFoundation, [{
+    key: "init",
+    value: function init() {
+      // Subclasses should override this method to perform initialization routines (registering events, etc.)
+    }
+  }, {
+    key: "destroy",
+    value: function destroy() {
+      // Subclasses should override this method to perform de-initialization routines (de-registering events, etc.)
+    }
+  }]);
+
+  return MDCFoundation;
+}();
+
+/* harmony default export */ __webpack_exports__["a"] = (MDCFoundation);
+
+/***/ }),
+
+/***/ 1:
+/***/ (function(module, __webpack_exports__, __webpack_require__) {
+
+"use strict";
+/* harmony import */ var __WEBPACK_IMPORTED_MODULE_0__foundation__ = __webpack_require__(0);
+var _createClass = function () { function defineProperties(target, props) { for (var i = 0; i < props.length; i++) { var descriptor = props[i]; descriptor.enumerable = descriptor.enumerable || false; descriptor.configurable = true; if ("value" in descriptor) descriptor.writable = true; Object.defineProperty(target, descriptor.key, descriptor); } } return function (Constructor, protoProps, staticProps) { if (protoProps) defineProperties(Constructor.prototype, protoProps); if (staticProps) defineProperties(Constructor, staticProps); return Constructor; }; }();
+
+function _classCallCheck(instance, Constructor) { if (!(instance instanceof Constructor)) { throw new TypeError("Cannot call a class as a function"); } }
+
+/**
+ * Copyright 2016 Google Inc.
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *   http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+
+
+
+/**
+ * @template F
+ */
+
+var MDCComponent = function () {
+  _createClass(MDCComponent, null, [{
+    key: 'attachTo',
+
+    /**
+     * @param {!Element} root
+     * @return {!MDCComponent}
+     */
+    value: function attachTo(root) {
+      // Subclasses which extend MDCBase should provide an attachTo() method that takes a root element and
+      // returns an instantiated component with its root set to that element. Also note that in the cases of
+      // subclasses, an explicit foundation class will not have to be passed in; it will simply be initialized
+      // from getDefaultFoundation().
+      return new MDCComponent(root, new __WEBPACK_IMPORTED_MODULE_0__foundation__["a" /* default */]());
+    }
+
+    /**
+     * @param {!Element} root
+     * @param {F=} foundation
+     * @param {...?} args
+     */
+
+  }]);
+
+  function MDCComponent(root) {
+    var foundation = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : undefined;
+
+    _classCallCheck(this, MDCComponent);
+
+    /** @protected {!Element} */
+    this.root_ = root;
+
+    for (var _len = arguments.length, args = Array(_len > 2 ? _len - 2 : 0), _key = 2; _key < _len; _key++) {
+      args[_key - 2] = arguments[_key];
+    }
+
+    this.initialize.apply(this, args);
+    // Note that we initialize foundation here and not within the constructor's default param so that
+    // this.root_ is defined and can be used within the foundation class.
+    /** @protected {!F} */
+    this.foundation_ = foundation === undefined ? this.getDefaultFoundation() : foundation;
+    this.foundation_.init();
+    this.initialSyncWithDOM();
+  }
+
+  _createClass(MDCComponent, [{
+    key: 'initialize',
+    value: function initialize() /* ...args */{}
+    // Subclasses can override this to do any additional setup work that would be considered part of a
+    // "constructor". Essentially, it is a hook into the parent constructor before the foundation is
+    // initialized. Any additional arguments besides root and foundation will be passed in here.
+
+
+    /**
+     * @return {!F} foundation
+     */
+
+  }, {
+    key: 'getDefaultFoundation',
+    value: function getDefaultFoundation() {
+      // Subclasses must override this method to return a properly configured foundation class for the
+      // component.
+      throw new Error('Subclasses must override getDefaultFoundation to return a properly configured ' + 'foundation class');
+    }
+  }, {
+    key: 'initialSyncWithDOM',
+    value: function initialSyncWithDOM() {
+      // Subclasses should override this method if they need to perform work to synchronize with a host DOM
+      // object. An example of this would be a form control wrapper that needs to synchronize its internal state
+      // to some property or attribute of the host DOM. Please note: this is *not* the place to perform DOM
+      // reads/writes that would cause layout / paint, as this is called synchronously from within the constructor.
+    }
+  }, {
+    key: 'destroy',
+    value: function destroy() {
+      // Subclasses may implement this method to release any resources / deregister any listeners they have
+      // attached. An example of this might be deregistering a resize event from the window object.
+      this.foundation_.destroy();
+    }
+
+    /**
+     * Wrapper method to add an event listener to the component's root element. This is most useful when
+     * listening for custom events.
+     * @param {string} evtType
+     * @param {!Function} handler
+     */
+
+  }, {
+    key: 'listen',
+    value: function listen(evtType, handler) {
+      this.root_.addEventListener(evtType, handler);
+    }
+
+    /**
+     * Wrapper method to remove an event listener to the component's root element. This is most useful when
+     * unlistening for custom events.
+     * @param {string} evtType
+     * @param {!Function} handler
+     */
+
+  }, {
+    key: 'unlisten',
+    value: function unlisten(evtType, handler) {
+      this.root_.removeEventListener(evtType, handler);
+    }
+
+    /**
+     * Fires a cross-browser-compatible custom event from the component root of the given type,
+     * with the given data.
+     * @param {string} evtType
+     * @param {!Object} evtData
+     * @param {boolean=} shouldBubble
+     */
+
+  }, {
+    key: 'emit',
+    value: function emit(evtType, evtData) {
+      var shouldBubble = arguments.length > 2 && arguments[2] !== undefined ? arguments[2] : false;
+
+      var evt = void 0;
+      if (typeof CustomEvent === 'function') {
+        evt = new CustomEvent(evtType, {
+          detail: evtData,
+          bubbles: shouldBubble
+        });
+      } else {
+        evt = document.createEvent('CustomEvent');
+        evt.initCustomEvent(evtType, shouldBubble, false, evtData);
+      }
+
+      this.root_.dispatchEvent(evt);
+    }
+  }]);
+
+  return MDCComponent;
+}();
+
+/* harmony default export */ __webpack_exports__["a"] = (MDCComponent);
+
+/***/ }),
+
+/***/ 10:
+/***/ (function(module, __webpack_exports__, __webpack_require__) {
+
+"use strict";
+Object.defineProperty(__webpack_exports__, "__esModule", { value: true });
+/* harmony export (immutable) */ __webpack_exports__["getTransformPropertyName"] = getTransformPropertyName;
+/* harmony export (immutable) */ __webpack_exports__["clamp"] = clamp;
+/* harmony export (immutable) */ __webpack_exports__["bezierProgress"] = bezierProgress;
+/**
+ * Copyright 2016 Google Inc. All Rights Reserved.
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *      http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+
+/** @type {string|undefined} */
+var storedTransformPropertyName_ = void 0;
+
+/**
+ * Returns the name of the correct transform property to use on the current browser.
+ * @param {!Window} globalObj
+ * @param {boolean=} forceRefresh
+ * @return {string}
+ */
+function getTransformPropertyName(globalObj) {
+  var forceRefresh = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : false;
+
+  if (storedTransformPropertyName_ === undefined || forceRefresh) {
+    var el = globalObj.document.createElement('div');
+    var transformPropertyName = 'transform' in el.style ? 'transform' : 'webkitTransform';
+    storedTransformPropertyName_ = transformPropertyName;
+  }
+
+  return storedTransformPropertyName_;
+}
+
+/**
+ * Clamps a value between the minimum and the maximum, returning the clamped value.
+ * @param {number} value
+ * @param {number} min
+ * @param {number} max
+ * @return {number}
+ */
+function clamp(value) {
+  var min = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : 0;
+  var max = arguments.length > 2 && arguments[2] !== undefined ? arguments[2] : 1;
+
+  return Math.min(max, Math.max(min, value));
+}
+
+/**
+ * Returns the easing value to apply at time t, for a given cubic bezier curve.
+ * Control points P0 and P3 are assumed to be (0,0) and (1,1), respectively.
+ * Parameters are as follows:
+ * - time: The current time in the animation, scaled between 0 and 1.
+ * - x1: The x value of control point P1.
+ * - y1: The y value of control point P1.
+ * - x2: The x value of control point P2.
+ * - y2: The y value of control point P2.
+ * @param {number} time
+ * @param {number} x1
+ * @param {number} y1
+ * @param {number} x2
+ * @param {number} y2
+ * @return {number}
+ */
+function bezierProgress(time, x1, y1, x2, y2) {
+  return getBezierCoordinate_(solvePositionFromXValue_(time, x1, x2), y1, y2);
+}
+
+/**
+ * Compute a single coordinate at a position point between 0 and 1.
+ * c1 and c2 are the matching coordinate on control points P1 and P2, respectively.
+ * Control points P0 and P3 are assumed to be (0,0) and (1,1), respectively.
+ * Adapted from https://github.com/google/closure-library/blob/master/closure/goog/math/bezier.js.
+ * @param {number} t
+ * @param {number} c1
+ * @param {number} c2
+ * @return {number}
+ */
+function getBezierCoordinate_(t, c1, c2) {
+  // Special case start and end.
+  if (t === 0 || t === 1) {
+    return t;
+  }
+
+  // Step one - from 4 points to 3
+  var ic0 = t * c1;
+  var ic1 = c1 + t * (c2 - c1);
+  var ic2 = c2 + t * (1 - c2);
+
+  // Step two - from 3 points to 2
+  ic0 += t * (ic1 - ic0);
+  ic1 += t * (ic2 - ic1);
+
+  // Final step - last point
+  return ic0 + t * (ic1 - ic0);
+}
+
+/**
+ * Project a point onto the Bezier curve, from a given X. Calculates the position t along the curve.
+ * Adapted from https://github.com/google/closure-library/blob/master/closure/goog/math/bezier.js.
+ * @param {number} xVal
+ * @param {number} x1
+ * @param {number} x2
+ * @return {number}
+ */
+function solvePositionFromXValue_(xVal, x1, x2) {
+  var EPSILON = 1e-6;
+  var MAX_ITERATIONS = 8;
+
+  if (xVal <= 0) {
+    return 0;
+  } else if (xVal >= 1) {
+    return 1;
+  }
+
+  // Initial estimate of t using linear interpolation.
+  var t = xVal;
+
+  // Try gradient descent to solve for t. If it works, it is very fast.
+  var tMin = 0;
+  var tMax = 1;
+  var value = 0;
+  for (var i = 0; i < MAX_ITERATIONS; i++) {
+    value = getBezierCoordinate_(t, x1, x2);
+    var derivative = (getBezierCoordinate_(t + EPSILON, x1, x2) - value) / EPSILON;
+    if (Math.abs(value - xVal) < EPSILON) {
+      return t;
+    } else if (Math.abs(derivative) < EPSILON) {
+      break;
+    } else {
+      if (value < xVal) {
+        tMin = t;
+      } else {
+        tMax = t;
+      }
+      t -= (value - xVal) / derivative;
+    }
+  }
+
+  // If the gradient descent got stuck in a local minimum, e.g. because
+  // the derivative was close to 0, use a Dichotomy refinement instead.
+  // We limit the number of interations to 8.
+  for (var _i = 0; Math.abs(value - xVal) > EPSILON && _i < MAX_ITERATIONS; _i++) {
+    if (value < xVal) {
+      tMin = t;
+      t = (t + tMax) / 2;
+    } else {
+      tMax = t;
+      t = (t + tMin) / 2;
+    }
+    value = getBezierCoordinate_(t, x1, x2);
+  }
+  return t;
+}
+
+/***/ }),
+
+/***/ 11:
+/***/ (function(module, __webpack_exports__, __webpack_require__) {
+
+"use strict";
+Object.defineProperty(__webpack_exports__, "__esModule", { value: true });
+/* harmony import */ var __WEBPACK_IMPORTED_MODULE_0__util__ = __webpack_require__(10);
+/* harmony import */ var __WEBPACK_IMPORTED_MODULE_1__simple__ = __webpack_require__(17);
+/* harmony reexport (binding) */ __webpack_require__.d(__webpack_exports__, "MDCSimpleMenu", function() { return __WEBPACK_IMPORTED_MODULE_1__simple__["a"]; });
+/* harmony reexport (binding) */ __webpack_require__.d(__webpack_exports__, "MDCSimpleMenuFoundation", function() { return __WEBPACK_IMPORTED_MODULE_1__simple__["b"]; });
+/* harmony reexport (module object) */ __webpack_require__.d(__webpack_exports__, "util", function() { return __WEBPACK_IMPORTED_MODULE_0__util__; });
+/**
+ * Copyright 2016 Google Inc. All Rights Reserved.
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *      http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+
+
+
+
+
+/***/ }),
+
+/***/ 14:
+/***/ (function(module, __webpack_exports__, __webpack_require__) {
+
+"use strict";
+var _createClass = function () { function defineProperties(target, props) { for (var i = 0; i < props.length; i++) { var descriptor = props[i]; descriptor.enumerable = descriptor.enumerable || false; descriptor.configurable = true; if ("value" in descriptor) descriptor.writable = true; Object.defineProperty(target, descriptor.key, descriptor); } } return function (Constructor, protoProps, staticProps) { if (protoProps) defineProperties(Constructor.prototype, protoProps); if (staticProps) defineProperties(Constructor, staticProps); return Constructor; }; }();
+
+function _classCallCheck(instance, Constructor) { if (!(instance instanceof Constructor)) { throw new TypeError("Cannot call a class as a function"); } }
+
+/**
+ * Copyright 2016 Google Inc. All Rights Reserved.
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *      http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+
+/* eslint no-unused-vars: [2, {"args": "none"}] */
+
+/**
+ * Adapter for MDC Simple Menu. Provides an interface for managing
+ * - classes
+ * - dom
+ * - focus
+ * - position
+ * - dimensions
+ * - event handlers
+ *
+ * Additionally, provides type information for the adapter to the Closure
+ * compiler.
+ *
+ * Implement this adapter for your framework of choice to delegate updates to
+ * the component in your framework of choice. See architecture documentation
+ * for more details.
+ * https://github.com/material-components/material-components-web/blob/master/docs/architecture.md
+ *
+ * @record
+ */
+var MDCSimpleMenuAdapter = function () {
+  function MDCSimpleMenuAdapter() {
+    _classCallCheck(this, MDCSimpleMenuAdapter);
+  }
+
+  _createClass(MDCSimpleMenuAdapter, [{
+    key: "addClass",
+
+    /** @param {string} className */
+    value: function addClass(className) {}
+
+    /** @param {string} className */
+
+  }, {
+    key: "removeClass",
+    value: function removeClass(className) {}
+
+    /**
+     * @param {string} className
+     * @return {boolean}
+     */
+
+  }, {
+    key: "hasClass",
+    value: function hasClass(className) {}
+
+    /** @return {boolean} */
+
+  }, {
+    key: "hasNecessaryDom",
+    value: function hasNecessaryDom() {}
+
+    /**
+     * @param {EventTarget} target
+     * @param {string} attributeName
+     * @return {string}
+     */
+
+  }, {
+    key: "getAttributeForEventTarget",
+    value: function getAttributeForEventTarget(target, attributeName) {}
+
+    /** @return {{ width: number, height: number }} */
+
+  }, {
+    key: "getInnerDimensions",
+    value: function getInnerDimensions() {}
+
+    /** @return {boolean} */
+
+  }, {
+    key: "hasAnchor",
+    value: function hasAnchor() {}
+
+    /** @return {{width: number, height: number, top: number, right: number, bottom: number, left: number}} */
+
+  }, {
+    key: "getAnchorDimensions",
+    value: function getAnchorDimensions() {}
+
+    /** @return {{ width: number, height: number }} */
+
+  }, {
+    key: "getWindowDimensions",
+    value: function getWindowDimensions() {}
+
+    /**
+     * @param {number} x
+     * @param {number} y
+     */
+
+  }, {
+    key: "setScale",
+    value: function setScale(x, y) {}
+
+    /**
+     * @param {number} x
+     * @param {number} y
+     */
+
+  }, {
+    key: "setInnerScale",
+    value: function setInnerScale(x, y) {}
+
+    /** @return {number} */
+
+  }, {
+    key: "getNumberOfItems",
+    value: function getNumberOfItems() {}
+
+    /**
+     * @param {string} type
+     * @param {function(!Event)} handler
+     */
+
+  }, {
+    key: "registerInteractionHandler",
+    value: function registerInteractionHandler(type, handler) {}
+
+    /**
+     * @param {string} type
+     * @param {function(!Event)} handler
+     */
+
+  }, {
+    key: "deregisterInteractionHandler",
+    value: function deregisterInteractionHandler(type, handler) {}
+
+    /** @param {function(!Event)} handler */
+
+  }, {
+    key: "registerBodyClickHandler",
+    value: function registerBodyClickHandler(handler) {}
+
+    /** @param {function(!Event)} handler */
+
+  }, {
+    key: "deregisterBodyClickHandler",
+    value: function deregisterBodyClickHandler(handler) {}
+
+    /**
+     * @param {number} index
+     * @return {{top: number, height: number}}
+     */
+
+  }, {
+    key: "getYParamsForItemAtIndex",
+    value: function getYParamsForItemAtIndex(index) {}
+
+    /**
+     * @param {number} index
+     * @param {string|null} value
+     */
+
+  }, {
+    key: "setTransitionDelayForItemAtIndex",
+    value: function setTransitionDelayForItemAtIndex(index, value) {}
+
+    /**
+     * @param {EventTarget} target
+     * @return {number}
+     */
+
+  }, {
+    key: "getIndexForEventTarget",
+    value: function getIndexForEventTarget(target) {}
+
+    /** @param {{index: number}} evtData */
+
+  }, {
+    key: "notifySelected",
+    value: function notifySelected(evtData) {}
+  }, {
+    key: "notifyCancel",
+    value: function notifyCancel() {}
+  }, {
+    key: "saveFocus",
+    value: function saveFocus() {}
+  }, {
+    key: "restoreFocus",
+    value: function restoreFocus() {}
+
+    /** @return {boolean} */
+
+  }, {
+    key: "isFocused",
+    value: function isFocused() {}
+  }, {
+    key: "focus",
+    value: function focus() {}
+
+    /** @return {number} */
+
+  }, {
+    key: "getFocusedItemIndex",
+    value: function getFocusedItemIndex() /* number */{}
+
+    /** @param {number} index */
+
+  }, {
+    key: "focusItemAtIndex",
+    value: function focusItemAtIndex(index) {}
+
+    /** @return {boolean} */
+
+  }, {
+    key: "isRtl",
+    value: function isRtl() {}
+
+    /** @param {string} origin */
+
+  }, {
+    key: "setTransformOrigin",
+    value: function setTransformOrigin(origin) {}
+
+    /** @param {{
+    *   top: (string|undefined),
+    *   right: (string|undefined),
+    *   bottom: (string|undefined),
+    *   left: (string|undefined)
+    * }} position */
+
+  }, {
+    key: "setPosition",
+    value: function setPosition(position) {}
+
+    /** @return {number} */
+
+  }, {
+    key: "getAccurateTime",
+    value: function getAccurateTime() {}
+  }]);
+
+  return MDCSimpleMenuAdapter;
+}();
+
+/* unused harmony default export */ var _unused_webpack_default_export = (MDCSimpleMenuAdapter);
+
+/***/ }),
+
+/***/ 15:
+/***/ (function(module, __webpack_exports__, __webpack_require__) {
+
+"use strict";
+/* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, "a", function() { return cssClasses; });
+/* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, "b", function() { return strings; });
+/* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, "c", function() { return numbers; });
+/**
+ * Copyright 2016 Google Inc. All Rights Reserved.
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *      http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+
+/** @enum {string} */
+var cssClasses = {
+  ROOT: 'mdc-simple-menu',
+  OPEN: 'mdc-simple-menu--open',
+  ANIMATING: 'mdc-simple-menu--animating',
+  TOP_RIGHT: 'mdc-simple-menu--open-from-top-right',
+  BOTTOM_LEFT: 'mdc-simple-menu--open-from-bottom-left',
+  BOTTOM_RIGHT: 'mdc-simple-menu--open-from-bottom-right'
+};
+
+/** @enum {string} */
+var strings = {
+  ITEMS_SELECTOR: '.mdc-simple-menu__items',
+  SELECTED_EVENT: 'MDCSimpleMenu:selected',
+  CANCEL_EVENT: 'MDCSimpleMenu:cancel',
+  ARIA_DISABLED_ATTR: 'aria-disabled'
+};
+
+/** @enum {number} */
+var numbers = {
+  // Amount of time to wait before triggering a selected event on the menu. Note that this time
+  // will most likely be bumped up once interactive lists are supported to allow for the ripple to
+  // animate before closing the menu
+  SELECTED_TRIGGER_DELAY: 50,
+  // Total duration of the menu animation.
+  TRANSITION_DURATION_MS: 300,
+  // The menu starts its open animation with the X axis at this time value (0 - 1).
+  TRANSITION_SCALE_ADJUSTMENT_X: 0.5,
+  // The time value the menu waits until the animation starts on the Y axis (0 - 1).
+  TRANSITION_SCALE_ADJUSTMENT_Y: 0.2,
+  // The cubic bezier control points for the animation (cubic-bezier(0, 0, 0.2, 1)).
+  TRANSITION_X1: 0,
+  TRANSITION_Y1: 0,
+  TRANSITION_X2: 0.2,
+  TRANSITION_Y2: 1
+};
+
+/***/ }),
+
+/***/ 16:
+/***/ (function(module, __webpack_exports__, __webpack_require__) {
+
+"use strict";
+/* harmony import */ var __WEBPACK_IMPORTED_MODULE_0__material_base_foundation__ = __webpack_require__(0);
+/* harmony import */ var __WEBPACK_IMPORTED_MODULE_1__adapter__ = __webpack_require__(14);
+/* harmony import */ var __WEBPACK_IMPORTED_MODULE_2__constants__ = __webpack_require__(15);
+/* harmony import */ var __WEBPACK_IMPORTED_MODULE_3__util__ = __webpack_require__(10);
+var _extends = Object.assign || function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; };
+
+var _createClass = function () { function defineProperties(target, props) { for (var i = 0; i < props.length; i++) { var descriptor = props[i]; descriptor.enumerable = descriptor.enumerable || false; descriptor.configurable = true; if ("value" in descriptor) descriptor.writable = true; Object.defineProperty(target, descriptor.key, descriptor); } } return function (Constructor, protoProps, staticProps) { if (protoProps) defineProperties(Constructor.prototype, protoProps); if (staticProps) defineProperties(Constructor, staticProps); return Constructor; }; }();
+
+function _defineProperty(obj, key, value) { if (key in obj) { Object.defineProperty(obj, key, { value: value, enumerable: true, configurable: true, writable: true }); } else { obj[key] = value; } return obj; }
+
+function _classCallCheck(instance, Constructor) { if (!(instance instanceof Constructor)) { throw new TypeError("Cannot call a class as a function"); } }
+
+function _possibleConstructorReturn(self, call) { if (!self) { throw new ReferenceError("this hasn't been initialised - super() hasn't been called"); } return call && (typeof call === "object" || typeof call === "function") ? call : self; }
+
+function _inherits(subClass, superClass) { if (typeof superClass !== "function" && superClass !== null) { throw new TypeError("Super expression must either be null or a function, not " + typeof superClass); } subClass.prototype = Object.create(superClass && superClass.prototype, { constructor: { value: subClass, enumerable: false, writable: true, configurable: true } }); if (superClass) Object.setPrototypeOf ? Object.setPrototypeOf(subClass, superClass) : subClass.__proto__ = superClass; }
+
+/**
+ * Copyright 2016 Google Inc. All Rights Reserved.
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *      http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+
+
+
+
+
+
+/**
+ * @extends {MDCFoundation<!MDCSimpleMenuAdapter>}
+ */
+
+var MDCSimpleMenuFoundation = function (_MDCFoundation) {
+  _inherits(MDCSimpleMenuFoundation, _MDCFoundation);
+
+  _createClass(MDCSimpleMenuFoundation, null, [{
+    key: 'cssClasses',
+
+    /** @return enum{cssClasses} */
+    get: function get() {
+      return __WEBPACK_IMPORTED_MODULE_2__constants__["a" /* cssClasses */];
+    }
+
+    /** @return enum{strings} */
+
+  }, {
+    key: 'strings',
+    get: function get() {
+      return __WEBPACK_IMPORTED_MODULE_2__constants__["b" /* strings */];
+    }
+
+    /** @return enum{numbers} */
+
+  }, {
+    key: 'numbers',
+    get: function get() {
+      return __WEBPACK_IMPORTED_MODULE_2__constants__["c" /* numbers */];
+    }
+
+    /**
+     * {@see MDCSimpleMenuAdapter} for typing information on parameters and return
+     * types.
+     * @return {!MDCSimpleMenuAdapter}
+     */
+
+  }, {
+    key: 'defaultAdapter',
+    get: function get() {
+      return (/** @type {!MDCSimpleMenuAdapter} */{
+          addClass: function addClass() {},
+          removeClass: function removeClass() {},
+          hasClass: function hasClass() {
+            return false;
+          },
+          hasNecessaryDom: function hasNecessaryDom() {
+            return false;
+          },
+          getAttributeForEventTarget: function getAttributeForEventTarget() {},
+          getInnerDimensions: function getInnerDimensions() {
+            return {};
+          },
+          hasAnchor: function hasAnchor() {
+            return false;
+          },
+          getAnchorDimensions: function getAnchorDimensions() {
+            return {};
+          },
+          getWindowDimensions: function getWindowDimensions() {
+            return {};
+          },
+          setScale: function setScale() {},
+          setInnerScale: function setInnerScale() {},
+          getNumberOfItems: function getNumberOfItems() {
+            return 0;
+          },
+          registerInteractionHandler: function registerInteractionHandler() {},
+          deregisterInteractionHandler: function deregisterInteractionHandler() {},
+          registerBodyClickHandler: function registerBodyClickHandler() {},
+          deregisterBodyClickHandler: function deregisterBodyClickHandler() {},
+          getYParamsForItemAtIndex: function getYParamsForItemAtIndex() {
+            return {};
+          },
+          setTransitionDelayForItemAtIndex: function setTransitionDelayForItemAtIndex() {},
+          getIndexForEventTarget: function getIndexForEventTarget() {
+            return 0;
+          },
+          notifySelected: function notifySelected() {},
+          notifyCancel: function notifyCancel() {},
+          saveFocus: function saveFocus() {},
+          restoreFocus: function restoreFocus() {},
+          isFocused: function isFocused() {
+            return false;
+          },
+          focus: function focus() {},
+          getFocusedItemIndex: function getFocusedItemIndex() {
+            return -1;
+          },
+          focusItemAtIndex: function focusItemAtIndex() {},
+          isRtl: function isRtl() {
+            return false;
+          },
+          setTransformOrigin: function setTransformOrigin() {},
+          setPosition: function setPosition() {},
+          getAccurateTime: function getAccurateTime() {
+            return 0;
+          }
+        }
+      );
+    }
+
+    /** @param {!MDCSimpleMenuAdapter} adapter */
+
+  }]);
+
+  function MDCSimpleMenuFoundation(adapter) {
+    _classCallCheck(this, MDCSimpleMenuFoundation);
+
+    /** @private {function(!Event)} */
+    var _this = _possibleConstructorReturn(this, (MDCSimpleMenuFoundation.__proto__ || Object.getPrototypeOf(MDCSimpleMenuFoundation)).call(this, _extends(MDCSimpleMenuFoundation.defaultAdapter, adapter)));
+
+    _this.clickHandler_ = function (evt) {
+      return _this.handlePossibleSelected_(evt);
+    };
+    /** @private {function(!Event)} */
+    _this.keydownHandler_ = function (evt) {
+      return _this.handleKeyboardDown_(evt);
+    };
+    /** @private {function(!Event)} */
+    _this.keyupHandler_ = function (evt) {
+      return _this.handleKeyboardUp_(evt);
+    };
+    /** @private {function(!Event)} */
+    _this.documentClickHandler_ = function (evt) {
+      _this.adapter_.notifyCancel();
+      _this.close(evt);
+    };
+    /** @private {boolean} */
+    _this.isOpen_ = false;
+    /** @private {number} */
+    _this.startScaleX_ = 0;
+    /** @private {number} */
+    _this.startScaleY_ = 0;
+    /** @private {number} */
+    _this.targetScale_ = 1;
+    /** @private {number} */
+    _this.scaleX_ = 0;
+    /** @private {number} */
+    _this.scaleY_ = 0;
+    /** @private {boolean} */
+    _this.running_ = false;
+    /** @private {number} */
+    _this.selectedTriggerTimerId_ = 0;
+    /** @private {number} */
+    _this.animationRequestId_ = 0;
+    /** @private {!{ width: number, height: number }} */
+    _this.dimensions_;
+    /** @private {number} */
+    _this.startTime_;
+    /** @private {number} */
+    _this.itemHeight_;
+    return _this;
+  }
+
+  _createClass(MDCSimpleMenuFoundation, [{
+    key: 'init',
+    value: function init() {
+      var _MDCSimpleMenuFoundat = MDCSimpleMenuFoundation.cssClasses,
+          ROOT = _MDCSimpleMenuFoundat.ROOT,
+          OPEN = _MDCSimpleMenuFoundat.OPEN;
+
+
+      if (!this.adapter_.hasClass(ROOT)) {
+        throw new Error(ROOT + ' class required in root element.');
+      }
+
+      if (!this.adapter_.hasNecessaryDom()) {
+        throw new Error('Required DOM nodes missing in ' + ROOT + ' component.');
+      }
+
+      if (this.adapter_.hasClass(OPEN)) {
+        this.isOpen_ = true;
+      }
+
+      this.adapter_.registerInteractionHandler('click', this.clickHandler_);
+      this.adapter_.registerInteractionHandler('keyup', this.keyupHandler_);
+      this.adapter_.registerInteractionHandler('keydown', this.keydownHandler_);
+    }
+  }, {
+    key: 'destroy',
+    value: function destroy() {
+      clearTimeout(this.selectedTriggerTimerId_);
+      // Cancel any currently running animations.
+      cancelAnimationFrame(this.animationRequestId_);
+      this.adapter_.deregisterInteractionHandler('click', this.clickHandler_);
+      this.adapter_.deregisterInteractionHandler('keyup', this.keyupHandler_);
+      this.adapter_.deregisterInteractionHandler('keydown', this.keydownHandler_);
+      this.adapter_.deregisterBodyClickHandler(this.documentClickHandler_);
+    }
+
+    /**
+     * Calculates transition delays for individual menu items, so that they fade in one at a time.
+     * @private
+     */
+
+  }, {
+    key: 'applyTransitionDelays_',
+    value: function applyTransitionDelays_() {
+      var _MDCSimpleMenuFoundat2 = MDCSimpleMenuFoundation.cssClasses,
+          BOTTOM_LEFT = _MDCSimpleMenuFoundat2.BOTTOM_LEFT,
+          BOTTOM_RIGHT = _MDCSimpleMenuFoundat2.BOTTOM_RIGHT;
+
+      var numItems = this.adapter_.getNumberOfItems();
+      var height = this.dimensions_.height;
+
+      var transitionDuration = MDCSimpleMenuFoundation.numbers.TRANSITION_DURATION_MS / 1000;
+      var start = MDCSimpleMenuFoundation.numbers.TRANSITION_SCALE_ADJUSTMENT_Y;
+
+      for (var index = 0; index < numItems; index++) {
+        var _adapter_$getYParamsF = this.adapter_.getYParamsForItemAtIndex(index),
+            itemTop = _adapter_$getYParamsF.top,
+            itemHeight = _adapter_$getYParamsF.height;
+
+        this.itemHeight_ = itemHeight;
+        var itemDelayFraction = itemTop / height;
+        if (this.adapter_.hasClass(BOTTOM_LEFT) || this.adapter_.hasClass(BOTTOM_RIGHT)) {
+          itemDelayFraction = (height - itemTop - itemHeight) / height;
+        }
+        var itemDelay = (start + itemDelayFraction * (1 - start)) * transitionDuration;
+        // Use toFixed() here to normalize CSS unit precision across browsers
+        this.adapter_.setTransitionDelayForItemAtIndex(index, itemDelay.toFixed(3) + 's');
+      }
+    }
+
+    /**
+     * Removes transition delays from menu items.
+     * @private
+     */
+
+  }, {
+    key: 'removeTransitionDelays_',
+    value: function removeTransitionDelays_() {
+      var numItems = this.adapter_.getNumberOfItems();
+      for (var i = 0; i < numItems; i++) {
+        this.adapter_.setTransitionDelayForItemAtIndex(i, null);
+      }
+    }
+
+    /**
+     * Animates menu opening or closing.
+     * @private
+     */
+
+  }, {
+    key: 'animationLoop_',
+    value: function animationLoop_() {
+      var _this2 = this;
+
+      var time = this.adapter_.getAccurateTime();
+      var _MDCSimpleMenuFoundat3 = MDCSimpleMenuFoundation.numbers,
+          TRANSITION_DURATION_MS = _MDCSimpleMenuFoundat3.TRANSITION_DURATION_MS,
+          TRANSITION_X1 = _MDCSimpleMenuFoundat3.TRANSITION_X1,
+          TRANSITION_Y1 = _MDCSimpleMenuFoundat3.TRANSITION_Y1,
+          TRANSITION_X2 = _MDCSimpleMenuFoundat3.TRANSITION_X2,
+          TRANSITION_Y2 = _MDCSimpleMenuFoundat3.TRANSITION_Y2,
+          TRANSITION_SCALE_ADJUSTMENT_X = _MDCSimpleMenuFoundat3.TRANSITION_SCALE_ADJUSTMENT_X,
+          TRANSITION_SCALE_ADJUSTMENT_Y = _MDCSimpleMenuFoundat3.TRANSITION_SCALE_ADJUSTMENT_Y;
+
+      var currentTime = __webpack_require__.i(__WEBPACK_IMPORTED_MODULE_3__util__["clamp"])((time - this.startTime_) / TRANSITION_DURATION_MS);
+
+      // Animate X axis very slowly, so that only the Y axis animation is visible during fade-out.
+      var currentTimeX = __webpack_require__.i(__WEBPACK_IMPORTED_MODULE_3__util__["clamp"])((currentTime - TRANSITION_SCALE_ADJUSTMENT_X) / (1 - TRANSITION_SCALE_ADJUSTMENT_X));
+      // No time-shifting on the Y axis when closing.
+      var currentTimeY = currentTime;
+
+      var startScaleY = this.startScaleY_;
+      if (this.targetScale_ === 1) {
+        // Start with the menu at the height of a single item.
+        if (this.itemHeight_) {
+          startScaleY = Math.max(this.itemHeight_ / this.dimensions_.height, startScaleY);
+        }
+        // X axis moves faster, so time-shift forward.
+        currentTimeX = __webpack_require__.i(__WEBPACK_IMPORTED_MODULE_3__util__["clamp"])(currentTime + TRANSITION_SCALE_ADJUSTMENT_X);
+        // Y axis moves slower, so time-shift backwards and adjust speed by the difference.
+        currentTimeY = __webpack_require__.i(__WEBPACK_IMPORTED_MODULE_3__util__["clamp"])((currentTime - TRANSITION_SCALE_ADJUSTMENT_Y) / (1 - TRANSITION_SCALE_ADJUSTMENT_Y));
+      }
+
+      // Apply cubic bezier easing independently to each axis.
+      var easeX = __webpack_require__.i(__WEBPACK_IMPORTED_MODULE_3__util__["bezierProgress"])(currentTimeX, TRANSITION_X1, TRANSITION_Y1, TRANSITION_X2, TRANSITION_Y2);
+      var easeY = __webpack_require__.i(__WEBPACK_IMPORTED_MODULE_3__util__["bezierProgress"])(currentTimeY, TRANSITION_X1, TRANSITION_Y1, TRANSITION_X2, TRANSITION_Y2);
+
+      // Calculate the scales to apply to the outer container and inner container.
+      this.scaleX_ = this.startScaleX_ + (this.targetScale_ - this.startScaleX_) * easeX;
+      var invScaleX = 1 / (this.scaleX_ === 0 ? 1 : this.scaleX_);
+      this.scaleY_ = startScaleY + (this.targetScale_ - startScaleY) * easeY;
+      var invScaleY = 1 / (this.scaleY_ === 0 ? 1 : this.scaleY_);
+
+      // Apply scales.
+      this.adapter_.setScale(this.scaleX_, this.scaleY_);
+      this.adapter_.setInnerScale(invScaleX, invScaleY);
+
+      // Stop animation when we've covered the entire 0 - 1 range of time.
+      if (currentTime < 1) {
+        this.animationRequestId_ = requestAnimationFrame(function () {
+          return _this2.animationLoop_();
+        });
+      } else {
+        this.animationRequestId_ = 0;
+        this.running_ = false;
+        this.adapter_.removeClass(MDCSimpleMenuFoundation.cssClasses.ANIMATING);
+      }
+    }
+
+    /**
+     * Starts the open or close animation.
+     * @private
+     */
+
+  }, {
+    key: 'animateMenu_',
+    value: function animateMenu_() {
+      var _this3 = this;
+
+      this.startTime_ = this.adapter_.getAccurateTime();
+      this.startScaleX_ = this.scaleX_;
+      this.startScaleY_ = this.scaleY_;
+
+      this.targetScale_ = this.isOpen_ ? 1 : 0;
+
+      if (!this.running_) {
+        this.running_ = true;
+        this.animationRequestId_ = requestAnimationFrame(function () {
+          return _this3.animationLoop_();
+        });
+      }
+    }
+
+    /**
+     * @param {?number} focusIndex
+     * @private
+     */
+
+  }, {
+    key: 'focusOnOpen_',
+    value: function focusOnOpen_(focusIndex) {
+      if (focusIndex === null) {
+        // First, try focusing the menu.
+        this.adapter_.focus();
+        // If that doesn't work, focus first item instead.
+        if (!this.adapter_.isFocused()) {
+          this.adapter_.focusItemAtIndex(0);
+        }
+      } else {
+        this.adapter_.focusItemAtIndex(focusIndex);
+      }
+    }
+
+    /**
+     * Handle keys that we want to repeat on hold (tab and arrows).
+     * @param {!Event} evt
+     * @return {boolean}
+     * @private
+     */
+
+  }, {
+    key: 'handleKeyboardDown_',
+    value: function handleKeyboardDown_(evt) {
+      // Do nothing if Alt, Ctrl or Meta are pressed.
+      if (evt.altKey || evt.ctrlKey || evt.metaKey) {
+        return true;
+      }
+
+      var keyCode = evt.keyCode,
+          key = evt.key,
+          shiftKey = evt.shiftKey;
+
+      var isTab = key === 'Tab' || keyCode === 9;
+      var isArrowUp = key === 'ArrowUp' || keyCode === 38;
+      var isArrowDown = key === 'ArrowDown' || keyCode === 40;
+      var isSpace = key === 'Space' || keyCode === 32;
+
+      var focusedItemIndex = this.adapter_.getFocusedItemIndex();
+      var lastItemIndex = this.adapter_.getNumberOfItems() - 1;
+
+      if (shiftKey && isTab && focusedItemIndex === 0) {
+        this.adapter_.focusItemAtIndex(lastItemIndex);
+        evt.preventDefault();
+        return false;
+      }
+
+      if (!shiftKey && isTab && focusedItemIndex === lastItemIndex) {
+        this.adapter_.focusItemAtIndex(0);
+        evt.preventDefault();
+        return false;
+      }
+
+      // Ensure Arrow{Up,Down} and space do not cause inadvertent scrolling
+      if (isArrowUp || isArrowDown || isSpace) {
+        evt.preventDefault();
+      }
+
+      if (isArrowUp) {
+        if (focusedItemIndex === 0 || this.adapter_.isFocused()) {
+          this.adapter_.focusItemAtIndex(lastItemIndex);
+        } else {
+          this.adapter_.focusItemAtIndex(focusedItemIndex - 1);
+        }
+      } else if (isArrowDown) {
+        if (focusedItemIndex === lastItemIndex || this.adapter_.isFocused()) {
+          this.adapter_.focusItemAtIndex(0);
+        } else {
+          this.adapter_.focusItemAtIndex(focusedItemIndex + 1);
+        }
+      }
+
+      return true;
+    }
+
+    /**
+     * Handle keys that we don't want to repeat on hold (Enter, Space, Escape).
+     * @param {!Event} evt
+     * @return {boolean}
+     * @private
+     */
+
+  }, {
+    key: 'handleKeyboardUp_',
+    value: function handleKeyboardUp_(evt) {
+      // Do nothing if Alt, Ctrl or Meta are pressed.
+      if (evt.altKey || evt.ctrlKey || evt.metaKey) {
+        return true;
+      }
+
+      var keyCode = evt.keyCode,
+          key = evt.key;
+
+      var isEnter = key === 'Enter' || keyCode === 13;
+      var isSpace = key === 'Space' || keyCode === 32;
+      var isEscape = key === 'Escape' || keyCode === 27;
+
+      if (isEnter || isSpace) {
+        this.handlePossibleSelected_(evt);
+      }
+
+      if (isEscape) {
+        this.adapter_.notifyCancel();
+        this.close();
+      }
+
+      return true;
+    }
+
+    /**
+     * @param {!Event} evt
+     * @private
+     */
+
+  }, {
+    key: 'handlePossibleSelected_',
+    value: function handlePossibleSelected_(evt) {
+      var _this4 = this;
+
+      if (this.adapter_.getAttributeForEventTarget(evt.target, __WEBPACK_IMPORTED_MODULE_2__constants__["b" /* strings */].ARIA_DISABLED_ATTR) === 'true') {
+        return;
+      }
+      var targetIndex = this.adapter_.getIndexForEventTarget(evt.target);
+      if (targetIndex < 0) {
+        return;
+      }
+      // Debounce multiple selections
+      if (this.selectedTriggerTimerId_) {
+        return;
+      }
+      this.selectedTriggerTimerId_ = setTimeout(function () {
+        _this4.selectedTriggerTimerId_ = 0;
+        _this4.close();
+        _this4.adapter_.notifySelected({ index: targetIndex });
+      }, __WEBPACK_IMPORTED_MODULE_2__constants__["c" /* numbers */].SELECTED_TRIGGER_DELAY);
+    }
+
+    /** @private */
+
+  }, {
+    key: 'autoPosition_',
+    value: function autoPosition_() {
+      var _position;
+
+      if (!this.adapter_.hasAnchor()) {
+        return;
+      }
+
+      // Defaults: open from the top left.
+      var vertical = 'top';
+      var horizontal = 'left';
+
+      var anchor = this.adapter_.getAnchorDimensions();
+      var windowDimensions = this.adapter_.getWindowDimensions();
+
+      var topOverflow = anchor.top + this.dimensions_.height - windowDimensions.height;
+      var bottomOverflow = this.dimensions_.height - anchor.bottom;
+      var extendsBeyondTopBounds = topOverflow > 0;
+
+      if (extendsBeyondTopBounds) {
+        if (bottomOverflow < topOverflow) {
+          vertical = 'bottom';
+        }
+      }
+
+      var leftOverflow = anchor.left + this.dimensions_.width - windowDimensions.width;
+      var rightOverflow = this.dimensions_.width - anchor.right;
+      var extendsBeyondLeftBounds = leftOverflow > 0;
+      var extendsBeyondRightBounds = rightOverflow > 0;
+
+      if (this.adapter_.isRtl()) {
+        // In RTL, we prefer to open from the right.
+        horizontal = 'right';
+        if (extendsBeyondRightBounds && leftOverflow < rightOverflow) {
+          horizontal = 'left';
+        }
+      } else if (extendsBeyondLeftBounds && rightOverflow < leftOverflow) {
+        horizontal = 'right';
+      }
+
+      var position = (_position = {}, _defineProperty(_position, horizontal, '0'), _defineProperty(_position, vertical, '0'), _position);
+
+      this.adapter_.setTransformOrigin(vertical + ' ' + horizontal);
+      this.adapter_.setPosition(position);
+    }
+
+    /**
+     * Open the menu.
+     * @param {{focusIndex: ?number}=} options
+     */
+
+  }, {
+    key: 'open',
+    value: function open() {
+      var _this5 = this;
+
+      var _ref = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : {},
+          _ref$focusIndex = _ref.focusIndex,
+          focusIndex = _ref$focusIndex === undefined ? null : _ref$focusIndex;
+
+      this.adapter_.saveFocus();
+      this.adapter_.addClass(MDCSimpleMenuFoundation.cssClasses.ANIMATING);
+      this.animationRequestId_ = requestAnimationFrame(function () {
+        _this5.dimensions_ = _this5.adapter_.getInnerDimensions();
+        _this5.applyTransitionDelays_();
+        _this5.autoPosition_();
+        _this5.animateMenu_();
+        _this5.adapter_.addClass(MDCSimpleMenuFoundation.cssClasses.OPEN);
+        _this5.focusOnOpen_(focusIndex);
+        _this5.adapter_.registerBodyClickHandler(_this5.documentClickHandler_);
+      });
+      this.isOpen_ = true;
+    }
+
+    /**
+     * Closes the menu.
+     * @param {Event=} evt
+     */
+
+  }, {
+    key: 'close',
+    value: function close() {
+      var _this6 = this;
+
+      var evt = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : null;
+
+      var targetIsDisabled = evt ? this.adapter_.getAttributeForEventTarget(evt.target, __WEBPACK_IMPORTED_MODULE_2__constants__["b" /* strings */].ARIA_DISABLED_ATTR) === 'true' : false;
+
+      if (targetIsDisabled) {
+        return;
+      }
+
+      this.adapter_.deregisterBodyClickHandler(this.documentClickHandler_);
+      this.adapter_.addClass(MDCSimpleMenuFoundation.cssClasses.ANIMATING);
+      requestAnimationFrame(function () {
+        _this6.removeTransitionDelays_();
+        _this6.animateMenu_();
+        _this6.adapter_.removeClass(MDCSimpleMenuFoundation.cssClasses.OPEN);
+      });
+      this.isOpen_ = false;
+      this.adapter_.restoreFocus();
+    }
+
+    /** @return {boolean} */
+
+  }, {
+    key: 'isOpen',
+    value: function isOpen() {
+      return this.isOpen_;
+    }
+  }]);
+
+  return MDCSimpleMenuFoundation;
+}(__WEBPACK_IMPORTED_MODULE_0__material_base_foundation__["a" /* default */]);
+
+/* harmony default export */ __webpack_exports__["a"] = (MDCSimpleMenuFoundation);
+
+/***/ }),
+
+/***/ 17:
+/***/ (function(module, __webpack_exports__, __webpack_require__) {
+
+"use strict";
+/* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, "a", function() { return MDCSimpleMenu; });
+/* harmony import */ var __WEBPACK_IMPORTED_MODULE_0__material_base_component__ = __webpack_require__(1);
+/* harmony import */ var __WEBPACK_IMPORTED_MODULE_1__foundation__ = __webpack_require__(16);
+/* harmony import */ var __WEBPACK_IMPORTED_MODULE_2__util__ = __webpack_require__(10);
+/* harmony reexport (binding) */ __webpack_require__.d(__webpack_exports__, "b", function() { return __WEBPACK_IMPORTED_MODULE_1__foundation__["a"]; });
+var _createClass = function () { function defineProperties(target, props) { for (var i = 0; i < props.length; i++) { var descriptor = props[i]; descriptor.enumerable = descriptor.enumerable || false; descriptor.configurable = true; if ("value" in descriptor) descriptor.writable = true; Object.defineProperty(target, descriptor.key, descriptor); } } return function (Constructor, protoProps, staticProps) { if (protoProps) defineProperties(Constructor.prototype, protoProps); if (staticProps) defineProperties(Constructor, staticProps); return Constructor; }; }();
+
+function _classCallCheck(instance, Constructor) { if (!(instance instanceof Constructor)) { throw new TypeError("Cannot call a class as a function"); } }
+
+function _possibleConstructorReturn(self, call) { if (!self) { throw new ReferenceError("this hasn't been initialised - super() hasn't been called"); } return call && (typeof call === "object" || typeof call === "function") ? call : self; }
+
+function _inherits(subClass, superClass) { if (typeof superClass !== "function" && superClass !== null) { throw new TypeError("Super expression must either be null or a function, not " + typeof superClass); } subClass.prototype = Object.create(superClass && superClass.prototype, { constructor: { value: subClass, enumerable: false, writable: true, configurable: true } }); if (superClass) Object.setPrototypeOf ? Object.setPrototypeOf(subClass, superClass) : subClass.__proto__ = superClass; }
+
+/**
+ * Copyright 2016 Google Inc. All Rights Reserved.
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *      http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+
+
+
+
+
+
+
+/**
+ * @extends MDCComponent<!MDCSimpleMenuFoundation>
+ */
+var MDCSimpleMenu = function (_MDCComponent) {
+  _inherits(MDCSimpleMenu, _MDCComponent);
+
+  /** @param {...?} args */
+  function MDCSimpleMenu() {
+    var _ref;
+
+    _classCallCheck(this, MDCSimpleMenu);
+
+    for (var _len = arguments.length, args = Array(_len), _key = 0; _key < _len; _key++) {
+      args[_key] = arguments[_key];
+    }
+
+    /** @private {!Element} */
+    var _this = _possibleConstructorReturn(this, (_ref = MDCSimpleMenu.__proto__ || Object.getPrototypeOf(MDCSimpleMenu)).call.apply(_ref, [this].concat(args)));
+
+    _this.previousFocus_;
+    return _this;
+  }
+
+  /**
+   * @param {!Element} root
+   * @return {!MDCSimpleMenu}
+   */
+
+
+  _createClass(MDCSimpleMenu, [{
+    key: 'show',
+
+
+    /** @param {{focusIndex: ?number}=} options */
+    value: function show() {
+      var _ref2 = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : {},
+          _ref2$focusIndex = _ref2.focusIndex,
+          focusIndex = _ref2$focusIndex === undefined ? null : _ref2$focusIndex;
+
+      this.foundation_.open({ focusIndex: focusIndex });
+    }
+  }, {
+    key: 'hide',
+    value: function hide() {
+      this.foundation_.close();
+    }
+
+    /**
+     * Return the item container element inside the component.
+     * @return {?Element}
+     */
+
+  }, {
+    key: 'getDefaultFoundation',
+
+
+    /** @return {!MDCSimpleMenuFoundation} */
+    value: function getDefaultFoundation() {
+      var _this2 = this;
+
+      return new __WEBPACK_IMPORTED_MODULE_1__foundation__["a" /* default */]({
+        addClass: function addClass(className) {
+          return _this2.root_.classList.add(className);
+        },
+        removeClass: function removeClass(className) {
+          return _this2.root_.classList.remove(className);
+        },
+        hasClass: function hasClass(className) {
+          return _this2.root_.classList.contains(className);
+        },
+        hasNecessaryDom: function hasNecessaryDom() {
+          return Boolean(_this2.itemsContainer_);
+        },
+        getAttributeForEventTarget: function getAttributeForEventTarget(target, attributeName) {
+          return target.getAttribute(attributeName);
+        },
+        getInnerDimensions: function getInnerDimensions() {
+          var itemsContainer = _this2.itemsContainer_;
+
+          return { width: itemsContainer.offsetWidth, height: itemsContainer.offsetHeight };
+        },
+        hasAnchor: function hasAnchor() {
+          return _this2.root_.parentElement && _this2.root_.parentElement.classList.contains('mdc-menu-anchor');
+        },
+        getAnchorDimensions: function getAnchorDimensions() {
+          return _this2.root_.parentElement.getBoundingClientRect();
+        },
+        getWindowDimensions: function getWindowDimensions() {
+          return { width: window.innerWidth, height: window.innerHeight };
+        },
+        setScale: function setScale(x, y) {
+          _this2.root_.style[__webpack_require__.i(__WEBPACK_IMPORTED_MODULE_2__util__["getTransformPropertyName"])(window)] = 'scale(' + x + ', ' + y + ')';
+        },
+        setInnerScale: function setInnerScale(x, y) {
+          _this2.itemsContainer_.style[__webpack_require__.i(__WEBPACK_IMPORTED_MODULE_2__util__["getTransformPropertyName"])(window)] = 'scale(' + x + ', ' + y + ')';
+        },
+        getNumberOfItems: function getNumberOfItems() {
+          return _this2.items.length;
+        },
+        registerInteractionHandler: function registerInteractionHandler(type, handler) {
+          return _this2.root_.addEventListener(type, handler);
+        },
+        deregisterInteractionHandler: function deregisterInteractionHandler(type, handler) {
+          return _this2.root_.removeEventListener(type, handler);
+        },
+        registerBodyClickHandler: function registerBodyClickHandler(handler) {
+          return document.body.addEventListener('click', handler);
+        },
+        deregisterBodyClickHandler: function deregisterBodyClickHandler(handler) {
+          return document.body.removeEventListener('click', handler);
+        },
+        getYParamsForItemAtIndex: function getYParamsForItemAtIndex(index) {
+          var _items$index = _this2.items[index],
+              top = _items$index.offsetTop,
+              height = _items$index.offsetHeight;
+
+          return { top: top, height: height };
+        },
+        setTransitionDelayForItemAtIndex: function setTransitionDelayForItemAtIndex(index, value) {
+          return _this2.items[index].style.setProperty('transition-delay', value);
+        },
+        getIndexForEventTarget: function getIndexForEventTarget(target) {
+          return _this2.items.indexOf(target);
+        },
+        notifySelected: function notifySelected(evtData) {
+          return _this2.emit(__WEBPACK_IMPORTED_MODULE_1__foundation__["a" /* default */].strings.SELECTED_EVENT, {
+            index: evtData.index,
+            item: _this2.items[evtData.index]
+          });
+        },
+        notifyCancel: function notifyCancel() {
+          return _this2.emit(__WEBPACK_IMPORTED_MODULE_1__foundation__["a" /* default */].strings.CANCEL_EVENT, {});
+        },
+        saveFocus: function saveFocus() {
+          _this2.previousFocus_ = document.activeElement;
+        },
+        restoreFocus: function restoreFocus() {
+          if (_this2.previousFocus_) {
+            _this2.previousFocus_.focus();
+          }
+        },
+        isFocused: function isFocused() {
+          return document.activeElement === _this2.root_;
+        },
+        focus: function focus() {
+          return _this2.root_.focus();
+        },
+        getFocusedItemIndex: function getFocusedItemIndex() {
+          return _this2.items.indexOf(document.activeElement);
+        },
+        focusItemAtIndex: function focusItemAtIndex(index) {
+          return _this2.items[index].focus();
+        },
+        isRtl: function isRtl() {
+          return getComputedStyle(_this2.root_).getPropertyValue('direction') === 'rtl';
+        },
+        setTransformOrigin: function setTransformOrigin(origin) {
+          _this2.root_.style[__webpack_require__.i(__WEBPACK_IMPORTED_MODULE_2__util__["getTransformPropertyName"])(window) + '-origin'] = origin;
+        },
+        setPosition: function setPosition(position) {
+          _this2.root_.style.left = 'left' in position ? position.left : null;
+          _this2.root_.style.right = 'right' in position ? position.right : null;
+          _this2.root_.style.top = 'top' in position ? position.top : null;
+          _this2.root_.style.bottom = 'bottom' in position ? position.bottom : null;
+        },
+        getAccurateTime: function getAccurateTime() {
+          return window.performance.now();
+        }
+      });
+    }
+  }, {
+    key: 'open',
+
+
+    /** @return {boolean} */
+    get: function get() {
+      return this.foundation_.isOpen();
+    }
+
+    /** @param {boolean} value */
+    ,
+    set: function set(value) {
+      if (value) {
+        this.foundation_.open();
+      } else {
+        this.foundation_.close();
+      }
+    }
+  }, {
+    key: 'itemsContainer_',
+    get: function get() {
+      return this.root_.querySelector(__WEBPACK_IMPORTED_MODULE_1__foundation__["a" /* default */].strings.ITEMS_SELECTOR);
+    }
+
+    /**
+     * Return the items within the menu. Note that this only contains the set of elements within
+     * the items container that are proper list items, and not supplemental / presentational DOM
+     * elements.
+     * @return {!Array<!Element>}
+     */
+
+  }, {
+    key: 'items',
+    get: function get() {
+      var itemsContainer = this.itemsContainer_;
+
+      return [].slice.call(itemsContainer.querySelectorAll('.mdc-list-item[role]'));
+    }
+  }], [{
+    key: 'attachTo',
+    value: function attachTo(root) {
+      return new MDCSimpleMenu(root);
+    }
+  }]);
+
+  return MDCSimpleMenu;
+}(__WEBPACK_IMPORTED_MODULE_0__material_base_component__["a" /* default */]);
+
+/***/ }),
+
+/***/ 91:
+/***/ (function(module, exports, __webpack_require__) {
+
+module.exports = __webpack_require__(11);
+
+
+/***/ })
+
+/******/ });
+});

+ 467 - 0
support/client/lib/vwf/view/lib/mdc/dist/mdc.radio.css

@@ -0,0 +1,467 @@
+/*!
+ Material Components for the web
+ Copyright (c) 2017 Google Inc.
+ License: Apache-2.0
+*/
+/*
+  Precomputed linear color channel values, for use in contrast calculations.
+  See https://www.w3.org/TR/WCAG20-TECHS/G17.html#G17-tests
+
+  Algorithm, for c in 0 to 255:
+  f(c) {
+    c = c / 255;
+    return c < 0.03928 ? c / 12.92 : Math.pow((c + 0.055) / 1.055, 2.4);
+  }
+
+  This lookup table is needed since there is no `pow` in SASS.
+*/
+/**
+ * Calculate the luminance for a color.
+ * See https://www.w3.org/TR/WCAG20-TECHS/G17.html#G17-tests
+ */
+/**
+ * Calculate the contrast ratio between two colors.
+ * See https://www.w3.org/TR/WCAG20-TECHS/G17.html#G17-tests
+ */
+/**
+ * Determine whether to use dark or light text on top of given color.
+ * Returns "dark" for dark text and "light" for light text.
+ */
+/*
+  Main theme colors.
+  If you're a user customizing your color scheme in SASS, these are probably the only variables you need to change.
+*/
+/* Indigo 500 */
+/* Pink A200 */
+/* White */
+/* Which set of text colors to use for each main theme color (light or dark) */
+/* Text colors according to light vs dark and text type */
+/* Primary text colors for each of the theme colors */
+/** MDC Ripple keyframes are split into their own file so that _mixins.scss can rely on them. */
+@-webkit-keyframes mdc-ripple-fg-radius-in {
+  from {
+    -webkit-transform: translate(var(--mdc-ripple-fg-translate-start, 0)) scale(1);
+            transform: translate(var(--mdc-ripple-fg-translate-start, 0)) scale(1);
+    -webkit-animation-timing-function: cubic-bezier(0.4, 0, 0.2, 1);
+            animation-timing-function: cubic-bezier(0.4, 0, 0.2, 1); }
+  to {
+    -webkit-transform: translate(var(--mdc-ripple-fg-translate-end, 0)) scale(var(--mdc-ripple-fg-scale, 1));
+            transform: translate(var(--mdc-ripple-fg-translate-end, 0)) scale(var(--mdc-ripple-fg-scale, 1)); } }
+@keyframes mdc-ripple-fg-radius-in {
+  from {
+    -webkit-transform: translate(var(--mdc-ripple-fg-translate-start, 0)) scale(1);
+            transform: translate(var(--mdc-ripple-fg-translate-start, 0)) scale(1);
+    -webkit-animation-timing-function: cubic-bezier(0.4, 0, 0.2, 1);
+            animation-timing-function: cubic-bezier(0.4, 0, 0.2, 1); }
+  to {
+    -webkit-transform: translate(var(--mdc-ripple-fg-translate-end, 0)) scale(var(--mdc-ripple-fg-scale, 1));
+            transform: translate(var(--mdc-ripple-fg-translate-end, 0)) scale(var(--mdc-ripple-fg-scale, 1)); } }
+
+@-webkit-keyframes mdc-ripple-fg-opacity-in {
+  from {
+    opacity: 0;
+    -webkit-animation-timing-function: linear;
+            animation-timing-function: linear; }
+  to {
+    opacity: 1; } }
+
+@keyframes mdc-ripple-fg-opacity-in {
+  from {
+    opacity: 0;
+    -webkit-animation-timing-function: linear;
+            animation-timing-function: linear; }
+  to {
+    opacity: 1; } }
+
+@-webkit-keyframes mdc-ripple-fg-opacity-out {
+  from {
+    opacity: 1;
+    -webkit-animation-timing-function: linear;
+            animation-timing-function: linear; }
+  to {
+    opacity: 0; } }
+
+@keyframes mdc-ripple-fg-opacity-out {
+  from {
+    opacity: 1;
+    -webkit-animation-timing-function: linear;
+            animation-timing-function: linear; }
+  to {
+    opacity: 0; } }
+
+/*
+  Precomputed linear color channel values, for use in contrast calculations.
+  See https://www.w3.org/TR/WCAG20-TECHS/G17.html#G17-tests
+
+  Algorithm, for c in 0 to 255:
+  f(c) {
+    c = c / 255;
+    return c < 0.03928 ? c / 12.92 : Math.pow((c + 0.055) / 1.055, 2.4);
+  }
+
+  This lookup table is needed since there is no `pow` in SASS.
+*/
+/**
+ * Calculate the luminance for a color.
+ * See https://www.w3.org/TR/WCAG20-TECHS/G17.html#G17-tests
+ */
+/**
+ * Calculate the contrast ratio between two colors.
+ * See https://www.w3.org/TR/WCAG20-TECHS/G17.html#G17-tests
+ */
+/**
+ * Determine whether to use dark or light text on top of given color.
+ * Returns "dark" for dark text and "light" for light text.
+ */
+/*
+  Main theme colors.
+  If you're a user customizing your color scheme in SASS, these are probably the only variables you need to change.
+*/
+/* Indigo 500 */
+/* Pink A200 */
+/* White */
+/* Which set of text colors to use for each main theme color (light or dark) */
+/* Text colors according to light vs dark and text type */
+/* Primary text colors for each of the theme colors */
+/**
+ * Applies the correct theme color style to the specified property.
+ * $property is typically color or background-color, but can be any CSS property that accepts color values.
+ * $style should be one of the map keys in $mdc-theme-property-values (_variables.scss).
+ */
+/**
+ * Creates a rule to be used in MDC-Web components for dark theming, and applies the provided contents.
+ * Should provide the $root-selector option if applied to anything other than the root selector.
+ * When used with a modifier class, provide a second argument of `true` for the $compound parameter
+ * to specify that this should be attached as a compound class.
+ *
+ * Usage example:
+ *
+ * ```scss
+ * .mdc-foo {
+ *   color: black;
+ *
+ *   @include mdc-theme-dark {
+ *     color: white;
+ *   }
+ *
+ *   &__bar {
+ *     background: black;
+ *
+ *     @include mdc-theme-dark(".mdc-foo") {
+ *       background: white;
+ *     }
+ *   }
+ * }
+ *
+ * .mdc-foo--disabled {
+ *   opacity: .38;
+ *
+ *   @include mdc-theme-dark(".mdc-foo", true) {
+ *     opacity: .5;
+ *   }
+ * }
+ * ```
+ */
+.mdc-radio {
+  --mdc-ripple-surface-width: 0;
+  --mdc-ripple-surface-height: 0;
+  --mdc-ripple-fg-size: 0;
+  --mdc-ripple-left: 0;
+  --mdc-ripple-top: 0;
+  --mdc-ripple-fg-scale: 1;
+  --mdc-ripple-fg-translate-end: 0;
+  --mdc-ripple-fg-translate-start: 0;
+  will-change: transform, opacity;
+  -webkit-tap-highlight-color: transparent;
+  display: inline-block;
+  position: relative;
+  -webkit-box-sizing: border-box;
+          box-sizing: border-box;
+  -webkit-box-flex: 0;
+      -ms-flex: 0 0 auto;
+          flex: 0 0 auto;
+  width: 40px;
+  height: 40px;
+  padding: 10px;
+  cursor: pointer;
+  will-change: opacity, transform, border-color, background-color, color; }
+  .mdc-radio:not(.mdc-ripple-upgraded):hover::before, .mdc-radio:not(.mdc-ripple-upgraded):focus::before, .mdc-radio:not(.mdc-ripple-upgraded):active::after {
+    -webkit-transition-duration: 85ms;
+            transition-duration: 85ms;
+    opacity: .6; }
+  .mdc-radio::before {
+    /* @alternate */
+    background-color: rgba(63, 81, 181, 0.14);
+    position: absolute;
+    top: calc(50% - 100%);
+    left: calc(50% - 100%);
+    width: 200%;
+    height: 200%;
+    -webkit-transition: opacity 250ms linear;
+    transition: opacity 250ms linear;
+    border-radius: 50%;
+    opacity: 0;
+    pointer-events: none;
+    content: ""; }
+    @supports (background-color: color(green a(10%))) {
+      .mdc-radio::before {
+        background-color: color(var(--mdc-theme-primary, #3f51b5) a(14%)); } }
+  .mdc-radio.mdc-ripple-upgraded::before {
+    top: calc(50% - 100%);
+    left: calc(50% - 100%);
+    width: 200%;
+    height: 200%;
+    /* @alternate */
+    -webkit-transform: scale(0);
+            transform: scale(0);
+    -webkit-transform: scale(var(--mdc-ripple-fg-scale, 0));
+            transform: scale(var(--mdc-ripple-fg-scale, 0)); }
+  .mdc-radio.mdc-ripple-upgraded--background-focused::before {
+    opacity: .99999; }
+  .mdc-radio.mdc-ripple-upgraded--background-active-fill::before {
+    -webkit-transition-duration: 120ms;
+            transition-duration: 120ms;
+    opacity: 1; }
+  .mdc-radio.mdc-ripple-upgraded--unbounded::before {
+    /* @alternate */
+    top: calc(50% - 50%);
+    top: var(--mdc-ripple-top, calc(50% - 50%));
+    /* @alternate */
+    left: calc(50% - 50%);
+    left: var(--mdc-ripple-left, calc(50% - 50%));
+    /* @alternate */
+    width: 100%;
+    width: var(--mdc-ripple-fg-size, 100%);
+    /* @alternate */
+    height: 100%;
+    height: var(--mdc-ripple-fg-size, 100%);
+    /* @alternate */
+    -webkit-transform: scale(0);
+            transform: scale(0);
+    -webkit-transform: scale(var(--mdc-ripple-fg-scale, 0));
+            transform: scale(var(--mdc-ripple-fg-scale, 0)); }
+  .mdc-radio::after {
+    /* @alternate */
+    background-color: rgba(63, 81, 181, 0.14);
+    position: absolute;
+    top: calc(50% - 100%);
+    left: calc(50% - 100%);
+    width: 200%;
+    height: 200%;
+    -webkit-transition: opacity 250ms linear;
+    transition: opacity 250ms linear;
+    border-radius: 50%;
+    opacity: 0;
+    pointer-events: none;
+    content: ""; }
+    @supports (background-color: color(green a(10%))) {
+      .mdc-radio::after {
+        background-color: color(var(--mdc-theme-primary, #3f51b5) a(14%)); } }
+  .mdc-radio.mdc-ripple-upgraded::after {
+    top: 0;
+    left: 0;
+    /* @alternate */
+    width: 100%;
+    width: var(--mdc-ripple-fg-size, 100%);
+    /* @alternate */
+    height: 100%;
+    height: var(--mdc-ripple-fg-size, 100%);
+    -webkit-transform: scale(0);
+            transform: scale(0);
+    -webkit-transform-origin: center center;
+            transform-origin: center center;
+    opacity: 0; }
+  .mdc-radio:not(.mdc-ripple-upgraded--unbounded)::after {
+    -webkit-transform-origin: center center;
+            transform-origin: center center; }
+  .mdc-radio.mdc-ripple-upgraded--unbounded::after {
+    /* @alternate */
+    top: 0;
+    top: var(--mdc-ripple-top, 0);
+    /* @alternate */
+    left: 0;
+    left: var(--mdc-ripple-left, 0);
+    /* @alternate */
+    width: 100%;
+    width: var(--mdc-ripple-fg-size, 100%);
+    /* @alternate */
+    height: 100%;
+    height: var(--mdc-ripple-fg-size, 100%);
+    -webkit-transform: scale(0);
+            transform: scale(0);
+    -webkit-transform-origin: center center;
+            transform-origin: center center; }
+  .mdc-radio.mdc-ripple-upgraded--foreground-activation::after {
+    -webkit-animation: 300ms mdc-ripple-fg-radius-in forwards, 83ms mdc-ripple-fg-opacity-in forwards;
+            animation: 300ms mdc-ripple-fg-radius-in forwards, 83ms mdc-ripple-fg-opacity-in forwards; }
+  .mdc-radio.mdc-ripple-upgraded--foreground-deactivation::after {
+    -webkit-transform: translate(var(--mdc-ripple-fg-translate-end, 0)) scale(var(--mdc-ripple-fg-scale, 1));
+            transform: translate(var(--mdc-ripple-fg-translate-end, 0)) scale(var(--mdc-ripple-fg-scale, 1));
+    -webkit-animation: 83ms mdc-ripple-fg-opacity-out;
+            animation: 83ms mdc-ripple-fg-opacity-out; }
+  .mdc-radio::before, .mdc-radio::after {
+    top: 0;
+    left: 0;
+    width: 100%;
+    height: 100%; }
+  .mdc-radio.mdc-ripple-upgraded .mdc-radio__background::before {
+    content: none; }
+  .mdc-radio__background {
+    display: inline-block;
+    position: absolute;
+    left: 10px;
+    width: 50%;
+    height: 50%;
+    -webkit-box-sizing: border-box;
+            box-sizing: border-box; }
+    .mdc-radio__background::before {
+      /* @alternate */
+      background-color: #3f51b5;
+      background-color: var(--mdc-theme-primary, #3f51b5);
+      position: absolute;
+      top: 0;
+      left: 0;
+      width: 100%;
+      height: 100%;
+      -webkit-transform: scale(0, 0);
+              transform: scale(0, 0);
+      -webkit-transition: opacity 120ms 0ms cubic-bezier(0.4, 0, 0.6, 1), -webkit-transform 120ms 0ms cubic-bezier(0.4, 0, 0.6, 1);
+      transition: opacity 120ms 0ms cubic-bezier(0.4, 0, 0.6, 1), -webkit-transform 120ms 0ms cubic-bezier(0.4, 0, 0.6, 1);
+      transition: opacity 120ms 0ms cubic-bezier(0.4, 0, 0.6, 1), transform 120ms 0ms cubic-bezier(0.4, 0, 0.6, 1);
+      transition: opacity 120ms 0ms cubic-bezier(0.4, 0, 0.6, 1), transform 120ms 0ms cubic-bezier(0.4, 0, 0.6, 1), -webkit-transform 120ms 0ms cubic-bezier(0.4, 0, 0.6, 1);
+      border-radius: 50%;
+      content: "";
+      opacity: 0;
+      pointer-events: none; }
+  .mdc-radio__outer-circle {
+    /* @alternate */
+    border-color: rgba(0, 0, 0, 0.54);
+    border-color: var(--mdc-theme-text-secondary-on-light, rgba(0, 0, 0, 0.54));
+    position: absolute;
+    top: 0;
+    left: 0;
+    width: 100%;
+    height: 100%;
+    -webkit-transition: border-color 120ms 0ms cubic-bezier(0.4, 0, 0.6, 1);
+    transition: border-color 120ms 0ms cubic-bezier(0.4, 0, 0.6, 1);
+    border-width: 2px;
+    border-style: solid;
+    border-radius: 50%;
+    -webkit-box-sizing: border-box;
+            box-sizing: border-box; }
+    .mdc-radio--theme-dark .mdc-radio__outer-circle,
+    .mdc-theme--dark .mdc-radio__outer-circle {
+      /* @alternate */
+      border-color: rgba(255, 255, 255, 0.7);
+      border-color: var(--mdc-theme-text-secondary-on-dark, rgba(255, 255, 255, 0.7)); }
+  .mdc-radio__inner-circle {
+    /* @alternate */
+    background-color: rgba(0, 0, 0, 0.54);
+    background-color: var(--mdc-theme-text-secondary-on-light, rgba(0, 0, 0, 0.54));
+    position: absolute;
+    top: 0;
+    left: 0;
+    width: 100%;
+    height: 100%;
+    -webkit-transform: scale(0, 0);
+            transform: scale(0, 0);
+    -webkit-transition: background-color 120ms 0ms cubic-bezier(0.4, 0, 0.6, 1), -webkit-transform 120ms 0ms cubic-bezier(0.4, 0, 0.6, 1);
+    transition: background-color 120ms 0ms cubic-bezier(0.4, 0, 0.6, 1), -webkit-transform 120ms 0ms cubic-bezier(0.4, 0, 0.6, 1);
+    transition: transform 120ms 0ms cubic-bezier(0.4, 0, 0.6, 1), background-color 120ms 0ms cubic-bezier(0.4, 0, 0.6, 1);
+    transition: transform 120ms 0ms cubic-bezier(0.4, 0, 0.6, 1), background-color 120ms 0ms cubic-bezier(0.4, 0, 0.6, 1), -webkit-transform 120ms 0ms cubic-bezier(0.4, 0, 0.6, 1);
+    border-radius: 50%;
+    -webkit-box-sizing: border-box;
+            box-sizing: border-box; }
+    .mdc-radio--theme-dark .mdc-radio__inner-circle,
+    .mdc-theme--dark .mdc-radio__inner-circle {
+      /* @alternate */
+      background-color: rgba(255, 255, 255, 0.7);
+      background-color: var(--mdc-theme-text-secondary-on-dark, rgba(255, 255, 255, 0.7)); }
+  .mdc-radio__native-control {
+    position: absolute;
+    top: 0;
+    left: 0;
+    width: 100%;
+    height: 100%;
+    margin: 0;
+    padding: 0;
+    cursor: inherit;
+    opacity: 0;
+    z-index: 1; }
+
+.mdc-radio__native-control:checked + .mdc-radio__background,
+.mdc-radio__native-control:disabled + .mdc-radio__background {
+  -webkit-transition: opacity 120ms 0ms cubic-bezier(0, 0, 0.2, 1), -webkit-transform 120ms 0ms cubic-bezier(0, 0, 0.2, 1);
+  transition: opacity 120ms 0ms cubic-bezier(0, 0, 0.2, 1), -webkit-transform 120ms 0ms cubic-bezier(0, 0, 0.2, 1);
+  transition: opacity 120ms 0ms cubic-bezier(0, 0, 0.2, 1), transform 120ms 0ms cubic-bezier(0, 0, 0.2, 1);
+  transition: opacity 120ms 0ms cubic-bezier(0, 0, 0.2, 1), transform 120ms 0ms cubic-bezier(0, 0, 0.2, 1), -webkit-transform 120ms 0ms cubic-bezier(0, 0, 0.2, 1); }
+  .mdc-radio__native-control:checked + .mdc-radio__background .mdc-radio__outer-circle,
+  .mdc-radio__native-control:disabled + .mdc-radio__background .mdc-radio__outer-circle {
+    -webkit-transition: border-color 120ms 0ms cubic-bezier(0, 0, 0.2, 1);
+    transition: border-color 120ms 0ms cubic-bezier(0, 0, 0.2, 1); }
+  .mdc-radio__native-control:checked + .mdc-radio__background .mdc-radio__inner-circle,
+  .mdc-radio__native-control:disabled + .mdc-radio__background .mdc-radio__inner-circle {
+    -webkit-transition: background-color 120ms 0ms cubic-bezier(0, 0, 0.2, 1), -webkit-transform 120ms 0ms cubic-bezier(0, 0, 0.2, 1);
+    transition: background-color 120ms 0ms cubic-bezier(0, 0, 0.2, 1), -webkit-transform 120ms 0ms cubic-bezier(0, 0, 0.2, 1);
+    transition: transform 120ms 0ms cubic-bezier(0, 0, 0.2, 1), background-color 120ms 0ms cubic-bezier(0, 0, 0.2, 1);
+    transition: transform 120ms 0ms cubic-bezier(0, 0, 0.2, 1), background-color 120ms 0ms cubic-bezier(0, 0, 0.2, 1), -webkit-transform 120ms 0ms cubic-bezier(0, 0, 0.2, 1); }
+
+.mdc-radio--disabled {
+  cursor: default;
+  pointer-events: none; }
+
+.mdc-radio__native-control:checked + .mdc-radio__background .mdc-radio__outer-circle {
+  /* @alternate */
+  border-color: #3f51b5;
+  border-color: var(--mdc-theme-primary, #3f51b5); }
+
+.mdc-radio__native-control:checked + .mdc-radio__background .mdc-radio__inner-circle {
+  /* @alternate */
+  background-color: #3f51b5;
+  background-color: var(--mdc-theme-primary, #3f51b5);
+  -webkit-transform: scale(0.5);
+          transform: scale(0.5);
+  -webkit-transition: background-color 120ms 0ms cubic-bezier(0, 0, 0.2, 1), -webkit-transform 120ms 0ms cubic-bezier(0, 0, 0.2, 1);
+  transition: background-color 120ms 0ms cubic-bezier(0, 0, 0.2, 1), -webkit-transform 120ms 0ms cubic-bezier(0, 0, 0.2, 1);
+  transition: transform 120ms 0ms cubic-bezier(0, 0, 0.2, 1), background-color 120ms 0ms cubic-bezier(0, 0, 0.2, 1);
+  transition: transform 120ms 0ms cubic-bezier(0, 0, 0.2, 1), background-color 120ms 0ms cubic-bezier(0, 0, 0.2, 1), -webkit-transform 120ms 0ms cubic-bezier(0, 0, 0.2, 1); }
+
+.mdc-radio__native-control:disabled + .mdc-radio__background,
+fieldset:disabled .mdc-radio__native-control + .mdc-radio__background,
+[aria-disabled="true"] .mdc-radio__native-control + .mdc-radio__background {
+  cursor: default; }
+  .mdc-radio__native-control:disabled + .mdc-radio__background .mdc-radio__outer-circle,
+  fieldset:disabled .mdc-radio__native-control + .mdc-radio__background .mdc-radio__outer-circle,
+  [aria-disabled="true"] .mdc-radio__native-control + .mdc-radio__background .mdc-radio__outer-circle {
+    border-color: rgba(0, 0, 0, 0.26); }
+    .mdc-radio--theme-dark .mdc-radio__native-control:disabled + .mdc-radio__background .mdc-radio__outer-circle,
+    .mdc-theme--dark .mdc-radio__native-control:disabled + .mdc-radio__background .mdc-radio__outer-circle, .mdc-radio--theme-dark
+    fieldset:disabled .mdc-radio__native-control + .mdc-radio__background .mdc-radio__outer-circle,
+    .mdc-theme--dark
+    fieldset:disabled .mdc-radio__native-control + .mdc-radio__background .mdc-radio__outer-circle, .mdc-radio--theme-dark
+    [aria-disabled="true"] .mdc-radio__native-control + .mdc-radio__background .mdc-radio__outer-circle,
+    .mdc-theme--dark
+    [aria-disabled="true"] .mdc-radio__native-control + .mdc-radio__background .mdc-radio__outer-circle {
+      border-color: rgba(255, 255, 255, 0.3); }
+  .mdc-radio__native-control:disabled + .mdc-radio__background .mdc-radio__inner-circle,
+  fieldset:disabled .mdc-radio__native-control + .mdc-radio__background .mdc-radio__inner-circle,
+  [aria-disabled="true"] .mdc-radio__native-control + .mdc-radio__background .mdc-radio__inner-circle {
+    background-color: rgba(0, 0, 0, 0.26); }
+    .mdc-radio--theme-dark .mdc-radio__native-control:disabled + .mdc-radio__background .mdc-radio__inner-circle,
+    .mdc-theme--dark .mdc-radio__native-control:disabled + .mdc-radio__background .mdc-radio__inner-circle, .mdc-radio--theme-dark
+    fieldset:disabled .mdc-radio__native-control + .mdc-radio__background .mdc-radio__inner-circle,
+    .mdc-theme--dark
+    fieldset:disabled .mdc-radio__native-control + .mdc-radio__background .mdc-radio__inner-circle, .mdc-radio--theme-dark
+    [aria-disabled="true"] .mdc-radio__native-control + .mdc-radio__background .mdc-radio__inner-circle,
+    .mdc-theme--dark
+    [aria-disabled="true"] .mdc-radio__native-control + .mdc-radio__background .mdc-radio__inner-circle {
+      background-color: rgba(255, 255, 255, 0.3); }
+
+.mdc-radio__native-control:focus + .mdc-radio__background::before {
+  -webkit-transform: scale(2, 2);
+          transform: scale(2, 2);
+  -webkit-transition: opacity 120ms 0ms cubic-bezier(0, 0, 0.2, 1), -webkit-transform 120ms 0ms cubic-bezier(0, 0, 0.2, 1);
+  transition: opacity 120ms 0ms cubic-bezier(0, 0, 0.2, 1), -webkit-transform 120ms 0ms cubic-bezier(0, 0, 0.2, 1);
+  transition: opacity 120ms 0ms cubic-bezier(0, 0, 0.2, 1), transform 120ms 0ms cubic-bezier(0, 0, 0.2, 1);
+  transition: opacity 120ms 0ms cubic-bezier(0, 0, 0.2, 1), transform 120ms 0ms cubic-bezier(0, 0, 0.2, 1), -webkit-transform 120ms 0ms cubic-bezier(0, 0, 0.2, 1);
+  opacity: .26; }

+ 83 - 0
support/client/lib/vwf/view/lib/mdc/dist/mdc.radio.css-entry

@@ -0,0 +1,83 @@
+/*!
+ Material Components for the web
+ Copyright (c) 2017 Google Inc.
+ License: Apache-2.0
+*/
+/******/ (function(modules) { // webpackBootstrap
+/******/ 	// The module cache
+/******/ 	var installedModules = {};
+/******/
+/******/ 	// The require function
+/******/ 	function __webpack_require__(moduleId) {
+/******/
+/******/ 		// Check if module is in cache
+/******/ 		if(installedModules[moduleId]) {
+/******/ 			return installedModules[moduleId].exports;
+/******/ 		}
+/******/ 		// Create a new module (and put it into the cache)
+/******/ 		var module = installedModules[moduleId] = {
+/******/ 			i: moduleId,
+/******/ 			l: false,
+/******/ 			exports: {}
+/******/ 		};
+/******/
+/******/ 		// Execute the module function
+/******/ 		modules[moduleId].call(module.exports, module, module.exports, __webpack_require__);
+/******/
+/******/ 		// Flag the module as loaded
+/******/ 		module.l = true;
+/******/
+/******/ 		// Return the exports of the module
+/******/ 		return module.exports;
+/******/ 	}
+/******/
+/******/
+/******/ 	// expose the modules object (__webpack_modules__)
+/******/ 	__webpack_require__.m = modules;
+/******/
+/******/ 	// expose the module cache
+/******/ 	__webpack_require__.c = installedModules;
+/******/
+/******/ 	// identity function for calling harmony imports with the correct context
+/******/ 	__webpack_require__.i = function(value) { return value; };
+/******/
+/******/ 	// define getter function for harmony exports
+/******/ 	__webpack_require__.d = function(exports, name, getter) {
+/******/ 		if(!__webpack_require__.o(exports, name)) {
+/******/ 			Object.defineProperty(exports, name, {
+/******/ 				configurable: false,
+/******/ 				enumerable: true,
+/******/ 				get: getter
+/******/ 			});
+/******/ 		}
+/******/ 	};
+/******/
+/******/ 	// getDefaultExport function for compatibility with non-harmony modules
+/******/ 	__webpack_require__.n = function(module) {
+/******/ 		var getter = module && module.__esModule ?
+/******/ 			function getDefault() { return module['default']; } :
+/******/ 			function getModuleExports() { return module; };
+/******/ 		__webpack_require__.d(getter, 'a', getter);
+/******/ 		return getter;
+/******/ 	};
+/******/
+/******/ 	// Object.prototype.hasOwnProperty.call
+/******/ 	__webpack_require__.o = function(object, property) { return Object.prototype.hasOwnProperty.call(object, property); };
+/******/
+/******/ 	// __webpack_public_path__
+/******/ 	__webpack_require__.p = "/assets/";
+/******/
+/******/ 	// Load entry module and return exports
+/******/ 	return __webpack_require__(__webpack_require__.s = 16);
+/******/ })
+/************************************************************************/
+/******/ ({
+
+/***/ 16:
+/***/ (function(module, exports) {
+
+// removed by extract-text-webpack-plugin
+
+/***/ })
+
+/******/ });

+ 2131 - 0
support/client/lib/vwf/view/lib/mdc/dist/mdc.radio.js

@@ -0,0 +1,2131 @@
+/*!
+ Material Components for the web
+ Copyright (c) 2017 Google Inc.
+ License: Apache-2.0
+*/
+(function webpackUniversalModuleDefinition(root, factory) {
+	if(typeof exports === 'object' && typeof module === 'object')
+		module.exports = factory();
+	else if(typeof define === 'function' && define.amd)
+		define([], factory);
+	else if(typeof exports === 'object')
+		exports["radio"] = factory();
+	else
+		root["mdc"] = root["mdc"] || {}, root["mdc"]["radio"] = factory();
+})(this, function() {
+return /******/ (function(modules) { // webpackBootstrap
+/******/ 	// The module cache
+/******/ 	var installedModules = {};
+/******/
+/******/ 	// The require function
+/******/ 	function __webpack_require__(moduleId) {
+/******/
+/******/ 		// Check if module is in cache
+/******/ 		if(installedModules[moduleId]) {
+/******/ 			return installedModules[moduleId].exports;
+/******/ 		}
+/******/ 		// Create a new module (and put it into the cache)
+/******/ 		var module = installedModules[moduleId] = {
+/******/ 			i: moduleId,
+/******/ 			l: false,
+/******/ 			exports: {}
+/******/ 		};
+/******/
+/******/ 		// Execute the module function
+/******/ 		modules[moduleId].call(module.exports, module, module.exports, __webpack_require__);
+/******/
+/******/ 		// Flag the module as loaded
+/******/ 		module.l = true;
+/******/
+/******/ 		// Return the exports of the module
+/******/ 		return module.exports;
+/******/ 	}
+/******/
+/******/
+/******/ 	// expose the modules object (__webpack_modules__)
+/******/ 	__webpack_require__.m = modules;
+/******/
+/******/ 	// expose the module cache
+/******/ 	__webpack_require__.c = installedModules;
+/******/
+/******/ 	// identity function for calling harmony imports with the correct context
+/******/ 	__webpack_require__.i = function(value) { return value; };
+/******/
+/******/ 	// define getter function for harmony exports
+/******/ 	__webpack_require__.d = function(exports, name, getter) {
+/******/ 		if(!__webpack_require__.o(exports, name)) {
+/******/ 			Object.defineProperty(exports, name, {
+/******/ 				configurable: false,
+/******/ 				enumerable: true,
+/******/ 				get: getter
+/******/ 			});
+/******/ 		}
+/******/ 	};
+/******/
+/******/ 	// getDefaultExport function for compatibility with non-harmony modules
+/******/ 	__webpack_require__.n = function(module) {
+/******/ 		var getter = module && module.__esModule ?
+/******/ 			function getDefault() { return module['default']; } :
+/******/ 			function getModuleExports() { return module; };
+/******/ 		__webpack_require__.d(getter, 'a', getter);
+/******/ 		return getter;
+/******/ 	};
+/******/
+/******/ 	// Object.prototype.hasOwnProperty.call
+/******/ 	__webpack_require__.o = function(object, property) { return Object.prototype.hasOwnProperty.call(object, property); };
+/******/
+/******/ 	// __webpack_public_path__
+/******/ 	__webpack_require__.p = "/assets/";
+/******/
+/******/ 	// Load entry module and return exports
+/******/ 	return __webpack_require__(__webpack_require__.s = 92);
+/******/ })
+/************************************************************************/
+/******/ ({
+
+/***/ 0:
+/***/ (function(module, __webpack_exports__, __webpack_require__) {
+
+"use strict";
+var _createClass = function () { function defineProperties(target, props) { for (var i = 0; i < props.length; i++) { var descriptor = props[i]; descriptor.enumerable = descriptor.enumerable || false; descriptor.configurable = true; if ("value" in descriptor) descriptor.writable = true; Object.defineProperty(target, descriptor.key, descriptor); } } return function (Constructor, protoProps, staticProps) { if (protoProps) defineProperties(Constructor.prototype, protoProps); if (staticProps) defineProperties(Constructor, staticProps); return Constructor; }; }();
+
+function _classCallCheck(instance, Constructor) { if (!(instance instanceof Constructor)) { throw new TypeError("Cannot call a class as a function"); } }
+
+/**
+ * Copyright 2016 Google Inc.
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *   http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+
+/**
+ * @template A
+ */
+var MDCFoundation = function () {
+  _createClass(MDCFoundation, null, [{
+    key: "cssClasses",
+
+    /** @return enum{cssClasses} */
+    get: function get() {
+      // Classes extending MDCFoundation should implement this method to return an object which exports every
+      // CSS class the foundation class needs as a property. e.g. {ACTIVE: 'mdc-component--active'}
+      return {};
+    }
+
+    /** @return enum{strings} */
+
+  }, {
+    key: "strings",
+    get: function get() {
+      // Classes extending MDCFoundation should implement this method to return an object which exports all
+      // semantic strings as constants. e.g. {ARIA_ROLE: 'tablist'}
+      return {};
+    }
+
+    /** @return enum{numbers} */
+
+  }, {
+    key: "numbers",
+    get: function get() {
+      // Classes extending MDCFoundation should implement this method to return an object which exports all
+      // of its semantic numbers as constants. e.g. {ANIMATION_DELAY_MS: 350}
+      return {};
+    }
+
+    /** @return {!Object} */
+
+  }, {
+    key: "defaultAdapter",
+    get: function get() {
+      // Classes extending MDCFoundation may choose to implement this getter in order to provide a convenient
+      // way of viewing the necessary methods of an adapter. In the future, this could also be used for adapter
+      // validation.
+      return {};
+    }
+
+    /**
+     * @param {A=} adapter
+     */
+
+  }]);
+
+  function MDCFoundation() {
+    var adapter = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : {};
+
+    _classCallCheck(this, MDCFoundation);
+
+    /** @protected {!A} */
+    this.adapter_ = adapter;
+  }
+
+  _createClass(MDCFoundation, [{
+    key: "init",
+    value: function init() {
+      // Subclasses should override this method to perform initialization routines (registering events, etc.)
+    }
+  }, {
+    key: "destroy",
+    value: function destroy() {
+      // Subclasses should override this method to perform de-initialization routines (de-registering events, etc.)
+    }
+  }]);
+
+  return MDCFoundation;
+}();
+
+/* harmony default export */ __webpack_exports__["a"] = (MDCFoundation);
+
+/***/ }),
+
+/***/ 1:
+/***/ (function(module, __webpack_exports__, __webpack_require__) {
+
+"use strict";
+/* harmony import */ var __WEBPACK_IMPORTED_MODULE_0__foundation__ = __webpack_require__(0);
+var _createClass = function () { function defineProperties(target, props) { for (var i = 0; i < props.length; i++) { var descriptor = props[i]; descriptor.enumerable = descriptor.enumerable || false; descriptor.configurable = true; if ("value" in descriptor) descriptor.writable = true; Object.defineProperty(target, descriptor.key, descriptor); } } return function (Constructor, protoProps, staticProps) { if (protoProps) defineProperties(Constructor.prototype, protoProps); if (staticProps) defineProperties(Constructor, staticProps); return Constructor; }; }();
+
+function _classCallCheck(instance, Constructor) { if (!(instance instanceof Constructor)) { throw new TypeError("Cannot call a class as a function"); } }
+
+/**
+ * Copyright 2016 Google Inc.
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *   http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+
+
+
+/**
+ * @template F
+ */
+
+var MDCComponent = function () {
+  _createClass(MDCComponent, null, [{
+    key: 'attachTo',
+
+    /**
+     * @param {!Element} root
+     * @return {!MDCComponent}
+     */
+    value: function attachTo(root) {
+      // Subclasses which extend MDCBase should provide an attachTo() method that takes a root element and
+      // returns an instantiated component with its root set to that element. Also note that in the cases of
+      // subclasses, an explicit foundation class will not have to be passed in; it will simply be initialized
+      // from getDefaultFoundation().
+      return new MDCComponent(root, new __WEBPACK_IMPORTED_MODULE_0__foundation__["a" /* default */]());
+    }
+
+    /**
+     * @param {!Element} root
+     * @param {F=} foundation
+     * @param {...?} args
+     */
+
+  }]);
+
+  function MDCComponent(root) {
+    var foundation = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : undefined;
+
+    _classCallCheck(this, MDCComponent);
+
+    /** @protected {!Element} */
+    this.root_ = root;
+
+    for (var _len = arguments.length, args = Array(_len > 2 ? _len - 2 : 0), _key = 2; _key < _len; _key++) {
+      args[_key - 2] = arguments[_key];
+    }
+
+    this.initialize.apply(this, args);
+    // Note that we initialize foundation here and not within the constructor's default param so that
+    // this.root_ is defined and can be used within the foundation class.
+    /** @protected {!F} */
+    this.foundation_ = foundation === undefined ? this.getDefaultFoundation() : foundation;
+    this.foundation_.init();
+    this.initialSyncWithDOM();
+  }
+
+  _createClass(MDCComponent, [{
+    key: 'initialize',
+    value: function initialize() /* ...args */{}
+    // Subclasses can override this to do any additional setup work that would be considered part of a
+    // "constructor". Essentially, it is a hook into the parent constructor before the foundation is
+    // initialized. Any additional arguments besides root and foundation will be passed in here.
+
+
+    /**
+     * @return {!F} foundation
+     */
+
+  }, {
+    key: 'getDefaultFoundation',
+    value: function getDefaultFoundation() {
+      // Subclasses must override this method to return a properly configured foundation class for the
+      // component.
+      throw new Error('Subclasses must override getDefaultFoundation to return a properly configured ' + 'foundation class');
+    }
+  }, {
+    key: 'initialSyncWithDOM',
+    value: function initialSyncWithDOM() {
+      // Subclasses should override this method if they need to perform work to synchronize with a host DOM
+      // object. An example of this would be a form control wrapper that needs to synchronize its internal state
+      // to some property or attribute of the host DOM. Please note: this is *not* the place to perform DOM
+      // reads/writes that would cause layout / paint, as this is called synchronously from within the constructor.
+    }
+  }, {
+    key: 'destroy',
+    value: function destroy() {
+      // Subclasses may implement this method to release any resources / deregister any listeners they have
+      // attached. An example of this might be deregistering a resize event from the window object.
+      this.foundation_.destroy();
+    }
+
+    /**
+     * Wrapper method to add an event listener to the component's root element. This is most useful when
+     * listening for custom events.
+     * @param {string} evtType
+     * @param {!Function} handler
+     */
+
+  }, {
+    key: 'listen',
+    value: function listen(evtType, handler) {
+      this.root_.addEventListener(evtType, handler);
+    }
+
+    /**
+     * Wrapper method to remove an event listener to the component's root element. This is most useful when
+     * unlistening for custom events.
+     * @param {string} evtType
+     * @param {!Function} handler
+     */
+
+  }, {
+    key: 'unlisten',
+    value: function unlisten(evtType, handler) {
+      this.root_.removeEventListener(evtType, handler);
+    }
+
+    /**
+     * Fires a cross-browser-compatible custom event from the component root of the given type,
+     * with the given data.
+     * @param {string} evtType
+     * @param {!Object} evtData
+     * @param {boolean=} shouldBubble
+     */
+
+  }, {
+    key: 'emit',
+    value: function emit(evtType, evtData) {
+      var shouldBubble = arguments.length > 2 && arguments[2] !== undefined ? arguments[2] : false;
+
+      var evt = void 0;
+      if (typeof CustomEvent === 'function') {
+        evt = new CustomEvent(evtType, {
+          detail: evtData,
+          bubbles: shouldBubble
+        });
+      } else {
+        evt = document.createEvent('CustomEvent');
+        evt.initCustomEvent(evtType, shouldBubble, false, evtData);
+      }
+
+      this.root_.dispatchEvent(evt);
+    }
+  }]);
+
+  return MDCComponent;
+}();
+
+/* harmony default export */ __webpack_exports__["a"] = (MDCComponent);
+
+/***/ }),
+
+/***/ 3:
+/***/ (function(module, __webpack_exports__, __webpack_require__) {
+
+"use strict";
+/* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, "a", function() { return SelectionControlState; });
+/**
+ * Copyright 2017 Google Inc. All Rights Reserved.
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *      http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+
+/**
+ * @typedef {!{
+ *   checked: boolean,
+ *   indeterminate: boolean,
+ *   disabled: boolean,
+ *   value: ?string
+ * }}
+ */
+var SelectionControlState = void 0;
+
+/***/ }),
+
+/***/ 31:
+/***/ (function(module, __webpack_exports__, __webpack_require__) {
+
+"use strict";
+Object.defineProperty(__webpack_exports__, "__esModule", { value: true });
+/* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, "MDCRadio", function() { return MDCRadio; });
+/* harmony import */ var __WEBPACK_IMPORTED_MODULE_0__material_base_component__ = __webpack_require__(1);
+/* harmony import */ var __WEBPACK_IMPORTED_MODULE_1__material_base_selection_control__ = __webpack_require__(3);
+/* harmony import */ var __WEBPACK_IMPORTED_MODULE_2__foundation__ = __webpack_require__(63);
+/* harmony import */ var __WEBPACK_IMPORTED_MODULE_3__material_ripple__ = __webpack_require__(6);
+/* harmony reexport (binding) */ __webpack_require__.d(__webpack_exports__, "MDCRadioFoundation", function() { return __WEBPACK_IMPORTED_MODULE_2__foundation__["a"]; });
+var _extends = Object.assign || function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; };
+
+var _get = function get(object, property, receiver) { if (object === null) object = Function.prototype; var desc = Object.getOwnPropertyDescriptor(object, property); if (desc === undefined) { var parent = Object.getPrototypeOf(object); if (parent === null) { return undefined; } else { return get(parent, property, receiver); } } else if ("value" in desc) { return desc.value; } else { var getter = desc.get; if (getter === undefined) { return undefined; } return getter.call(receiver); } };
+
+var _createClass = function () { function defineProperties(target, props) { for (var i = 0; i < props.length; i++) { var descriptor = props[i]; descriptor.enumerable = descriptor.enumerable || false; descriptor.configurable = true; if ("value" in descriptor) descriptor.writable = true; Object.defineProperty(target, descriptor.key, descriptor); } } return function (Constructor, protoProps, staticProps) { if (protoProps) defineProperties(Constructor.prototype, protoProps); if (staticProps) defineProperties(Constructor, staticProps); return Constructor; }; }();
+
+function _classCallCheck(instance, Constructor) { if (!(instance instanceof Constructor)) { throw new TypeError("Cannot call a class as a function"); } }
+
+function _possibleConstructorReturn(self, call) { if (!self) { throw new ReferenceError("this hasn't been initialised - super() hasn't been called"); } return call && (typeof call === "object" || typeof call === "function") ? call : self; }
+
+function _inherits(subClass, superClass) { if (typeof superClass !== "function" && superClass !== null) { throw new TypeError("Super expression must either be null or a function, not " + typeof superClass); } subClass.prototype = Object.create(superClass && superClass.prototype, { constructor: { value: subClass, enumerable: false, writable: true, configurable: true } }); if (superClass) Object.setPrototypeOf ? Object.setPrototypeOf(subClass, superClass) : subClass.__proto__ = superClass; }
+
+/**
+ * Copyright 2016 Google Inc. All Rights Reserved.
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *      http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+
+
+/* eslint-disable no-unused-vars */
+
+/* eslint-enable no-unused-vars */
+
+
+
+
+
+/**
+ * @extends MDCComponent<!MDCRadioFoundation>
+ */
+var MDCRadio = function (_MDCComponent) {
+  _inherits(MDCRadio, _MDCComponent);
+
+  _createClass(MDCRadio, [{
+    key: 'checked',
+
+
+    /** @return {boolean} */
+    get: function get() {
+      return this.foundation_.isChecked();
+    }
+
+    /** @param {boolean} checked */
+    ,
+    set: function set(checked) {
+      this.foundation_.setChecked(checked);
+    }
+
+    /** @return {boolean} */
+
+  }, {
+    key: 'disabled',
+    get: function get() {
+      return this.foundation_.isDisabled();
+    }
+
+    /** @param {boolean} disabled */
+    ,
+    set: function set(disabled) {
+      this.foundation_.setDisabled(disabled);
+    }
+
+    /** @return {?string} */
+
+  }, {
+    key: 'value',
+    get: function get() {
+      return this.foundation_.getValue();
+    }
+
+    /** @param {?string} value */
+    ,
+    set: function set(value) {
+      this.foundation_.setValue(value);
+    }
+
+    /** @return {!MDCRipple} */
+
+  }, {
+    key: 'ripple',
+    get: function get() {
+      return this.ripple_;
+    }
+  }], [{
+    key: 'attachTo',
+    value: function attachTo(root) {
+      return new MDCRadio(root);
+    }
+  }]);
+
+  function MDCRadio() {
+    var _ref;
+
+    _classCallCheck(this, MDCRadio);
+
+    for (var _len = arguments.length, args = Array(_len), _key = 0; _key < _len; _key++) {
+      args[_key] = arguments[_key];
+    }
+
+    /** @private {!MDCRipple} */
+    var _this = _possibleConstructorReturn(this, (_ref = MDCRadio.__proto__ || Object.getPrototypeOf(MDCRadio)).call.apply(_ref, [this].concat(args)));
+
+    _this.ripple_ = _this.initRipple_();
+    return _this;
+  }
+
+  /**
+   * @return {!MDCRipple}
+   * @private
+   */
+
+
+  _createClass(MDCRadio, [{
+    key: 'initRipple_',
+    value: function initRipple_() {
+      var _this2 = this;
+
+      var adapter = _extends(__WEBPACK_IMPORTED_MODULE_3__material_ripple__["MDCRipple"].createAdapter(this), {
+        isUnbounded: function isUnbounded() {
+          return true;
+        },
+        // Radio buttons technically go "active" whenever there is *any* keyboard interaction. This is not the
+        // UI we desire.
+        isSurfaceActive: function isSurfaceActive() {
+          return false;
+        },
+        registerInteractionHandler: function registerInteractionHandler(type, handler) {
+          return _this2.nativeControl_.addEventListener(type, handler);
+        },
+        deregisterInteractionHandler: function deregisterInteractionHandler(type, handler) {
+          return _this2.nativeControl_.removeEventListener(type, handler);
+        },
+        computeBoundingRect: function computeBoundingRect() {
+          var _root_$getBoundingCli = _this2.root_.getBoundingClientRect(),
+              left = _root_$getBoundingCli.left,
+              top = _root_$getBoundingCli.top;
+
+          var DIM = 40;
+          return {
+            top: top,
+            left: left,
+            right: left + DIM,
+            bottom: top + DIM,
+            width: DIM,
+            height: DIM
+          };
+        }
+      });
+      var foundation = new __WEBPACK_IMPORTED_MODULE_3__material_ripple__["MDCRippleFoundation"](adapter);
+      return new __WEBPACK_IMPORTED_MODULE_3__material_ripple__["MDCRipple"](this.root_, foundation);
+    }
+
+    /**
+     * Returns the state of the native control element, or null if the native control element is not present.
+     * @return {?SelectionControlState}
+     * @private
+     */
+
+  }, {
+    key: 'destroy',
+    value: function destroy() {
+      this.ripple_.destroy();
+      _get(MDCRadio.prototype.__proto__ || Object.getPrototypeOf(MDCRadio.prototype), 'destroy', this).call(this);
+    }
+
+    /** @return {!MDCRadioFoundation} */
+
+  }, {
+    key: 'getDefaultFoundation',
+    value: function getDefaultFoundation() {
+      var _this3 = this;
+
+      return new __WEBPACK_IMPORTED_MODULE_2__foundation__["a" /* default */]({
+        addClass: function addClass(className) {
+          return _this3.root_.classList.add(className);
+        },
+        removeClass: function removeClass(className) {
+          return _this3.root_.classList.remove(className);
+        },
+        getNativeControl: function getNativeControl() {
+          return _this3.root_.querySelector(__WEBPACK_IMPORTED_MODULE_2__foundation__["a" /* default */].strings.NATIVE_CONTROL_SELECTOR);
+        }
+      });
+    }
+  }, {
+    key: 'nativeControl_',
+    get: function get() {
+      var NATIVE_CONTROL_SELECTOR = __WEBPACK_IMPORTED_MODULE_2__foundation__["a" /* default */].strings.NATIVE_CONTROL_SELECTOR;
+
+      var el = /** @type {?SelectionControlState} */this.root_.querySelector(NATIVE_CONTROL_SELECTOR);
+      return el;
+    }
+  }]);
+
+  return MDCRadio;
+}(__WEBPACK_IMPORTED_MODULE_0__material_base_component__["a" /* default */]);
+
+/***/ }),
+
+/***/ 4:
+/***/ (function(module, __webpack_exports__, __webpack_require__) {
+
+"use strict";
+var _createClass = function () { function defineProperties(target, props) { for (var i = 0; i < props.length; i++) { var descriptor = props[i]; descriptor.enumerable = descriptor.enumerable || false; descriptor.configurable = true; if ("value" in descriptor) descriptor.writable = true; Object.defineProperty(target, descriptor.key, descriptor); } } return function (Constructor, protoProps, staticProps) { if (protoProps) defineProperties(Constructor.prototype, protoProps); if (staticProps) defineProperties(Constructor, staticProps); return Constructor; }; }();
+
+function _classCallCheck(instance, Constructor) { if (!(instance instanceof Constructor)) { throw new TypeError("Cannot call a class as a function"); } }
+
+/**
+ * Copyright 2016 Google Inc. All Rights Reserved.
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *      http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+
+/* eslint no-unused-vars: [2, {"args": "none"}] */
+
+/**
+ * Adapter for MDC Ripple. Provides an interface for managing
+ * - classes
+ * - dom
+ * - CSS variables
+ * - position
+ * - dimensions
+ * - scroll position
+ * - event handlers
+ * - unbounded, active and disabled states
+ *
+ * Additionally, provides type information for the adapter to the Closure
+ * compiler.
+ *
+ * Implement this adapter for your framework of choice to delegate updates to
+ * the component in your framework of choice. See architecture documentation
+ * for more details.
+ * https://github.com/material-components/material-components-web/blob/master/docs/architecture.md
+ *
+ * @record
+ */
+var MDCRippleAdapter = function () {
+  function MDCRippleAdapter() {
+    _classCallCheck(this, MDCRippleAdapter);
+  }
+
+  _createClass(MDCRippleAdapter, [{
+    key: "browserSupportsCssVars",
+
+    /** @return {boolean} */
+    value: function browserSupportsCssVars() {}
+
+    /** @return {boolean} */
+
+  }, {
+    key: "isUnbounded",
+    value: function isUnbounded() {}
+
+    /** @return {boolean} */
+
+  }, {
+    key: "isSurfaceActive",
+    value: function isSurfaceActive() {}
+
+    /** @return {boolean} */
+
+  }, {
+    key: "isSurfaceDisabled",
+    value: function isSurfaceDisabled() {}
+
+    /** @param {string} className */
+
+  }, {
+    key: "addClass",
+    value: function addClass(className) {}
+
+    /** @param {string} className */
+
+  }, {
+    key: "removeClass",
+    value: function removeClass(className) {}
+
+    /**
+     * @param {string} evtType
+     * @param {!Function} handler
+     */
+
+  }, {
+    key: "registerInteractionHandler",
+    value: function registerInteractionHandler(evtType, handler) {}
+
+    /**
+     * @param {string} evtType
+     * @param {!Function} handler
+     */
+
+  }, {
+    key: "deregisterInteractionHandler",
+    value: function deregisterInteractionHandler(evtType, handler) {}
+
+    /**
+     * @param {!Function} handler
+     */
+
+  }, {
+    key: "registerResizeHandler",
+    value: function registerResizeHandler(handler) {}
+
+    /**
+     * @param {!Function} handler
+     */
+
+  }, {
+    key: "deregisterResizeHandler",
+    value: function deregisterResizeHandler(handler) {}
+
+    /**
+     * @param {string} varName
+     * @param {?number|string} value
+     */
+
+  }, {
+    key: "updateCssVariable",
+    value: function updateCssVariable(varName, value) {}
+
+    /** @return {!ClientRect} */
+
+  }, {
+    key: "computeBoundingRect",
+    value: function computeBoundingRect() {}
+
+    /** @return {{x: number, y: number}} */
+
+  }, {
+    key: "getWindowPageOffset",
+    value: function getWindowPageOffset() {}
+  }]);
+
+  return MDCRippleAdapter;
+}();
+
+/* unused harmony default export */ var _unused_webpack_default_export = (MDCRippleAdapter);
+
+/***/ }),
+
+/***/ 5:
+/***/ (function(module, __webpack_exports__, __webpack_require__) {
+
+"use strict";
+Object.defineProperty(__webpack_exports__, "__esModule", { value: true });
+/* harmony export (immutable) */ __webpack_exports__["supportsCssVariables"] = supportsCssVariables;
+/* harmony export (immutable) */ __webpack_exports__["applyPassive"] = applyPassive;
+/* harmony export (immutable) */ __webpack_exports__["getMatchesProperty"] = getMatchesProperty;
+/* harmony export (immutable) */ __webpack_exports__["getNormalizedEventCoords"] = getNormalizedEventCoords;
+/**
+ * Copyright 2016 Google Inc. All Rights Reserved.
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *      http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+
+/**
+ * Stores result from supportsCssVariables to avoid redundant processing to detect CSS custom variable support.
+ * @private {boolean|undefined}
+ */
+var supportsCssVariables_ = void 0;
+
+/**
+ * Stores result from applyPassive to avoid redundant processing to detect passive event listener support.
+ * @private {boolean|undefined}
+ */
+var supportsPassive_ = void 0;
+
+/**
+ * @param {!Window} windowObj
+ * @return {boolean}
+ */
+function detectEdgePseudoVarBug(windowObj) {
+  // Detect versions of Edge with buggy var() support
+  // See: https://developer.microsoft.com/en-us/microsoft-edge/platform/issues/11495448/
+  var document = windowObj.document;
+  var className = 'test-edge-css-var';
+  var styleNode = document.createElement('style');
+  document.head.appendChild(styleNode);
+  var sheet = styleNode.sheet;
+  // Internet Explorer 11 requires indices to always be specified to insertRule
+  sheet.insertRule(':root { --' + className + ': 1px solid #000; }', 0);
+  sheet.insertRule('.' + className + ' { visibility: hidden; }', 1);
+  sheet.insertRule('.' + className + '::before { border: var(--' + className + '); }', 2);
+  var node = document.createElement('div');
+  node.className = className;
+  document.body.appendChild(node);
+  // Bug exists if ::before style ends up propagating to the parent element
+  var hasPseudoVarBug = windowObj.getComputedStyle(node).borderTopStyle === 'solid';
+  node.remove();
+  styleNode.remove();
+  return hasPseudoVarBug;
+}
+
+/**
+ * @param {!Window} windowObj
+ * @param {boolean=} forceRefresh
+ * @return {boolean|undefined}
+ */
+function supportsCssVariables(windowObj) {
+  var forceRefresh = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : false;
+
+  if (typeof supportsCssVariables_ === 'boolean' && !forceRefresh) {
+    return supportsCssVariables_;
+  }
+
+  var supportsFunctionPresent = windowObj.CSS && typeof windowObj.CSS.supports === 'function';
+  if (!supportsFunctionPresent) {
+    return;
+  }
+
+  var explicitlySupportsCssVars = windowObj.CSS.supports('--css-vars', 'yes');
+  // See: https://bugs.webkit.org/show_bug.cgi?id=154669
+  // See: README section on Safari
+  var weAreFeatureDetectingSafari10plus = windowObj.CSS.supports('(--css-vars: yes)') && windowObj.CSS.supports('color', '#00000000');
+
+  if (explicitlySupportsCssVars || weAreFeatureDetectingSafari10plus) {
+    supportsCssVariables_ = !detectEdgePseudoVarBug(windowObj);
+  } else {
+    supportsCssVariables_ = false;
+  }
+  return supportsCssVariables_;
+}
+
+//
+/**
+ * Determine whether the current browser supports passive event listeners, and if so, use them.
+ * @param {!Window=} globalObj
+ * @param {boolean=} forceRefresh
+ * @return {boolean|{passive: boolean}}
+ */
+function applyPassive() {
+  var globalObj = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : window;
+  var forceRefresh = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : false;
+
+  if (supportsPassive_ === undefined || forceRefresh) {
+    var isSupported = false;
+    try {
+      globalObj.document.addEventListener('test', null, { get passive() {
+          isSupported = true;
+        } });
+    } catch (e) {}
+
+    supportsPassive_ = isSupported;
+  }
+
+  return supportsPassive_ ? { passive: true } : false;
+}
+
+/**
+ * @param {!Object} HTMLElementPrototype
+ * @return {!Array<string>}
+ */
+function getMatchesProperty(HTMLElementPrototype) {
+  return ['webkitMatchesSelector', 'msMatchesSelector', 'matches'].filter(function (p) {
+    return p in HTMLElementPrototype;
+  }).pop();
+}
+
+/**
+ * @param {!Event} ev
+ * @param {!{x: number, y: number}} pageOffset
+ * @param {!ClientRect} clientRect
+ * @return {!{x: number, y: number}}
+ */
+function getNormalizedEventCoords(ev, pageOffset, clientRect) {
+  var x = pageOffset.x,
+      y = pageOffset.y;
+
+  var documentX = x + clientRect.left;
+  var documentY = y + clientRect.top;
+
+  var normalizedX = void 0;
+  var normalizedY = void 0;
+  // Determine touch point relative to the ripple container.
+  if (ev.type === 'touchstart') {
+    normalizedX = ev.changedTouches[0].pageX - documentX;
+    normalizedY = ev.changedTouches[0].pageY - documentY;
+  } else {
+    normalizedX = ev.pageX - documentX;
+    normalizedY = ev.pageY - documentY;
+  }
+
+  return { x: normalizedX, y: normalizedY };
+}
+
+/***/ }),
+
+/***/ 6:
+/***/ (function(module, __webpack_exports__, __webpack_require__) {
+
+"use strict";
+Object.defineProperty(__webpack_exports__, "__esModule", { value: true });
+/* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, "MDCRipple", function() { return MDCRipple; });
+/* harmony import */ var __WEBPACK_IMPORTED_MODULE_0__material_base_component__ = __webpack_require__(1);
+/* harmony import */ var __WEBPACK_IMPORTED_MODULE_1__adapter__ = __webpack_require__(4);
+/* harmony import */ var __WEBPACK_IMPORTED_MODULE_2__foundation__ = __webpack_require__(8);
+/* harmony import */ var __WEBPACK_IMPORTED_MODULE_3__util__ = __webpack_require__(5);
+/* harmony reexport (binding) */ __webpack_require__.d(__webpack_exports__, "MDCRippleFoundation", function() { return __WEBPACK_IMPORTED_MODULE_2__foundation__["a"]; });
+/* harmony reexport (module object) */ __webpack_require__.d(__webpack_exports__, "util", function() { return __WEBPACK_IMPORTED_MODULE_3__util__; });
+var _createClass = function () { function defineProperties(target, props) { for (var i = 0; i < props.length; i++) { var descriptor = props[i]; descriptor.enumerable = descriptor.enumerable || false; descriptor.configurable = true; if ("value" in descriptor) descriptor.writable = true; Object.defineProperty(target, descriptor.key, descriptor); } } return function (Constructor, protoProps, staticProps) { if (protoProps) defineProperties(Constructor.prototype, protoProps); if (staticProps) defineProperties(Constructor, staticProps); return Constructor; }; }();
+
+function _classCallCheck(instance, Constructor) { if (!(instance instanceof Constructor)) { throw new TypeError("Cannot call a class as a function"); } }
+
+function _possibleConstructorReturn(self, call) { if (!self) { throw new ReferenceError("this hasn't been initialised - super() hasn't been called"); } return call && (typeof call === "object" || typeof call === "function") ? call : self; }
+
+function _inherits(subClass, superClass) { if (typeof superClass !== "function" && superClass !== null) { throw new TypeError("Super expression must either be null or a function, not " + typeof superClass); } subClass.prototype = Object.create(superClass && superClass.prototype, { constructor: { value: subClass, enumerable: false, writable: true, configurable: true } }); if (superClass) Object.setPrototypeOf ? Object.setPrototypeOf(subClass, superClass) : subClass.__proto__ = superClass; }
+
+/**
+ * Copyright 2016 Google Inc. All Rights Reserved.
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *      http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+
+
+
+
+
+
+
+
+
+/**
+ * @extends MDCComponent<!MDCRippleFoundation>
+ */
+var MDCRipple = function (_MDCComponent) {
+  _inherits(MDCRipple, _MDCComponent);
+
+  /** @param {...?} args */
+  function MDCRipple() {
+    var _ref;
+
+    _classCallCheck(this, MDCRipple);
+
+    for (var _len = arguments.length, args = Array(_len), _key = 0; _key < _len; _key++) {
+      args[_key] = arguments[_key];
+    }
+
+    /** @type {boolean} */
+    var _this = _possibleConstructorReturn(this, (_ref = MDCRipple.__proto__ || Object.getPrototypeOf(MDCRipple)).call.apply(_ref, [this].concat(args)));
+
+    _this.disabled = false;
+
+    /** @private {boolean} */
+    _this.unbounded_;
+    return _this;
+  }
+
+  /**
+   * @param {!Element} root
+   * @param {{isUnbounded: (boolean|undefined)}=} options
+   * @return {!MDCRipple}
+   */
+
+
+  _createClass(MDCRipple, [{
+    key: 'activate',
+    value: function activate() {
+      this.foundation_.activate();
+    }
+  }, {
+    key: 'deactivate',
+    value: function deactivate() {
+      this.foundation_.deactivate();
+    }
+  }, {
+    key: 'layout',
+    value: function layout() {
+      this.foundation_.layout();
+    }
+
+    /** @return {!MDCRippleFoundation} */
+
+  }, {
+    key: 'getDefaultFoundation',
+    value: function getDefaultFoundation() {
+      return new __WEBPACK_IMPORTED_MODULE_2__foundation__["a" /* default */](MDCRipple.createAdapter(this));
+    }
+  }, {
+    key: 'initialSyncWithDOM',
+    value: function initialSyncWithDOM() {
+      this.unbounded = 'mdcRippleIsUnbounded' in this.root_.dataset;
+    }
+  }, {
+    key: 'unbounded',
+
+
+    /** @return {boolean} */
+    get: function get() {
+      return this.unbounded_;
+    }
+
+    /** @param {boolean} unbounded */
+    ,
+    set: function set(unbounded) {
+      var UNBOUNDED = __WEBPACK_IMPORTED_MODULE_2__foundation__["a" /* default */].cssClasses.UNBOUNDED;
+
+      this.unbounded_ = Boolean(unbounded);
+      if (this.unbounded_) {
+        this.root_.classList.add(UNBOUNDED);
+      } else {
+        this.root_.classList.remove(UNBOUNDED);
+      }
+    }
+  }], [{
+    key: 'attachTo',
+    value: function attachTo(root) {
+      var _ref2 = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : {},
+          _ref2$isUnbounded = _ref2.isUnbounded,
+          isUnbounded = _ref2$isUnbounded === undefined ? undefined : _ref2$isUnbounded;
+
+      var ripple = new MDCRipple(root);
+      // Only override unbounded behavior if option is explicitly specified
+      if (isUnbounded !== undefined) {
+        ripple.unbounded = /** @type {boolean} */isUnbounded;
+      }
+      return ripple;
+    }
+
+    /**
+     * @param {!RippleCapableSurface} instance
+     * @return {!MDCRippleAdapter}
+     */
+
+  }, {
+    key: 'createAdapter',
+    value: function createAdapter(instance) {
+      var MATCHES = __WEBPACK_IMPORTED_MODULE_3__util__["getMatchesProperty"](HTMLElement.prototype);
+
+      return {
+        browserSupportsCssVars: function browserSupportsCssVars() {
+          return __WEBPACK_IMPORTED_MODULE_3__util__["supportsCssVariables"](window);
+        },
+        isUnbounded: function isUnbounded() {
+          return instance.unbounded;
+        },
+        isSurfaceActive: function isSurfaceActive() {
+          return instance.root_[MATCHES](':active');
+        },
+        isSurfaceDisabled: function isSurfaceDisabled() {
+          return instance.disabled;
+        },
+        addClass: function addClass(className) {
+          return instance.root_.classList.add(className);
+        },
+        removeClass: function removeClass(className) {
+          return instance.root_.classList.remove(className);
+        },
+        registerInteractionHandler: function registerInteractionHandler(evtType, handler) {
+          return instance.root_.addEventListener(evtType, handler, __WEBPACK_IMPORTED_MODULE_3__util__["applyPassive"]());
+        },
+        deregisterInteractionHandler: function deregisterInteractionHandler(evtType, handler) {
+          return instance.root_.removeEventListener(evtType, handler, __WEBPACK_IMPORTED_MODULE_3__util__["applyPassive"]());
+        },
+        registerResizeHandler: function registerResizeHandler(handler) {
+          return window.addEventListener('resize', handler);
+        },
+        deregisterResizeHandler: function deregisterResizeHandler(handler) {
+          return window.removeEventListener('resize', handler);
+        },
+        updateCssVariable: function updateCssVariable(varName, value) {
+          return instance.root_.style.setProperty(varName, value);
+        },
+        computeBoundingRect: function computeBoundingRect() {
+          return instance.root_.getBoundingClientRect();
+        },
+        getWindowPageOffset: function getWindowPageOffset() {
+          return { x: window.pageXOffset, y: window.pageYOffset };
+        }
+      };
+    }
+  }]);
+
+  return MDCRipple;
+}(__WEBPACK_IMPORTED_MODULE_0__material_base_component__["a" /* default */]);
+
+/**
+ * See Material Design spec for more details on when to use ripples.
+ * https://material.io/guidelines/motion/choreography.html#choreography-creation
+ * @record
+ */
+
+var RippleCapableSurface = function RippleCapableSurface() {
+  _classCallCheck(this, RippleCapableSurface);
+};
+
+/** @protected {!Element} */
+
+
+RippleCapableSurface.prototype.root_;
+
+/**
+ * Whether or not the ripple bleeds out of the bounds of the element.
+ * @type {boolean|undefined}
+ */
+RippleCapableSurface.prototype.unbounded;
+
+/**
+ * Whether or not the ripple is attached to a disabled component.
+ * @type {boolean|undefined}
+ */
+RippleCapableSurface.prototype.disabled;
+
+/***/ }),
+
+/***/ 61:
+/***/ (function(module, __webpack_exports__, __webpack_require__) {
+
+"use strict";
+/* harmony import */ var __WEBPACK_IMPORTED_MODULE_0__material_base_selection_control__ = __webpack_require__(3);
+var _createClass = function () { function defineProperties(target, props) { for (var i = 0; i < props.length; i++) { var descriptor = props[i]; descriptor.enumerable = descriptor.enumerable || false; descriptor.configurable = true; if ("value" in descriptor) descriptor.writable = true; Object.defineProperty(target, descriptor.key, descriptor); } } return function (Constructor, protoProps, staticProps) { if (protoProps) defineProperties(Constructor.prototype, protoProps); if (staticProps) defineProperties(Constructor, staticProps); return Constructor; }; }();
+
+function _classCallCheck(instance, Constructor) { if (!(instance instanceof Constructor)) { throw new TypeError("Cannot call a class as a function"); } }
+
+/**
+ * Copyright 2016 Google Inc. All Rights Reserved.
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *      http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+
+/* eslint-disable no-unused-vars */
+
+
+/* eslint no-unused-vars: [2, {"args": "none"}] */
+
+/**
+ * Adapter for MDC Radio. Provides an interface for managing
+ * - classes
+ * - dom
+ *
+ * Additionally, provides type information for the adapter to the Closure
+ * compiler.
+ *
+ * Implement this adapter for your framework of choice to delegate updates to
+ * the component in your framework of choice. See architecture documentation
+ * for more details.
+ * https://github.com/material-components/material-components-web/blob/master/docs/architecture.md
+ *
+ * @record
+ */
+
+var MDCRadioAdapter = function () {
+  function MDCRadioAdapter() {
+    _classCallCheck(this, MDCRadioAdapter);
+  }
+
+  _createClass(MDCRadioAdapter, [{
+    key: 'addClass',
+
+    /** @param {string} className */
+    value: function addClass(className) {}
+
+    /** @param {string} className */
+
+  }, {
+    key: 'removeClass',
+    value: function removeClass(className) {}
+
+    /** @return {!SelectionControlState} */
+
+  }, {
+    key: 'getNativeControl',
+    value: function getNativeControl() {}
+  }]);
+
+  return MDCRadioAdapter;
+}();
+
+/* unused harmony default export */ var _unused_webpack_default_export = (MDCRadioAdapter);
+
+/***/ }),
+
+/***/ 62:
+/***/ (function(module, __webpack_exports__, __webpack_require__) {
+
+"use strict";
+/* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, "b", function() { return strings; });
+/* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, "a", function() { return cssClasses; });
+/**
+ * Copyright 2016 Google Inc. All Rights Reserved.
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *      http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+
+/** @enum {string} */
+var strings = {
+  NATIVE_CONTROL_SELECTOR: '.mdc-radio__native-control'
+};
+
+/** @enum {string} */
+var cssClasses = {
+  ROOT: 'mdc-radio',
+  DISABLED: 'mdc-radio--disabled'
+};
+
+/***/ }),
+
+/***/ 63:
+/***/ (function(module, __webpack_exports__, __webpack_require__) {
+
+"use strict";
+/* harmony import */ var __WEBPACK_IMPORTED_MODULE_0__material_base_foundation__ = __webpack_require__(0);
+/* harmony import */ var __WEBPACK_IMPORTED_MODULE_1__material_base_selection_control__ = __webpack_require__(3);
+/* harmony import */ var __WEBPACK_IMPORTED_MODULE_2__adapter__ = __webpack_require__(61);
+/* harmony import */ var __WEBPACK_IMPORTED_MODULE_3__constants__ = __webpack_require__(62);
+var _createClass = function () { function defineProperties(target, props) { for (var i = 0; i < props.length; i++) { var descriptor = props[i]; descriptor.enumerable = descriptor.enumerable || false; descriptor.configurable = true; if ("value" in descriptor) descriptor.writable = true; Object.defineProperty(target, descriptor.key, descriptor); } } return function (Constructor, protoProps, staticProps) { if (protoProps) defineProperties(Constructor.prototype, protoProps); if (staticProps) defineProperties(Constructor, staticProps); return Constructor; }; }();
+
+function _classCallCheck(instance, Constructor) { if (!(instance instanceof Constructor)) { throw new TypeError("Cannot call a class as a function"); } }
+
+function _possibleConstructorReturn(self, call) { if (!self) { throw new ReferenceError("this hasn't been initialised - super() hasn't been called"); } return call && (typeof call === "object" || typeof call === "function") ? call : self; }
+
+function _inherits(subClass, superClass) { if (typeof superClass !== "function" && superClass !== null) { throw new TypeError("Super expression must either be null or a function, not " + typeof superClass); } subClass.prototype = Object.create(superClass && superClass.prototype, { constructor: { value: subClass, enumerable: false, writable: true, configurable: true } }); if (superClass) Object.setPrototypeOf ? Object.setPrototypeOf(subClass, superClass) : subClass.__proto__ = superClass; }
+
+/**
+ * Copyright 2016 Google Inc. All Rights Reserved.
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *      http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+
+
+/* eslint-disable no-unused-vars */
+
+
+/* eslint-enable no-unused-vars */
+
+
+/**
+ * @extends {MDCFoundation<!MDCRadioAdapter>}
+ */
+
+var MDCRadioFoundation = function (_MDCFoundation) {
+  _inherits(MDCRadioFoundation, _MDCFoundation);
+
+  function MDCRadioFoundation() {
+    _classCallCheck(this, MDCRadioFoundation);
+
+    return _possibleConstructorReturn(this, (MDCRadioFoundation.__proto__ || Object.getPrototypeOf(MDCRadioFoundation)).apply(this, arguments));
+  }
+
+  _createClass(MDCRadioFoundation, [{
+    key: 'isChecked',
+
+
+    /** @return {boolean} */
+    value: function isChecked() {
+      return this.getNativeControl_().checked;
+    }
+
+    /** @param {boolean} checked */
+
+  }, {
+    key: 'setChecked',
+    value: function setChecked(checked) {
+      this.getNativeControl_().checked = checked;
+    }
+
+    /** @return {boolean} */
+
+  }, {
+    key: 'isDisabled',
+    value: function isDisabled() {
+      return this.getNativeControl_().disabled;
+    }
+
+    /** @param {boolean} disabled */
+
+  }, {
+    key: 'setDisabled',
+    value: function setDisabled(disabled) {
+      var DISABLED = MDCRadioFoundation.cssClasses.DISABLED;
+
+      this.getNativeControl_().disabled = disabled;
+      if (disabled) {
+        this.adapter_.addClass(DISABLED);
+      } else {
+        this.adapter_.removeClass(DISABLED);
+      }
+    }
+
+    /** @return {?string} */
+
+  }, {
+    key: 'getValue',
+    value: function getValue() {
+      return this.getNativeControl_().value;
+    }
+
+    /** @param {?string} value */
+
+  }, {
+    key: 'setValue',
+    value: function setValue(value) {
+      this.getNativeControl_().value = value;
+    }
+
+    /**
+     * @return {!SelectionControlState}
+     * @private
+     */
+
+  }, {
+    key: 'getNativeControl_',
+    value: function getNativeControl_() {
+      return this.adapter_.getNativeControl() || {
+        checked: false,
+        disabled: false,
+        value: null
+      };
+    }
+  }], [{
+    key: 'cssClasses',
+
+    /** @return enum {cssClasses} */
+    get: function get() {
+      return __WEBPACK_IMPORTED_MODULE_3__constants__["a" /* cssClasses */];
+    }
+
+    /** @return enum {strings} */
+
+  }, {
+    key: 'strings',
+    get: function get() {
+      return __WEBPACK_IMPORTED_MODULE_3__constants__["b" /* strings */];
+    }
+
+    /** @return {!MDCRadioAdapter} */
+
+  }, {
+    key: 'defaultAdapter',
+    get: function get() {
+      return (/** @type {!MDCRadioAdapter} */{
+          addClass: function addClass() /* className: string */{},
+          removeClass: function removeClass() /* className: string */{},
+          getNativeControl: function getNativeControl() /* !SelectionControlState */{}
+        }
+      );
+    }
+  }]);
+
+  return MDCRadioFoundation;
+}(__WEBPACK_IMPORTED_MODULE_0__material_base_foundation__["a" /* default */]);
+
+/* harmony default export */ __webpack_exports__["a"] = (MDCRadioFoundation);
+
+/***/ }),
+
+/***/ 7:
+/***/ (function(module, __webpack_exports__, __webpack_require__) {
+
+"use strict";
+/* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, "a", function() { return cssClasses; });
+/* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, "b", function() { return strings; });
+/* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, "c", function() { return numbers; });
+/**
+ * Copyright 2016 Google Inc. All Rights Reserved.
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *      http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+
+var cssClasses = {
+  // Ripple is a special case where the "root" component is really a "mixin" of sorts,
+  // given that it's an 'upgrade' to an existing component. That being said it is the root
+  // CSS class that all other CSS classes derive from.
+  ROOT: 'mdc-ripple-upgraded',
+  UNBOUNDED: 'mdc-ripple-upgraded--unbounded',
+  BG_FOCUSED: 'mdc-ripple-upgraded--background-focused',
+  BG_ACTIVE_FILL: 'mdc-ripple-upgraded--background-active-fill',
+  FG_ACTIVATION: 'mdc-ripple-upgraded--foreground-activation',
+  FG_DEACTIVATION: 'mdc-ripple-upgraded--foreground-deactivation'
+};
+
+var strings = {
+  VAR_SURFACE_WIDTH: '--mdc-ripple-surface-width',
+  VAR_SURFACE_HEIGHT: '--mdc-ripple-surface-height',
+  VAR_FG_SIZE: '--mdc-ripple-fg-size',
+  VAR_LEFT: '--mdc-ripple-left',
+  VAR_TOP: '--mdc-ripple-top',
+  VAR_FG_SCALE: '--mdc-ripple-fg-scale',
+  VAR_FG_TRANSLATE_START: '--mdc-ripple-fg-translate-start',
+  VAR_FG_TRANSLATE_END: '--mdc-ripple-fg-translate-end'
+};
+
+var numbers = {
+  PADDING: 10,
+  INITIAL_ORIGIN_SCALE: 0.6,
+  DEACTIVATION_TIMEOUT_MS: 300,
+  FG_DEACTIVATION_MS: 83
+};
+
+/***/ }),
+
+/***/ 8:
+/***/ (function(module, __webpack_exports__, __webpack_require__) {
+
+"use strict";
+/* harmony import */ var __WEBPACK_IMPORTED_MODULE_0__material_base_foundation__ = __webpack_require__(0);
+/* harmony import */ var __WEBPACK_IMPORTED_MODULE_1__adapter__ = __webpack_require__(4);
+/* harmony import */ var __WEBPACK_IMPORTED_MODULE_2__constants__ = __webpack_require__(7);
+/* harmony import */ var __WEBPACK_IMPORTED_MODULE_3__util__ = __webpack_require__(5);
+var _extends = Object.assign || function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; };
+
+var _createClass = function () { function defineProperties(target, props) { for (var i = 0; i < props.length; i++) { var descriptor = props[i]; descriptor.enumerable = descriptor.enumerable || false; descriptor.configurable = true; if ("value" in descriptor) descriptor.writable = true; Object.defineProperty(target, descriptor.key, descriptor); } } return function (Constructor, protoProps, staticProps) { if (protoProps) defineProperties(Constructor.prototype, protoProps); if (staticProps) defineProperties(Constructor, staticProps); return Constructor; }; }();
+
+function _classCallCheck(instance, Constructor) { if (!(instance instanceof Constructor)) { throw new TypeError("Cannot call a class as a function"); } }
+
+function _possibleConstructorReturn(self, call) { if (!self) { throw new ReferenceError("this hasn't been initialised - super() hasn't been called"); } return call && (typeof call === "object" || typeof call === "function") ? call : self; }
+
+function _inherits(subClass, superClass) { if (typeof superClass !== "function" && superClass !== null) { throw new TypeError("Super expression must either be null or a function, not " + typeof superClass); } subClass.prototype = Object.create(superClass && superClass.prototype, { constructor: { value: subClass, enumerable: false, writable: true, configurable: true } }); if (superClass) Object.setPrototypeOf ? Object.setPrototypeOf(subClass, superClass) : subClass.__proto__ = superClass; }
+
+/**
+ * Copyright 2016 Google Inc. All Rights Reserved.
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *      http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+
+
+
+
+
+
+/**
+ * @typedef {!{
+ *   isActivated: (boolean|undefined),
+ *   hasDeactivationUXRun: (boolean|undefined),
+ *   wasActivatedByPointer: (boolean|undefined),
+ *   wasElementMadeActive: (boolean|undefined),
+ *   activationStartTime: (number|undefined),
+ *   activationEvent: Event,
+ *   isProgrammatic: (boolean|undefined)
+ * }}
+ */
+var ActivationStateType = void 0;
+
+/**
+ * @typedef {!{
+ *   activate: (string|undefined),
+ *   deactivate: (string|undefined),
+ *   focus: (string|undefined),
+ *   blur: (string|undefined)
+ * }}
+ */
+var ListenerInfoType = void 0;
+
+/**
+ * @typedef {!{
+ *   activate: function(!Event),
+ *   deactivate: function(!Event),
+ *   focus: function(),
+ *   blur: function()
+ * }}
+ */
+var ListenersType = void 0;
+
+/**
+ * @typedef {!{
+ *   x: number,
+ *   y: number
+ * }}
+ */
+var PointType = void 0;
+
+/**
+ * @enum {string}
+ */
+var DEACTIVATION_ACTIVATION_PAIRS = {
+  mouseup: 'mousedown',
+  pointerup: 'pointerdown',
+  touchend: 'touchstart',
+  keyup: 'keydown',
+  blur: 'focus'
+};
+
+/**
+ * @extends {MDCFoundation<!MDCRippleAdapter>}
+ */
+
+var MDCRippleFoundation = function (_MDCFoundation) {
+  _inherits(MDCRippleFoundation, _MDCFoundation);
+
+  _createClass(MDCRippleFoundation, [{
+    key: 'isSupported_',
+
+
+    /**
+     * We compute this property so that we are not querying information about the client
+     * until the point in time where the foundation requests it. This prevents scenarios where
+     * client-side feature-detection may happen too early, such as when components are rendered on the server
+     * and then initialized at mount time on the client.
+     * @return {boolean}
+     */
+    get: function get() {
+      return this.adapter_.browserSupportsCssVars();
+    }
+  }], [{
+    key: 'cssClasses',
+    get: function get() {
+      return __WEBPACK_IMPORTED_MODULE_2__constants__["a" /* cssClasses */];
+    }
+  }, {
+    key: 'strings',
+    get: function get() {
+      return __WEBPACK_IMPORTED_MODULE_2__constants__["b" /* strings */];
+    }
+  }, {
+    key: 'numbers',
+    get: function get() {
+      return __WEBPACK_IMPORTED_MODULE_2__constants__["c" /* numbers */];
+    }
+  }, {
+    key: 'defaultAdapter',
+    get: function get() {
+      return {
+        browserSupportsCssVars: function browserSupportsCssVars() /* boolean - cached */{},
+        isUnbounded: function isUnbounded() /* boolean */{},
+        isSurfaceActive: function isSurfaceActive() /* boolean */{},
+        isSurfaceDisabled: function isSurfaceDisabled() /* boolean */{},
+        addClass: function addClass() /* className: string */{},
+        removeClass: function removeClass() /* className: string */{},
+        registerInteractionHandler: function registerInteractionHandler() /* evtType: string, handler: EventListener */{},
+        deregisterInteractionHandler: function deregisterInteractionHandler() /* evtType: string, handler: EventListener */{},
+        registerResizeHandler: function registerResizeHandler() /* handler: EventListener */{},
+        deregisterResizeHandler: function deregisterResizeHandler() /* handler: EventListener */{},
+        updateCssVariable: function updateCssVariable() /* varName: string, value: string */{},
+        computeBoundingRect: function computeBoundingRect() /* ClientRect */{},
+        getWindowPageOffset: function getWindowPageOffset() /* {x: number, y: number} */{}
+      };
+    }
+  }]);
+
+  function MDCRippleFoundation(adapter) {
+    _classCallCheck(this, MDCRippleFoundation);
+
+    /** @private {number} */
+    var _this = _possibleConstructorReturn(this, (MDCRippleFoundation.__proto__ || Object.getPrototypeOf(MDCRippleFoundation)).call(this, _extends(MDCRippleFoundation.defaultAdapter, adapter)));
+
+    _this.layoutFrame_ = 0;
+
+    /** @private {!ClientRect} */
+    _this.frame_ = /** @type {!ClientRect} */{ width: 0, height: 0 };
+
+    /** @private {!ActivationStateType} */
+    _this.activationState_ = _this.defaultActivationState_();
+
+    /** @private {number} */
+    _this.xfDuration_ = 0;
+
+    /** @private {number} */
+    _this.initialSize_ = 0;
+
+    /** @private {number} */
+    _this.maxRadius_ = 0;
+
+    /** @private {!Array<{ListenerInfoType}>} */
+    _this.listenerInfos_ = [{ activate: 'touchstart', deactivate: 'touchend' }, { activate: 'pointerdown', deactivate: 'pointerup' }, { activate: 'mousedown', deactivate: 'mouseup' }, { activate: 'keydown', deactivate: 'keyup' }, { focus: 'focus', blur: 'blur' }];
+
+    /** @private {!ListenersType} */
+    _this.listeners_ = {
+      activate: function activate(e) {
+        return _this.activate_(e);
+      },
+      deactivate: function deactivate(e) {
+        return _this.deactivate_(e);
+      },
+      focus: function focus() {
+        return requestAnimationFrame(function () {
+          return _this.adapter_.addClass(MDCRippleFoundation.cssClasses.BG_FOCUSED);
+        });
+      },
+      blur: function blur() {
+        return requestAnimationFrame(function () {
+          return _this.adapter_.removeClass(MDCRippleFoundation.cssClasses.BG_FOCUSED);
+        });
+      }
+    };
+
+    /** @private {!Function} */
+    _this.resizeHandler_ = function () {
+      return _this.layout();
+    };
+
+    /** @private {!{left: number, top:number}} */
+    _this.unboundedCoords_ = {
+      left: 0,
+      top: 0
+    };
+
+    /** @private {number} */
+    _this.fgScale_ = 0;
+
+    /** @private {number} */
+    _this.activationTimer_ = 0;
+
+    /** @private {number} */
+    _this.fgDeactivationRemovalTimer_ = 0;
+
+    /** @private {boolean} */
+    _this.activationAnimationHasEnded_ = false;
+
+    /** @private {!Function} */
+    _this.activationTimerCallback_ = function () {
+      _this.activationAnimationHasEnded_ = true;
+      _this.runDeactivationUXLogicIfReady_();
+    };
+    return _this;
+  }
+
+  /**
+   * @return {!ActivationStateType}
+   */
+
+
+  _createClass(MDCRippleFoundation, [{
+    key: 'defaultActivationState_',
+    value: function defaultActivationState_() {
+      return {
+        isActivated: false,
+        hasDeactivationUXRun: false,
+        wasActivatedByPointer: false,
+        wasElementMadeActive: false,
+        activationStartTime: 0,
+        activationEvent: null,
+        isProgrammatic: false
+      };
+    }
+  }, {
+    key: 'init',
+    value: function init() {
+      var _this2 = this;
+
+      if (!this.isSupported_) {
+        return;
+      }
+      this.addEventListeners_();
+
+      var _MDCRippleFoundation$ = MDCRippleFoundation.cssClasses,
+          ROOT = _MDCRippleFoundation$.ROOT,
+          UNBOUNDED = _MDCRippleFoundation$.UNBOUNDED;
+
+      requestAnimationFrame(function () {
+        _this2.adapter_.addClass(ROOT);
+        if (_this2.adapter_.isUnbounded()) {
+          _this2.adapter_.addClass(UNBOUNDED);
+        }
+        _this2.layoutInternal_();
+      });
+    }
+
+    /** @private */
+
+  }, {
+    key: 'addEventListeners_',
+    value: function addEventListeners_() {
+      var _this3 = this;
+
+      this.listenerInfos_.forEach(function (info) {
+        Object.keys(info).forEach(function (k) {
+          _this3.adapter_.registerInteractionHandler(info[k], _this3.listeners_[k]);
+        });
+      });
+      this.adapter_.registerResizeHandler(this.resizeHandler_);
+    }
+
+    /**
+     * @param {Event} e
+     * @private
+     */
+
+  }, {
+    key: 'activate_',
+    value: function activate_(e) {
+      var _this4 = this;
+
+      if (this.adapter_.isSurfaceDisabled()) {
+        return;
+      }
+
+      var activationState = this.activationState_;
+
+      if (activationState.isActivated) {
+        return;
+      }
+
+      activationState.isActivated = true;
+      activationState.isProgrammatic = e === null;
+      activationState.activationEvent = e;
+      activationState.wasActivatedByPointer = activationState.isProgrammatic ? false : e.type === 'mousedown' || e.type === 'touchstart' || e.type === 'pointerdown';
+      activationState.activationStartTime = Date.now();
+
+      requestAnimationFrame(function () {
+        // This needs to be wrapped in an rAF call b/c web browsers
+        // report active states inconsistently when they're called within
+        // event handling code:
+        // - https://bugs.chromium.org/p/chromium/issues/detail?id=635971
+        // - https://bugzilla.mozilla.org/show_bug.cgi?id=1293741
+        activationState.wasElementMadeActive = e && e.type === 'keydown' ? _this4.adapter_.isSurfaceActive() : true;
+        if (activationState.wasElementMadeActive) {
+          _this4.animateActivation_();
+        } else {
+          // Reset activation state immediately if element was not made active.
+          _this4.activationState_ = _this4.defaultActivationState_();
+        }
+      });
+    }
+  }, {
+    key: 'activate',
+    value: function activate() {
+      this.activate_(null);
+    }
+
+    /** @private */
+
+  }, {
+    key: 'animateActivation_',
+    value: function animateActivation_() {
+      var _this5 = this;
+
+      var _MDCRippleFoundation$2 = MDCRippleFoundation.strings,
+          VAR_FG_TRANSLATE_START = _MDCRippleFoundation$2.VAR_FG_TRANSLATE_START,
+          VAR_FG_TRANSLATE_END = _MDCRippleFoundation$2.VAR_FG_TRANSLATE_END;
+      var _MDCRippleFoundation$3 = MDCRippleFoundation.cssClasses,
+          BG_ACTIVE_FILL = _MDCRippleFoundation$3.BG_ACTIVE_FILL,
+          FG_DEACTIVATION = _MDCRippleFoundation$3.FG_DEACTIVATION,
+          FG_ACTIVATION = _MDCRippleFoundation$3.FG_ACTIVATION;
+      var DEACTIVATION_TIMEOUT_MS = MDCRippleFoundation.numbers.DEACTIVATION_TIMEOUT_MS;
+
+
+      var translateStart = '';
+      var translateEnd = '';
+
+      if (!this.adapter_.isUnbounded()) {
+        var _getFgTranslationCoor = this.getFgTranslationCoordinates_(),
+            startPoint = _getFgTranslationCoor.startPoint,
+            endPoint = _getFgTranslationCoor.endPoint;
+
+        translateStart = startPoint.x + 'px, ' + startPoint.y + 'px';
+        translateEnd = endPoint.x + 'px, ' + endPoint.y + 'px';
+      }
+
+      this.adapter_.updateCssVariable(VAR_FG_TRANSLATE_START, translateStart);
+      this.adapter_.updateCssVariable(VAR_FG_TRANSLATE_END, translateEnd);
+      // Cancel any ongoing activation/deactivation animations
+      clearTimeout(this.activationTimer_);
+      clearTimeout(this.fgDeactivationRemovalTimer_);
+      this.rmBoundedActivationClasses_();
+      this.adapter_.removeClass(FG_DEACTIVATION);
+
+      // Force layout in order to re-trigger the animation.
+      this.adapter_.computeBoundingRect();
+      this.adapter_.addClass(BG_ACTIVE_FILL);
+      this.adapter_.addClass(FG_ACTIVATION);
+      this.activationTimer_ = setTimeout(function () {
+        return _this5.activationTimerCallback_();
+      }, DEACTIVATION_TIMEOUT_MS);
+    }
+
+    /**
+     * @private
+     * @return {{startPoint: PointType, endPoint: PointType}}
+     */
+
+  }, {
+    key: 'getFgTranslationCoordinates_',
+    value: function getFgTranslationCoordinates_() {
+      var activationState = this.activationState_;
+      var activationEvent = activationState.activationEvent,
+          wasActivatedByPointer = activationState.wasActivatedByPointer;
+
+
+      var startPoint = void 0;
+      if (wasActivatedByPointer) {
+        startPoint = __webpack_require__.i(__WEBPACK_IMPORTED_MODULE_3__util__["getNormalizedEventCoords"])(
+        /** @type {!Event} */activationEvent, this.adapter_.getWindowPageOffset(), this.adapter_.computeBoundingRect());
+      } else {
+        startPoint = {
+          x: this.frame_.width / 2,
+          y: this.frame_.height / 2
+        };
+      }
+      // Center the element around the start point.
+      startPoint = {
+        x: startPoint.x - this.initialSize_ / 2,
+        y: startPoint.y - this.initialSize_ / 2
+      };
+
+      var endPoint = {
+        x: this.frame_.width / 2 - this.initialSize_ / 2,
+        y: this.frame_.height / 2 - this.initialSize_ / 2
+      };
+
+      return { startPoint: startPoint, endPoint: endPoint };
+    }
+
+    /** @private */
+
+  }, {
+    key: 'runDeactivationUXLogicIfReady_',
+    value: function runDeactivationUXLogicIfReady_() {
+      var _this6 = this;
+
+      var FG_DEACTIVATION = MDCRippleFoundation.cssClasses.FG_DEACTIVATION;
+      var _activationState_ = this.activationState_,
+          hasDeactivationUXRun = _activationState_.hasDeactivationUXRun,
+          isActivated = _activationState_.isActivated;
+
+      var activationHasEnded = hasDeactivationUXRun || !isActivated;
+      if (activationHasEnded && this.activationAnimationHasEnded_) {
+        this.rmBoundedActivationClasses_();
+        this.adapter_.addClass(FG_DEACTIVATION);
+        this.fgDeactivationRemovalTimer_ = setTimeout(function () {
+          _this6.adapter_.removeClass(FG_DEACTIVATION);
+        }, __WEBPACK_IMPORTED_MODULE_2__constants__["c" /* numbers */].FG_DEACTIVATION_MS);
+      }
+    }
+
+    /** @private */
+
+  }, {
+    key: 'rmBoundedActivationClasses_',
+    value: function rmBoundedActivationClasses_() {
+      var _MDCRippleFoundation$4 = MDCRippleFoundation.cssClasses,
+          BG_ACTIVE_FILL = _MDCRippleFoundation$4.BG_ACTIVE_FILL,
+          FG_ACTIVATION = _MDCRippleFoundation$4.FG_ACTIVATION;
+
+      this.adapter_.removeClass(BG_ACTIVE_FILL);
+      this.adapter_.removeClass(FG_ACTIVATION);
+      this.activationAnimationHasEnded_ = false;
+      this.adapter_.computeBoundingRect();
+    }
+
+    /**
+     * @param {Event} e
+     * @private
+     */
+
+  }, {
+    key: 'deactivate_',
+    value: function deactivate_(e) {
+      var _this7 = this;
+
+      var activationState = this.activationState_;
+      // This can happen in scenarios such as when you have a keyup event that blurs the element.
+
+      if (!activationState.isActivated) {
+        return;
+      }
+      // Programmatic deactivation.
+      if (activationState.isProgrammatic) {
+        var evtObject = null;
+        var _state = /** @type {!ActivationStateType} */_extends({}, activationState);
+        requestAnimationFrame(function () {
+          return _this7.animateDeactivation_(evtObject, _state);
+        });
+        this.activationState_ = this.defaultActivationState_();
+        return;
+      }
+
+      var actualActivationType = DEACTIVATION_ACTIVATION_PAIRS[e.type];
+      var expectedActivationType = activationState.activationEvent.type;
+      // NOTE: Pointer events are tricky - https://patrickhlauke.github.io/touch/tests/results/
+      // Essentially, what we need to do here is decouple the deactivation UX from the actual
+      // deactivation state itself. This way, touch/pointer events in sequence do not trample one
+      // another.
+      var needsDeactivationUX = actualActivationType === expectedActivationType;
+      var needsActualDeactivation = needsDeactivationUX;
+      if (activationState.wasActivatedByPointer) {
+        needsActualDeactivation = e.type === 'mouseup';
+      }
+
+      var state = /** @type {!ActivationStateType} */_extends({}, activationState);
+      requestAnimationFrame(function () {
+        if (needsDeactivationUX) {
+          _this7.activationState_.hasDeactivationUXRun = true;
+          _this7.animateDeactivation_(e, state);
+        }
+
+        if (needsActualDeactivation) {
+          _this7.activationState_ = _this7.defaultActivationState_();
+        }
+      });
+    }
+  }, {
+    key: 'deactivate',
+    value: function deactivate() {
+      this.deactivate_(null);
+    }
+
+    /**
+     * @param {Event} e
+     * @param {!ActivationStateType} options
+     * @private
+     */
+
+  }, {
+    key: 'animateDeactivation_',
+    value: function animateDeactivation_(e, _ref) {
+      var wasActivatedByPointer = _ref.wasActivatedByPointer,
+          wasElementMadeActive = _ref.wasElementMadeActive;
+      var BG_FOCUSED = MDCRippleFoundation.cssClasses.BG_FOCUSED;
+
+      if (wasActivatedByPointer || wasElementMadeActive) {
+        // Remove class left over by element being focused
+        this.adapter_.removeClass(BG_FOCUSED);
+        this.runDeactivationUXLogicIfReady_();
+      }
+    }
+  }, {
+    key: 'destroy',
+    value: function destroy() {
+      var _this8 = this;
+
+      if (!this.isSupported_) {
+        return;
+      }
+      this.removeEventListeners_();
+
+      var _MDCRippleFoundation$5 = MDCRippleFoundation.cssClasses,
+          ROOT = _MDCRippleFoundation$5.ROOT,
+          UNBOUNDED = _MDCRippleFoundation$5.UNBOUNDED;
+
+      requestAnimationFrame(function () {
+        _this8.adapter_.removeClass(ROOT);
+        _this8.adapter_.removeClass(UNBOUNDED);
+        _this8.removeCssVars_();
+      });
+    }
+
+    /** @private */
+
+  }, {
+    key: 'removeEventListeners_',
+    value: function removeEventListeners_() {
+      var _this9 = this;
+
+      this.listenerInfos_.forEach(function (info) {
+        Object.keys(info).forEach(function (k) {
+          _this9.adapter_.deregisterInteractionHandler(info[k], _this9.listeners_[k]);
+        });
+      });
+      this.adapter_.deregisterResizeHandler(this.resizeHandler_);
+    }
+
+    /** @private */
+
+  }, {
+    key: 'removeCssVars_',
+    value: function removeCssVars_() {
+      var _this10 = this;
+
+      var strings = MDCRippleFoundation.strings;
+
+      Object.keys(strings).forEach(function (k) {
+        if (k.indexOf('VAR_') === 0) {
+          _this10.adapter_.updateCssVariable(strings[k], null);
+        }
+      });
+    }
+  }, {
+    key: 'layout',
+    value: function layout() {
+      var _this11 = this;
+
+      if (this.layoutFrame_) {
+        cancelAnimationFrame(this.layoutFrame_);
+      }
+      this.layoutFrame_ = requestAnimationFrame(function () {
+        _this11.layoutInternal_();
+        _this11.layoutFrame_ = 0;
+      });
+    }
+
+    /** @private */
+
+  }, {
+    key: 'layoutInternal_',
+    value: function layoutInternal_() {
+      this.frame_ = this.adapter_.computeBoundingRect();
+
+      var maxDim = Math.max(this.frame_.height, this.frame_.width);
+      var surfaceDiameter = Math.sqrt(Math.pow(this.frame_.width, 2) + Math.pow(this.frame_.height, 2));
+
+      // 60% of the largest dimension of the surface
+      this.initialSize_ = maxDim * MDCRippleFoundation.numbers.INITIAL_ORIGIN_SCALE;
+
+      // Diameter of the surface + 10px
+      this.maxRadius_ = surfaceDiameter + MDCRippleFoundation.numbers.PADDING;
+      this.fgScale_ = this.maxRadius_ / this.initialSize_;
+      this.xfDuration_ = 1000 * Math.sqrt(this.maxRadius_ / 1024);
+      this.updateLayoutCssVars_();
+    }
+
+    /** @private */
+
+  }, {
+    key: 'updateLayoutCssVars_',
+    value: function updateLayoutCssVars_() {
+      var _MDCRippleFoundation$6 = MDCRippleFoundation.strings,
+          VAR_SURFACE_WIDTH = _MDCRippleFoundation$6.VAR_SURFACE_WIDTH,
+          VAR_SURFACE_HEIGHT = _MDCRippleFoundation$6.VAR_SURFACE_HEIGHT,
+          VAR_FG_SIZE = _MDCRippleFoundation$6.VAR_FG_SIZE,
+          VAR_LEFT = _MDCRippleFoundation$6.VAR_LEFT,
+          VAR_TOP = _MDCRippleFoundation$6.VAR_TOP,
+          VAR_FG_SCALE = _MDCRippleFoundation$6.VAR_FG_SCALE;
+
+
+      this.adapter_.updateCssVariable(VAR_SURFACE_WIDTH, this.frame_.width + 'px');
+      this.adapter_.updateCssVariable(VAR_SURFACE_HEIGHT, this.frame_.height + 'px');
+      this.adapter_.updateCssVariable(VAR_FG_SIZE, this.initialSize_ + 'px');
+      this.adapter_.updateCssVariable(VAR_FG_SCALE, this.fgScale_);
+
+      if (this.adapter_.isUnbounded()) {
+        this.unboundedCoords_ = {
+          left: Math.round(this.frame_.width / 2 - this.initialSize_ / 2),
+          top: Math.round(this.frame_.height / 2 - this.initialSize_ / 2)
+        };
+
+        this.adapter_.updateCssVariable(VAR_LEFT, this.unboundedCoords_.left + 'px');
+        this.adapter_.updateCssVariable(VAR_TOP, this.unboundedCoords_.top + 'px');
+      }
+    }
+  }]);
+
+  return MDCRippleFoundation;
+}(__WEBPACK_IMPORTED_MODULE_0__material_base_foundation__["a" /* default */]);
+
+/* harmony default export */ __webpack_exports__["a"] = (MDCRippleFoundation);
+
+/***/ }),
+
+/***/ 92:
+/***/ (function(module, exports, __webpack_require__) {
+
+module.exports = __webpack_require__(31);
+
+
+/***/ })
+
+/******/ });
+});

+ 514 - 0
support/client/lib/vwf/view/lib/mdc/dist/mdc.ripple.css

@@ -0,0 +1,514 @@
+/*!
+ Material Components for the web
+ Copyright (c) 2017 Google Inc.
+ License: Apache-2.0
+*/
+/*
+  Precomputed linear color channel values, for use in contrast calculations.
+  See https://www.w3.org/TR/WCAG20-TECHS/G17.html#G17-tests
+
+  Algorithm, for c in 0 to 255:
+  f(c) {
+    c = c / 255;
+    return c < 0.03928 ? c / 12.92 : Math.pow((c + 0.055) / 1.055, 2.4);
+  }
+
+  This lookup table is needed since there is no `pow` in SASS.
+*/
+/**
+ * Calculate the luminance for a color.
+ * See https://www.w3.org/TR/WCAG20-TECHS/G17.html#G17-tests
+ */
+/**
+ * Calculate the contrast ratio between two colors.
+ * See https://www.w3.org/TR/WCAG20-TECHS/G17.html#G17-tests
+ */
+/**
+ * Determine whether to use dark or light text on top of given color.
+ * Returns "dark" for dark text and "light" for light text.
+ */
+/*
+  Main theme colors.
+  If you're a user customizing your color scheme in SASS, these are probably the only variables you need to change.
+*/
+/* Indigo 500 */
+/* Pink A200 */
+/* White */
+/* Which set of text colors to use for each main theme color (light or dark) */
+/* Text colors according to light vs dark and text type */
+/* Primary text colors for each of the theme colors */
+/**
+ * Applies the correct theme color style to the specified property.
+ * $property is typically color or background-color, but can be any CSS property that accepts color values.
+ * $style should be one of the map keys in $mdc-theme-property-values (_variables.scss).
+ */
+/**
+ * Creates a rule to be used in MDC-Web components for dark theming, and applies the provided contents.
+ * Should provide the $root-selector option if applied to anything other than the root selector.
+ * When used with a modifier class, provide a second argument of `true` for the $compound parameter
+ * to specify that this should be attached as a compound class.
+ *
+ * Usage example:
+ *
+ * ```scss
+ * .mdc-foo {
+ *   color: black;
+ *
+ *   @include mdc-theme-dark {
+ *     color: white;
+ *   }
+ *
+ *   &__bar {
+ *     background: black;
+ *
+ *     @include mdc-theme-dark(".mdc-foo") {
+ *       background: white;
+ *     }
+ *   }
+ * }
+ *
+ * .mdc-foo--disabled {
+ *   opacity: .38;
+ *
+ *   @include mdc-theme-dark(".mdc-foo", true) {
+ *     opacity: .5;
+ *   }
+ * }
+ * ```
+ */
+/*
+  Precomputed linear color channel values, for use in contrast calculations.
+  See https://www.w3.org/TR/WCAG20-TECHS/G17.html#G17-tests
+
+  Algorithm, for c in 0 to 255:
+  f(c) {
+    c = c / 255;
+    return c < 0.03928 ? c / 12.92 : Math.pow((c + 0.055) / 1.055, 2.4);
+  }
+
+  This lookup table is needed since there is no `pow` in SASS.
+*/
+/**
+ * Calculate the luminance for a color.
+ * See https://www.w3.org/TR/WCAG20-TECHS/G17.html#G17-tests
+ */
+/**
+ * Calculate the contrast ratio between two colors.
+ * See https://www.w3.org/TR/WCAG20-TECHS/G17.html#G17-tests
+ */
+/**
+ * Determine whether to use dark or light text on top of given color.
+ * Returns "dark" for dark text and "light" for light text.
+ */
+/*
+  Main theme colors.
+  If you're a user customizing your color scheme in SASS, these are probably the only variables you need to change.
+*/
+/* Indigo 500 */
+/* Pink A200 */
+/* White */
+/* Which set of text colors to use for each main theme color (light or dark) */
+/* Text colors according to light vs dark and text type */
+/* Primary text colors for each of the theme colors */
+/** MDC Ripple keyframes are split into their own file so that _mixins.scss can rely on them. */
+@-webkit-keyframes mdc-ripple-fg-radius-in {
+  from {
+    -webkit-transform: translate(var(--mdc-ripple-fg-translate-start, 0)) scale(1);
+            transform: translate(var(--mdc-ripple-fg-translate-start, 0)) scale(1);
+    -webkit-animation-timing-function: cubic-bezier(0.4, 0, 0.2, 1);
+            animation-timing-function: cubic-bezier(0.4, 0, 0.2, 1); }
+  to {
+    -webkit-transform: translate(var(--mdc-ripple-fg-translate-end, 0)) scale(var(--mdc-ripple-fg-scale, 1));
+            transform: translate(var(--mdc-ripple-fg-translate-end, 0)) scale(var(--mdc-ripple-fg-scale, 1)); } }
+@keyframes mdc-ripple-fg-radius-in {
+  from {
+    -webkit-transform: translate(var(--mdc-ripple-fg-translate-start, 0)) scale(1);
+            transform: translate(var(--mdc-ripple-fg-translate-start, 0)) scale(1);
+    -webkit-animation-timing-function: cubic-bezier(0.4, 0, 0.2, 1);
+            animation-timing-function: cubic-bezier(0.4, 0, 0.2, 1); }
+  to {
+    -webkit-transform: translate(var(--mdc-ripple-fg-translate-end, 0)) scale(var(--mdc-ripple-fg-scale, 1));
+            transform: translate(var(--mdc-ripple-fg-translate-end, 0)) scale(var(--mdc-ripple-fg-scale, 1)); } }
+
+@-webkit-keyframes mdc-ripple-fg-opacity-in {
+  from {
+    opacity: 0;
+    -webkit-animation-timing-function: linear;
+            animation-timing-function: linear; }
+  to {
+    opacity: 1; } }
+
+@keyframes mdc-ripple-fg-opacity-in {
+  from {
+    opacity: 0;
+    -webkit-animation-timing-function: linear;
+            animation-timing-function: linear; }
+  to {
+    opacity: 1; } }
+
+@-webkit-keyframes mdc-ripple-fg-opacity-out {
+  from {
+    opacity: 1;
+    -webkit-animation-timing-function: linear;
+            animation-timing-function: linear; }
+  to {
+    opacity: 0; } }
+
+@keyframes mdc-ripple-fg-opacity-out {
+  from {
+    opacity: 1;
+    -webkit-animation-timing-function: linear;
+            animation-timing-function: linear; }
+  to {
+    opacity: 0; } }
+
+.mdc-ripple-surface {
+  --mdc-ripple-surface-width: 0;
+  --mdc-ripple-surface-height: 0;
+  --mdc-ripple-fg-size: 0;
+  --mdc-ripple-left: 0;
+  --mdc-ripple-top: 0;
+  --mdc-ripple-fg-scale: 1;
+  --mdc-ripple-fg-translate-end: 0;
+  --mdc-ripple-fg-translate-start: 0;
+  will-change: transform, opacity;
+  -webkit-tap-highlight-color: transparent;
+  position: relative;
+  outline: none;
+  overflow: hidden; }
+  .mdc-ripple-surface:not(.mdc-ripple-upgraded):hover::before, .mdc-ripple-surface:not(.mdc-ripple-upgraded):focus::before, .mdc-ripple-surface:not(.mdc-ripple-upgraded):active::after {
+    -webkit-transition-duration: 85ms;
+            transition-duration: 85ms;
+    opacity: .6; }
+  .mdc-ripple-surface::before {
+    background-color: rgba(0, 0, 0, 0.06);
+    position: absolute;
+    top: calc(50% - 100%);
+    left: calc(50% - 100%);
+    width: 200%;
+    height: 200%;
+    -webkit-transition: opacity 250ms linear;
+    transition: opacity 250ms linear;
+    border-radius: 50%;
+    opacity: 0;
+    pointer-events: none;
+    content: ""; }
+  .mdc-ripple-surface.mdc-ripple-upgraded::before {
+    top: calc(50% - 100%);
+    left: calc(50% - 100%);
+    width: 200%;
+    height: 200%;
+    /* @alternate */
+    -webkit-transform: scale(0);
+            transform: scale(0);
+    -webkit-transform: scale(var(--mdc-ripple-fg-scale, 0));
+            transform: scale(var(--mdc-ripple-fg-scale, 0)); }
+  .mdc-ripple-surface.mdc-ripple-upgraded--background-focused::before {
+    opacity: .99999; }
+  .mdc-ripple-surface.mdc-ripple-upgraded--background-active-fill::before {
+    -webkit-transition-duration: 120ms;
+            transition-duration: 120ms;
+    opacity: 1; }
+  .mdc-ripple-surface.mdc-ripple-upgraded--unbounded::before {
+    /* @alternate */
+    top: calc(50% - 50%);
+    top: var(--mdc-ripple-top, calc(50% - 50%));
+    /* @alternate */
+    left: calc(50% - 50%);
+    left: var(--mdc-ripple-left, calc(50% - 50%));
+    /* @alternate */
+    width: 100%;
+    width: var(--mdc-ripple-fg-size, 100%);
+    /* @alternate */
+    height: 100%;
+    height: var(--mdc-ripple-fg-size, 100%);
+    /* @alternate */
+    -webkit-transform: scale(0);
+            transform: scale(0);
+    -webkit-transform: scale(var(--mdc-ripple-fg-scale, 0));
+            transform: scale(var(--mdc-ripple-fg-scale, 0)); }
+  .mdc-ripple-surface::after {
+    background-color: rgba(0, 0, 0, 0.06);
+    position: absolute;
+    top: calc(50% - 100%);
+    left: calc(50% - 100%);
+    width: 200%;
+    height: 200%;
+    -webkit-transition: opacity 250ms linear;
+    transition: opacity 250ms linear;
+    border-radius: 50%;
+    opacity: 0;
+    pointer-events: none;
+    content: ""; }
+  .mdc-ripple-surface.mdc-ripple-upgraded::after {
+    top: 0;
+    left: 0;
+    /* @alternate */
+    width: 100%;
+    width: var(--mdc-ripple-fg-size, 100%);
+    /* @alternate */
+    height: 100%;
+    height: var(--mdc-ripple-fg-size, 100%);
+    -webkit-transform: scale(0);
+            transform: scale(0);
+    -webkit-transform-origin: center center;
+            transform-origin: center center;
+    opacity: 0; }
+  .mdc-ripple-surface:not(.mdc-ripple-upgraded--unbounded)::after {
+    -webkit-transform-origin: center center;
+            transform-origin: center center; }
+  .mdc-ripple-surface.mdc-ripple-upgraded--unbounded::after {
+    /* @alternate */
+    top: 0;
+    top: var(--mdc-ripple-top, 0);
+    /* @alternate */
+    left: 0;
+    left: var(--mdc-ripple-left, 0);
+    /* @alternate */
+    width: 100%;
+    width: var(--mdc-ripple-fg-size, 100%);
+    /* @alternate */
+    height: 100%;
+    height: var(--mdc-ripple-fg-size, 100%);
+    -webkit-transform: scale(0);
+            transform: scale(0);
+    -webkit-transform-origin: center center;
+            transform-origin: center center; }
+  .mdc-ripple-surface.mdc-ripple-upgraded--foreground-activation::after {
+    -webkit-animation: 300ms mdc-ripple-fg-radius-in forwards, 83ms mdc-ripple-fg-opacity-in forwards;
+            animation: 300ms mdc-ripple-fg-radius-in forwards, 83ms mdc-ripple-fg-opacity-in forwards; }
+  .mdc-ripple-surface.mdc-ripple-upgraded--foreground-deactivation::after {
+    -webkit-transform: translate(var(--mdc-ripple-fg-translate-end, 0)) scale(var(--mdc-ripple-fg-scale, 1));
+            transform: translate(var(--mdc-ripple-fg-translate-end, 0)) scale(var(--mdc-ripple-fg-scale, 1));
+    -webkit-animation: 83ms mdc-ripple-fg-opacity-out;
+            animation: 83ms mdc-ripple-fg-opacity-out; }
+  .mdc-ripple-surface[data-mdc-ripple-is-unbounded] {
+    overflow: visible; }
+  .mdc-ripple-surface--primary::before, .mdc-ripple-surface--primary::after {
+    /* @alternate */
+    background-color: #3f51b5;
+    background-color: var(--mdc-theme-primary, #3f51b5); }
+  .mdc-ripple-surface--primary::before {
+    /* @alternate */
+    background-color: rgba(63, 81, 181, 0.16);
+    position: absolute;
+    top: calc(50% - 100%);
+    left: calc(50% - 100%);
+    width: 200%;
+    height: 200%;
+    -webkit-transition: opacity 250ms linear;
+    transition: opacity 250ms linear;
+    border-radius: 50%;
+    opacity: 0;
+    pointer-events: none;
+    content: ""; }
+    @supports (background-color: color(green a(10%))) {
+      .mdc-ripple-surface--primary::before {
+        background-color: color(var(--mdc-theme-primary, #3f51b5) a(16%)); } }
+  .mdc-ripple-surface--primary.mdc-ripple-upgraded::before {
+    top: calc(50% - 100%);
+    left: calc(50% - 100%);
+    width: 200%;
+    height: 200%;
+    /* @alternate */
+    -webkit-transform: scale(0);
+            transform: scale(0);
+    -webkit-transform: scale(var(--mdc-ripple-fg-scale, 0));
+            transform: scale(var(--mdc-ripple-fg-scale, 0)); }
+  .mdc-ripple-surface--primary.mdc-ripple-upgraded--background-focused::before {
+    opacity: .99999; }
+  .mdc-ripple-surface--primary.mdc-ripple-upgraded--background-active-fill::before {
+    -webkit-transition-duration: 120ms;
+            transition-duration: 120ms;
+    opacity: 1; }
+  .mdc-ripple-surface--primary.mdc-ripple-upgraded--unbounded::before {
+    /* @alternate */
+    top: calc(50% - 50%);
+    top: var(--mdc-ripple-top, calc(50% - 50%));
+    /* @alternate */
+    left: calc(50% - 50%);
+    left: var(--mdc-ripple-left, calc(50% - 50%));
+    /* @alternate */
+    width: 100%;
+    width: var(--mdc-ripple-fg-size, 100%);
+    /* @alternate */
+    height: 100%;
+    height: var(--mdc-ripple-fg-size, 100%);
+    /* @alternate */
+    -webkit-transform: scale(0);
+            transform: scale(0);
+    -webkit-transform: scale(var(--mdc-ripple-fg-scale, 0));
+            transform: scale(var(--mdc-ripple-fg-scale, 0)); }
+  .mdc-ripple-surface--primary::after {
+    /* @alternate */
+    background-color: rgba(63, 81, 181, 0.16);
+    position: absolute;
+    top: calc(50% - 100%);
+    left: calc(50% - 100%);
+    width: 200%;
+    height: 200%;
+    -webkit-transition: opacity 250ms linear;
+    transition: opacity 250ms linear;
+    border-radius: 50%;
+    opacity: 0;
+    pointer-events: none;
+    content: ""; }
+    @supports (background-color: color(green a(10%))) {
+      .mdc-ripple-surface--primary::after {
+        background-color: color(var(--mdc-theme-primary, #3f51b5) a(16%)); } }
+  .mdc-ripple-surface--primary.mdc-ripple-upgraded::after {
+    top: 0;
+    left: 0;
+    /* @alternate */
+    width: 100%;
+    width: var(--mdc-ripple-fg-size, 100%);
+    /* @alternate */
+    height: 100%;
+    height: var(--mdc-ripple-fg-size, 100%);
+    -webkit-transform: scale(0);
+            transform: scale(0);
+    -webkit-transform-origin: center center;
+            transform-origin: center center;
+    opacity: 0; }
+  .mdc-ripple-surface--primary:not(.mdc-ripple-upgraded--unbounded)::after {
+    -webkit-transform-origin: center center;
+            transform-origin: center center; }
+  .mdc-ripple-surface--primary.mdc-ripple-upgraded--unbounded::after {
+    /* @alternate */
+    top: 0;
+    top: var(--mdc-ripple-top, 0);
+    /* @alternate */
+    left: 0;
+    left: var(--mdc-ripple-left, 0);
+    /* @alternate */
+    width: 100%;
+    width: var(--mdc-ripple-fg-size, 100%);
+    /* @alternate */
+    height: 100%;
+    height: var(--mdc-ripple-fg-size, 100%);
+    -webkit-transform: scale(0);
+            transform: scale(0);
+    -webkit-transform-origin: center center;
+            transform-origin: center center; }
+  .mdc-ripple-surface--primary.mdc-ripple-upgraded--foreground-activation::after {
+    -webkit-animation: 300ms mdc-ripple-fg-radius-in forwards, 83ms mdc-ripple-fg-opacity-in forwards;
+            animation: 300ms mdc-ripple-fg-radius-in forwards, 83ms mdc-ripple-fg-opacity-in forwards; }
+  .mdc-ripple-surface--primary.mdc-ripple-upgraded--foreground-deactivation::after {
+    -webkit-transform: translate(var(--mdc-ripple-fg-translate-end, 0)) scale(var(--mdc-ripple-fg-scale, 1));
+            transform: translate(var(--mdc-ripple-fg-translate-end, 0)) scale(var(--mdc-ripple-fg-scale, 1));
+    -webkit-animation: 83ms mdc-ripple-fg-opacity-out;
+            animation: 83ms mdc-ripple-fg-opacity-out; }
+  .mdc-ripple-surface--accent::before, .mdc-ripple-surface--accent::after {
+    /* @alternate */
+    background-color: #3f51b5;
+    background-color: var(--mdc-theme-primary, #3f51b5); }
+  .mdc-ripple-surface--accent::before {
+    /* @alternate */
+    background-color: rgba(255, 64, 129, 0.16);
+    position: absolute;
+    top: calc(50% - 100%);
+    left: calc(50% - 100%);
+    width: 200%;
+    height: 200%;
+    -webkit-transition: opacity 250ms linear;
+    transition: opacity 250ms linear;
+    border-radius: 50%;
+    opacity: 0;
+    pointer-events: none;
+    content: ""; }
+    @supports (background-color: color(green a(10%))) {
+      .mdc-ripple-surface--accent::before {
+        background-color: color(var(--mdc-theme-accent, #ff4081) a(16%)); } }
+  .mdc-ripple-surface--accent.mdc-ripple-upgraded::before {
+    top: calc(50% - 100%);
+    left: calc(50% - 100%);
+    width: 200%;
+    height: 200%;
+    /* @alternate */
+    -webkit-transform: scale(0);
+            transform: scale(0);
+    -webkit-transform: scale(var(--mdc-ripple-fg-scale, 0));
+            transform: scale(var(--mdc-ripple-fg-scale, 0)); }
+  .mdc-ripple-surface--accent.mdc-ripple-upgraded--background-focused::before {
+    opacity: .99999; }
+  .mdc-ripple-surface--accent.mdc-ripple-upgraded--background-active-fill::before {
+    -webkit-transition-duration: 120ms;
+            transition-duration: 120ms;
+    opacity: 1; }
+  .mdc-ripple-surface--accent.mdc-ripple-upgraded--unbounded::before {
+    /* @alternate */
+    top: calc(50% - 50%);
+    top: var(--mdc-ripple-top, calc(50% - 50%));
+    /* @alternate */
+    left: calc(50% - 50%);
+    left: var(--mdc-ripple-left, calc(50% - 50%));
+    /* @alternate */
+    width: 100%;
+    width: var(--mdc-ripple-fg-size, 100%);
+    /* @alternate */
+    height: 100%;
+    height: var(--mdc-ripple-fg-size, 100%);
+    /* @alternate */
+    -webkit-transform: scale(0);
+            transform: scale(0);
+    -webkit-transform: scale(var(--mdc-ripple-fg-scale, 0));
+            transform: scale(var(--mdc-ripple-fg-scale, 0)); }
+  .mdc-ripple-surface--accent::after {
+    /* @alternate */
+    background-color: rgba(255, 64, 129, 0.16);
+    position: absolute;
+    top: calc(50% - 100%);
+    left: calc(50% - 100%);
+    width: 200%;
+    height: 200%;
+    -webkit-transition: opacity 250ms linear;
+    transition: opacity 250ms linear;
+    border-radius: 50%;
+    opacity: 0;
+    pointer-events: none;
+    content: ""; }
+    @supports (background-color: color(green a(10%))) {
+      .mdc-ripple-surface--accent::after {
+        background-color: color(var(--mdc-theme-accent, #ff4081) a(16%)); } }
+  .mdc-ripple-surface--accent.mdc-ripple-upgraded::after {
+    top: 0;
+    left: 0;
+    /* @alternate */
+    width: 100%;
+    width: var(--mdc-ripple-fg-size, 100%);
+    /* @alternate */
+    height: 100%;
+    height: var(--mdc-ripple-fg-size, 100%);
+    -webkit-transform: scale(0);
+            transform: scale(0);
+    -webkit-transform-origin: center center;
+            transform-origin: center center;
+    opacity: 0; }
+  .mdc-ripple-surface--accent:not(.mdc-ripple-upgraded--unbounded)::after {
+    -webkit-transform-origin: center center;
+            transform-origin: center center; }
+  .mdc-ripple-surface--accent.mdc-ripple-upgraded--unbounded::after {
+    /* @alternate */
+    top: 0;
+    top: var(--mdc-ripple-top, 0);
+    /* @alternate */
+    left: 0;
+    left: var(--mdc-ripple-left, 0);
+    /* @alternate */
+    width: 100%;
+    width: var(--mdc-ripple-fg-size, 100%);
+    /* @alternate */
+    height: 100%;
+    height: var(--mdc-ripple-fg-size, 100%);
+    -webkit-transform: scale(0);
+            transform: scale(0);
+    -webkit-transform-origin: center center;
+            transform-origin: center center; }
+  .mdc-ripple-surface--accent.mdc-ripple-upgraded--foreground-activation::after {
+    -webkit-animation: 300ms mdc-ripple-fg-radius-in forwards, 83ms mdc-ripple-fg-opacity-in forwards;
+            animation: 300ms mdc-ripple-fg-radius-in forwards, 83ms mdc-ripple-fg-opacity-in forwards; }
+  .mdc-ripple-surface--accent.mdc-ripple-upgraded--foreground-deactivation::after {
+    -webkit-transform: translate(var(--mdc-ripple-fg-translate-end, 0)) scale(var(--mdc-ripple-fg-scale, 1));
+            transform: translate(var(--mdc-ripple-fg-translate-end, 0)) scale(var(--mdc-ripple-fg-scale, 1));
+    -webkit-animation: 83ms mdc-ripple-fg-opacity-out;
+            animation: 83ms mdc-ripple-fg-opacity-out; }

+ 83 - 0
support/client/lib/vwf/view/lib/mdc/dist/mdc.ripple.css-entry

@@ -0,0 +1,83 @@
+/*!
+ Material Components for the web
+ Copyright (c) 2017 Google Inc.
+ License: Apache-2.0
+*/
+/******/ (function(modules) { // webpackBootstrap
+/******/ 	// The module cache
+/******/ 	var installedModules = {};
+/******/
+/******/ 	// The require function
+/******/ 	function __webpack_require__(moduleId) {
+/******/
+/******/ 		// Check if module is in cache
+/******/ 		if(installedModules[moduleId]) {
+/******/ 			return installedModules[moduleId].exports;
+/******/ 		}
+/******/ 		// Create a new module (and put it into the cache)
+/******/ 		var module = installedModules[moduleId] = {
+/******/ 			i: moduleId,
+/******/ 			l: false,
+/******/ 			exports: {}
+/******/ 		};
+/******/
+/******/ 		// Execute the module function
+/******/ 		modules[moduleId].call(module.exports, module, module.exports, __webpack_require__);
+/******/
+/******/ 		// Flag the module as loaded
+/******/ 		module.l = true;
+/******/
+/******/ 		// Return the exports of the module
+/******/ 		return module.exports;
+/******/ 	}
+/******/
+/******/
+/******/ 	// expose the modules object (__webpack_modules__)
+/******/ 	__webpack_require__.m = modules;
+/******/
+/******/ 	// expose the module cache
+/******/ 	__webpack_require__.c = installedModules;
+/******/
+/******/ 	// identity function for calling harmony imports with the correct context
+/******/ 	__webpack_require__.i = function(value) { return value; };
+/******/
+/******/ 	// define getter function for harmony exports
+/******/ 	__webpack_require__.d = function(exports, name, getter) {
+/******/ 		if(!__webpack_require__.o(exports, name)) {
+/******/ 			Object.defineProperty(exports, name, {
+/******/ 				configurable: false,
+/******/ 				enumerable: true,
+/******/ 				get: getter
+/******/ 			});
+/******/ 		}
+/******/ 	};
+/******/
+/******/ 	// getDefaultExport function for compatibility with non-harmony modules
+/******/ 	__webpack_require__.n = function(module) {
+/******/ 		var getter = module && module.__esModule ?
+/******/ 			function getDefault() { return module['default']; } :
+/******/ 			function getModuleExports() { return module; };
+/******/ 		__webpack_require__.d(getter, 'a', getter);
+/******/ 		return getter;
+/******/ 	};
+/******/
+/******/ 	// Object.prototype.hasOwnProperty.call
+/******/ 	__webpack_require__.o = function(object, property) { return Object.prototype.hasOwnProperty.call(object, property); };
+/******/
+/******/ 	// __webpack_public_path__
+/******/ 	__webpack_require__.p = "/assets/";
+/******/
+/******/ 	// Load entry module and return exports
+/******/ 	return __webpack_require__(__webpack_require__.s = 17);
+/******/ })
+/************************************************************************/
+/******/ ({
+
+/***/ 17:
+/***/ (function(module, exports) {
+
+// removed by extract-text-webpack-plugin
+
+/***/ })
+
+/******/ });

+ 1607 - 0
support/client/lib/vwf/view/lib/mdc/dist/mdc.ripple.js

@@ -0,0 +1,1607 @@
+/*!
+ Material Components for the web
+ Copyright (c) 2017 Google Inc.
+ License: Apache-2.0
+*/
+(function webpackUniversalModuleDefinition(root, factory) {
+	if(typeof exports === 'object' && typeof module === 'object')
+		module.exports = factory();
+	else if(typeof define === 'function' && define.amd)
+		define([], factory);
+	else if(typeof exports === 'object')
+		exports["ripple"] = factory();
+	else
+		root["mdc"] = root["mdc"] || {}, root["mdc"]["ripple"] = factory();
+})(this, function() {
+return /******/ (function(modules) { // webpackBootstrap
+/******/ 	// The module cache
+/******/ 	var installedModules = {};
+/******/
+/******/ 	// The require function
+/******/ 	function __webpack_require__(moduleId) {
+/******/
+/******/ 		// Check if module is in cache
+/******/ 		if(installedModules[moduleId]) {
+/******/ 			return installedModules[moduleId].exports;
+/******/ 		}
+/******/ 		// Create a new module (and put it into the cache)
+/******/ 		var module = installedModules[moduleId] = {
+/******/ 			i: moduleId,
+/******/ 			l: false,
+/******/ 			exports: {}
+/******/ 		};
+/******/
+/******/ 		// Execute the module function
+/******/ 		modules[moduleId].call(module.exports, module, module.exports, __webpack_require__);
+/******/
+/******/ 		// Flag the module as loaded
+/******/ 		module.l = true;
+/******/
+/******/ 		// Return the exports of the module
+/******/ 		return module.exports;
+/******/ 	}
+/******/
+/******/
+/******/ 	// expose the modules object (__webpack_modules__)
+/******/ 	__webpack_require__.m = modules;
+/******/
+/******/ 	// expose the module cache
+/******/ 	__webpack_require__.c = installedModules;
+/******/
+/******/ 	// identity function for calling harmony imports with the correct context
+/******/ 	__webpack_require__.i = function(value) { return value; };
+/******/
+/******/ 	// define getter function for harmony exports
+/******/ 	__webpack_require__.d = function(exports, name, getter) {
+/******/ 		if(!__webpack_require__.o(exports, name)) {
+/******/ 			Object.defineProperty(exports, name, {
+/******/ 				configurable: false,
+/******/ 				enumerable: true,
+/******/ 				get: getter
+/******/ 			});
+/******/ 		}
+/******/ 	};
+/******/
+/******/ 	// getDefaultExport function for compatibility with non-harmony modules
+/******/ 	__webpack_require__.n = function(module) {
+/******/ 		var getter = module && module.__esModule ?
+/******/ 			function getDefault() { return module['default']; } :
+/******/ 			function getModuleExports() { return module; };
+/******/ 		__webpack_require__.d(getter, 'a', getter);
+/******/ 		return getter;
+/******/ 	};
+/******/
+/******/ 	// Object.prototype.hasOwnProperty.call
+/******/ 	__webpack_require__.o = function(object, property) { return Object.prototype.hasOwnProperty.call(object, property); };
+/******/
+/******/ 	// __webpack_public_path__
+/******/ 	__webpack_require__.p = "/assets/";
+/******/
+/******/ 	// Load entry module and return exports
+/******/ 	return __webpack_require__(__webpack_require__.s = 93);
+/******/ })
+/************************************************************************/
+/******/ ({
+
+/***/ 0:
+/***/ (function(module, __webpack_exports__, __webpack_require__) {
+
+"use strict";
+var _createClass = function () { function defineProperties(target, props) { for (var i = 0; i < props.length; i++) { var descriptor = props[i]; descriptor.enumerable = descriptor.enumerable || false; descriptor.configurable = true; if ("value" in descriptor) descriptor.writable = true; Object.defineProperty(target, descriptor.key, descriptor); } } return function (Constructor, protoProps, staticProps) { if (protoProps) defineProperties(Constructor.prototype, protoProps); if (staticProps) defineProperties(Constructor, staticProps); return Constructor; }; }();
+
+function _classCallCheck(instance, Constructor) { if (!(instance instanceof Constructor)) { throw new TypeError("Cannot call a class as a function"); } }
+
+/**
+ * Copyright 2016 Google Inc.
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *   http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+
+/**
+ * @template A
+ */
+var MDCFoundation = function () {
+  _createClass(MDCFoundation, null, [{
+    key: "cssClasses",
+
+    /** @return enum{cssClasses} */
+    get: function get() {
+      // Classes extending MDCFoundation should implement this method to return an object which exports every
+      // CSS class the foundation class needs as a property. e.g. {ACTIVE: 'mdc-component--active'}
+      return {};
+    }
+
+    /** @return enum{strings} */
+
+  }, {
+    key: "strings",
+    get: function get() {
+      // Classes extending MDCFoundation should implement this method to return an object which exports all
+      // semantic strings as constants. e.g. {ARIA_ROLE: 'tablist'}
+      return {};
+    }
+
+    /** @return enum{numbers} */
+
+  }, {
+    key: "numbers",
+    get: function get() {
+      // Classes extending MDCFoundation should implement this method to return an object which exports all
+      // of its semantic numbers as constants. e.g. {ANIMATION_DELAY_MS: 350}
+      return {};
+    }
+
+    /** @return {!Object} */
+
+  }, {
+    key: "defaultAdapter",
+    get: function get() {
+      // Classes extending MDCFoundation may choose to implement this getter in order to provide a convenient
+      // way of viewing the necessary methods of an adapter. In the future, this could also be used for adapter
+      // validation.
+      return {};
+    }
+
+    /**
+     * @param {A=} adapter
+     */
+
+  }]);
+
+  function MDCFoundation() {
+    var adapter = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : {};
+
+    _classCallCheck(this, MDCFoundation);
+
+    /** @protected {!A} */
+    this.adapter_ = adapter;
+  }
+
+  _createClass(MDCFoundation, [{
+    key: "init",
+    value: function init() {
+      // Subclasses should override this method to perform initialization routines (registering events, etc.)
+    }
+  }, {
+    key: "destroy",
+    value: function destroy() {
+      // Subclasses should override this method to perform de-initialization routines (de-registering events, etc.)
+    }
+  }]);
+
+  return MDCFoundation;
+}();
+
+/* harmony default export */ __webpack_exports__["a"] = (MDCFoundation);
+
+/***/ }),
+
+/***/ 1:
+/***/ (function(module, __webpack_exports__, __webpack_require__) {
+
+"use strict";
+/* harmony import */ var __WEBPACK_IMPORTED_MODULE_0__foundation__ = __webpack_require__(0);
+var _createClass = function () { function defineProperties(target, props) { for (var i = 0; i < props.length; i++) { var descriptor = props[i]; descriptor.enumerable = descriptor.enumerable || false; descriptor.configurable = true; if ("value" in descriptor) descriptor.writable = true; Object.defineProperty(target, descriptor.key, descriptor); } } return function (Constructor, protoProps, staticProps) { if (protoProps) defineProperties(Constructor.prototype, protoProps); if (staticProps) defineProperties(Constructor, staticProps); return Constructor; }; }();
+
+function _classCallCheck(instance, Constructor) { if (!(instance instanceof Constructor)) { throw new TypeError("Cannot call a class as a function"); } }
+
+/**
+ * Copyright 2016 Google Inc.
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *   http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+
+
+
+/**
+ * @template F
+ */
+
+var MDCComponent = function () {
+  _createClass(MDCComponent, null, [{
+    key: 'attachTo',
+
+    /**
+     * @param {!Element} root
+     * @return {!MDCComponent}
+     */
+    value: function attachTo(root) {
+      // Subclasses which extend MDCBase should provide an attachTo() method that takes a root element and
+      // returns an instantiated component with its root set to that element. Also note that in the cases of
+      // subclasses, an explicit foundation class will not have to be passed in; it will simply be initialized
+      // from getDefaultFoundation().
+      return new MDCComponent(root, new __WEBPACK_IMPORTED_MODULE_0__foundation__["a" /* default */]());
+    }
+
+    /**
+     * @param {!Element} root
+     * @param {F=} foundation
+     * @param {...?} args
+     */
+
+  }]);
+
+  function MDCComponent(root) {
+    var foundation = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : undefined;
+
+    _classCallCheck(this, MDCComponent);
+
+    /** @protected {!Element} */
+    this.root_ = root;
+
+    for (var _len = arguments.length, args = Array(_len > 2 ? _len - 2 : 0), _key = 2; _key < _len; _key++) {
+      args[_key - 2] = arguments[_key];
+    }
+
+    this.initialize.apply(this, args);
+    // Note that we initialize foundation here and not within the constructor's default param so that
+    // this.root_ is defined and can be used within the foundation class.
+    /** @protected {!F} */
+    this.foundation_ = foundation === undefined ? this.getDefaultFoundation() : foundation;
+    this.foundation_.init();
+    this.initialSyncWithDOM();
+  }
+
+  _createClass(MDCComponent, [{
+    key: 'initialize',
+    value: function initialize() /* ...args */{}
+    // Subclasses can override this to do any additional setup work that would be considered part of a
+    // "constructor". Essentially, it is a hook into the parent constructor before the foundation is
+    // initialized. Any additional arguments besides root and foundation will be passed in here.
+
+
+    /**
+     * @return {!F} foundation
+     */
+
+  }, {
+    key: 'getDefaultFoundation',
+    value: function getDefaultFoundation() {
+      // Subclasses must override this method to return a properly configured foundation class for the
+      // component.
+      throw new Error('Subclasses must override getDefaultFoundation to return a properly configured ' + 'foundation class');
+    }
+  }, {
+    key: 'initialSyncWithDOM',
+    value: function initialSyncWithDOM() {
+      // Subclasses should override this method if they need to perform work to synchronize with a host DOM
+      // object. An example of this would be a form control wrapper that needs to synchronize its internal state
+      // to some property or attribute of the host DOM. Please note: this is *not* the place to perform DOM
+      // reads/writes that would cause layout / paint, as this is called synchronously from within the constructor.
+    }
+  }, {
+    key: 'destroy',
+    value: function destroy() {
+      // Subclasses may implement this method to release any resources / deregister any listeners they have
+      // attached. An example of this might be deregistering a resize event from the window object.
+      this.foundation_.destroy();
+    }
+
+    /**
+     * Wrapper method to add an event listener to the component's root element. This is most useful when
+     * listening for custom events.
+     * @param {string} evtType
+     * @param {!Function} handler
+     */
+
+  }, {
+    key: 'listen',
+    value: function listen(evtType, handler) {
+      this.root_.addEventListener(evtType, handler);
+    }
+
+    /**
+     * Wrapper method to remove an event listener to the component's root element. This is most useful when
+     * unlistening for custom events.
+     * @param {string} evtType
+     * @param {!Function} handler
+     */
+
+  }, {
+    key: 'unlisten',
+    value: function unlisten(evtType, handler) {
+      this.root_.removeEventListener(evtType, handler);
+    }
+
+    /**
+     * Fires a cross-browser-compatible custom event from the component root of the given type,
+     * with the given data.
+     * @param {string} evtType
+     * @param {!Object} evtData
+     * @param {boolean=} shouldBubble
+     */
+
+  }, {
+    key: 'emit',
+    value: function emit(evtType, evtData) {
+      var shouldBubble = arguments.length > 2 && arguments[2] !== undefined ? arguments[2] : false;
+
+      var evt = void 0;
+      if (typeof CustomEvent === 'function') {
+        evt = new CustomEvent(evtType, {
+          detail: evtData,
+          bubbles: shouldBubble
+        });
+      } else {
+        evt = document.createEvent('CustomEvent');
+        evt.initCustomEvent(evtType, shouldBubble, false, evtData);
+      }
+
+      this.root_.dispatchEvent(evt);
+    }
+  }]);
+
+  return MDCComponent;
+}();
+
+/* harmony default export */ __webpack_exports__["a"] = (MDCComponent);
+
+/***/ }),
+
+/***/ 4:
+/***/ (function(module, __webpack_exports__, __webpack_require__) {
+
+"use strict";
+var _createClass = function () { function defineProperties(target, props) { for (var i = 0; i < props.length; i++) { var descriptor = props[i]; descriptor.enumerable = descriptor.enumerable || false; descriptor.configurable = true; if ("value" in descriptor) descriptor.writable = true; Object.defineProperty(target, descriptor.key, descriptor); } } return function (Constructor, protoProps, staticProps) { if (protoProps) defineProperties(Constructor.prototype, protoProps); if (staticProps) defineProperties(Constructor, staticProps); return Constructor; }; }();
+
+function _classCallCheck(instance, Constructor) { if (!(instance instanceof Constructor)) { throw new TypeError("Cannot call a class as a function"); } }
+
+/**
+ * Copyright 2016 Google Inc. All Rights Reserved.
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *      http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+
+/* eslint no-unused-vars: [2, {"args": "none"}] */
+
+/**
+ * Adapter for MDC Ripple. Provides an interface for managing
+ * - classes
+ * - dom
+ * - CSS variables
+ * - position
+ * - dimensions
+ * - scroll position
+ * - event handlers
+ * - unbounded, active and disabled states
+ *
+ * Additionally, provides type information for the adapter to the Closure
+ * compiler.
+ *
+ * Implement this adapter for your framework of choice to delegate updates to
+ * the component in your framework of choice. See architecture documentation
+ * for more details.
+ * https://github.com/material-components/material-components-web/blob/master/docs/architecture.md
+ *
+ * @record
+ */
+var MDCRippleAdapter = function () {
+  function MDCRippleAdapter() {
+    _classCallCheck(this, MDCRippleAdapter);
+  }
+
+  _createClass(MDCRippleAdapter, [{
+    key: "browserSupportsCssVars",
+
+    /** @return {boolean} */
+    value: function browserSupportsCssVars() {}
+
+    /** @return {boolean} */
+
+  }, {
+    key: "isUnbounded",
+    value: function isUnbounded() {}
+
+    /** @return {boolean} */
+
+  }, {
+    key: "isSurfaceActive",
+    value: function isSurfaceActive() {}
+
+    /** @return {boolean} */
+
+  }, {
+    key: "isSurfaceDisabled",
+    value: function isSurfaceDisabled() {}
+
+    /** @param {string} className */
+
+  }, {
+    key: "addClass",
+    value: function addClass(className) {}
+
+    /** @param {string} className */
+
+  }, {
+    key: "removeClass",
+    value: function removeClass(className) {}
+
+    /**
+     * @param {string} evtType
+     * @param {!Function} handler
+     */
+
+  }, {
+    key: "registerInteractionHandler",
+    value: function registerInteractionHandler(evtType, handler) {}
+
+    /**
+     * @param {string} evtType
+     * @param {!Function} handler
+     */
+
+  }, {
+    key: "deregisterInteractionHandler",
+    value: function deregisterInteractionHandler(evtType, handler) {}
+
+    /**
+     * @param {!Function} handler
+     */
+
+  }, {
+    key: "registerResizeHandler",
+    value: function registerResizeHandler(handler) {}
+
+    /**
+     * @param {!Function} handler
+     */
+
+  }, {
+    key: "deregisterResizeHandler",
+    value: function deregisterResizeHandler(handler) {}
+
+    /**
+     * @param {string} varName
+     * @param {?number|string} value
+     */
+
+  }, {
+    key: "updateCssVariable",
+    value: function updateCssVariable(varName, value) {}
+
+    /** @return {!ClientRect} */
+
+  }, {
+    key: "computeBoundingRect",
+    value: function computeBoundingRect() {}
+
+    /** @return {{x: number, y: number}} */
+
+  }, {
+    key: "getWindowPageOffset",
+    value: function getWindowPageOffset() {}
+  }]);
+
+  return MDCRippleAdapter;
+}();
+
+/* unused harmony default export */ var _unused_webpack_default_export = (MDCRippleAdapter);
+
+/***/ }),
+
+/***/ 5:
+/***/ (function(module, __webpack_exports__, __webpack_require__) {
+
+"use strict";
+Object.defineProperty(__webpack_exports__, "__esModule", { value: true });
+/* harmony export (immutable) */ __webpack_exports__["supportsCssVariables"] = supportsCssVariables;
+/* harmony export (immutable) */ __webpack_exports__["applyPassive"] = applyPassive;
+/* harmony export (immutable) */ __webpack_exports__["getMatchesProperty"] = getMatchesProperty;
+/* harmony export (immutable) */ __webpack_exports__["getNormalizedEventCoords"] = getNormalizedEventCoords;
+/**
+ * Copyright 2016 Google Inc. All Rights Reserved.
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *      http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+
+/**
+ * Stores result from supportsCssVariables to avoid redundant processing to detect CSS custom variable support.
+ * @private {boolean|undefined}
+ */
+var supportsCssVariables_ = void 0;
+
+/**
+ * Stores result from applyPassive to avoid redundant processing to detect passive event listener support.
+ * @private {boolean|undefined}
+ */
+var supportsPassive_ = void 0;
+
+/**
+ * @param {!Window} windowObj
+ * @return {boolean}
+ */
+function detectEdgePseudoVarBug(windowObj) {
+  // Detect versions of Edge with buggy var() support
+  // See: https://developer.microsoft.com/en-us/microsoft-edge/platform/issues/11495448/
+  var document = windowObj.document;
+  var className = 'test-edge-css-var';
+  var styleNode = document.createElement('style');
+  document.head.appendChild(styleNode);
+  var sheet = styleNode.sheet;
+  // Internet Explorer 11 requires indices to always be specified to insertRule
+  sheet.insertRule(':root { --' + className + ': 1px solid #000; }', 0);
+  sheet.insertRule('.' + className + ' { visibility: hidden; }', 1);
+  sheet.insertRule('.' + className + '::before { border: var(--' + className + '); }', 2);
+  var node = document.createElement('div');
+  node.className = className;
+  document.body.appendChild(node);
+  // Bug exists if ::before style ends up propagating to the parent element
+  var hasPseudoVarBug = windowObj.getComputedStyle(node).borderTopStyle === 'solid';
+  node.remove();
+  styleNode.remove();
+  return hasPseudoVarBug;
+}
+
+/**
+ * @param {!Window} windowObj
+ * @param {boolean=} forceRefresh
+ * @return {boolean|undefined}
+ */
+function supportsCssVariables(windowObj) {
+  var forceRefresh = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : false;
+
+  if (typeof supportsCssVariables_ === 'boolean' && !forceRefresh) {
+    return supportsCssVariables_;
+  }
+
+  var supportsFunctionPresent = windowObj.CSS && typeof windowObj.CSS.supports === 'function';
+  if (!supportsFunctionPresent) {
+    return;
+  }
+
+  var explicitlySupportsCssVars = windowObj.CSS.supports('--css-vars', 'yes');
+  // See: https://bugs.webkit.org/show_bug.cgi?id=154669
+  // See: README section on Safari
+  var weAreFeatureDetectingSafari10plus = windowObj.CSS.supports('(--css-vars: yes)') && windowObj.CSS.supports('color', '#00000000');
+
+  if (explicitlySupportsCssVars || weAreFeatureDetectingSafari10plus) {
+    supportsCssVariables_ = !detectEdgePseudoVarBug(windowObj);
+  } else {
+    supportsCssVariables_ = false;
+  }
+  return supportsCssVariables_;
+}
+
+//
+/**
+ * Determine whether the current browser supports passive event listeners, and if so, use them.
+ * @param {!Window=} globalObj
+ * @param {boolean=} forceRefresh
+ * @return {boolean|{passive: boolean}}
+ */
+function applyPassive() {
+  var globalObj = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : window;
+  var forceRefresh = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : false;
+
+  if (supportsPassive_ === undefined || forceRefresh) {
+    var isSupported = false;
+    try {
+      globalObj.document.addEventListener('test', null, { get passive() {
+          isSupported = true;
+        } });
+    } catch (e) {}
+
+    supportsPassive_ = isSupported;
+  }
+
+  return supportsPassive_ ? { passive: true } : false;
+}
+
+/**
+ * @param {!Object} HTMLElementPrototype
+ * @return {!Array<string>}
+ */
+function getMatchesProperty(HTMLElementPrototype) {
+  return ['webkitMatchesSelector', 'msMatchesSelector', 'matches'].filter(function (p) {
+    return p in HTMLElementPrototype;
+  }).pop();
+}
+
+/**
+ * @param {!Event} ev
+ * @param {!{x: number, y: number}} pageOffset
+ * @param {!ClientRect} clientRect
+ * @return {!{x: number, y: number}}
+ */
+function getNormalizedEventCoords(ev, pageOffset, clientRect) {
+  var x = pageOffset.x,
+      y = pageOffset.y;
+
+  var documentX = x + clientRect.left;
+  var documentY = y + clientRect.top;
+
+  var normalizedX = void 0;
+  var normalizedY = void 0;
+  // Determine touch point relative to the ripple container.
+  if (ev.type === 'touchstart') {
+    normalizedX = ev.changedTouches[0].pageX - documentX;
+    normalizedY = ev.changedTouches[0].pageY - documentY;
+  } else {
+    normalizedX = ev.pageX - documentX;
+    normalizedY = ev.pageY - documentY;
+  }
+
+  return { x: normalizedX, y: normalizedY };
+}
+
+/***/ }),
+
+/***/ 6:
+/***/ (function(module, __webpack_exports__, __webpack_require__) {
+
+"use strict";
+Object.defineProperty(__webpack_exports__, "__esModule", { value: true });
+/* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, "MDCRipple", function() { return MDCRipple; });
+/* harmony import */ var __WEBPACK_IMPORTED_MODULE_0__material_base_component__ = __webpack_require__(1);
+/* harmony import */ var __WEBPACK_IMPORTED_MODULE_1__adapter__ = __webpack_require__(4);
+/* harmony import */ var __WEBPACK_IMPORTED_MODULE_2__foundation__ = __webpack_require__(8);
+/* harmony import */ var __WEBPACK_IMPORTED_MODULE_3__util__ = __webpack_require__(5);
+/* harmony reexport (binding) */ __webpack_require__.d(__webpack_exports__, "MDCRippleFoundation", function() { return __WEBPACK_IMPORTED_MODULE_2__foundation__["a"]; });
+/* harmony reexport (module object) */ __webpack_require__.d(__webpack_exports__, "util", function() { return __WEBPACK_IMPORTED_MODULE_3__util__; });
+var _createClass = function () { function defineProperties(target, props) { for (var i = 0; i < props.length; i++) { var descriptor = props[i]; descriptor.enumerable = descriptor.enumerable || false; descriptor.configurable = true; if ("value" in descriptor) descriptor.writable = true; Object.defineProperty(target, descriptor.key, descriptor); } } return function (Constructor, protoProps, staticProps) { if (protoProps) defineProperties(Constructor.prototype, protoProps); if (staticProps) defineProperties(Constructor, staticProps); return Constructor; }; }();
+
+function _classCallCheck(instance, Constructor) { if (!(instance instanceof Constructor)) { throw new TypeError("Cannot call a class as a function"); } }
+
+function _possibleConstructorReturn(self, call) { if (!self) { throw new ReferenceError("this hasn't been initialised - super() hasn't been called"); } return call && (typeof call === "object" || typeof call === "function") ? call : self; }
+
+function _inherits(subClass, superClass) { if (typeof superClass !== "function" && superClass !== null) { throw new TypeError("Super expression must either be null or a function, not " + typeof superClass); } subClass.prototype = Object.create(superClass && superClass.prototype, { constructor: { value: subClass, enumerable: false, writable: true, configurable: true } }); if (superClass) Object.setPrototypeOf ? Object.setPrototypeOf(subClass, superClass) : subClass.__proto__ = superClass; }
+
+/**
+ * Copyright 2016 Google Inc. All Rights Reserved.
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *      http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+
+
+
+
+
+
+
+
+
+/**
+ * @extends MDCComponent<!MDCRippleFoundation>
+ */
+var MDCRipple = function (_MDCComponent) {
+  _inherits(MDCRipple, _MDCComponent);
+
+  /** @param {...?} args */
+  function MDCRipple() {
+    var _ref;
+
+    _classCallCheck(this, MDCRipple);
+
+    for (var _len = arguments.length, args = Array(_len), _key = 0; _key < _len; _key++) {
+      args[_key] = arguments[_key];
+    }
+
+    /** @type {boolean} */
+    var _this = _possibleConstructorReturn(this, (_ref = MDCRipple.__proto__ || Object.getPrototypeOf(MDCRipple)).call.apply(_ref, [this].concat(args)));
+
+    _this.disabled = false;
+
+    /** @private {boolean} */
+    _this.unbounded_;
+    return _this;
+  }
+
+  /**
+   * @param {!Element} root
+   * @param {{isUnbounded: (boolean|undefined)}=} options
+   * @return {!MDCRipple}
+   */
+
+
+  _createClass(MDCRipple, [{
+    key: 'activate',
+    value: function activate() {
+      this.foundation_.activate();
+    }
+  }, {
+    key: 'deactivate',
+    value: function deactivate() {
+      this.foundation_.deactivate();
+    }
+  }, {
+    key: 'layout',
+    value: function layout() {
+      this.foundation_.layout();
+    }
+
+    /** @return {!MDCRippleFoundation} */
+
+  }, {
+    key: 'getDefaultFoundation',
+    value: function getDefaultFoundation() {
+      return new __WEBPACK_IMPORTED_MODULE_2__foundation__["a" /* default */](MDCRipple.createAdapter(this));
+    }
+  }, {
+    key: 'initialSyncWithDOM',
+    value: function initialSyncWithDOM() {
+      this.unbounded = 'mdcRippleIsUnbounded' in this.root_.dataset;
+    }
+  }, {
+    key: 'unbounded',
+
+
+    /** @return {boolean} */
+    get: function get() {
+      return this.unbounded_;
+    }
+
+    /** @param {boolean} unbounded */
+    ,
+    set: function set(unbounded) {
+      var UNBOUNDED = __WEBPACK_IMPORTED_MODULE_2__foundation__["a" /* default */].cssClasses.UNBOUNDED;
+
+      this.unbounded_ = Boolean(unbounded);
+      if (this.unbounded_) {
+        this.root_.classList.add(UNBOUNDED);
+      } else {
+        this.root_.classList.remove(UNBOUNDED);
+      }
+    }
+  }], [{
+    key: 'attachTo',
+    value: function attachTo(root) {
+      var _ref2 = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : {},
+          _ref2$isUnbounded = _ref2.isUnbounded,
+          isUnbounded = _ref2$isUnbounded === undefined ? undefined : _ref2$isUnbounded;
+
+      var ripple = new MDCRipple(root);
+      // Only override unbounded behavior if option is explicitly specified
+      if (isUnbounded !== undefined) {
+        ripple.unbounded = /** @type {boolean} */isUnbounded;
+      }
+      return ripple;
+    }
+
+    /**
+     * @param {!RippleCapableSurface} instance
+     * @return {!MDCRippleAdapter}
+     */
+
+  }, {
+    key: 'createAdapter',
+    value: function createAdapter(instance) {
+      var MATCHES = __WEBPACK_IMPORTED_MODULE_3__util__["getMatchesProperty"](HTMLElement.prototype);
+
+      return {
+        browserSupportsCssVars: function browserSupportsCssVars() {
+          return __WEBPACK_IMPORTED_MODULE_3__util__["supportsCssVariables"](window);
+        },
+        isUnbounded: function isUnbounded() {
+          return instance.unbounded;
+        },
+        isSurfaceActive: function isSurfaceActive() {
+          return instance.root_[MATCHES](':active');
+        },
+        isSurfaceDisabled: function isSurfaceDisabled() {
+          return instance.disabled;
+        },
+        addClass: function addClass(className) {
+          return instance.root_.classList.add(className);
+        },
+        removeClass: function removeClass(className) {
+          return instance.root_.classList.remove(className);
+        },
+        registerInteractionHandler: function registerInteractionHandler(evtType, handler) {
+          return instance.root_.addEventListener(evtType, handler, __WEBPACK_IMPORTED_MODULE_3__util__["applyPassive"]());
+        },
+        deregisterInteractionHandler: function deregisterInteractionHandler(evtType, handler) {
+          return instance.root_.removeEventListener(evtType, handler, __WEBPACK_IMPORTED_MODULE_3__util__["applyPassive"]());
+        },
+        registerResizeHandler: function registerResizeHandler(handler) {
+          return window.addEventListener('resize', handler);
+        },
+        deregisterResizeHandler: function deregisterResizeHandler(handler) {
+          return window.removeEventListener('resize', handler);
+        },
+        updateCssVariable: function updateCssVariable(varName, value) {
+          return instance.root_.style.setProperty(varName, value);
+        },
+        computeBoundingRect: function computeBoundingRect() {
+          return instance.root_.getBoundingClientRect();
+        },
+        getWindowPageOffset: function getWindowPageOffset() {
+          return { x: window.pageXOffset, y: window.pageYOffset };
+        }
+      };
+    }
+  }]);
+
+  return MDCRipple;
+}(__WEBPACK_IMPORTED_MODULE_0__material_base_component__["a" /* default */]);
+
+/**
+ * See Material Design spec for more details on when to use ripples.
+ * https://material.io/guidelines/motion/choreography.html#choreography-creation
+ * @record
+ */
+
+var RippleCapableSurface = function RippleCapableSurface() {
+  _classCallCheck(this, RippleCapableSurface);
+};
+
+/** @protected {!Element} */
+
+
+RippleCapableSurface.prototype.root_;
+
+/**
+ * Whether or not the ripple bleeds out of the bounds of the element.
+ * @type {boolean|undefined}
+ */
+RippleCapableSurface.prototype.unbounded;
+
+/**
+ * Whether or not the ripple is attached to a disabled component.
+ * @type {boolean|undefined}
+ */
+RippleCapableSurface.prototype.disabled;
+
+/***/ }),
+
+/***/ 7:
+/***/ (function(module, __webpack_exports__, __webpack_require__) {
+
+"use strict";
+/* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, "a", function() { return cssClasses; });
+/* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, "b", function() { return strings; });
+/* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, "c", function() { return numbers; });
+/**
+ * Copyright 2016 Google Inc. All Rights Reserved.
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *      http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+
+var cssClasses = {
+  // Ripple is a special case where the "root" component is really a "mixin" of sorts,
+  // given that it's an 'upgrade' to an existing component. That being said it is the root
+  // CSS class that all other CSS classes derive from.
+  ROOT: 'mdc-ripple-upgraded',
+  UNBOUNDED: 'mdc-ripple-upgraded--unbounded',
+  BG_FOCUSED: 'mdc-ripple-upgraded--background-focused',
+  BG_ACTIVE_FILL: 'mdc-ripple-upgraded--background-active-fill',
+  FG_ACTIVATION: 'mdc-ripple-upgraded--foreground-activation',
+  FG_DEACTIVATION: 'mdc-ripple-upgraded--foreground-deactivation'
+};
+
+var strings = {
+  VAR_SURFACE_WIDTH: '--mdc-ripple-surface-width',
+  VAR_SURFACE_HEIGHT: '--mdc-ripple-surface-height',
+  VAR_FG_SIZE: '--mdc-ripple-fg-size',
+  VAR_LEFT: '--mdc-ripple-left',
+  VAR_TOP: '--mdc-ripple-top',
+  VAR_FG_SCALE: '--mdc-ripple-fg-scale',
+  VAR_FG_TRANSLATE_START: '--mdc-ripple-fg-translate-start',
+  VAR_FG_TRANSLATE_END: '--mdc-ripple-fg-translate-end'
+};
+
+var numbers = {
+  PADDING: 10,
+  INITIAL_ORIGIN_SCALE: 0.6,
+  DEACTIVATION_TIMEOUT_MS: 300,
+  FG_DEACTIVATION_MS: 83
+};
+
+/***/ }),
+
+/***/ 8:
+/***/ (function(module, __webpack_exports__, __webpack_require__) {
+
+"use strict";
+/* harmony import */ var __WEBPACK_IMPORTED_MODULE_0__material_base_foundation__ = __webpack_require__(0);
+/* harmony import */ var __WEBPACK_IMPORTED_MODULE_1__adapter__ = __webpack_require__(4);
+/* harmony import */ var __WEBPACK_IMPORTED_MODULE_2__constants__ = __webpack_require__(7);
+/* harmony import */ var __WEBPACK_IMPORTED_MODULE_3__util__ = __webpack_require__(5);
+var _extends = Object.assign || function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; };
+
+var _createClass = function () { function defineProperties(target, props) { for (var i = 0; i < props.length; i++) { var descriptor = props[i]; descriptor.enumerable = descriptor.enumerable || false; descriptor.configurable = true; if ("value" in descriptor) descriptor.writable = true; Object.defineProperty(target, descriptor.key, descriptor); } } return function (Constructor, protoProps, staticProps) { if (protoProps) defineProperties(Constructor.prototype, protoProps); if (staticProps) defineProperties(Constructor, staticProps); return Constructor; }; }();
+
+function _classCallCheck(instance, Constructor) { if (!(instance instanceof Constructor)) { throw new TypeError("Cannot call a class as a function"); } }
+
+function _possibleConstructorReturn(self, call) { if (!self) { throw new ReferenceError("this hasn't been initialised - super() hasn't been called"); } return call && (typeof call === "object" || typeof call === "function") ? call : self; }
+
+function _inherits(subClass, superClass) { if (typeof superClass !== "function" && superClass !== null) { throw new TypeError("Super expression must either be null or a function, not " + typeof superClass); } subClass.prototype = Object.create(superClass && superClass.prototype, { constructor: { value: subClass, enumerable: false, writable: true, configurable: true } }); if (superClass) Object.setPrototypeOf ? Object.setPrototypeOf(subClass, superClass) : subClass.__proto__ = superClass; }
+
+/**
+ * Copyright 2016 Google Inc. All Rights Reserved.
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *      http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+
+
+
+
+
+
+/**
+ * @typedef {!{
+ *   isActivated: (boolean|undefined),
+ *   hasDeactivationUXRun: (boolean|undefined),
+ *   wasActivatedByPointer: (boolean|undefined),
+ *   wasElementMadeActive: (boolean|undefined),
+ *   activationStartTime: (number|undefined),
+ *   activationEvent: Event,
+ *   isProgrammatic: (boolean|undefined)
+ * }}
+ */
+var ActivationStateType = void 0;
+
+/**
+ * @typedef {!{
+ *   activate: (string|undefined),
+ *   deactivate: (string|undefined),
+ *   focus: (string|undefined),
+ *   blur: (string|undefined)
+ * }}
+ */
+var ListenerInfoType = void 0;
+
+/**
+ * @typedef {!{
+ *   activate: function(!Event),
+ *   deactivate: function(!Event),
+ *   focus: function(),
+ *   blur: function()
+ * }}
+ */
+var ListenersType = void 0;
+
+/**
+ * @typedef {!{
+ *   x: number,
+ *   y: number
+ * }}
+ */
+var PointType = void 0;
+
+/**
+ * @enum {string}
+ */
+var DEACTIVATION_ACTIVATION_PAIRS = {
+  mouseup: 'mousedown',
+  pointerup: 'pointerdown',
+  touchend: 'touchstart',
+  keyup: 'keydown',
+  blur: 'focus'
+};
+
+/**
+ * @extends {MDCFoundation<!MDCRippleAdapter>}
+ */
+
+var MDCRippleFoundation = function (_MDCFoundation) {
+  _inherits(MDCRippleFoundation, _MDCFoundation);
+
+  _createClass(MDCRippleFoundation, [{
+    key: 'isSupported_',
+
+
+    /**
+     * We compute this property so that we are not querying information about the client
+     * until the point in time where the foundation requests it. This prevents scenarios where
+     * client-side feature-detection may happen too early, such as when components are rendered on the server
+     * and then initialized at mount time on the client.
+     * @return {boolean}
+     */
+    get: function get() {
+      return this.adapter_.browserSupportsCssVars();
+    }
+  }], [{
+    key: 'cssClasses',
+    get: function get() {
+      return __WEBPACK_IMPORTED_MODULE_2__constants__["a" /* cssClasses */];
+    }
+  }, {
+    key: 'strings',
+    get: function get() {
+      return __WEBPACK_IMPORTED_MODULE_2__constants__["b" /* strings */];
+    }
+  }, {
+    key: 'numbers',
+    get: function get() {
+      return __WEBPACK_IMPORTED_MODULE_2__constants__["c" /* numbers */];
+    }
+  }, {
+    key: 'defaultAdapter',
+    get: function get() {
+      return {
+        browserSupportsCssVars: function browserSupportsCssVars() /* boolean - cached */{},
+        isUnbounded: function isUnbounded() /* boolean */{},
+        isSurfaceActive: function isSurfaceActive() /* boolean */{},
+        isSurfaceDisabled: function isSurfaceDisabled() /* boolean */{},
+        addClass: function addClass() /* className: string */{},
+        removeClass: function removeClass() /* className: string */{},
+        registerInteractionHandler: function registerInteractionHandler() /* evtType: string, handler: EventListener */{},
+        deregisterInteractionHandler: function deregisterInteractionHandler() /* evtType: string, handler: EventListener */{},
+        registerResizeHandler: function registerResizeHandler() /* handler: EventListener */{},
+        deregisterResizeHandler: function deregisterResizeHandler() /* handler: EventListener */{},
+        updateCssVariable: function updateCssVariable() /* varName: string, value: string */{},
+        computeBoundingRect: function computeBoundingRect() /* ClientRect */{},
+        getWindowPageOffset: function getWindowPageOffset() /* {x: number, y: number} */{}
+      };
+    }
+  }]);
+
+  function MDCRippleFoundation(adapter) {
+    _classCallCheck(this, MDCRippleFoundation);
+
+    /** @private {number} */
+    var _this = _possibleConstructorReturn(this, (MDCRippleFoundation.__proto__ || Object.getPrototypeOf(MDCRippleFoundation)).call(this, _extends(MDCRippleFoundation.defaultAdapter, adapter)));
+
+    _this.layoutFrame_ = 0;
+
+    /** @private {!ClientRect} */
+    _this.frame_ = /** @type {!ClientRect} */{ width: 0, height: 0 };
+
+    /** @private {!ActivationStateType} */
+    _this.activationState_ = _this.defaultActivationState_();
+
+    /** @private {number} */
+    _this.xfDuration_ = 0;
+
+    /** @private {number} */
+    _this.initialSize_ = 0;
+
+    /** @private {number} */
+    _this.maxRadius_ = 0;
+
+    /** @private {!Array<{ListenerInfoType}>} */
+    _this.listenerInfos_ = [{ activate: 'touchstart', deactivate: 'touchend' }, { activate: 'pointerdown', deactivate: 'pointerup' }, { activate: 'mousedown', deactivate: 'mouseup' }, { activate: 'keydown', deactivate: 'keyup' }, { focus: 'focus', blur: 'blur' }];
+
+    /** @private {!ListenersType} */
+    _this.listeners_ = {
+      activate: function activate(e) {
+        return _this.activate_(e);
+      },
+      deactivate: function deactivate(e) {
+        return _this.deactivate_(e);
+      },
+      focus: function focus() {
+        return requestAnimationFrame(function () {
+          return _this.adapter_.addClass(MDCRippleFoundation.cssClasses.BG_FOCUSED);
+        });
+      },
+      blur: function blur() {
+        return requestAnimationFrame(function () {
+          return _this.adapter_.removeClass(MDCRippleFoundation.cssClasses.BG_FOCUSED);
+        });
+      }
+    };
+
+    /** @private {!Function} */
+    _this.resizeHandler_ = function () {
+      return _this.layout();
+    };
+
+    /** @private {!{left: number, top:number}} */
+    _this.unboundedCoords_ = {
+      left: 0,
+      top: 0
+    };
+
+    /** @private {number} */
+    _this.fgScale_ = 0;
+
+    /** @private {number} */
+    _this.activationTimer_ = 0;
+
+    /** @private {number} */
+    _this.fgDeactivationRemovalTimer_ = 0;
+
+    /** @private {boolean} */
+    _this.activationAnimationHasEnded_ = false;
+
+    /** @private {!Function} */
+    _this.activationTimerCallback_ = function () {
+      _this.activationAnimationHasEnded_ = true;
+      _this.runDeactivationUXLogicIfReady_();
+    };
+    return _this;
+  }
+
+  /**
+   * @return {!ActivationStateType}
+   */
+
+
+  _createClass(MDCRippleFoundation, [{
+    key: 'defaultActivationState_',
+    value: function defaultActivationState_() {
+      return {
+        isActivated: false,
+        hasDeactivationUXRun: false,
+        wasActivatedByPointer: false,
+        wasElementMadeActive: false,
+        activationStartTime: 0,
+        activationEvent: null,
+        isProgrammatic: false
+      };
+    }
+  }, {
+    key: 'init',
+    value: function init() {
+      var _this2 = this;
+
+      if (!this.isSupported_) {
+        return;
+      }
+      this.addEventListeners_();
+
+      var _MDCRippleFoundation$ = MDCRippleFoundation.cssClasses,
+          ROOT = _MDCRippleFoundation$.ROOT,
+          UNBOUNDED = _MDCRippleFoundation$.UNBOUNDED;
+
+      requestAnimationFrame(function () {
+        _this2.adapter_.addClass(ROOT);
+        if (_this2.adapter_.isUnbounded()) {
+          _this2.adapter_.addClass(UNBOUNDED);
+        }
+        _this2.layoutInternal_();
+      });
+    }
+
+    /** @private */
+
+  }, {
+    key: 'addEventListeners_',
+    value: function addEventListeners_() {
+      var _this3 = this;
+
+      this.listenerInfos_.forEach(function (info) {
+        Object.keys(info).forEach(function (k) {
+          _this3.adapter_.registerInteractionHandler(info[k], _this3.listeners_[k]);
+        });
+      });
+      this.adapter_.registerResizeHandler(this.resizeHandler_);
+    }
+
+    /**
+     * @param {Event} e
+     * @private
+     */
+
+  }, {
+    key: 'activate_',
+    value: function activate_(e) {
+      var _this4 = this;
+
+      if (this.adapter_.isSurfaceDisabled()) {
+        return;
+      }
+
+      var activationState = this.activationState_;
+
+      if (activationState.isActivated) {
+        return;
+      }
+
+      activationState.isActivated = true;
+      activationState.isProgrammatic = e === null;
+      activationState.activationEvent = e;
+      activationState.wasActivatedByPointer = activationState.isProgrammatic ? false : e.type === 'mousedown' || e.type === 'touchstart' || e.type === 'pointerdown';
+      activationState.activationStartTime = Date.now();
+
+      requestAnimationFrame(function () {
+        // This needs to be wrapped in an rAF call b/c web browsers
+        // report active states inconsistently when they're called within
+        // event handling code:
+        // - https://bugs.chromium.org/p/chromium/issues/detail?id=635971
+        // - https://bugzilla.mozilla.org/show_bug.cgi?id=1293741
+        activationState.wasElementMadeActive = e && e.type === 'keydown' ? _this4.adapter_.isSurfaceActive() : true;
+        if (activationState.wasElementMadeActive) {
+          _this4.animateActivation_();
+        } else {
+          // Reset activation state immediately if element was not made active.
+          _this4.activationState_ = _this4.defaultActivationState_();
+        }
+      });
+    }
+  }, {
+    key: 'activate',
+    value: function activate() {
+      this.activate_(null);
+    }
+
+    /** @private */
+
+  }, {
+    key: 'animateActivation_',
+    value: function animateActivation_() {
+      var _this5 = this;
+
+      var _MDCRippleFoundation$2 = MDCRippleFoundation.strings,
+          VAR_FG_TRANSLATE_START = _MDCRippleFoundation$2.VAR_FG_TRANSLATE_START,
+          VAR_FG_TRANSLATE_END = _MDCRippleFoundation$2.VAR_FG_TRANSLATE_END;
+      var _MDCRippleFoundation$3 = MDCRippleFoundation.cssClasses,
+          BG_ACTIVE_FILL = _MDCRippleFoundation$3.BG_ACTIVE_FILL,
+          FG_DEACTIVATION = _MDCRippleFoundation$3.FG_DEACTIVATION,
+          FG_ACTIVATION = _MDCRippleFoundation$3.FG_ACTIVATION;
+      var DEACTIVATION_TIMEOUT_MS = MDCRippleFoundation.numbers.DEACTIVATION_TIMEOUT_MS;
+
+
+      var translateStart = '';
+      var translateEnd = '';
+
+      if (!this.adapter_.isUnbounded()) {
+        var _getFgTranslationCoor = this.getFgTranslationCoordinates_(),
+            startPoint = _getFgTranslationCoor.startPoint,
+            endPoint = _getFgTranslationCoor.endPoint;
+
+        translateStart = startPoint.x + 'px, ' + startPoint.y + 'px';
+        translateEnd = endPoint.x + 'px, ' + endPoint.y + 'px';
+      }
+
+      this.adapter_.updateCssVariable(VAR_FG_TRANSLATE_START, translateStart);
+      this.adapter_.updateCssVariable(VAR_FG_TRANSLATE_END, translateEnd);
+      // Cancel any ongoing activation/deactivation animations
+      clearTimeout(this.activationTimer_);
+      clearTimeout(this.fgDeactivationRemovalTimer_);
+      this.rmBoundedActivationClasses_();
+      this.adapter_.removeClass(FG_DEACTIVATION);
+
+      // Force layout in order to re-trigger the animation.
+      this.adapter_.computeBoundingRect();
+      this.adapter_.addClass(BG_ACTIVE_FILL);
+      this.adapter_.addClass(FG_ACTIVATION);
+      this.activationTimer_ = setTimeout(function () {
+        return _this5.activationTimerCallback_();
+      }, DEACTIVATION_TIMEOUT_MS);
+    }
+
+    /**
+     * @private
+     * @return {{startPoint: PointType, endPoint: PointType}}
+     */
+
+  }, {
+    key: 'getFgTranslationCoordinates_',
+    value: function getFgTranslationCoordinates_() {
+      var activationState = this.activationState_;
+      var activationEvent = activationState.activationEvent,
+          wasActivatedByPointer = activationState.wasActivatedByPointer;
+
+
+      var startPoint = void 0;
+      if (wasActivatedByPointer) {
+        startPoint = __webpack_require__.i(__WEBPACK_IMPORTED_MODULE_3__util__["getNormalizedEventCoords"])(
+        /** @type {!Event} */activationEvent, this.adapter_.getWindowPageOffset(), this.adapter_.computeBoundingRect());
+      } else {
+        startPoint = {
+          x: this.frame_.width / 2,
+          y: this.frame_.height / 2
+        };
+      }
+      // Center the element around the start point.
+      startPoint = {
+        x: startPoint.x - this.initialSize_ / 2,
+        y: startPoint.y - this.initialSize_ / 2
+      };
+
+      var endPoint = {
+        x: this.frame_.width / 2 - this.initialSize_ / 2,
+        y: this.frame_.height / 2 - this.initialSize_ / 2
+      };
+
+      return { startPoint: startPoint, endPoint: endPoint };
+    }
+
+    /** @private */
+
+  }, {
+    key: 'runDeactivationUXLogicIfReady_',
+    value: function runDeactivationUXLogicIfReady_() {
+      var _this6 = this;
+
+      var FG_DEACTIVATION = MDCRippleFoundation.cssClasses.FG_DEACTIVATION;
+      var _activationState_ = this.activationState_,
+          hasDeactivationUXRun = _activationState_.hasDeactivationUXRun,
+          isActivated = _activationState_.isActivated;
+
+      var activationHasEnded = hasDeactivationUXRun || !isActivated;
+      if (activationHasEnded && this.activationAnimationHasEnded_) {
+        this.rmBoundedActivationClasses_();
+        this.adapter_.addClass(FG_DEACTIVATION);
+        this.fgDeactivationRemovalTimer_ = setTimeout(function () {
+          _this6.adapter_.removeClass(FG_DEACTIVATION);
+        }, __WEBPACK_IMPORTED_MODULE_2__constants__["c" /* numbers */].FG_DEACTIVATION_MS);
+      }
+    }
+
+    /** @private */
+
+  }, {
+    key: 'rmBoundedActivationClasses_',
+    value: function rmBoundedActivationClasses_() {
+      var _MDCRippleFoundation$4 = MDCRippleFoundation.cssClasses,
+          BG_ACTIVE_FILL = _MDCRippleFoundation$4.BG_ACTIVE_FILL,
+          FG_ACTIVATION = _MDCRippleFoundation$4.FG_ACTIVATION;
+
+      this.adapter_.removeClass(BG_ACTIVE_FILL);
+      this.adapter_.removeClass(FG_ACTIVATION);
+      this.activationAnimationHasEnded_ = false;
+      this.adapter_.computeBoundingRect();
+    }
+
+    /**
+     * @param {Event} e
+     * @private
+     */
+
+  }, {
+    key: 'deactivate_',
+    value: function deactivate_(e) {
+      var _this7 = this;
+
+      var activationState = this.activationState_;
+      // This can happen in scenarios such as when you have a keyup event that blurs the element.
+
+      if (!activationState.isActivated) {
+        return;
+      }
+      // Programmatic deactivation.
+      if (activationState.isProgrammatic) {
+        var evtObject = null;
+        var _state = /** @type {!ActivationStateType} */_extends({}, activationState);
+        requestAnimationFrame(function () {
+          return _this7.animateDeactivation_(evtObject, _state);
+        });
+        this.activationState_ = this.defaultActivationState_();
+        return;
+      }
+
+      var actualActivationType = DEACTIVATION_ACTIVATION_PAIRS[e.type];
+      var expectedActivationType = activationState.activationEvent.type;
+      // NOTE: Pointer events are tricky - https://patrickhlauke.github.io/touch/tests/results/
+      // Essentially, what we need to do here is decouple the deactivation UX from the actual
+      // deactivation state itself. This way, touch/pointer events in sequence do not trample one
+      // another.
+      var needsDeactivationUX = actualActivationType === expectedActivationType;
+      var needsActualDeactivation = needsDeactivationUX;
+      if (activationState.wasActivatedByPointer) {
+        needsActualDeactivation = e.type === 'mouseup';
+      }
+
+      var state = /** @type {!ActivationStateType} */_extends({}, activationState);
+      requestAnimationFrame(function () {
+        if (needsDeactivationUX) {
+          _this7.activationState_.hasDeactivationUXRun = true;
+          _this7.animateDeactivation_(e, state);
+        }
+
+        if (needsActualDeactivation) {
+          _this7.activationState_ = _this7.defaultActivationState_();
+        }
+      });
+    }
+  }, {
+    key: 'deactivate',
+    value: function deactivate() {
+      this.deactivate_(null);
+    }
+
+    /**
+     * @param {Event} e
+     * @param {!ActivationStateType} options
+     * @private
+     */
+
+  }, {
+    key: 'animateDeactivation_',
+    value: function animateDeactivation_(e, _ref) {
+      var wasActivatedByPointer = _ref.wasActivatedByPointer,
+          wasElementMadeActive = _ref.wasElementMadeActive;
+      var BG_FOCUSED = MDCRippleFoundation.cssClasses.BG_FOCUSED;
+
+      if (wasActivatedByPointer || wasElementMadeActive) {
+        // Remove class left over by element being focused
+        this.adapter_.removeClass(BG_FOCUSED);
+        this.runDeactivationUXLogicIfReady_();
+      }
+    }
+  }, {
+    key: 'destroy',
+    value: function destroy() {
+      var _this8 = this;
+
+      if (!this.isSupported_) {
+        return;
+      }
+      this.removeEventListeners_();
+
+      var _MDCRippleFoundation$5 = MDCRippleFoundation.cssClasses,
+          ROOT = _MDCRippleFoundation$5.ROOT,
+          UNBOUNDED = _MDCRippleFoundation$5.UNBOUNDED;
+
+      requestAnimationFrame(function () {
+        _this8.adapter_.removeClass(ROOT);
+        _this8.adapter_.removeClass(UNBOUNDED);
+        _this8.removeCssVars_();
+      });
+    }
+
+    /** @private */
+
+  }, {
+    key: 'removeEventListeners_',
+    value: function removeEventListeners_() {
+      var _this9 = this;
+
+      this.listenerInfos_.forEach(function (info) {
+        Object.keys(info).forEach(function (k) {
+          _this9.adapter_.deregisterInteractionHandler(info[k], _this9.listeners_[k]);
+        });
+      });
+      this.adapter_.deregisterResizeHandler(this.resizeHandler_);
+    }
+
+    /** @private */
+
+  }, {
+    key: 'removeCssVars_',
+    value: function removeCssVars_() {
+      var _this10 = this;
+
+      var strings = MDCRippleFoundation.strings;
+
+      Object.keys(strings).forEach(function (k) {
+        if (k.indexOf('VAR_') === 0) {
+          _this10.adapter_.updateCssVariable(strings[k], null);
+        }
+      });
+    }
+  }, {
+    key: 'layout',
+    value: function layout() {
+      var _this11 = this;
+
+      if (this.layoutFrame_) {
+        cancelAnimationFrame(this.layoutFrame_);
+      }
+      this.layoutFrame_ = requestAnimationFrame(function () {
+        _this11.layoutInternal_();
+        _this11.layoutFrame_ = 0;
+      });
+    }
+
+    /** @private */
+
+  }, {
+    key: 'layoutInternal_',
+    value: function layoutInternal_() {
+      this.frame_ = this.adapter_.computeBoundingRect();
+
+      var maxDim = Math.max(this.frame_.height, this.frame_.width);
+      var surfaceDiameter = Math.sqrt(Math.pow(this.frame_.width, 2) + Math.pow(this.frame_.height, 2));
+
+      // 60% of the largest dimension of the surface
+      this.initialSize_ = maxDim * MDCRippleFoundation.numbers.INITIAL_ORIGIN_SCALE;
+
+      // Diameter of the surface + 10px
+      this.maxRadius_ = surfaceDiameter + MDCRippleFoundation.numbers.PADDING;
+      this.fgScale_ = this.maxRadius_ / this.initialSize_;
+      this.xfDuration_ = 1000 * Math.sqrt(this.maxRadius_ / 1024);
+      this.updateLayoutCssVars_();
+    }
+
+    /** @private */
+
+  }, {
+    key: 'updateLayoutCssVars_',
+    value: function updateLayoutCssVars_() {
+      var _MDCRippleFoundation$6 = MDCRippleFoundation.strings,
+          VAR_SURFACE_WIDTH = _MDCRippleFoundation$6.VAR_SURFACE_WIDTH,
+          VAR_SURFACE_HEIGHT = _MDCRippleFoundation$6.VAR_SURFACE_HEIGHT,
+          VAR_FG_SIZE = _MDCRippleFoundation$6.VAR_FG_SIZE,
+          VAR_LEFT = _MDCRippleFoundation$6.VAR_LEFT,
+          VAR_TOP = _MDCRippleFoundation$6.VAR_TOP,
+          VAR_FG_SCALE = _MDCRippleFoundation$6.VAR_FG_SCALE;
+
+
+      this.adapter_.updateCssVariable(VAR_SURFACE_WIDTH, this.frame_.width + 'px');
+      this.adapter_.updateCssVariable(VAR_SURFACE_HEIGHT, this.frame_.height + 'px');
+      this.adapter_.updateCssVariable(VAR_FG_SIZE, this.initialSize_ + 'px');
+      this.adapter_.updateCssVariable(VAR_FG_SCALE, this.fgScale_);
+
+      if (this.adapter_.isUnbounded()) {
+        this.unboundedCoords_ = {
+          left: Math.round(this.frame_.width / 2 - this.initialSize_ / 2),
+          top: Math.round(this.frame_.height / 2 - this.initialSize_ / 2)
+        };
+
+        this.adapter_.updateCssVariable(VAR_LEFT, this.unboundedCoords_.left + 'px');
+        this.adapter_.updateCssVariable(VAR_TOP, this.unboundedCoords_.top + 'px');
+      }
+    }
+  }]);
+
+  return MDCRippleFoundation;
+}(__WEBPACK_IMPORTED_MODULE_0__material_base_foundation__["a" /* default */]);
+
+/* harmony default export */ __webpack_exports__["a"] = (MDCRippleFoundation);
+
+/***/ }),
+
+/***/ 93:
+/***/ (function(module, exports, __webpack_require__) {
+
+module.exports = __webpack_require__(6);
+
+
+/***/ })
+
+/******/ });
+});

+ 478 - 0
support/client/lib/vwf/view/lib/mdc/dist/mdc.select.css

@@ -0,0 +1,478 @@
+/*!
+ Material Components for the web
+ Copyright (c) 2017 Google Inc.
+ License: Apache-2.0
+*/
+/* TODO(sgomes): Figure out what to do about desktop font sizes. */
+/* TODO(sgomes): Figure out what to do about i18n and i18n font sizes. */
+/*
+  Precomputed linear color channel values, for use in contrast calculations.
+  See https://www.w3.org/TR/WCAG20-TECHS/G17.html#G17-tests
+
+  Algorithm, for c in 0 to 255:
+  f(c) {
+    c = c / 255;
+    return c < 0.03928 ? c / 12.92 : Math.pow((c + 0.055) / 1.055, 2.4);
+  }
+
+  This lookup table is needed since there is no `pow` in SASS.
+*/
+/**
+ * Calculate the luminance for a color.
+ * See https://www.w3.org/TR/WCAG20-TECHS/G17.html#G17-tests
+ */
+/**
+ * Calculate the contrast ratio between two colors.
+ * See https://www.w3.org/TR/WCAG20-TECHS/G17.html#G17-tests
+ */
+/**
+ * Determine whether to use dark or light text on top of given color.
+ * Returns "dark" for dark text and "light" for light text.
+ */
+/*
+  Main theme colors.
+  If you're a user customizing your color scheme in SASS, these are probably the only variables you need to change.
+*/
+/* Indigo 500 */
+/* Pink A200 */
+/* White */
+/* Which set of text colors to use for each main theme color (light or dark) */
+/* Text colors according to light vs dark and text type */
+/* Primary text colors for each of the theme colors */
+/**
+ * Applies the correct theme color style to the specified property.
+ * $property is typically color or background-color, but can be any CSS property that accepts color values.
+ * $style should be one of the map keys in $mdc-theme-property-values (_variables.scss).
+ */
+/**
+ * Creates a rule to be used in MDC-Web components for dark theming, and applies the provided contents.
+ * Should provide the $root-selector option if applied to anything other than the root selector.
+ * When used with a modifier class, provide a second argument of `true` for the $compound parameter
+ * to specify that this should be attached as a compound class.
+ *
+ * Usage example:
+ *
+ * ```scss
+ * .mdc-foo {
+ *   color: black;
+ *
+ *   @include mdc-theme-dark {
+ *     color: white;
+ *   }
+ *
+ *   &__bar {
+ *     background: black;
+ *
+ *     @include mdc-theme-dark(".mdc-foo") {
+ *       background: white;
+ *     }
+ *   }
+ * }
+ *
+ * .mdc-foo--disabled {
+ *   opacity: .38;
+ *
+ *   @include mdc-theme-dark(".mdc-foo", true) {
+ *     opacity: .5;
+ *   }
+ * }
+ * ```
+ */
+/**
+ * Creates a rule that will be applied when an MDC-Web component is within the context of an RTL layout.
+ *
+ * Usage Example:
+ * ```scss
+ * .mdc-foo {
+ *   position: absolute;
+ *   left: 0;
+ *
+ *   @include mdc-rtl {
+ *     left: auto;
+ *     right: 0;
+ *   }
+ *
+ *   &__bar {
+ *     margin-left: 4px;
+ *     @include mdc-rtl(".mdc-foo") {
+ *       margin-left: auto;
+ *       margin-right: 4px;
+ *     }
+ *   }
+ * }
+ *
+ * .mdc-foo--mod {
+ *   padding-left: 4px;
+ *
+ *   @include mdc-rtl {
+ *     padding-left: auto;
+ *     padding-right: 4px;
+ *   }
+ * }
+ * ```
+ *
+ * Note that this works by checking for [dir="rtl"] on an ancestor element. While this will work
+ * in most cases, it will in some cases lead to false negatives, e.g.
+ *
+ * ```html
+ * <html dir="rtl">
+ *   <!-- ... -->
+ *   <div dir="ltr">
+ *     <div class="mdc-foo">Styled incorrectly as RTL!</div>
+ *   </div>
+ * </html>
+ * ```
+ *
+ * In the future, selectors such as :dir (http://mdn.io/:dir) will help us mitigate this.
+ */
+/**
+ * Takes a base box-model property - e.g. margin / border / padding - along with a default
+ * direction and value, and emits rules which apply the value to the
+ * "<base-property>-<default-direction>" property by default, but flips the direction
+ * when within an RTL context.
+ *
+ * For example:
+ *
+ * ```scss
+ * .mdc-foo {
+ *   @include mdc-rtl-reflexive-box(margin, left, 8px);
+ * }
+ * ```
+ * is equivalent to:
+ *
+ * ```scss
+ * .mdc-foo {
+ *   margin-left: 8px;
+ *
+ *   @include mdc-rtl {
+ *     margin-right: 8px;
+ *     margin-left: 0;
+ *   }
+ * }
+ * ```
+ * whereas:
+ *
+ * ```scss
+ * .mdc-foo {
+ *   @include mdc-rtl-reflexive-box(margin, right, 8px);
+ * }
+ * ```
+ * is equivalent to:
+ *
+ * ```scss
+ * .mdc-foo {
+ *   margin-right: 8px;
+ *
+ *   @include mdc-rtl {
+ *     margin-right: 0;
+ *     margin-left: 8px;
+ *   }
+ * }
+ * ```
+ *
+ * You can also pass a 4th optional $root-selector argument which will be forwarded to `mdc-rtl`,
+ * e.g. `@include mdc-rtl-reflexive-box(margin, left, 8px, ".mdc-component")`.
+ *
+ * Note that this function will always zero out the original value in an RTL context. If you're
+ * trying to flip the values, use mdc-rtl-reflexive-property().
+ */
+/**
+ * Takes a base property and emits rules that assign <base-property>-left to <left-value> and
+ * <base-property>-right to <right-value> in a LTR context, and vice versa in a RTL context.
+ * For example:
+ *
+ * ```scss
+ * .mdc-foo {
+ *   @include mdc-rtl-reflexive-property(margin, auto, 12px);
+ * }
+ * ```
+ * is equivalent to:
+ *
+ * ```scss
+ * .mdc-foo {
+ *   margin-left: auto;
+ *   margin-right: 12px;
+ *
+ *   @include mdc-rtl {
+ *     margin-left: 12px;
+ *     margin-right: auto;
+ *   }
+ * }
+ * ```
+ *
+ * A 4th optional $root-selector argument can be given, which will be passed to `mdc-rtl`.
+ */
+/**
+ * Takes an argument specifying a horizontal position property (either "left" or "right") as well
+ * as a value, and applies that value to the specified position in a LTR context, and flips it in a
+ * RTL context. For example:
+ *
+ * ```scss
+ * .mdc-foo {
+ *   @include mdc-rtl-reflexive-position(left, 0);
+ *   position: absolute;
+ * }
+ * ```
+ * is equivalent to:
+ *
+ * ```scss
+ *  .mdc-foo {
+ *    position: absolute;
+ *    left: 0;
+ *    right: initial;
+ *
+ *    @include mdc-rtl {
+ *      right: 0;
+ *      left: initial;
+ *    }
+ *  }
+ * ```
+ * An optional third $root-selector argument may also be given, which is passed to `mdc-rtl`.
+ */
+.mdc-select {
+  font-family: Roboto, sans-serif;
+  -moz-osx-font-smoothing: grayscale;
+  -webkit-font-smoothing: antialiased;
+  font-size: 1rem;
+  font-weight: 400;
+  letter-spacing: 0.04em;
+  line-height: 1.75rem;
+  text-decoration: inherit;
+  text-transform: inherit;
+  /* @alternate */
+  color: rgba(0, 0, 0, 0.87);
+  color: var(--mdc-theme-text-primary-on-light, rgba(0, 0, 0, 0.87));
+  padding-left: 0;
+  padding-right: 24px;
+  -webkit-appearance: none;
+     -moz-appearance: none;
+          appearance: none;
+  display: -webkit-inline-box;
+  display: -ms-inline-flexbox;
+  display: inline-flex;
+  -webkit-box-align: center;
+      -ms-flex-align: center;
+          align-items: center;
+  -webkit-box-pack: start;
+      -ms-flex-pack: start;
+          justify-content: flex-start;
+  max-width: calc(100% - 24px);
+  height: 32px;
+  -webkit-transition: border-bottom-color 150ms 0ms cubic-bezier(0.4, 0, 0.6, 1), background-color 150ms 0ms cubic-bezier(0.4, 0, 0.6, 1);
+  transition: border-bottom-color 150ms 0ms cubic-bezier(0.4, 0, 0.6, 1), background-color 150ms 0ms cubic-bezier(0.4, 0, 0.6, 1);
+  border: none;
+  border-bottom: 1px solid rgba(0, 0, 0, 0.12);
+  border-radius: 0;
+  background: none;
+  background-repeat: no-repeat;
+  background-position: right center;
+  background-image: url(data:image/svg+xml,%3Csvg%20width%3D%2210px%22%20height%3D%225px%22%20viewBox%3D%227%2010%2010%205%22%20version%3D%221.1%22%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20xmlns%3Axlink%3D%22http%3A%2F%2Fwww.w3.org%2F1999%2Fxlink%22%3E%0A%20%20%20%20%3Cpolygon%20id%3D%22Shape%22%20stroke%3D%22none%22%20fill%3D%22%230%22%20fill-rule%3D%22evenodd%22%20opacity%3D%220.54%22%20points%3D%227%2010%2012%2015%2017%2010%22%3E%3C%2Fpolygon%3E%0A%3C%2Fsvg%3E);
+  font-family: Roboto, sans-serif;
+  font-size: .936rem;
+  cursor: pointer; }
+  [dir="rtl"] .mdc-select, .mdc-select[dir="rtl"] {
+    padding-left: 24px;
+    padding-right: 0; }
+  .mdc-select::-ms-expand {
+    display: none; }
+  .mdc-select:focus {
+    /* @alternate */
+    border-bottom-color: #3f51b5;
+    border-bottom-color: var(--mdc-theme-primary, #3f51b5);
+    outline: none;
+    background-color: rgba(0, 0, 0, 0.06); }
+  [dir="rtl"] .mdc-select, .mdc-select[dir="rtl"] {
+    background-position: left center; }
+  .mdc-select--theme-dark,
+  .mdc-theme--dark .mdc-select {
+    /* @alternate */
+    color: white;
+    color: var(--mdc-theme-text-primary-on-dark, white);
+    background-image: url(data:image/svg+xml,%3Csvg%20width%3D%2210px%22%20height%3D%225px%22%20viewBox%3D%227%2010%2010%205%22%20version%3D%221.1%22%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20xmlns%3Axlink%3D%22http%3A%2F%2Fwww.w3.org%2F1999%2Fxlink%22%3E%0A%20%20%20%20%3Cpolygon%20id%3D%22Shape%22%20stroke%3D%22none%22%20fill%3D%22%23ffffff%22%20fill-rule%3D%22evenodd%22%20opacity%3D%220.54%22%20points%3D%227%2010%2012%2015%2017%2010%22%3E%3C%2Fpolygon%3E%0A%3C%2Fsvg%3E);
+    border-bottom: 1px solid rgba(255, 255, 255, 0.12); }
+    .mdc-select--theme-dark:focus,
+    .mdc-theme--dark .mdc-select:focus {
+      /* @alternate */
+      border-bottom-color: #3f51b5;
+      border-bottom-color: var(--mdc-theme-primary, #3f51b5);
+      background-color: rgba(255, 255, 255, 0.09); }
+  .mdc-select__menu {
+    position: fixed;
+    top: 0;
+    left: 0;
+    max-height: 100%;
+    -webkit-transform-origin: center center;
+            transform-origin: center center;
+    overflow-y: scroll;
+    z-index: 4; }
+  .mdc-select__selected-text {
+    -webkit-transition: opacity 125ms 0ms cubic-bezier(0.4, 0, 0.6, 1), -webkit-transform 125ms 0ms cubic-bezier(0.4, 0, 0.6, 1);
+    transition: opacity 125ms 0ms cubic-bezier(0.4, 0, 0.6, 1), -webkit-transform 125ms 0ms cubic-bezier(0.4, 0, 0.6, 1);
+    transition: opacity 125ms 0ms cubic-bezier(0.4, 0, 0.6, 1), transform 125ms 0ms cubic-bezier(0.4, 0, 0.6, 1);
+    transition: opacity 125ms 0ms cubic-bezier(0.4, 0, 0.6, 1), transform 125ms 0ms cubic-bezier(0.4, 0, 0.6, 1), -webkit-transform 125ms 0ms cubic-bezier(0.4, 0, 0.6, 1);
+    white-space: nowrap;
+    overflow: hidden; }
+
+.mdc-select--open .mdc-select__selected-text {
+  -webkit-transform: translateY(8px);
+          transform: translateY(8px);
+  -webkit-transition: opacity 125ms 125ms cubic-bezier(0, 0, 0.2, 1), -webkit-transform 125ms 125ms cubic-bezier(0, 0, 0.2, 1);
+  transition: opacity 125ms 125ms cubic-bezier(0, 0, 0.2, 1), -webkit-transform 125ms 125ms cubic-bezier(0, 0, 0.2, 1);
+  transition: opacity 125ms 125ms cubic-bezier(0, 0, 0.2, 1), transform 125ms 125ms cubic-bezier(0, 0, 0.2, 1);
+  transition: opacity 125ms 125ms cubic-bezier(0, 0, 0.2, 1), transform 125ms 125ms cubic-bezier(0, 0, 0.2, 1), -webkit-transform 125ms 125ms cubic-bezier(0, 0, 0.2, 1);
+  opacity: 0; }
+
+.mdc-select--disabled,
+.mdc-select[disabled] {
+  /* @alternate */
+  color: rgba(0, 0, 0, 0.38);
+  color: var(--mdc-theme-text-disabled-on-light, rgba(0, 0, 0, 0.38));
+  background-image: url(data:image/svg+xml,%3Csvg%20width%3D%2210px%22%20height%3D%225px%22%20viewBox%3D%227%2010%2010%205%22%20version%3D%221.1%22%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20xmlns%3Axlink%3D%22http%3A%2F%2Fwww.w3.org%2F1999%2Fxlink%22%3E%0A%20%20%20%20%3Cpolygon%20id%3D%22Shape%22%20stroke%3D%22none%22%20fill%3D%22%230%22%20fill-rule%3D%22evenodd%22%20opacity%3D%220.38%22%20points%3D%227%2010%2012%2015%2017%2010%22%3E%3C%2Fpolygon%3E%0A%3C%2Fsvg%3E);
+  border-bottom-style: dotted;
+  cursor: default;
+  pointer-events: none;
+  -webkit-user-select: none;
+     -moz-user-select: none;
+      -ms-user-select: none;
+          user-select: none; }
+
+.mdc-select--theme-dark.mdc-select--disabled,
+.mdc-theme--dark .mdc-select--disabled {
+  /* @alternate */
+  color: rgba(255, 255, 255, 0.5);
+  color: var(--mdc-theme-text-disabled-on-dark, rgba(255, 255, 255, 0.5));
+  background-image: url(data:image/svg+xml,%3Csvg%20width%3D%2210px%22%20height%3D%225px%22%20viewBox%3D%227%2010%2010%205%22%20version%3D%221.1%22%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20xmlns%3Axlink%3D%22http%3A%2F%2Fwww.w3.org%2F1999%2Fxlink%22%3E%0A%20%20%20%20%3Cpolygon%20id%3D%22Shape%22%20stroke%3D%22none%22%20fill%3D%22%23ffffff%22%20fill-rule%3D%22evenodd%22%20opacity%3D%220.38%22%20points%3D%227%2010%2012%2015%2017%2010%22%3E%3C%2Fpolygon%3E%0A%3C%2Fsvg%3E);
+  border-bottom: 1px dotted rgba(255, 255, 255, 0.38); }
+
+.mdc-select--theme-dark.mdc-select[disabled],
+.mdc-theme--dark .mdc-select[disabled] {
+  /* @alternate */
+  color: rgba(255, 255, 255, 0.5);
+  color: var(--mdc-theme-text-disabled-on-dark, rgba(255, 255, 255, 0.5));
+  background-image: url(data:image/svg+xml,%3Csvg%20width%3D%2210px%22%20height%3D%225px%22%20viewBox%3D%227%2010%2010%205%22%20version%3D%221.1%22%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20xmlns%3Axlink%3D%22http%3A%2F%2Fwww.w3.org%2F1999%2Fxlink%22%3E%0A%20%20%20%20%3Cpolygon%20id%3D%22Shape%22%20stroke%3D%22none%22%20fill%3D%22%23ffffff%22%20fill-rule%3D%22evenodd%22%20opacity%3D%220.38%22%20points%3D%227%2010%2012%2015%2017%2010%22%3E%3C%2Fpolygon%3E%0A%3C%2Fsvg%3E);
+  border-bottom: 1px dotted rgba(255, 255, 255, 0.38); }
+
+.mdc-select__menu .mdc-list-item {
+  font-family: Roboto, sans-serif;
+  -moz-osx-font-smoothing: grayscale;
+  -webkit-font-smoothing: antialiased;
+  font-size: 1rem;
+  font-weight: 400;
+  letter-spacing: 0.04em;
+  line-height: 1.75rem;
+  text-decoration: inherit;
+  text-transform: inherit;
+  /* @alternate */
+  color: rgba(0, 0, 0, 0.54);
+  color: var(--mdc-theme-text-secondary-on-light, rgba(0, 0, 0, 0.54)); }
+  .mdc-select__menu .mdc-list-item[aria-selected="true"] {
+    /* @alternate */
+    color: rgba(0, 0, 0, 0.87);
+    color: var(--mdc-theme-text-primary-on-light, rgba(0, 0, 0, 0.87)); }
+  .mdc-select--theme-dark .mdc-select__menu .mdc-list-item,
+  .mdc-theme--dark .mdc-select__menu .mdc-list-item {
+    /* @alternate */
+    color: rgba(255, 255, 255, 0.7);
+    color: var(--mdc-theme-text-secondary-on-dark, rgba(255, 255, 255, 0.7)); }
+    .mdc-select--theme-dark .mdc-select__menu .mdc-list-item[aria-selected="true"],
+    .mdc-theme--dark .mdc-select__menu .mdc-list-item[aria-selected="true"] {
+      /* @alternate */
+      color: white;
+      color: var(--mdc-theme-text-primary-on-dark, white); }
+
+.mdc-select__menu .mdc-list-group,
+.mdc-select__menu .mdc-list-group > .mdc-list-item:first-child {
+  margin-top: 12px; }
+
+.mdc-select__menu .mdc-list-group {
+  /* @alternate */
+  color: rgba(0, 0, 0, 0.38);
+  color: var(--mdc-theme-text-hint-on-light, rgba(0, 0, 0, 0.38));
+  font-weight: normal; }
+  .mdc-select__menu .mdc-list-group .mdc-list-item {
+    /* @alternate */
+    color: rgba(0, 0, 0, 0.87);
+    color: var(--mdc-theme-text-primary-on-light, rgba(0, 0, 0, 0.87)); }
+
+.mdc-select--theme-dark .mdc-select__menu .mdc-list-group,
+.mdc-theme--dark .mdc-select__menu .mdc-list-group {
+  /* @alternate */
+  color: rgba(255, 255, 255, 0.5);
+  color: var(--mdc-theme-text-hint-on-dark, rgba(255, 255, 255, 0.5)); }
+  .mdc-select--theme-dark .mdc-select__menu .mdc-list-group .mdc-list-item,
+  .mdc-theme--dark .mdc-select__menu .mdc-list-group .mdc-list-item {
+    /* @alternate */
+    color: white;
+    color: var(--mdc-theme-text-primary-on-dark, white); }
+
+.mdc-multi-select {
+  -webkit-appearance: none;
+     -moz-appearance: none;
+          appearance: none;
+  width: 250px;
+  padding: 0;
+  border: 1px solid;
+  /* @alternate */
+  border-color: rgba(0, 0, 0, 0.38);
+  border-color: var(--mdc-theme-text-hint-on-light, rgba(0, 0, 0, 0.38));
+  outline: none; }
+  .mdc-multi-select--theme-dark,
+  .mdc-theme--dark .mdc-multi-select {
+    /* @alternate */
+    border-color: rgba(255, 255, 255, 0.5);
+    border-color: var(--mdc-theme-text-hint-on-dark, rgba(255, 255, 255, 0.5)); }
+  .mdc-multi-select .mdc-list-group {
+    margin: 16px 0 0;
+    padding: 0 0 0 16px;
+    /* @alternate */
+    color: rgba(0, 0, 0, 0.38);
+    color: var(--mdc-theme-text-hint-on-light, rgba(0, 0, 0, 0.38));
+    font-weight: normal; }
+    .mdc-multi-select .mdc-list-group--theme-dark,
+    .mdc-theme--dark .mdc-multi-select .mdc-list-group {
+      /* @alternate */
+      color: rgba(255, 255, 255, 0.5);
+      color: var(--mdc-theme-text-hint-on-dark, rgba(255, 255, 255, 0.5)); }
+    .mdc-multi-select .mdc-list-group:last-child {
+      margin-bottom: 16px; }
+    .mdc-multi-select .mdc-list-group .mdc-list-divider {
+      margin-left: -16px; }
+  .mdc-multi-select .mdc-list-item {
+    margin: 0 0 0 -16px;
+    padding: 0 16px;
+    /* @alternate */
+    color: rgba(0, 0, 0, 0.87);
+    color: var(--mdc-theme-text-primary-on-light, rgba(0, 0, 0, 0.87)); }
+    .mdc-multi-select .mdc-list-item--theme-dark,
+    .mdc-theme--dark .mdc-multi-select .mdc-list-item {
+      /* @alternate */
+      color: white;
+      color: var(--mdc-theme-text-primary-on-dark, white); }
+    .mdc-multi-select .mdc-list-item:first-child {
+      margin-top: 12px; }
+    .mdc-multi-select .mdc-list-item:last-child {
+      margin-bottom: 8px; }
+  .mdc-multi-select .mdc-list-item:checked {
+    background-color: rgba(0, 0, 0, 0.12);
+    /* @alternate */
+    background-color: #fff;
+    background-color: var(--mdc-theme-background, #fff); }
+    .mdc-multi-select .mdc-list-item:checked--theme-dark,
+    .mdc-theme--dark .mdc-multi-select .mdc-list-item:checked {
+      /* @alternate */
+      background-color: white;
+      background-color: var(--mdc-theme-text-primary-on-dark, white); }
+  .mdc-multi-select .mdc-list-divider {
+    margin-bottom: 8px;
+    padding-top: 8px;
+    font-size: 0; }
+
+.mdc-multi-select:focus .mdc-list-item:checked {
+  /* @alternate */
+  background-color: #3f51b5;
+  background-color: var(--mdc-theme-primary, #3f51b5); }
+  .mdc-multi-select:focus .mdc-list-item:checked--theme-dark,
+  .mdc-theme--dark .mdc-multi-select:focus .mdc-list-item:checked {
+    /* @alternate */
+    background-color: white;
+    background-color: var(--mdc-theme-text-primary-on-dark, white); }

+ 83 - 0
support/client/lib/vwf/view/lib/mdc/dist/mdc.select.css-entry

@@ -0,0 +1,83 @@
+/*!
+ Material Components for the web
+ Copyright (c) 2017 Google Inc.
+ License: Apache-2.0
+*/
+/******/ (function(modules) { // webpackBootstrap
+/******/ 	// The module cache
+/******/ 	var installedModules = {};
+/******/
+/******/ 	// The require function
+/******/ 	function __webpack_require__(moduleId) {
+/******/
+/******/ 		// Check if module is in cache
+/******/ 		if(installedModules[moduleId]) {
+/******/ 			return installedModules[moduleId].exports;
+/******/ 		}
+/******/ 		// Create a new module (and put it into the cache)
+/******/ 		var module = installedModules[moduleId] = {
+/******/ 			i: moduleId,
+/******/ 			l: false,
+/******/ 			exports: {}
+/******/ 		};
+/******/
+/******/ 		// Execute the module function
+/******/ 		modules[moduleId].call(module.exports, module, module.exports, __webpack_require__);
+/******/
+/******/ 		// Flag the module as loaded
+/******/ 		module.l = true;
+/******/
+/******/ 		// Return the exports of the module
+/******/ 		return module.exports;
+/******/ 	}
+/******/
+/******/
+/******/ 	// expose the modules object (__webpack_modules__)
+/******/ 	__webpack_require__.m = modules;
+/******/
+/******/ 	// expose the module cache
+/******/ 	__webpack_require__.c = installedModules;
+/******/
+/******/ 	// identity function for calling harmony imports with the correct context
+/******/ 	__webpack_require__.i = function(value) { return value; };
+/******/
+/******/ 	// define getter function for harmony exports
+/******/ 	__webpack_require__.d = function(exports, name, getter) {
+/******/ 		if(!__webpack_require__.o(exports, name)) {
+/******/ 			Object.defineProperty(exports, name, {
+/******/ 				configurable: false,
+/******/ 				enumerable: true,
+/******/ 				get: getter
+/******/ 			});
+/******/ 		}
+/******/ 	};
+/******/
+/******/ 	// getDefaultExport function for compatibility with non-harmony modules
+/******/ 	__webpack_require__.n = function(module) {
+/******/ 		var getter = module && module.__esModule ?
+/******/ 			function getDefault() { return module['default']; } :
+/******/ 			function getModuleExports() { return module; };
+/******/ 		__webpack_require__.d(getter, 'a', getter);
+/******/ 		return getter;
+/******/ 	};
+/******/
+/******/ 	// Object.prototype.hasOwnProperty.call
+/******/ 	__webpack_require__.o = function(object, property) { return Object.prototype.hasOwnProperty.call(object, property); };
+/******/
+/******/ 	// __webpack_public_path__
+/******/ 	__webpack_require__.p = "/assets/";
+/******/
+/******/ 	// Load entry module and return exports
+/******/ 	return __webpack_require__(__webpack_require__.s = 18);
+/******/ })
+/************************************************************************/
+/******/ ({
+
+/***/ 18:
+/***/ (function(module, exports) {
+
+// removed by extract-text-webpack-plugin
+
+/***/ })
+
+/******/ });

+ 2458 - 0
support/client/lib/vwf/view/lib/mdc/dist/mdc.select.js

@@ -0,0 +1,2458 @@
+/*!
+ Material Components for the web
+ Copyright (c) 2017 Google Inc.
+ License: Apache-2.0
+*/
+(function webpackUniversalModuleDefinition(root, factory) {
+	if(typeof exports === 'object' && typeof module === 'object')
+		module.exports = factory();
+	else if(typeof define === 'function' && define.amd)
+		define([], factory);
+	else if(typeof exports === 'object')
+		exports["select"] = factory();
+	else
+		root["mdc"] = root["mdc"] || {}, root["mdc"]["select"] = factory();
+})(this, function() {
+return /******/ (function(modules) { // webpackBootstrap
+/******/ 	// The module cache
+/******/ 	var installedModules = {};
+/******/
+/******/ 	// The require function
+/******/ 	function __webpack_require__(moduleId) {
+/******/
+/******/ 		// Check if module is in cache
+/******/ 		if(installedModules[moduleId]) {
+/******/ 			return installedModules[moduleId].exports;
+/******/ 		}
+/******/ 		// Create a new module (and put it into the cache)
+/******/ 		var module = installedModules[moduleId] = {
+/******/ 			i: moduleId,
+/******/ 			l: false,
+/******/ 			exports: {}
+/******/ 		};
+/******/
+/******/ 		// Execute the module function
+/******/ 		modules[moduleId].call(module.exports, module, module.exports, __webpack_require__);
+/******/
+/******/ 		// Flag the module as loaded
+/******/ 		module.l = true;
+/******/
+/******/ 		// Return the exports of the module
+/******/ 		return module.exports;
+/******/ 	}
+/******/
+/******/
+/******/ 	// expose the modules object (__webpack_modules__)
+/******/ 	__webpack_require__.m = modules;
+/******/
+/******/ 	// expose the module cache
+/******/ 	__webpack_require__.c = installedModules;
+/******/
+/******/ 	// identity function for calling harmony imports with the correct context
+/******/ 	__webpack_require__.i = function(value) { return value; };
+/******/
+/******/ 	// define getter function for harmony exports
+/******/ 	__webpack_require__.d = function(exports, name, getter) {
+/******/ 		if(!__webpack_require__.o(exports, name)) {
+/******/ 			Object.defineProperty(exports, name, {
+/******/ 				configurable: false,
+/******/ 				enumerable: true,
+/******/ 				get: getter
+/******/ 			});
+/******/ 		}
+/******/ 	};
+/******/
+/******/ 	// getDefaultExport function for compatibility with non-harmony modules
+/******/ 	__webpack_require__.n = function(module) {
+/******/ 		var getter = module && module.__esModule ?
+/******/ 			function getDefault() { return module['default']; } :
+/******/ 			function getModuleExports() { return module; };
+/******/ 		__webpack_require__.d(getter, 'a', getter);
+/******/ 		return getter;
+/******/ 	};
+/******/
+/******/ 	// Object.prototype.hasOwnProperty.call
+/******/ 	__webpack_require__.o = function(object, property) { return Object.prototype.hasOwnProperty.call(object, property); };
+/******/
+/******/ 	// __webpack_public_path__
+/******/ 	__webpack_require__.p = "/assets/";
+/******/
+/******/ 	// Load entry module and return exports
+/******/ 	return __webpack_require__(__webpack_require__.s = 94);
+/******/ })
+/************************************************************************/
+/******/ ({
+
+/***/ 0:
+/***/ (function(module, __webpack_exports__, __webpack_require__) {
+
+"use strict";
+var _createClass = function () { function defineProperties(target, props) { for (var i = 0; i < props.length; i++) { var descriptor = props[i]; descriptor.enumerable = descriptor.enumerable || false; descriptor.configurable = true; if ("value" in descriptor) descriptor.writable = true; Object.defineProperty(target, descriptor.key, descriptor); } } return function (Constructor, protoProps, staticProps) { if (protoProps) defineProperties(Constructor.prototype, protoProps); if (staticProps) defineProperties(Constructor, staticProps); return Constructor; }; }();
+
+function _classCallCheck(instance, Constructor) { if (!(instance instanceof Constructor)) { throw new TypeError("Cannot call a class as a function"); } }
+
+/**
+ * Copyright 2016 Google Inc.
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *   http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+
+/**
+ * @template A
+ */
+var MDCFoundation = function () {
+  _createClass(MDCFoundation, null, [{
+    key: "cssClasses",
+
+    /** @return enum{cssClasses} */
+    get: function get() {
+      // Classes extending MDCFoundation should implement this method to return an object which exports every
+      // CSS class the foundation class needs as a property. e.g. {ACTIVE: 'mdc-component--active'}
+      return {};
+    }
+
+    /** @return enum{strings} */
+
+  }, {
+    key: "strings",
+    get: function get() {
+      // Classes extending MDCFoundation should implement this method to return an object which exports all
+      // semantic strings as constants. e.g. {ARIA_ROLE: 'tablist'}
+      return {};
+    }
+
+    /** @return enum{numbers} */
+
+  }, {
+    key: "numbers",
+    get: function get() {
+      // Classes extending MDCFoundation should implement this method to return an object which exports all
+      // of its semantic numbers as constants. e.g. {ANIMATION_DELAY_MS: 350}
+      return {};
+    }
+
+    /** @return {!Object} */
+
+  }, {
+    key: "defaultAdapter",
+    get: function get() {
+      // Classes extending MDCFoundation may choose to implement this getter in order to provide a convenient
+      // way of viewing the necessary methods of an adapter. In the future, this could also be used for adapter
+      // validation.
+      return {};
+    }
+
+    /**
+     * @param {A=} adapter
+     */
+
+  }]);
+
+  function MDCFoundation() {
+    var adapter = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : {};
+
+    _classCallCheck(this, MDCFoundation);
+
+    /** @protected {!A} */
+    this.adapter_ = adapter;
+  }
+
+  _createClass(MDCFoundation, [{
+    key: "init",
+    value: function init() {
+      // Subclasses should override this method to perform initialization routines (registering events, etc.)
+    }
+  }, {
+    key: "destroy",
+    value: function destroy() {
+      // Subclasses should override this method to perform de-initialization routines (de-registering events, etc.)
+    }
+  }]);
+
+  return MDCFoundation;
+}();
+
+/* harmony default export */ __webpack_exports__["a"] = (MDCFoundation);
+
+/***/ }),
+
+/***/ 1:
+/***/ (function(module, __webpack_exports__, __webpack_require__) {
+
+"use strict";
+/* harmony import */ var __WEBPACK_IMPORTED_MODULE_0__foundation__ = __webpack_require__(0);
+var _createClass = function () { function defineProperties(target, props) { for (var i = 0; i < props.length; i++) { var descriptor = props[i]; descriptor.enumerable = descriptor.enumerable || false; descriptor.configurable = true; if ("value" in descriptor) descriptor.writable = true; Object.defineProperty(target, descriptor.key, descriptor); } } return function (Constructor, protoProps, staticProps) { if (protoProps) defineProperties(Constructor.prototype, protoProps); if (staticProps) defineProperties(Constructor, staticProps); return Constructor; }; }();
+
+function _classCallCheck(instance, Constructor) { if (!(instance instanceof Constructor)) { throw new TypeError("Cannot call a class as a function"); } }
+
+/**
+ * Copyright 2016 Google Inc.
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *   http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+
+
+
+/**
+ * @template F
+ */
+
+var MDCComponent = function () {
+  _createClass(MDCComponent, null, [{
+    key: 'attachTo',
+
+    /**
+     * @param {!Element} root
+     * @return {!MDCComponent}
+     */
+    value: function attachTo(root) {
+      // Subclasses which extend MDCBase should provide an attachTo() method that takes a root element and
+      // returns an instantiated component with its root set to that element. Also note that in the cases of
+      // subclasses, an explicit foundation class will not have to be passed in; it will simply be initialized
+      // from getDefaultFoundation().
+      return new MDCComponent(root, new __WEBPACK_IMPORTED_MODULE_0__foundation__["a" /* default */]());
+    }
+
+    /**
+     * @param {!Element} root
+     * @param {F=} foundation
+     * @param {...?} args
+     */
+
+  }]);
+
+  function MDCComponent(root) {
+    var foundation = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : undefined;
+
+    _classCallCheck(this, MDCComponent);
+
+    /** @protected {!Element} */
+    this.root_ = root;
+
+    for (var _len = arguments.length, args = Array(_len > 2 ? _len - 2 : 0), _key = 2; _key < _len; _key++) {
+      args[_key - 2] = arguments[_key];
+    }
+
+    this.initialize.apply(this, args);
+    // Note that we initialize foundation here and not within the constructor's default param so that
+    // this.root_ is defined and can be used within the foundation class.
+    /** @protected {!F} */
+    this.foundation_ = foundation === undefined ? this.getDefaultFoundation() : foundation;
+    this.foundation_.init();
+    this.initialSyncWithDOM();
+  }
+
+  _createClass(MDCComponent, [{
+    key: 'initialize',
+    value: function initialize() /* ...args */{}
+    // Subclasses can override this to do any additional setup work that would be considered part of a
+    // "constructor". Essentially, it is a hook into the parent constructor before the foundation is
+    // initialized. Any additional arguments besides root and foundation will be passed in here.
+
+
+    /**
+     * @return {!F} foundation
+     */
+
+  }, {
+    key: 'getDefaultFoundation',
+    value: function getDefaultFoundation() {
+      // Subclasses must override this method to return a properly configured foundation class for the
+      // component.
+      throw new Error('Subclasses must override getDefaultFoundation to return a properly configured ' + 'foundation class');
+    }
+  }, {
+    key: 'initialSyncWithDOM',
+    value: function initialSyncWithDOM() {
+      // Subclasses should override this method if they need to perform work to synchronize with a host DOM
+      // object. An example of this would be a form control wrapper that needs to synchronize its internal state
+      // to some property or attribute of the host DOM. Please note: this is *not* the place to perform DOM
+      // reads/writes that would cause layout / paint, as this is called synchronously from within the constructor.
+    }
+  }, {
+    key: 'destroy',
+    value: function destroy() {
+      // Subclasses may implement this method to release any resources / deregister any listeners they have
+      // attached. An example of this might be deregistering a resize event from the window object.
+      this.foundation_.destroy();
+    }
+
+    /**
+     * Wrapper method to add an event listener to the component's root element. This is most useful when
+     * listening for custom events.
+     * @param {string} evtType
+     * @param {!Function} handler
+     */
+
+  }, {
+    key: 'listen',
+    value: function listen(evtType, handler) {
+      this.root_.addEventListener(evtType, handler);
+    }
+
+    /**
+     * Wrapper method to remove an event listener to the component's root element. This is most useful when
+     * unlistening for custom events.
+     * @param {string} evtType
+     * @param {!Function} handler
+     */
+
+  }, {
+    key: 'unlisten',
+    value: function unlisten(evtType, handler) {
+      this.root_.removeEventListener(evtType, handler);
+    }
+
+    /**
+     * Fires a cross-browser-compatible custom event from the component root of the given type,
+     * with the given data.
+     * @param {string} evtType
+     * @param {!Object} evtData
+     * @param {boolean=} shouldBubble
+     */
+
+  }, {
+    key: 'emit',
+    value: function emit(evtType, evtData) {
+      var shouldBubble = arguments.length > 2 && arguments[2] !== undefined ? arguments[2] : false;
+
+      var evt = void 0;
+      if (typeof CustomEvent === 'function') {
+        evt = new CustomEvent(evtType, {
+          detail: evtData,
+          bubbles: shouldBubble
+        });
+      } else {
+        evt = document.createEvent('CustomEvent');
+        evt.initCustomEvent(evtType, shouldBubble, false, evtData);
+      }
+
+      this.root_.dispatchEvent(evt);
+    }
+  }]);
+
+  return MDCComponent;
+}();
+
+/* harmony default export */ __webpack_exports__["a"] = (MDCComponent);
+
+/***/ }),
+
+/***/ 10:
+/***/ (function(module, __webpack_exports__, __webpack_require__) {
+
+"use strict";
+Object.defineProperty(__webpack_exports__, "__esModule", { value: true });
+/* harmony export (immutable) */ __webpack_exports__["getTransformPropertyName"] = getTransformPropertyName;
+/* harmony export (immutable) */ __webpack_exports__["clamp"] = clamp;
+/* harmony export (immutable) */ __webpack_exports__["bezierProgress"] = bezierProgress;
+/**
+ * Copyright 2016 Google Inc. All Rights Reserved.
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *      http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+
+/** @type {string|undefined} */
+var storedTransformPropertyName_ = void 0;
+
+/**
+ * Returns the name of the correct transform property to use on the current browser.
+ * @param {!Window} globalObj
+ * @param {boolean=} forceRefresh
+ * @return {string}
+ */
+function getTransformPropertyName(globalObj) {
+  var forceRefresh = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : false;
+
+  if (storedTransformPropertyName_ === undefined || forceRefresh) {
+    var el = globalObj.document.createElement('div');
+    var transformPropertyName = 'transform' in el.style ? 'transform' : 'webkitTransform';
+    storedTransformPropertyName_ = transformPropertyName;
+  }
+
+  return storedTransformPropertyName_;
+}
+
+/**
+ * Clamps a value between the minimum and the maximum, returning the clamped value.
+ * @param {number} value
+ * @param {number} min
+ * @param {number} max
+ * @return {number}
+ */
+function clamp(value) {
+  var min = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : 0;
+  var max = arguments.length > 2 && arguments[2] !== undefined ? arguments[2] : 1;
+
+  return Math.min(max, Math.max(min, value));
+}
+
+/**
+ * Returns the easing value to apply at time t, for a given cubic bezier curve.
+ * Control points P0 and P3 are assumed to be (0,0) and (1,1), respectively.
+ * Parameters are as follows:
+ * - time: The current time in the animation, scaled between 0 and 1.
+ * - x1: The x value of control point P1.
+ * - y1: The y value of control point P1.
+ * - x2: The x value of control point P2.
+ * - y2: The y value of control point P2.
+ * @param {number} time
+ * @param {number} x1
+ * @param {number} y1
+ * @param {number} x2
+ * @param {number} y2
+ * @return {number}
+ */
+function bezierProgress(time, x1, y1, x2, y2) {
+  return getBezierCoordinate_(solvePositionFromXValue_(time, x1, x2), y1, y2);
+}
+
+/**
+ * Compute a single coordinate at a position point between 0 and 1.
+ * c1 and c2 are the matching coordinate on control points P1 and P2, respectively.
+ * Control points P0 and P3 are assumed to be (0,0) and (1,1), respectively.
+ * Adapted from https://github.com/google/closure-library/blob/master/closure/goog/math/bezier.js.
+ * @param {number} t
+ * @param {number} c1
+ * @param {number} c2
+ * @return {number}
+ */
+function getBezierCoordinate_(t, c1, c2) {
+  // Special case start and end.
+  if (t === 0 || t === 1) {
+    return t;
+  }
+
+  // Step one - from 4 points to 3
+  var ic0 = t * c1;
+  var ic1 = c1 + t * (c2 - c1);
+  var ic2 = c2 + t * (1 - c2);
+
+  // Step two - from 3 points to 2
+  ic0 += t * (ic1 - ic0);
+  ic1 += t * (ic2 - ic1);
+
+  // Final step - last point
+  return ic0 + t * (ic1 - ic0);
+}
+
+/**
+ * Project a point onto the Bezier curve, from a given X. Calculates the position t along the curve.
+ * Adapted from https://github.com/google/closure-library/blob/master/closure/goog/math/bezier.js.
+ * @param {number} xVal
+ * @param {number} x1
+ * @param {number} x2
+ * @return {number}
+ */
+function solvePositionFromXValue_(xVal, x1, x2) {
+  var EPSILON = 1e-6;
+  var MAX_ITERATIONS = 8;
+
+  if (xVal <= 0) {
+    return 0;
+  } else if (xVal >= 1) {
+    return 1;
+  }
+
+  // Initial estimate of t using linear interpolation.
+  var t = xVal;
+
+  // Try gradient descent to solve for t. If it works, it is very fast.
+  var tMin = 0;
+  var tMax = 1;
+  var value = 0;
+  for (var i = 0; i < MAX_ITERATIONS; i++) {
+    value = getBezierCoordinate_(t, x1, x2);
+    var derivative = (getBezierCoordinate_(t + EPSILON, x1, x2) - value) / EPSILON;
+    if (Math.abs(value - xVal) < EPSILON) {
+      return t;
+    } else if (Math.abs(derivative) < EPSILON) {
+      break;
+    } else {
+      if (value < xVal) {
+        tMin = t;
+      } else {
+        tMax = t;
+      }
+      t -= (value - xVal) / derivative;
+    }
+  }
+
+  // If the gradient descent got stuck in a local minimum, e.g. because
+  // the derivative was close to 0, use a Dichotomy refinement instead.
+  // We limit the number of interations to 8.
+  for (var _i = 0; Math.abs(value - xVal) > EPSILON && _i < MAX_ITERATIONS; _i++) {
+    if (value < xVal) {
+      tMin = t;
+      t = (t + tMax) / 2;
+    } else {
+      tMax = t;
+      t = (t + tMin) / 2;
+    }
+    value = getBezierCoordinate_(t, x1, x2);
+  }
+  return t;
+}
+
+/***/ }),
+
+/***/ 11:
+/***/ (function(module, __webpack_exports__, __webpack_require__) {
+
+"use strict";
+Object.defineProperty(__webpack_exports__, "__esModule", { value: true });
+/* harmony import */ var __WEBPACK_IMPORTED_MODULE_0__util__ = __webpack_require__(10);
+/* harmony import */ var __WEBPACK_IMPORTED_MODULE_1__simple__ = __webpack_require__(17);
+/* harmony reexport (binding) */ __webpack_require__.d(__webpack_exports__, "MDCSimpleMenu", function() { return __WEBPACK_IMPORTED_MODULE_1__simple__["a"]; });
+/* harmony reexport (binding) */ __webpack_require__.d(__webpack_exports__, "MDCSimpleMenuFoundation", function() { return __WEBPACK_IMPORTED_MODULE_1__simple__["b"]; });
+/* harmony reexport (module object) */ __webpack_require__.d(__webpack_exports__, "util", function() { return __WEBPACK_IMPORTED_MODULE_0__util__; });
+/**
+ * Copyright 2016 Google Inc. All Rights Reserved.
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *      http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+
+
+
+
+
+/***/ }),
+
+/***/ 14:
+/***/ (function(module, __webpack_exports__, __webpack_require__) {
+
+"use strict";
+var _createClass = function () { function defineProperties(target, props) { for (var i = 0; i < props.length; i++) { var descriptor = props[i]; descriptor.enumerable = descriptor.enumerable || false; descriptor.configurable = true; if ("value" in descriptor) descriptor.writable = true; Object.defineProperty(target, descriptor.key, descriptor); } } return function (Constructor, protoProps, staticProps) { if (protoProps) defineProperties(Constructor.prototype, protoProps); if (staticProps) defineProperties(Constructor, staticProps); return Constructor; }; }();
+
+function _classCallCheck(instance, Constructor) { if (!(instance instanceof Constructor)) { throw new TypeError("Cannot call a class as a function"); } }
+
+/**
+ * Copyright 2016 Google Inc. All Rights Reserved.
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *      http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+
+/* eslint no-unused-vars: [2, {"args": "none"}] */
+
+/**
+ * Adapter for MDC Simple Menu. Provides an interface for managing
+ * - classes
+ * - dom
+ * - focus
+ * - position
+ * - dimensions
+ * - event handlers
+ *
+ * Additionally, provides type information for the adapter to the Closure
+ * compiler.
+ *
+ * Implement this adapter for your framework of choice to delegate updates to
+ * the component in your framework of choice. See architecture documentation
+ * for more details.
+ * https://github.com/material-components/material-components-web/blob/master/docs/architecture.md
+ *
+ * @record
+ */
+var MDCSimpleMenuAdapter = function () {
+  function MDCSimpleMenuAdapter() {
+    _classCallCheck(this, MDCSimpleMenuAdapter);
+  }
+
+  _createClass(MDCSimpleMenuAdapter, [{
+    key: "addClass",
+
+    /** @param {string} className */
+    value: function addClass(className) {}
+
+    /** @param {string} className */
+
+  }, {
+    key: "removeClass",
+    value: function removeClass(className) {}
+
+    /**
+     * @param {string} className
+     * @return {boolean}
+     */
+
+  }, {
+    key: "hasClass",
+    value: function hasClass(className) {}
+
+    /** @return {boolean} */
+
+  }, {
+    key: "hasNecessaryDom",
+    value: function hasNecessaryDom() {}
+
+    /**
+     * @param {EventTarget} target
+     * @param {string} attributeName
+     * @return {string}
+     */
+
+  }, {
+    key: "getAttributeForEventTarget",
+    value: function getAttributeForEventTarget(target, attributeName) {}
+
+    /** @return {{ width: number, height: number }} */
+
+  }, {
+    key: "getInnerDimensions",
+    value: function getInnerDimensions() {}
+
+    /** @return {boolean} */
+
+  }, {
+    key: "hasAnchor",
+    value: function hasAnchor() {}
+
+    /** @return {{width: number, height: number, top: number, right: number, bottom: number, left: number}} */
+
+  }, {
+    key: "getAnchorDimensions",
+    value: function getAnchorDimensions() {}
+
+    /** @return {{ width: number, height: number }} */
+
+  }, {
+    key: "getWindowDimensions",
+    value: function getWindowDimensions() {}
+
+    /**
+     * @param {number} x
+     * @param {number} y
+     */
+
+  }, {
+    key: "setScale",
+    value: function setScale(x, y) {}
+
+    /**
+     * @param {number} x
+     * @param {number} y
+     */
+
+  }, {
+    key: "setInnerScale",
+    value: function setInnerScale(x, y) {}
+
+    /** @return {number} */
+
+  }, {
+    key: "getNumberOfItems",
+    value: function getNumberOfItems() {}
+
+    /**
+     * @param {string} type
+     * @param {function(!Event)} handler
+     */
+
+  }, {
+    key: "registerInteractionHandler",
+    value: function registerInteractionHandler(type, handler) {}
+
+    /**
+     * @param {string} type
+     * @param {function(!Event)} handler
+     */
+
+  }, {
+    key: "deregisterInteractionHandler",
+    value: function deregisterInteractionHandler(type, handler) {}
+
+    /** @param {function(!Event)} handler */
+
+  }, {
+    key: "registerBodyClickHandler",
+    value: function registerBodyClickHandler(handler) {}
+
+    /** @param {function(!Event)} handler */
+
+  }, {
+    key: "deregisterBodyClickHandler",
+    value: function deregisterBodyClickHandler(handler) {}
+
+    /**
+     * @param {number} index
+     * @return {{top: number, height: number}}
+     */
+
+  }, {
+    key: "getYParamsForItemAtIndex",
+    value: function getYParamsForItemAtIndex(index) {}
+
+    /**
+     * @param {number} index
+     * @param {string|null} value
+     */
+
+  }, {
+    key: "setTransitionDelayForItemAtIndex",
+    value: function setTransitionDelayForItemAtIndex(index, value) {}
+
+    /**
+     * @param {EventTarget} target
+     * @return {number}
+     */
+
+  }, {
+    key: "getIndexForEventTarget",
+    value: function getIndexForEventTarget(target) {}
+
+    /** @param {{index: number}} evtData */
+
+  }, {
+    key: "notifySelected",
+    value: function notifySelected(evtData) {}
+  }, {
+    key: "notifyCancel",
+    value: function notifyCancel() {}
+  }, {
+    key: "saveFocus",
+    value: function saveFocus() {}
+  }, {
+    key: "restoreFocus",
+    value: function restoreFocus() {}
+
+    /** @return {boolean} */
+
+  }, {
+    key: "isFocused",
+    value: function isFocused() {}
+  }, {
+    key: "focus",
+    value: function focus() {}
+
+    /** @return {number} */
+
+  }, {
+    key: "getFocusedItemIndex",
+    value: function getFocusedItemIndex() /* number */{}
+
+    /** @param {number} index */
+
+  }, {
+    key: "focusItemAtIndex",
+    value: function focusItemAtIndex(index) {}
+
+    /** @return {boolean} */
+
+  }, {
+    key: "isRtl",
+    value: function isRtl() {}
+
+    /** @param {string} origin */
+
+  }, {
+    key: "setTransformOrigin",
+    value: function setTransformOrigin(origin) {}
+
+    /** @param {{
+    *   top: (string|undefined),
+    *   right: (string|undefined),
+    *   bottom: (string|undefined),
+    *   left: (string|undefined)
+    * }} position */
+
+  }, {
+    key: "setPosition",
+    value: function setPosition(position) {}
+
+    /** @return {number} */
+
+  }, {
+    key: "getAccurateTime",
+    value: function getAccurateTime() {}
+  }]);
+
+  return MDCSimpleMenuAdapter;
+}();
+
+/* unused harmony default export */ var _unused_webpack_default_export = (MDCSimpleMenuAdapter);
+
+/***/ }),
+
+/***/ 15:
+/***/ (function(module, __webpack_exports__, __webpack_require__) {
+
+"use strict";
+/* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, "a", function() { return cssClasses; });
+/* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, "b", function() { return strings; });
+/* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, "c", function() { return numbers; });
+/**
+ * Copyright 2016 Google Inc. All Rights Reserved.
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *      http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+
+/** @enum {string} */
+var cssClasses = {
+  ROOT: 'mdc-simple-menu',
+  OPEN: 'mdc-simple-menu--open',
+  ANIMATING: 'mdc-simple-menu--animating',
+  TOP_RIGHT: 'mdc-simple-menu--open-from-top-right',
+  BOTTOM_LEFT: 'mdc-simple-menu--open-from-bottom-left',
+  BOTTOM_RIGHT: 'mdc-simple-menu--open-from-bottom-right'
+};
+
+/** @enum {string} */
+var strings = {
+  ITEMS_SELECTOR: '.mdc-simple-menu__items',
+  SELECTED_EVENT: 'MDCSimpleMenu:selected',
+  CANCEL_EVENT: 'MDCSimpleMenu:cancel',
+  ARIA_DISABLED_ATTR: 'aria-disabled'
+};
+
+/** @enum {number} */
+var numbers = {
+  // Amount of time to wait before triggering a selected event on the menu. Note that this time
+  // will most likely be bumped up once interactive lists are supported to allow for the ripple to
+  // animate before closing the menu
+  SELECTED_TRIGGER_DELAY: 50,
+  // Total duration of the menu animation.
+  TRANSITION_DURATION_MS: 300,
+  // The menu starts its open animation with the X axis at this time value (0 - 1).
+  TRANSITION_SCALE_ADJUSTMENT_X: 0.5,
+  // The time value the menu waits until the animation starts on the Y axis (0 - 1).
+  TRANSITION_SCALE_ADJUSTMENT_Y: 0.2,
+  // The cubic bezier control points for the animation (cubic-bezier(0, 0, 0.2, 1)).
+  TRANSITION_X1: 0,
+  TRANSITION_Y1: 0,
+  TRANSITION_X2: 0.2,
+  TRANSITION_Y2: 1
+};
+
+/***/ }),
+
+/***/ 16:
+/***/ (function(module, __webpack_exports__, __webpack_require__) {
+
+"use strict";
+/* harmony import */ var __WEBPACK_IMPORTED_MODULE_0__material_base_foundation__ = __webpack_require__(0);
+/* harmony import */ var __WEBPACK_IMPORTED_MODULE_1__adapter__ = __webpack_require__(14);
+/* harmony import */ var __WEBPACK_IMPORTED_MODULE_2__constants__ = __webpack_require__(15);
+/* harmony import */ var __WEBPACK_IMPORTED_MODULE_3__util__ = __webpack_require__(10);
+var _extends = Object.assign || function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; };
+
+var _createClass = function () { function defineProperties(target, props) { for (var i = 0; i < props.length; i++) { var descriptor = props[i]; descriptor.enumerable = descriptor.enumerable || false; descriptor.configurable = true; if ("value" in descriptor) descriptor.writable = true; Object.defineProperty(target, descriptor.key, descriptor); } } return function (Constructor, protoProps, staticProps) { if (protoProps) defineProperties(Constructor.prototype, protoProps); if (staticProps) defineProperties(Constructor, staticProps); return Constructor; }; }();
+
+function _defineProperty(obj, key, value) { if (key in obj) { Object.defineProperty(obj, key, { value: value, enumerable: true, configurable: true, writable: true }); } else { obj[key] = value; } return obj; }
+
+function _classCallCheck(instance, Constructor) { if (!(instance instanceof Constructor)) { throw new TypeError("Cannot call a class as a function"); } }
+
+function _possibleConstructorReturn(self, call) { if (!self) { throw new ReferenceError("this hasn't been initialised - super() hasn't been called"); } return call && (typeof call === "object" || typeof call === "function") ? call : self; }
+
+function _inherits(subClass, superClass) { if (typeof superClass !== "function" && superClass !== null) { throw new TypeError("Super expression must either be null or a function, not " + typeof superClass); } subClass.prototype = Object.create(superClass && superClass.prototype, { constructor: { value: subClass, enumerable: false, writable: true, configurable: true } }); if (superClass) Object.setPrototypeOf ? Object.setPrototypeOf(subClass, superClass) : subClass.__proto__ = superClass; }
+
+/**
+ * Copyright 2016 Google Inc. All Rights Reserved.
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *      http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+
+
+
+
+
+
+/**
+ * @extends {MDCFoundation<!MDCSimpleMenuAdapter>}
+ */
+
+var MDCSimpleMenuFoundation = function (_MDCFoundation) {
+  _inherits(MDCSimpleMenuFoundation, _MDCFoundation);
+
+  _createClass(MDCSimpleMenuFoundation, null, [{
+    key: 'cssClasses',
+
+    /** @return enum{cssClasses} */
+    get: function get() {
+      return __WEBPACK_IMPORTED_MODULE_2__constants__["a" /* cssClasses */];
+    }
+
+    /** @return enum{strings} */
+
+  }, {
+    key: 'strings',
+    get: function get() {
+      return __WEBPACK_IMPORTED_MODULE_2__constants__["b" /* strings */];
+    }
+
+    /** @return enum{numbers} */
+
+  }, {
+    key: 'numbers',
+    get: function get() {
+      return __WEBPACK_IMPORTED_MODULE_2__constants__["c" /* numbers */];
+    }
+
+    /**
+     * {@see MDCSimpleMenuAdapter} for typing information on parameters and return
+     * types.
+     * @return {!MDCSimpleMenuAdapter}
+     */
+
+  }, {
+    key: 'defaultAdapter',
+    get: function get() {
+      return (/** @type {!MDCSimpleMenuAdapter} */{
+          addClass: function addClass() {},
+          removeClass: function removeClass() {},
+          hasClass: function hasClass() {
+            return false;
+          },
+          hasNecessaryDom: function hasNecessaryDom() {
+            return false;
+          },
+          getAttributeForEventTarget: function getAttributeForEventTarget() {},
+          getInnerDimensions: function getInnerDimensions() {
+            return {};
+          },
+          hasAnchor: function hasAnchor() {
+            return false;
+          },
+          getAnchorDimensions: function getAnchorDimensions() {
+            return {};
+          },
+          getWindowDimensions: function getWindowDimensions() {
+            return {};
+          },
+          setScale: function setScale() {},
+          setInnerScale: function setInnerScale() {},
+          getNumberOfItems: function getNumberOfItems() {
+            return 0;
+          },
+          registerInteractionHandler: function registerInteractionHandler() {},
+          deregisterInteractionHandler: function deregisterInteractionHandler() {},
+          registerBodyClickHandler: function registerBodyClickHandler() {},
+          deregisterBodyClickHandler: function deregisterBodyClickHandler() {},
+          getYParamsForItemAtIndex: function getYParamsForItemAtIndex() {
+            return {};
+          },
+          setTransitionDelayForItemAtIndex: function setTransitionDelayForItemAtIndex() {},
+          getIndexForEventTarget: function getIndexForEventTarget() {
+            return 0;
+          },
+          notifySelected: function notifySelected() {},
+          notifyCancel: function notifyCancel() {},
+          saveFocus: function saveFocus() {},
+          restoreFocus: function restoreFocus() {},
+          isFocused: function isFocused() {
+            return false;
+          },
+          focus: function focus() {},
+          getFocusedItemIndex: function getFocusedItemIndex() {
+            return -1;
+          },
+          focusItemAtIndex: function focusItemAtIndex() {},
+          isRtl: function isRtl() {
+            return false;
+          },
+          setTransformOrigin: function setTransformOrigin() {},
+          setPosition: function setPosition() {},
+          getAccurateTime: function getAccurateTime() {
+            return 0;
+          }
+        }
+      );
+    }
+
+    /** @param {!MDCSimpleMenuAdapter} adapter */
+
+  }]);
+
+  function MDCSimpleMenuFoundation(adapter) {
+    _classCallCheck(this, MDCSimpleMenuFoundation);
+
+    /** @private {function(!Event)} */
+    var _this = _possibleConstructorReturn(this, (MDCSimpleMenuFoundation.__proto__ || Object.getPrototypeOf(MDCSimpleMenuFoundation)).call(this, _extends(MDCSimpleMenuFoundation.defaultAdapter, adapter)));
+
+    _this.clickHandler_ = function (evt) {
+      return _this.handlePossibleSelected_(evt);
+    };
+    /** @private {function(!Event)} */
+    _this.keydownHandler_ = function (evt) {
+      return _this.handleKeyboardDown_(evt);
+    };
+    /** @private {function(!Event)} */
+    _this.keyupHandler_ = function (evt) {
+      return _this.handleKeyboardUp_(evt);
+    };
+    /** @private {function(!Event)} */
+    _this.documentClickHandler_ = function (evt) {
+      _this.adapter_.notifyCancel();
+      _this.close(evt);
+    };
+    /** @private {boolean} */
+    _this.isOpen_ = false;
+    /** @private {number} */
+    _this.startScaleX_ = 0;
+    /** @private {number} */
+    _this.startScaleY_ = 0;
+    /** @private {number} */
+    _this.targetScale_ = 1;
+    /** @private {number} */
+    _this.scaleX_ = 0;
+    /** @private {number} */
+    _this.scaleY_ = 0;
+    /** @private {boolean} */
+    _this.running_ = false;
+    /** @private {number} */
+    _this.selectedTriggerTimerId_ = 0;
+    /** @private {number} */
+    _this.animationRequestId_ = 0;
+    /** @private {!{ width: number, height: number }} */
+    _this.dimensions_;
+    /** @private {number} */
+    _this.startTime_;
+    /** @private {number} */
+    _this.itemHeight_;
+    return _this;
+  }
+
+  _createClass(MDCSimpleMenuFoundation, [{
+    key: 'init',
+    value: function init() {
+      var _MDCSimpleMenuFoundat = MDCSimpleMenuFoundation.cssClasses,
+          ROOT = _MDCSimpleMenuFoundat.ROOT,
+          OPEN = _MDCSimpleMenuFoundat.OPEN;
+
+
+      if (!this.adapter_.hasClass(ROOT)) {
+        throw new Error(ROOT + ' class required in root element.');
+      }
+
+      if (!this.adapter_.hasNecessaryDom()) {
+        throw new Error('Required DOM nodes missing in ' + ROOT + ' component.');
+      }
+
+      if (this.adapter_.hasClass(OPEN)) {
+        this.isOpen_ = true;
+      }
+
+      this.adapter_.registerInteractionHandler('click', this.clickHandler_);
+      this.adapter_.registerInteractionHandler('keyup', this.keyupHandler_);
+      this.adapter_.registerInteractionHandler('keydown', this.keydownHandler_);
+    }
+  }, {
+    key: 'destroy',
+    value: function destroy() {
+      clearTimeout(this.selectedTriggerTimerId_);
+      // Cancel any currently running animations.
+      cancelAnimationFrame(this.animationRequestId_);
+      this.adapter_.deregisterInteractionHandler('click', this.clickHandler_);
+      this.adapter_.deregisterInteractionHandler('keyup', this.keyupHandler_);
+      this.adapter_.deregisterInteractionHandler('keydown', this.keydownHandler_);
+      this.adapter_.deregisterBodyClickHandler(this.documentClickHandler_);
+    }
+
+    /**
+     * Calculates transition delays for individual menu items, so that they fade in one at a time.
+     * @private
+     */
+
+  }, {
+    key: 'applyTransitionDelays_',
+    value: function applyTransitionDelays_() {
+      var _MDCSimpleMenuFoundat2 = MDCSimpleMenuFoundation.cssClasses,
+          BOTTOM_LEFT = _MDCSimpleMenuFoundat2.BOTTOM_LEFT,
+          BOTTOM_RIGHT = _MDCSimpleMenuFoundat2.BOTTOM_RIGHT;
+
+      var numItems = this.adapter_.getNumberOfItems();
+      var height = this.dimensions_.height;
+
+      var transitionDuration = MDCSimpleMenuFoundation.numbers.TRANSITION_DURATION_MS / 1000;
+      var start = MDCSimpleMenuFoundation.numbers.TRANSITION_SCALE_ADJUSTMENT_Y;
+
+      for (var index = 0; index < numItems; index++) {
+        var _adapter_$getYParamsF = this.adapter_.getYParamsForItemAtIndex(index),
+            itemTop = _adapter_$getYParamsF.top,
+            itemHeight = _adapter_$getYParamsF.height;
+
+        this.itemHeight_ = itemHeight;
+        var itemDelayFraction = itemTop / height;
+        if (this.adapter_.hasClass(BOTTOM_LEFT) || this.adapter_.hasClass(BOTTOM_RIGHT)) {
+          itemDelayFraction = (height - itemTop - itemHeight) / height;
+        }
+        var itemDelay = (start + itemDelayFraction * (1 - start)) * transitionDuration;
+        // Use toFixed() here to normalize CSS unit precision across browsers
+        this.adapter_.setTransitionDelayForItemAtIndex(index, itemDelay.toFixed(3) + 's');
+      }
+    }
+
+    /**
+     * Removes transition delays from menu items.
+     * @private
+     */
+
+  }, {
+    key: 'removeTransitionDelays_',
+    value: function removeTransitionDelays_() {
+      var numItems = this.adapter_.getNumberOfItems();
+      for (var i = 0; i < numItems; i++) {
+        this.adapter_.setTransitionDelayForItemAtIndex(i, null);
+      }
+    }
+
+    /**
+     * Animates menu opening or closing.
+     * @private
+     */
+
+  }, {
+    key: 'animationLoop_',
+    value: function animationLoop_() {
+      var _this2 = this;
+
+      var time = this.adapter_.getAccurateTime();
+      var _MDCSimpleMenuFoundat3 = MDCSimpleMenuFoundation.numbers,
+          TRANSITION_DURATION_MS = _MDCSimpleMenuFoundat3.TRANSITION_DURATION_MS,
+          TRANSITION_X1 = _MDCSimpleMenuFoundat3.TRANSITION_X1,
+          TRANSITION_Y1 = _MDCSimpleMenuFoundat3.TRANSITION_Y1,
+          TRANSITION_X2 = _MDCSimpleMenuFoundat3.TRANSITION_X2,
+          TRANSITION_Y2 = _MDCSimpleMenuFoundat3.TRANSITION_Y2,
+          TRANSITION_SCALE_ADJUSTMENT_X = _MDCSimpleMenuFoundat3.TRANSITION_SCALE_ADJUSTMENT_X,
+          TRANSITION_SCALE_ADJUSTMENT_Y = _MDCSimpleMenuFoundat3.TRANSITION_SCALE_ADJUSTMENT_Y;
+
+      var currentTime = __webpack_require__.i(__WEBPACK_IMPORTED_MODULE_3__util__["clamp"])((time - this.startTime_) / TRANSITION_DURATION_MS);
+
+      // Animate X axis very slowly, so that only the Y axis animation is visible during fade-out.
+      var currentTimeX = __webpack_require__.i(__WEBPACK_IMPORTED_MODULE_3__util__["clamp"])((currentTime - TRANSITION_SCALE_ADJUSTMENT_X) / (1 - TRANSITION_SCALE_ADJUSTMENT_X));
+      // No time-shifting on the Y axis when closing.
+      var currentTimeY = currentTime;
+
+      var startScaleY = this.startScaleY_;
+      if (this.targetScale_ === 1) {
+        // Start with the menu at the height of a single item.
+        if (this.itemHeight_) {
+          startScaleY = Math.max(this.itemHeight_ / this.dimensions_.height, startScaleY);
+        }
+        // X axis moves faster, so time-shift forward.
+        currentTimeX = __webpack_require__.i(__WEBPACK_IMPORTED_MODULE_3__util__["clamp"])(currentTime + TRANSITION_SCALE_ADJUSTMENT_X);
+        // Y axis moves slower, so time-shift backwards and adjust speed by the difference.
+        currentTimeY = __webpack_require__.i(__WEBPACK_IMPORTED_MODULE_3__util__["clamp"])((currentTime - TRANSITION_SCALE_ADJUSTMENT_Y) / (1 - TRANSITION_SCALE_ADJUSTMENT_Y));
+      }
+
+      // Apply cubic bezier easing independently to each axis.
+      var easeX = __webpack_require__.i(__WEBPACK_IMPORTED_MODULE_3__util__["bezierProgress"])(currentTimeX, TRANSITION_X1, TRANSITION_Y1, TRANSITION_X2, TRANSITION_Y2);
+      var easeY = __webpack_require__.i(__WEBPACK_IMPORTED_MODULE_3__util__["bezierProgress"])(currentTimeY, TRANSITION_X1, TRANSITION_Y1, TRANSITION_X2, TRANSITION_Y2);
+
+      // Calculate the scales to apply to the outer container and inner container.
+      this.scaleX_ = this.startScaleX_ + (this.targetScale_ - this.startScaleX_) * easeX;
+      var invScaleX = 1 / (this.scaleX_ === 0 ? 1 : this.scaleX_);
+      this.scaleY_ = startScaleY + (this.targetScale_ - startScaleY) * easeY;
+      var invScaleY = 1 / (this.scaleY_ === 0 ? 1 : this.scaleY_);
+
+      // Apply scales.
+      this.adapter_.setScale(this.scaleX_, this.scaleY_);
+      this.adapter_.setInnerScale(invScaleX, invScaleY);
+
+      // Stop animation when we've covered the entire 0 - 1 range of time.
+      if (currentTime < 1) {
+        this.animationRequestId_ = requestAnimationFrame(function () {
+          return _this2.animationLoop_();
+        });
+      } else {
+        this.animationRequestId_ = 0;
+        this.running_ = false;
+        this.adapter_.removeClass(MDCSimpleMenuFoundation.cssClasses.ANIMATING);
+      }
+    }
+
+    /**
+     * Starts the open or close animation.
+     * @private
+     */
+
+  }, {
+    key: 'animateMenu_',
+    value: function animateMenu_() {
+      var _this3 = this;
+
+      this.startTime_ = this.adapter_.getAccurateTime();
+      this.startScaleX_ = this.scaleX_;
+      this.startScaleY_ = this.scaleY_;
+
+      this.targetScale_ = this.isOpen_ ? 1 : 0;
+
+      if (!this.running_) {
+        this.running_ = true;
+        this.animationRequestId_ = requestAnimationFrame(function () {
+          return _this3.animationLoop_();
+        });
+      }
+    }
+
+    /**
+     * @param {?number} focusIndex
+     * @private
+     */
+
+  }, {
+    key: 'focusOnOpen_',
+    value: function focusOnOpen_(focusIndex) {
+      if (focusIndex === null) {
+        // First, try focusing the menu.
+        this.adapter_.focus();
+        // If that doesn't work, focus first item instead.
+        if (!this.adapter_.isFocused()) {
+          this.adapter_.focusItemAtIndex(0);
+        }
+      } else {
+        this.adapter_.focusItemAtIndex(focusIndex);
+      }
+    }
+
+    /**
+     * Handle keys that we want to repeat on hold (tab and arrows).
+     * @param {!Event} evt
+     * @return {boolean}
+     * @private
+     */
+
+  }, {
+    key: 'handleKeyboardDown_',
+    value: function handleKeyboardDown_(evt) {
+      // Do nothing if Alt, Ctrl or Meta are pressed.
+      if (evt.altKey || evt.ctrlKey || evt.metaKey) {
+        return true;
+      }
+
+      var keyCode = evt.keyCode,
+          key = evt.key,
+          shiftKey = evt.shiftKey;
+
+      var isTab = key === 'Tab' || keyCode === 9;
+      var isArrowUp = key === 'ArrowUp' || keyCode === 38;
+      var isArrowDown = key === 'ArrowDown' || keyCode === 40;
+      var isSpace = key === 'Space' || keyCode === 32;
+
+      var focusedItemIndex = this.adapter_.getFocusedItemIndex();
+      var lastItemIndex = this.adapter_.getNumberOfItems() - 1;
+
+      if (shiftKey && isTab && focusedItemIndex === 0) {
+        this.adapter_.focusItemAtIndex(lastItemIndex);
+        evt.preventDefault();
+        return false;
+      }
+
+      if (!shiftKey && isTab && focusedItemIndex === lastItemIndex) {
+        this.adapter_.focusItemAtIndex(0);
+        evt.preventDefault();
+        return false;
+      }
+
+      // Ensure Arrow{Up,Down} and space do not cause inadvertent scrolling
+      if (isArrowUp || isArrowDown || isSpace) {
+        evt.preventDefault();
+      }
+
+      if (isArrowUp) {
+        if (focusedItemIndex === 0 || this.adapter_.isFocused()) {
+          this.adapter_.focusItemAtIndex(lastItemIndex);
+        } else {
+          this.adapter_.focusItemAtIndex(focusedItemIndex - 1);
+        }
+      } else if (isArrowDown) {
+        if (focusedItemIndex === lastItemIndex || this.adapter_.isFocused()) {
+          this.adapter_.focusItemAtIndex(0);
+        } else {
+          this.adapter_.focusItemAtIndex(focusedItemIndex + 1);
+        }
+      }
+
+      return true;
+    }
+
+    /**
+     * Handle keys that we don't want to repeat on hold (Enter, Space, Escape).
+     * @param {!Event} evt
+     * @return {boolean}
+     * @private
+     */
+
+  }, {
+    key: 'handleKeyboardUp_',
+    value: function handleKeyboardUp_(evt) {
+      // Do nothing if Alt, Ctrl or Meta are pressed.
+      if (evt.altKey || evt.ctrlKey || evt.metaKey) {
+        return true;
+      }
+
+      var keyCode = evt.keyCode,
+          key = evt.key;
+
+      var isEnter = key === 'Enter' || keyCode === 13;
+      var isSpace = key === 'Space' || keyCode === 32;
+      var isEscape = key === 'Escape' || keyCode === 27;
+
+      if (isEnter || isSpace) {
+        this.handlePossibleSelected_(evt);
+      }
+
+      if (isEscape) {
+        this.adapter_.notifyCancel();
+        this.close();
+      }
+
+      return true;
+    }
+
+    /**
+     * @param {!Event} evt
+     * @private
+     */
+
+  }, {
+    key: 'handlePossibleSelected_',
+    value: function handlePossibleSelected_(evt) {
+      var _this4 = this;
+
+      if (this.adapter_.getAttributeForEventTarget(evt.target, __WEBPACK_IMPORTED_MODULE_2__constants__["b" /* strings */].ARIA_DISABLED_ATTR) === 'true') {
+        return;
+      }
+      var targetIndex = this.adapter_.getIndexForEventTarget(evt.target);
+      if (targetIndex < 0) {
+        return;
+      }
+      // Debounce multiple selections
+      if (this.selectedTriggerTimerId_) {
+        return;
+      }
+      this.selectedTriggerTimerId_ = setTimeout(function () {
+        _this4.selectedTriggerTimerId_ = 0;
+        _this4.close();
+        _this4.adapter_.notifySelected({ index: targetIndex });
+      }, __WEBPACK_IMPORTED_MODULE_2__constants__["c" /* numbers */].SELECTED_TRIGGER_DELAY);
+    }
+
+    /** @private */
+
+  }, {
+    key: 'autoPosition_',
+    value: function autoPosition_() {
+      var _position;
+
+      if (!this.adapter_.hasAnchor()) {
+        return;
+      }
+
+      // Defaults: open from the top left.
+      var vertical = 'top';
+      var horizontal = 'left';
+
+      var anchor = this.adapter_.getAnchorDimensions();
+      var windowDimensions = this.adapter_.getWindowDimensions();
+
+      var topOverflow = anchor.top + this.dimensions_.height - windowDimensions.height;
+      var bottomOverflow = this.dimensions_.height - anchor.bottom;
+      var extendsBeyondTopBounds = topOverflow > 0;
+
+      if (extendsBeyondTopBounds) {
+        if (bottomOverflow < topOverflow) {
+          vertical = 'bottom';
+        }
+      }
+
+      var leftOverflow = anchor.left + this.dimensions_.width - windowDimensions.width;
+      var rightOverflow = this.dimensions_.width - anchor.right;
+      var extendsBeyondLeftBounds = leftOverflow > 0;
+      var extendsBeyondRightBounds = rightOverflow > 0;
+
+      if (this.adapter_.isRtl()) {
+        // In RTL, we prefer to open from the right.
+        horizontal = 'right';
+        if (extendsBeyondRightBounds && leftOverflow < rightOverflow) {
+          horizontal = 'left';
+        }
+      } else if (extendsBeyondLeftBounds && rightOverflow < leftOverflow) {
+        horizontal = 'right';
+      }
+
+      var position = (_position = {}, _defineProperty(_position, horizontal, '0'), _defineProperty(_position, vertical, '0'), _position);
+
+      this.adapter_.setTransformOrigin(vertical + ' ' + horizontal);
+      this.adapter_.setPosition(position);
+    }
+
+    /**
+     * Open the menu.
+     * @param {{focusIndex: ?number}=} options
+     */
+
+  }, {
+    key: 'open',
+    value: function open() {
+      var _this5 = this;
+
+      var _ref = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : {},
+          _ref$focusIndex = _ref.focusIndex,
+          focusIndex = _ref$focusIndex === undefined ? null : _ref$focusIndex;
+
+      this.adapter_.saveFocus();
+      this.adapter_.addClass(MDCSimpleMenuFoundation.cssClasses.ANIMATING);
+      this.animationRequestId_ = requestAnimationFrame(function () {
+        _this5.dimensions_ = _this5.adapter_.getInnerDimensions();
+        _this5.applyTransitionDelays_();
+        _this5.autoPosition_();
+        _this5.animateMenu_();
+        _this5.adapter_.addClass(MDCSimpleMenuFoundation.cssClasses.OPEN);
+        _this5.focusOnOpen_(focusIndex);
+        _this5.adapter_.registerBodyClickHandler(_this5.documentClickHandler_);
+      });
+      this.isOpen_ = true;
+    }
+
+    /**
+     * Closes the menu.
+     * @param {Event=} evt
+     */
+
+  }, {
+    key: 'close',
+    value: function close() {
+      var _this6 = this;
+
+      var evt = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : null;
+
+      var targetIsDisabled = evt ? this.adapter_.getAttributeForEventTarget(evt.target, __WEBPACK_IMPORTED_MODULE_2__constants__["b" /* strings */].ARIA_DISABLED_ATTR) === 'true' : false;
+
+      if (targetIsDisabled) {
+        return;
+      }
+
+      this.adapter_.deregisterBodyClickHandler(this.documentClickHandler_);
+      this.adapter_.addClass(MDCSimpleMenuFoundation.cssClasses.ANIMATING);
+      requestAnimationFrame(function () {
+        _this6.removeTransitionDelays_();
+        _this6.animateMenu_();
+        _this6.adapter_.removeClass(MDCSimpleMenuFoundation.cssClasses.OPEN);
+      });
+      this.isOpen_ = false;
+      this.adapter_.restoreFocus();
+    }
+
+    /** @return {boolean} */
+
+  }, {
+    key: 'isOpen',
+    value: function isOpen() {
+      return this.isOpen_;
+    }
+  }]);
+
+  return MDCSimpleMenuFoundation;
+}(__WEBPACK_IMPORTED_MODULE_0__material_base_foundation__["a" /* default */]);
+
+/* harmony default export */ __webpack_exports__["a"] = (MDCSimpleMenuFoundation);
+
+/***/ }),
+
+/***/ 17:
+/***/ (function(module, __webpack_exports__, __webpack_require__) {
+
+"use strict";
+/* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, "a", function() { return MDCSimpleMenu; });
+/* harmony import */ var __WEBPACK_IMPORTED_MODULE_0__material_base_component__ = __webpack_require__(1);
+/* harmony import */ var __WEBPACK_IMPORTED_MODULE_1__foundation__ = __webpack_require__(16);
+/* harmony import */ var __WEBPACK_IMPORTED_MODULE_2__util__ = __webpack_require__(10);
+/* harmony reexport (binding) */ __webpack_require__.d(__webpack_exports__, "b", function() { return __WEBPACK_IMPORTED_MODULE_1__foundation__["a"]; });
+var _createClass = function () { function defineProperties(target, props) { for (var i = 0; i < props.length; i++) { var descriptor = props[i]; descriptor.enumerable = descriptor.enumerable || false; descriptor.configurable = true; if ("value" in descriptor) descriptor.writable = true; Object.defineProperty(target, descriptor.key, descriptor); } } return function (Constructor, protoProps, staticProps) { if (protoProps) defineProperties(Constructor.prototype, protoProps); if (staticProps) defineProperties(Constructor, staticProps); return Constructor; }; }();
+
+function _classCallCheck(instance, Constructor) { if (!(instance instanceof Constructor)) { throw new TypeError("Cannot call a class as a function"); } }
+
+function _possibleConstructorReturn(self, call) { if (!self) { throw new ReferenceError("this hasn't been initialised - super() hasn't been called"); } return call && (typeof call === "object" || typeof call === "function") ? call : self; }
+
+function _inherits(subClass, superClass) { if (typeof superClass !== "function" && superClass !== null) { throw new TypeError("Super expression must either be null or a function, not " + typeof superClass); } subClass.prototype = Object.create(superClass && superClass.prototype, { constructor: { value: subClass, enumerable: false, writable: true, configurable: true } }); if (superClass) Object.setPrototypeOf ? Object.setPrototypeOf(subClass, superClass) : subClass.__proto__ = superClass; }
+
+/**
+ * Copyright 2016 Google Inc. All Rights Reserved.
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *      http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+
+
+
+
+
+
+
+/**
+ * @extends MDCComponent<!MDCSimpleMenuFoundation>
+ */
+var MDCSimpleMenu = function (_MDCComponent) {
+  _inherits(MDCSimpleMenu, _MDCComponent);
+
+  /** @param {...?} args */
+  function MDCSimpleMenu() {
+    var _ref;
+
+    _classCallCheck(this, MDCSimpleMenu);
+
+    for (var _len = arguments.length, args = Array(_len), _key = 0; _key < _len; _key++) {
+      args[_key] = arguments[_key];
+    }
+
+    /** @private {!Element} */
+    var _this = _possibleConstructorReturn(this, (_ref = MDCSimpleMenu.__proto__ || Object.getPrototypeOf(MDCSimpleMenu)).call.apply(_ref, [this].concat(args)));
+
+    _this.previousFocus_;
+    return _this;
+  }
+
+  /**
+   * @param {!Element} root
+   * @return {!MDCSimpleMenu}
+   */
+
+
+  _createClass(MDCSimpleMenu, [{
+    key: 'show',
+
+
+    /** @param {{focusIndex: ?number}=} options */
+    value: function show() {
+      var _ref2 = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : {},
+          _ref2$focusIndex = _ref2.focusIndex,
+          focusIndex = _ref2$focusIndex === undefined ? null : _ref2$focusIndex;
+
+      this.foundation_.open({ focusIndex: focusIndex });
+    }
+  }, {
+    key: 'hide',
+    value: function hide() {
+      this.foundation_.close();
+    }
+
+    /**
+     * Return the item container element inside the component.
+     * @return {?Element}
+     */
+
+  }, {
+    key: 'getDefaultFoundation',
+
+
+    /** @return {!MDCSimpleMenuFoundation} */
+    value: function getDefaultFoundation() {
+      var _this2 = this;
+
+      return new __WEBPACK_IMPORTED_MODULE_1__foundation__["a" /* default */]({
+        addClass: function addClass(className) {
+          return _this2.root_.classList.add(className);
+        },
+        removeClass: function removeClass(className) {
+          return _this2.root_.classList.remove(className);
+        },
+        hasClass: function hasClass(className) {
+          return _this2.root_.classList.contains(className);
+        },
+        hasNecessaryDom: function hasNecessaryDom() {
+          return Boolean(_this2.itemsContainer_);
+        },
+        getAttributeForEventTarget: function getAttributeForEventTarget(target, attributeName) {
+          return target.getAttribute(attributeName);
+        },
+        getInnerDimensions: function getInnerDimensions() {
+          var itemsContainer = _this2.itemsContainer_;
+
+          return { width: itemsContainer.offsetWidth, height: itemsContainer.offsetHeight };
+        },
+        hasAnchor: function hasAnchor() {
+          return _this2.root_.parentElement && _this2.root_.parentElement.classList.contains('mdc-menu-anchor');
+        },
+        getAnchorDimensions: function getAnchorDimensions() {
+          return _this2.root_.parentElement.getBoundingClientRect();
+        },
+        getWindowDimensions: function getWindowDimensions() {
+          return { width: window.innerWidth, height: window.innerHeight };
+        },
+        setScale: function setScale(x, y) {
+          _this2.root_.style[__webpack_require__.i(__WEBPACK_IMPORTED_MODULE_2__util__["getTransformPropertyName"])(window)] = 'scale(' + x + ', ' + y + ')';
+        },
+        setInnerScale: function setInnerScale(x, y) {
+          _this2.itemsContainer_.style[__webpack_require__.i(__WEBPACK_IMPORTED_MODULE_2__util__["getTransformPropertyName"])(window)] = 'scale(' + x + ', ' + y + ')';
+        },
+        getNumberOfItems: function getNumberOfItems() {
+          return _this2.items.length;
+        },
+        registerInteractionHandler: function registerInteractionHandler(type, handler) {
+          return _this2.root_.addEventListener(type, handler);
+        },
+        deregisterInteractionHandler: function deregisterInteractionHandler(type, handler) {
+          return _this2.root_.removeEventListener(type, handler);
+        },
+        registerBodyClickHandler: function registerBodyClickHandler(handler) {
+          return document.body.addEventListener('click', handler);
+        },
+        deregisterBodyClickHandler: function deregisterBodyClickHandler(handler) {
+          return document.body.removeEventListener('click', handler);
+        },
+        getYParamsForItemAtIndex: function getYParamsForItemAtIndex(index) {
+          var _items$index = _this2.items[index],
+              top = _items$index.offsetTop,
+              height = _items$index.offsetHeight;
+
+          return { top: top, height: height };
+        },
+        setTransitionDelayForItemAtIndex: function setTransitionDelayForItemAtIndex(index, value) {
+          return _this2.items[index].style.setProperty('transition-delay', value);
+        },
+        getIndexForEventTarget: function getIndexForEventTarget(target) {
+          return _this2.items.indexOf(target);
+        },
+        notifySelected: function notifySelected(evtData) {
+          return _this2.emit(__WEBPACK_IMPORTED_MODULE_1__foundation__["a" /* default */].strings.SELECTED_EVENT, {
+            index: evtData.index,
+            item: _this2.items[evtData.index]
+          });
+        },
+        notifyCancel: function notifyCancel() {
+          return _this2.emit(__WEBPACK_IMPORTED_MODULE_1__foundation__["a" /* default */].strings.CANCEL_EVENT, {});
+        },
+        saveFocus: function saveFocus() {
+          _this2.previousFocus_ = document.activeElement;
+        },
+        restoreFocus: function restoreFocus() {
+          if (_this2.previousFocus_) {
+            _this2.previousFocus_.focus();
+          }
+        },
+        isFocused: function isFocused() {
+          return document.activeElement === _this2.root_;
+        },
+        focus: function focus() {
+          return _this2.root_.focus();
+        },
+        getFocusedItemIndex: function getFocusedItemIndex() {
+          return _this2.items.indexOf(document.activeElement);
+        },
+        focusItemAtIndex: function focusItemAtIndex(index) {
+          return _this2.items[index].focus();
+        },
+        isRtl: function isRtl() {
+          return getComputedStyle(_this2.root_).getPropertyValue('direction') === 'rtl';
+        },
+        setTransformOrigin: function setTransformOrigin(origin) {
+          _this2.root_.style[__webpack_require__.i(__WEBPACK_IMPORTED_MODULE_2__util__["getTransformPropertyName"])(window) + '-origin'] = origin;
+        },
+        setPosition: function setPosition(position) {
+          _this2.root_.style.left = 'left' in position ? position.left : null;
+          _this2.root_.style.right = 'right' in position ? position.right : null;
+          _this2.root_.style.top = 'top' in position ? position.top : null;
+          _this2.root_.style.bottom = 'bottom' in position ? position.bottom : null;
+        },
+        getAccurateTime: function getAccurateTime() {
+          return window.performance.now();
+        }
+      });
+    }
+  }, {
+    key: 'open',
+
+
+    /** @return {boolean} */
+    get: function get() {
+      return this.foundation_.isOpen();
+    }
+
+    /** @param {boolean} value */
+    ,
+    set: function set(value) {
+      if (value) {
+        this.foundation_.open();
+      } else {
+        this.foundation_.close();
+      }
+    }
+  }, {
+    key: 'itemsContainer_',
+    get: function get() {
+      return this.root_.querySelector(__WEBPACK_IMPORTED_MODULE_1__foundation__["a" /* default */].strings.ITEMS_SELECTOR);
+    }
+
+    /**
+     * Return the items within the menu. Note that this only contains the set of elements within
+     * the items container that are proper list items, and not supplemental / presentational DOM
+     * elements.
+     * @return {!Array<!Element>}
+     */
+
+  }, {
+    key: 'items',
+    get: function get() {
+      var itemsContainer = this.itemsContainer_;
+
+      return [].slice.call(itemsContainer.querySelectorAll('.mdc-list-item[role]'));
+    }
+  }], [{
+    key: 'attachTo',
+    value: function attachTo(root) {
+      return new MDCSimpleMenu(root);
+    }
+  }]);
+
+  return MDCSimpleMenu;
+}(__WEBPACK_IMPORTED_MODULE_0__material_base_component__["a" /* default */]);
+
+/***/ }),
+
+/***/ 2:
+/***/ (function(module, __webpack_exports__, __webpack_require__) {
+
+"use strict";
+Object.defineProperty(__webpack_exports__, "__esModule", { value: true });
+/* harmony import */ var __WEBPACK_IMPORTED_MODULE_0__foundation__ = __webpack_require__(0);
+/* harmony import */ var __WEBPACK_IMPORTED_MODULE_1__component__ = __webpack_require__(1);
+/* harmony import */ var __WEBPACK_IMPORTED_MODULE_2__selection_control__ = __webpack_require__(3);
+/* harmony reexport (binding) */ __webpack_require__.d(__webpack_exports__, "MDCFoundation", function() { return __WEBPACK_IMPORTED_MODULE_0__foundation__["a"]; });
+/* harmony reexport (binding) */ __webpack_require__.d(__webpack_exports__, "MDCComponent", function() { return __WEBPACK_IMPORTED_MODULE_1__component__["a"]; });
+/* harmony reexport (binding) */ __webpack_require__.d(__webpack_exports__, "SelectionControlState", function() { return __WEBPACK_IMPORTED_MODULE_2__selection_control__["a"]; });
+/**
+ * Copyright 2016 Google Inc.
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *   http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+
+
+
+
+
+
+
+/***/ }),
+
+/***/ 3:
+/***/ (function(module, __webpack_exports__, __webpack_require__) {
+
+"use strict";
+/* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, "a", function() { return SelectionControlState; });
+/**
+ * Copyright 2017 Google Inc. All Rights Reserved.
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *      http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+
+/**
+ * @typedef {!{
+ *   checked: boolean,
+ *   indeterminate: boolean,
+ *   disabled: boolean,
+ *   value: ?string
+ * }}
+ */
+var SelectionControlState = void 0;
+
+/***/ }),
+
+/***/ 32:
+/***/ (function(module, __webpack_exports__, __webpack_require__) {
+
+"use strict";
+Object.defineProperty(__webpack_exports__, "__esModule", { value: true });
+/* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, "MDCSelect", function() { return MDCSelect; });
+/* harmony import */ var __WEBPACK_IMPORTED_MODULE_0__material_base__ = __webpack_require__(2);
+/* harmony import */ var __WEBPACK_IMPORTED_MODULE_1__material_menu__ = __webpack_require__(11);
+/* harmony import */ var __WEBPACK_IMPORTED_MODULE_2__foundation__ = __webpack_require__(65);
+/* harmony reexport (binding) */ __webpack_require__.d(__webpack_exports__, "MDCSelectFoundation", function() { return __WEBPACK_IMPORTED_MODULE_2__foundation__["a"]; });
+var _createClass = function () { function defineProperties(target, props) { for (var i = 0; i < props.length; i++) { var descriptor = props[i]; descriptor.enumerable = descriptor.enumerable || false; descriptor.configurable = true; if ("value" in descriptor) descriptor.writable = true; Object.defineProperty(target, descriptor.key, descriptor); } } return function (Constructor, protoProps, staticProps) { if (protoProps) defineProperties(Constructor.prototype, protoProps); if (staticProps) defineProperties(Constructor, staticProps); return Constructor; }; }();
+
+function _classCallCheck(instance, Constructor) { if (!(instance instanceof Constructor)) { throw new TypeError("Cannot call a class as a function"); } }
+
+function _possibleConstructorReturn(self, call) { if (!self) { throw new ReferenceError("this hasn't been initialised - super() hasn't been called"); } return call && (typeof call === "object" || typeof call === "function") ? call : self; }
+
+function _inherits(subClass, superClass) { if (typeof superClass !== "function" && superClass !== null) { throw new TypeError("Super expression must either be null or a function, not " + typeof superClass); } subClass.prototype = Object.create(superClass && superClass.prototype, { constructor: { value: subClass, enumerable: false, writable: true, configurable: true } }); if (superClass) Object.setPrototypeOf ? Object.setPrototypeOf(subClass, superClass) : subClass.__proto__ = superClass; }
+
+/**
+ * Copyright 2016 Google Inc. All Rights Reserved.
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *      http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+
+
+
+
+
+
+
+
+var MDCSelect = function (_MDCComponent) {
+  _inherits(MDCSelect, _MDCComponent);
+
+  function MDCSelect() {
+    _classCallCheck(this, MDCSelect);
+
+    return _possibleConstructorReturn(this, (MDCSelect.__proto__ || Object.getPrototypeOf(MDCSelect)).apply(this, arguments));
+  }
+
+  _createClass(MDCSelect, [{
+    key: 'item',
+    value: function item(index) {
+      return this.options[index] || null;
+    }
+  }, {
+    key: 'nameditem',
+    value: function nameditem(key) {
+      // NOTE: IE11 precludes us from using Array.prototype.find
+      for (var i = 0, options = this.options, option; option = options[i]; i++) {
+        if (option.id === key || option.getAttribute('name') === key) {
+          return option;
+        }
+      }
+      return null;
+    }
+  }, {
+    key: 'initialize',
+    value: function initialize() {
+      var menuFactory = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : function (el) {
+        return new __WEBPACK_IMPORTED_MODULE_1__material_menu__["MDCSimpleMenu"](el);
+      };
+
+      this.menuEl_ = this.root_.querySelector('.mdc-select__menu');
+      this.menu_ = menuFactory(this.menuEl_);
+      this.selectedText_ = this.root_.querySelector('.mdc-select__selected-text');
+    }
+  }, {
+    key: 'getDefaultFoundation',
+    value: function getDefaultFoundation() {
+      var _this2 = this;
+
+      return new __WEBPACK_IMPORTED_MODULE_2__foundation__["a" /* default */]({
+        addClass: function addClass(className) {
+          return _this2.root_.classList.add(className);
+        },
+        removeClass: function removeClass(className) {
+          return _this2.root_.classList.remove(className);
+        },
+        setAttr: function setAttr(attr, value) {
+          return _this2.root_.setAttribute(attr, value);
+        },
+        rmAttr: function rmAttr(attr, value) {
+          return _this2.root_.removeAttribute(attr, value);
+        },
+        computeBoundingRect: function computeBoundingRect() {
+          return _this2.root_.getBoundingClientRect();
+        },
+        registerInteractionHandler: function registerInteractionHandler(type, handler) {
+          return _this2.root_.addEventListener(type, handler);
+        },
+        deregisterInteractionHandler: function deregisterInteractionHandler(type, handler) {
+          return _this2.root_.removeEventListener(type, handler);
+        },
+        focus: function focus() {
+          return _this2.root_.focus();
+        },
+        makeTabbable: function makeTabbable() {
+          _this2.root_.tabIndex = 0;
+        },
+        makeUntabbable: function makeUntabbable() {
+          _this2.root_.tabIndex = -1;
+        },
+        getComputedStyleValue: function getComputedStyleValue(prop) {
+          return window.getComputedStyle(_this2.root_).getPropertyValue(prop);
+        },
+        setStyle: function setStyle(propertyName, value) {
+          return _this2.root_.style.setProperty(propertyName, value);
+        },
+        create2dRenderingContext: function create2dRenderingContext() {
+          return document.createElement('canvas').getContext('2d');
+        },
+        setMenuElStyle: function setMenuElStyle(propertyName, value) {
+          return _this2.menuEl_.style.setProperty(propertyName, value);
+        },
+        setMenuElAttr: function setMenuElAttr(attr, value) {
+          return _this2.menuEl_.setAttribute(attr, value);
+        },
+        rmMenuElAttr: function rmMenuElAttr(attr) {
+          return _this2.menuEl_.removeAttribute(attr);
+        },
+        getMenuElOffsetHeight: function getMenuElOffsetHeight() {
+          return _this2.menuEl_.offsetHeight;
+        },
+        openMenu: function openMenu(focusIndex) {
+          return _this2.menu_.show({ focusIndex: focusIndex });
+        },
+        isMenuOpen: function isMenuOpen() {
+          return _this2.menu_.open;
+        },
+        setSelectedTextContent: function setSelectedTextContent(selectedTextContent) {
+          _this2.selectedText_.textContent = selectedTextContent;
+        },
+        getNumberOfOptions: function getNumberOfOptions() {
+          return _this2.options.length;
+        },
+        getTextForOptionAtIndex: function getTextForOptionAtIndex(index) {
+          return _this2.options[index].textContent;
+        },
+        getValueForOptionAtIndex: function getValueForOptionAtIndex(index) {
+          return _this2.options[index].id || _this2.options[index].textContent;
+        },
+        setAttrForOptionAtIndex: function setAttrForOptionAtIndex(index, attr, value) {
+          return _this2.options[index].setAttribute(attr, value);
+        },
+        rmAttrForOptionAtIndex: function rmAttrForOptionAtIndex(index, attr) {
+          return _this2.options[index].removeAttribute(attr);
+        },
+        getOffsetTopForOptionAtIndex: function getOffsetTopForOptionAtIndex(index) {
+          return _this2.options[index].offsetTop;
+        },
+        registerMenuInteractionHandler: function registerMenuInteractionHandler(type, handler) {
+          return _this2.menu_.listen(type, handler);
+        },
+        deregisterMenuInteractionHandler: function deregisterMenuInteractionHandler(type, handler) {
+          return _this2.menu_.unlisten(type, handler);
+        },
+        notifyChange: function notifyChange() {
+          return _this2.emit(__WEBPACK_IMPORTED_MODULE_2__foundation__["a" /* default */].strings.CHANGE_EVENT, _this2);
+        },
+        getWindowInnerHeight: function getWindowInnerHeight() {
+          return window.innerHeight;
+        }
+      });
+    }
+  }, {
+    key: 'initialSyncWithDOM',
+    value: function initialSyncWithDOM() {
+      var selectedOption = this.selectedOptions[0];
+      var idx = selectedOption ? this.options.indexOf(selectedOption) : -1;
+      if (idx >= 0) {
+        this.selectedIndex = idx;
+      }
+
+      if (this.root_.getAttribute('aria-disabled') === 'true') {
+        this.disabled = true;
+      }
+    }
+  }, {
+    key: 'value',
+    get: function get() {
+      return this.foundation_.getValue();
+    }
+  }, {
+    key: 'options',
+    get: function get() {
+      return this.menu_.items;
+    }
+  }, {
+    key: 'selectedOptions',
+    get: function get() {
+      return this.root_.querySelectorAll('[aria-selected]');
+    }
+  }, {
+    key: 'selectedIndex',
+    get: function get() {
+      return this.foundation_.getSelectedIndex();
+    },
+    set: function set(selectedIndex) {
+      this.foundation_.setSelectedIndex(selectedIndex);
+    }
+  }, {
+    key: 'disabled',
+    get: function get() {
+      return this.foundation_.isDisabled();
+    },
+    set: function set(disabled) {
+      this.foundation_.setDisabled(disabled);
+    }
+  }], [{
+    key: 'attachTo',
+    value: function attachTo(root) {
+      return new MDCSelect(root);
+    }
+  }]);
+
+  return MDCSelect;
+}(__WEBPACK_IMPORTED_MODULE_0__material_base__["MDCComponent"]);
+
+/***/ }),
+
+/***/ 64:
+/***/ (function(module, __webpack_exports__, __webpack_require__) {
+
+"use strict";
+/* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, "a", function() { return cssClasses; });
+/* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, "b", function() { return strings; });
+/**
+ * Copyright 2016 Google Inc. All Rights Reserved.
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *      http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+var cssClasses = {
+  ROOT: 'mdc-select',
+  OPEN: 'mdc-select--open',
+  DISABLED: 'mdc-select--disabled'
+};
+
+var strings = {
+  CHANGE_EVENT: 'MDCSelect:change'
+};
+
+/***/ }),
+
+/***/ 65:
+/***/ (function(module, __webpack_exports__, __webpack_require__) {
+
+"use strict";
+/* harmony import */ var __WEBPACK_IMPORTED_MODULE_0__material_base__ = __webpack_require__(2);
+/* harmony import */ var __WEBPACK_IMPORTED_MODULE_1__constants__ = __webpack_require__(64);
+/* harmony import */ var __WEBPACK_IMPORTED_MODULE_2__material_menu__ = __webpack_require__(11);
+var _extends = Object.assign || function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; };
+
+var _createClass = function () { function defineProperties(target, props) { for (var i = 0; i < props.length; i++) { var descriptor = props[i]; descriptor.enumerable = descriptor.enumerable || false; descriptor.configurable = true; if ("value" in descriptor) descriptor.writable = true; Object.defineProperty(target, descriptor.key, descriptor); } } return function (Constructor, protoProps, staticProps) { if (protoProps) defineProperties(Constructor.prototype, protoProps); if (staticProps) defineProperties(Constructor, staticProps); return Constructor; }; }();
+
+function _classCallCheck(instance, Constructor) { if (!(instance instanceof Constructor)) { throw new TypeError("Cannot call a class as a function"); } }
+
+function _possibleConstructorReturn(self, call) { if (!self) { throw new ReferenceError("this hasn't been initialised - super() hasn't been called"); } return call && (typeof call === "object" || typeof call === "function") ? call : self; }
+
+function _inherits(subClass, superClass) { if (typeof superClass !== "function" && superClass !== null) { throw new TypeError("Super expression must either be null or a function, not " + typeof superClass); } subClass.prototype = Object.create(superClass && superClass.prototype, { constructor: { value: subClass, enumerable: false, writable: true, configurable: true } }); if (superClass) Object.setPrototypeOf ? Object.setPrototypeOf(subClass, superClass) : subClass.__proto__ = superClass; }
+
+/**
+ * Copyright 2016 Google Inc. All Rights Reserved.
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *      http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+
+
+
+
+
+var OPENER_KEYS = [{ key: 'ArrowUp', keyCode: 38, forType: 'keydown' }, { key: 'ArrowDown', keyCode: 40, forType: 'keydown' }, { key: 'Space', keyCode: 32, forType: 'keyup' }];
+
+var MDCSelectFoundation = function (_MDCFoundation) {
+  _inherits(MDCSelectFoundation, _MDCFoundation);
+
+  _createClass(MDCSelectFoundation, null, [{
+    key: 'cssClasses',
+    get: function get() {
+      return __WEBPACK_IMPORTED_MODULE_1__constants__["a" /* cssClasses */];
+    }
+  }, {
+    key: 'strings',
+    get: function get() {
+      return __WEBPACK_IMPORTED_MODULE_1__constants__["b" /* strings */];
+    }
+  }, {
+    key: 'defaultAdapter',
+    get: function get() {
+      return {
+        addClass: function addClass() /* className: string */{},
+        removeClass: function removeClass() /* className: string */{},
+        setAttr: function setAttr() /* attr: string, value: string */{},
+        rmAttr: function rmAttr() /* attr: string */{},
+        computeBoundingRect: function computeBoundingRect() {
+          return (/* {left: number, top: number} */{ left: 0, top: 0 }
+          );
+        },
+        registerInteractionHandler: function registerInteractionHandler() /* type: string, handler: EventListener */{},
+        deregisterInteractionHandler: function deregisterInteractionHandler() /* type: string, handler: EventListener */{},
+        focus: function focus() {},
+        makeTabbable: function makeTabbable() {},
+        makeUntabbable: function makeUntabbable() {},
+        getComputedStyleValue: function getComputedStyleValue() {
+          return (/* propertyName: string */ /* string */''
+          );
+        },
+        setStyle: function setStyle() /* propertyName: string, value: string */{},
+        create2dRenderingContext: function create2dRenderingContext() {
+          return (/* {font: string, measureText: (string) => {width: number}} */{
+              font: '',
+              measureText: function measureText() {
+                return { width: 0 };
+              }
+            }
+          );
+        },
+        setMenuElStyle: function setMenuElStyle() /* propertyName: string, value: string */{},
+        setMenuElAttr: function setMenuElAttr() /* attr: string, value: string */{},
+        rmMenuElAttr: function rmMenuElAttr() /* attr: string */{},
+        getMenuElOffsetHeight: function getMenuElOffsetHeight() {
+          return (/* number */0
+          );
+        },
+        openMenu: function openMenu() /* focusIndex: number */{},
+        isMenuOpen: function isMenuOpen() {
+          return (/* boolean */false
+          );
+        },
+        setSelectedTextContent: function setSelectedTextContent() /* textContent: string */{},
+        getNumberOfOptions: function getNumberOfOptions() {
+          return (/* number */0
+          );
+        },
+        getTextForOptionAtIndex: function getTextForOptionAtIndex() {
+          return (/* index: number */ /* string */''
+          );
+        },
+        getValueForOptionAtIndex: function getValueForOptionAtIndex() {
+          return (/* index: number */ /* string */''
+          );
+        },
+        setAttrForOptionAtIndex: function setAttrForOptionAtIndex() /* index: number, attr: string, value: string */{},
+        rmAttrForOptionAtIndex: function rmAttrForOptionAtIndex() /* index: number, attr: string */{},
+        getOffsetTopForOptionAtIndex: function getOffsetTopForOptionAtIndex() {
+          return (/* index: number */ /* number */0
+          );
+        },
+        registerMenuInteractionHandler: function registerMenuInteractionHandler() /* type: string, handler: EventListener */{},
+        deregisterMenuInteractionHandler: function deregisterMenuInteractionHandler() /* type: string, handler: EventListener */{},
+        notifyChange: function notifyChange() {},
+        getWindowInnerHeight: function getWindowInnerHeight() {
+          return (/* number */0
+          );
+        }
+      };
+    }
+  }]);
+
+  function MDCSelectFoundation(adapter) {
+    _classCallCheck(this, MDCSelectFoundation);
+
+    var _this = _possibleConstructorReturn(this, (MDCSelectFoundation.__proto__ || Object.getPrototypeOf(MDCSelectFoundation)).call(this, _extends(MDCSelectFoundation.defaultAdapter, adapter)));
+
+    _this.ctx_ = null;
+    _this.selectedIndex_ = -1;
+    _this.disabled_ = false;
+    _this.displayHandler_ = function (evt) {
+      evt.preventDefault();
+      if (!_this.adapter_.isMenuOpen()) {
+        _this.open_();
+      }
+    };
+    _this.displayViaKeyboardHandler_ = function (evt) {
+      return _this.handleDisplayViaKeyboard_(evt);
+    };
+    _this.selectionHandler_ = function (_ref) {
+      var detail = _ref.detail;
+      var index = detail.index;
+
+      _this.close_();
+      if (index !== _this.selectedIndex_) {
+        _this.setSelectedIndex(index);
+        _this.adapter_.notifyChange();
+      }
+    };
+    _this.cancelHandler_ = function () {
+      _this.close_();
+    };
+    return _this;
+  }
+
+  _createClass(MDCSelectFoundation, [{
+    key: 'init',
+    value: function init() {
+      this.ctx_ = this.adapter_.create2dRenderingContext();
+      this.adapter_.registerInteractionHandler('click', this.displayHandler_);
+      this.adapter_.registerInteractionHandler('keydown', this.displayViaKeyboardHandler_);
+      this.adapter_.registerInteractionHandler('keyup', this.displayViaKeyboardHandler_);
+      this.adapter_.registerMenuInteractionHandler(__WEBPACK_IMPORTED_MODULE_2__material_menu__["MDCSimpleMenuFoundation"].strings.SELECTED_EVENT, this.selectionHandler_);
+      this.adapter_.registerMenuInteractionHandler(__WEBPACK_IMPORTED_MODULE_2__material_menu__["MDCSimpleMenuFoundation"].strings.CANCEL_EVENT, this.cancelHandler_);
+      this.resize();
+    }
+  }, {
+    key: 'destroy',
+    value: function destroy() {
+      // Drop reference to context object to prevent potential leaks
+      this.ctx_ = null;
+      this.adapter_.deregisterInteractionHandler('click', this.displayHandler_);
+      this.adapter_.deregisterInteractionHandler('keydown', this.displayViaKeyboardHandler_);
+      this.adapter_.deregisterInteractionHandler('keyup', this.displayViaKeyboardHandler_);
+      this.adapter_.deregisterMenuInteractionHandler(__WEBPACK_IMPORTED_MODULE_2__material_menu__["MDCSimpleMenuFoundation"].strings.SELECTED_EVENT, this.selectionHandler_);
+      this.adapter_.deregisterMenuInteractionHandler(__WEBPACK_IMPORTED_MODULE_2__material_menu__["MDCSimpleMenuFoundation"].strings.CANCEL_EVENT, this.cancelHandler_);
+    }
+  }, {
+    key: 'getValue',
+    value: function getValue() {
+      return this.selectedIndex_ >= 0 ? this.adapter_.getValueForOptionAtIndex(this.selectedIndex_) : '';
+    }
+  }, {
+    key: 'getSelectedIndex',
+    value: function getSelectedIndex() {
+      return this.selectedIndex_;
+    }
+  }, {
+    key: 'setSelectedIndex',
+    value: function setSelectedIndex(index) {
+      var prevSelectedIndex = this.selectedIndex_;
+      if (prevSelectedIndex >= 0) {
+        this.adapter_.rmAttrForOptionAtIndex(this.selectedIndex_, 'aria-selected');
+      }
+
+      this.selectedIndex_ = index >= 0 && index < this.adapter_.getNumberOfOptions() ? index : -1;
+      var selectedTextContent = '';
+      if (this.selectedIndex_ >= 0) {
+        selectedTextContent = this.adapter_.getTextForOptionAtIndex(this.selectedIndex_).trim();
+        this.adapter_.setAttrForOptionAtIndex(this.selectedIndex_, 'aria-selected', 'true');
+      }
+      this.adapter_.setSelectedTextContent(selectedTextContent);
+    }
+  }, {
+    key: 'isDisabled',
+    value: function isDisabled() {
+      return this.disabled_;
+    }
+  }, {
+    key: 'setDisabled',
+    value: function setDisabled(disabled) {
+      var DISABLED = MDCSelectFoundation.cssClasses.DISABLED;
+
+      this.disabled_ = disabled;
+      if (this.disabled_) {
+        this.adapter_.addClass(DISABLED);
+        this.adapter_.setAttr('aria-disabled', 'true');
+        this.adapter_.makeUntabbable();
+      } else {
+        this.adapter_.removeClass(DISABLED);
+        this.adapter_.rmAttr('aria-disabled');
+        this.adapter_.makeTabbable();
+      }
+    }
+  }, {
+    key: 'resize',
+    value: function resize() {
+      var font = this.adapter_.getComputedStyleValue('font');
+      var letterSpacing = parseFloat(this.adapter_.getComputedStyleValue('letter-spacing'));
+      if (font) {
+        this.ctx_.font = font;
+      } else {
+        var primaryFontFamily = this.adapter_.getComputedStyleValue('font-family').split(',')[0];
+        var fontSize = this.adapter_.getComputedStyleValue('font-size');
+        this.ctx_.font = fontSize + ' ' + primaryFontFamily;
+      }
+
+      var maxTextLength = 0;
+      for (var i = 0, l = this.adapter_.getNumberOfOptions(); i < l; i++) {
+        var txt = this.adapter_.getTextForOptionAtIndex(i).trim();
+
+        var _ctx_$measureText = this.ctx_.measureText(txt),
+            width = _ctx_$measureText.width;
+
+        var addedSpace = letterSpacing * txt.length;
+        maxTextLength = Math.max(maxTextLength, Math.ceil(width + addedSpace));
+      }
+      this.adapter_.setStyle('width', maxTextLength + 'px');
+    }
+  }, {
+    key: 'open_',
+    value: function open_() {
+      var OPEN = MDCSelectFoundation.cssClasses.OPEN;
+
+      var focusIndex = this.selectedIndex_ < 0 ? 0 : this.selectedIndex_;
+
+      this.setMenuStylesForOpenAtIndex_(focusIndex);
+      this.adapter_.addClass(OPEN);
+      this.adapter_.openMenu(focusIndex);
+    }
+  }, {
+    key: 'setMenuStylesForOpenAtIndex_',
+    value: function setMenuStylesForOpenAtIndex_(index) {
+      var innerHeight = this.adapter_.getWindowInnerHeight();
+
+      var _adapter_$computeBoun = this.adapter_.computeBoundingRect(),
+          left = _adapter_$computeBoun.left,
+          top = _adapter_$computeBoun.top;
+
+      this.adapter_.setMenuElAttr('aria-hidden', 'true');
+      this.adapter_.setMenuElStyle('display', 'block');
+      var menuHeight = this.adapter_.getMenuElOffsetHeight();
+      var itemOffsetTop = this.adapter_.getOffsetTopForOptionAtIndex(index);
+      this.adapter_.setMenuElStyle('display', '');
+      this.adapter_.rmMenuElAttr('aria-hidden');
+
+      var adjustedTop = top - itemOffsetTop;
+      var overflowsTop = adjustedTop < 0;
+      var overflowsBottom = adjustedTop + menuHeight > innerHeight;
+      if (overflowsTop) {
+        adjustedTop = 0;
+      } else if (overflowsBottom) {
+        adjustedTop = Math.max(0, innerHeight - menuHeight);
+      };
+
+      this.adapter_.setMenuElStyle('left', left + 'px');
+      this.adapter_.setMenuElStyle('top', adjustedTop + 'px');
+      this.adapter_.setMenuElStyle('transform-origin', 'center ' + itemOffsetTop + 'px');
+    }
+  }, {
+    key: 'close_',
+    value: function close_() {
+      var OPEN = MDCSelectFoundation.cssClasses.OPEN;
+
+      this.adapter_.removeClass(OPEN);
+      this.adapter_.focus();
+    }
+  }, {
+    key: 'handleDisplayViaKeyboard_',
+    value: function handleDisplayViaKeyboard_(evt) {
+      // We use a hard-coded 2 instead of Event.AT_TARGET to avoid having to reference a browser
+      // global.
+      var EVENT_PHASE_AT_TARGET = 2;
+      if (evt.eventPhase !== EVENT_PHASE_AT_TARGET) {
+        return;
+      }
+
+      // Prevent pressing space down from scrolling the page
+      var isSpaceDown = evt.type === 'keydown' && (evt.key === 'Space' || evt.keyCode === 32);
+      if (isSpaceDown) {
+        evt.preventDefault();
+      }
+
+      var isOpenerKey = OPENER_KEYS.some(function (_ref2) {
+        var key = _ref2.key,
+            keyCode = _ref2.keyCode,
+            forType = _ref2.forType;
+
+        return evt.type === forType && (evt.key === key || evt.keyCode === keyCode);
+      });
+      if (isOpenerKey) {
+        this.displayHandler_(evt);
+      }
+    }
+  }]);
+
+  return MDCSelectFoundation;
+}(__WEBPACK_IMPORTED_MODULE_0__material_base__["MDCFoundation"]);
+
+/* harmony default export */ __webpack_exports__["a"] = (MDCSelectFoundation);
+
+/***/ }),
+
+/***/ 94:
+/***/ (function(module, exports, __webpack_require__) {
+
+module.exports = __webpack_require__(32);
+
+
+/***/ })
+
+/******/ });
+});

+ 510 - 0
support/client/lib/vwf/view/lib/mdc/dist/mdc.slider.css

@@ -0,0 +1,510 @@
+/*!
+ Material Components for the web
+ Copyright (c) 2017 Google Inc.
+ License: Apache-2.0
+*/
+/*
+  Precomputed linear color channel values, for use in contrast calculations.
+  See https://www.w3.org/TR/WCAG20-TECHS/G17.html#G17-tests
+
+  Algorithm, for c in 0 to 255:
+  f(c) {
+    c = c / 255;
+    return c < 0.03928 ? c / 12.92 : Math.pow((c + 0.055) / 1.055, 2.4);
+  }
+
+  This lookup table is needed since there is no `pow` in SASS.
+*/
+/**
+ * Calculate the luminance for a color.
+ * See https://www.w3.org/TR/WCAG20-TECHS/G17.html#G17-tests
+ */
+/**
+ * Calculate the contrast ratio between two colors.
+ * See https://www.w3.org/TR/WCAG20-TECHS/G17.html#G17-tests
+ */
+/**
+ * Determine whether to use dark or light text on top of given color.
+ * Returns "dark" for dark text and "light" for light text.
+ */
+/*
+  Main theme colors.
+  If you're a user customizing your color scheme in SASS, these are probably the only variables you need to change.
+*/
+/* Indigo 500 */
+/* Pink A200 */
+/* White */
+/* Which set of text colors to use for each main theme color (light or dark) */
+/* Text colors according to light vs dark and text type */
+/* Primary text colors for each of the theme colors */
+/**
+ * Applies the correct theme color style to the specified property.
+ * $property is typically color or background-color, but can be any CSS property that accepts color values.
+ * $style should be one of the map keys in $mdc-theme-property-values (_variables.scss).
+ */
+/**
+ * Creates a rule to be used in MDC-Web components for dark theming, and applies the provided contents.
+ * Should provide the $root-selector option if applied to anything other than the root selector.
+ * When used with a modifier class, provide a second argument of `true` for the $compound parameter
+ * to specify that this should be attached as a compound class.
+ *
+ * Usage example:
+ *
+ * ```scss
+ * .mdc-foo {
+ *   color: black;
+ *
+ *   @include mdc-theme-dark {
+ *     color: white;
+ *   }
+ *
+ *   &__bar {
+ *     background: black;
+ *
+ *     @include mdc-theme-dark(".mdc-foo") {
+ *       background: white;
+ *     }
+ *   }
+ * }
+ *
+ * .mdc-foo--disabled {
+ *   opacity: .38;
+ *
+ *   @include mdc-theme-dark(".mdc-foo", true) {
+ *     opacity: .5;
+ *   }
+ * }
+ * ```
+ */
+/* TODO(sgomes): Figure out what to do about desktop font sizes. */
+/* TODO(sgomes): Figure out what to do about i18n and i18n font sizes. */
+/**
+ * Creates a rule that will be applied when an MDC-Web component is within the context of an RTL layout.
+ *
+ * Usage Example:
+ * ```scss
+ * .mdc-foo {
+ *   position: absolute;
+ *   left: 0;
+ *
+ *   @include mdc-rtl {
+ *     left: auto;
+ *     right: 0;
+ *   }
+ *
+ *   &__bar {
+ *     margin-left: 4px;
+ *     @include mdc-rtl(".mdc-foo") {
+ *       margin-left: auto;
+ *       margin-right: 4px;
+ *     }
+ *   }
+ * }
+ *
+ * .mdc-foo--mod {
+ *   padding-left: 4px;
+ *
+ *   @include mdc-rtl {
+ *     padding-left: auto;
+ *     padding-right: 4px;
+ *   }
+ * }
+ * ```
+ *
+ * Note that this works by checking for [dir="rtl"] on an ancestor element. While this will work
+ * in most cases, it will in some cases lead to false negatives, e.g.
+ *
+ * ```html
+ * <html dir="rtl">
+ *   <!-- ... -->
+ *   <div dir="ltr">
+ *     <div class="mdc-foo">Styled incorrectly as RTL!</div>
+ *   </div>
+ * </html>
+ * ```
+ *
+ * In the future, selectors such as :dir (http://mdn.io/:dir) will help us mitigate this.
+ */
+/**
+ * Takes a base box-model property - e.g. margin / border / padding - along with a default
+ * direction and value, and emits rules which apply the value to the
+ * "<base-property>-<default-direction>" property by default, but flips the direction
+ * when within an RTL context.
+ *
+ * For example:
+ *
+ * ```scss
+ * .mdc-foo {
+ *   @include mdc-rtl-reflexive-box(margin, left, 8px);
+ * }
+ * ```
+ * is equivalent to:
+ *
+ * ```scss
+ * .mdc-foo {
+ *   margin-left: 8px;
+ *
+ *   @include mdc-rtl {
+ *     margin-right: 8px;
+ *     margin-left: 0;
+ *   }
+ * }
+ * ```
+ * whereas:
+ *
+ * ```scss
+ * .mdc-foo {
+ *   @include mdc-rtl-reflexive-box(margin, right, 8px);
+ * }
+ * ```
+ * is equivalent to:
+ *
+ * ```scss
+ * .mdc-foo {
+ *   margin-right: 8px;
+ *
+ *   @include mdc-rtl {
+ *     margin-right: 0;
+ *     margin-left: 8px;
+ *   }
+ * }
+ * ```
+ *
+ * You can also pass a 4th optional $root-selector argument which will be forwarded to `mdc-rtl`,
+ * e.g. `@include mdc-rtl-reflexive-box(margin, left, 8px, ".mdc-component")`.
+ *
+ * Note that this function will always zero out the original value in an RTL context. If you're
+ * trying to flip the values, use mdc-rtl-reflexive-property().
+ */
+/**
+ * Takes a base property and emits rules that assign <base-property>-left to <left-value> and
+ * <base-property>-right to <right-value> in a LTR context, and vice versa in a RTL context.
+ * For example:
+ *
+ * ```scss
+ * .mdc-foo {
+ *   @include mdc-rtl-reflexive-property(margin, auto, 12px);
+ * }
+ * ```
+ * is equivalent to:
+ *
+ * ```scss
+ * .mdc-foo {
+ *   margin-left: auto;
+ *   margin-right: 12px;
+ *
+ *   @include mdc-rtl {
+ *     margin-left: 12px;
+ *     margin-right: auto;
+ *   }
+ * }
+ * ```
+ *
+ * A 4th optional $root-selector argument can be given, which will be passed to `mdc-rtl`.
+ */
+/**
+ * Takes an argument specifying a horizontal position property (either "left" or "right") as well
+ * as a value, and applies that value to the specified position in a LTR context, and flips it in a
+ * RTL context. For example:
+ *
+ * ```scss
+ * .mdc-foo {
+ *   @include mdc-rtl-reflexive-position(left, 0);
+ *   position: absolute;
+ * }
+ * ```
+ * is equivalent to:
+ *
+ * ```scss
+ *  .mdc-foo {
+ *    position: absolute;
+ *    left: 0;
+ *    right: initial;
+ *
+ *    @include mdc-rtl {
+ *      right: 0;
+ *      left: initial;
+ *    }
+ *  }
+ * ```
+ * An optional third $root-selector argument may also be given, which is passed to `mdc-rtl`.
+ */
+@-webkit-keyframes mdc-slider-emphasize {
+  0% {
+    -webkit-animation-timing-function: ease-out;
+            animation-timing-function: ease-out; }
+  50% {
+    -webkit-animation-timing-function: ease-in;
+            animation-timing-function: ease-in;
+    -webkit-transform: scale(0.85);
+            transform: scale(0.85); }
+  100% {
+    -webkit-transform: scale(0.571);
+            transform: scale(0.571); } }
+@keyframes mdc-slider-emphasize {
+  0% {
+    -webkit-animation-timing-function: ease-out;
+            animation-timing-function: ease-out; }
+  50% {
+    -webkit-animation-timing-function: ease-in;
+            animation-timing-function: ease-in;
+    -webkit-transform: scale(0.85);
+            transform: scale(0.85); }
+  100% {
+    -webkit-transform: scale(0.571);
+            transform: scale(0.571); } }
+
+.mdc-slider {
+  position: relative;
+  width: 100%;
+  height: 48px;
+  cursor: pointer;
+  -ms-touch-action: pan-x;
+      touch-action: pan-x;
+  -webkit-tap-highlight-color: transparent; }
+  .mdc-slider:focus {
+    outline: none; }
+  .mdc-slider__track-container {
+    position: absolute;
+    top: 50%;
+    width: 100%;
+    height: 2px;
+    background-color: #bdbdbd;
+    overflow: hidden; }
+    .mdc-slider--theme-dark .mdc-slider__track-container,
+    .mdc-theme--dark .mdc-slider__track-container {
+      background-color: #5c5c5c; }
+  .mdc-slider__track {
+    /* @alternate */
+    background-color: #3f51b5;
+    background-color: var(--mdc-theme-primary, #3f51b5);
+    position: absolute;
+    width: 100%;
+    height: 100%;
+    -webkit-transform-origin: left top;
+            transform-origin: left top;
+    will-change: transform; }
+    [dir="rtl"] .mdc-slider .mdc-slider__track,
+    .mdc-slider[dir="rtl"] .mdc-slider__track {
+      -webkit-transform-origin: right top;
+              transform-origin: right top; }
+  .mdc-slider__track-marker-container {
+    display: -webkit-box;
+    display: -ms-flexbox;
+    display: flex;
+    margin-right: 0;
+    margin-left: -1px;
+    visibility: hidden; }
+    [dir="rtl"] .mdc-slider .mdc-slider__track-marker-container,
+    .mdc-slider[dir="rtl"] .mdc-slider__track-marker-container {
+      margin-right: -1px;
+      margin-left: 0; }
+    .mdc-slider__track-marker-container::after {
+      display: block;
+      width: 2px;
+      height: 2px;
+      background-color: #5c5c5c;
+      content: ""; }
+      .mdc-slider--theme-dark.mdc-slider__track-marker-container::after,
+      .mdc-theme--dark .mdc-slider__track-marker-container::after {
+        background-color: #bdbdbd; }
+  .mdc-slider__track-marker {
+    -webkit-box-flex: 1;
+        -ms-flex: 1;
+            flex: 1; }
+    .mdc-slider__track-marker::after {
+      display: block;
+      width: 2px;
+      height: 2px;
+      background-color: #5c5c5c;
+      content: ""; }
+      .mdc-slider--theme-dark.mdc-slider__track-marker::after,
+      .mdc-theme--dark .mdc-slider__track-marker::after {
+        background-color: #bdbdbd; }
+    .mdc-slider__track-marker:first-child::after {
+      width: 3px; }
+  .mdc-slider__thumb-container {
+    position: absolute;
+    top: 15px;
+    left: 0;
+    width: 21px;
+    height: 100%;
+    will-change: transform;
+    -webkit-user-select: none;
+       -moz-user-select: none;
+        -ms-user-select: none;
+            user-select: none; }
+  .mdc-slider__thumb {
+    /* @alternate */
+    fill: #3f51b5;
+    fill: var(--mdc-theme-primary, #3f51b5);
+    /* @alternate */
+    stroke: #3f51b5;
+    stroke: var(--mdc-theme-primary, #3f51b5);
+    position: absolute;
+    top: 0;
+    left: 0;
+    -webkit-transform: scale(0.571);
+            transform: scale(0.571);
+    -webkit-transition: fill 100ms ease-out, stroke 100ms ease-out, -webkit-transform 100ms ease-out;
+    transition: fill 100ms ease-out, stroke 100ms ease-out, -webkit-transform 100ms ease-out;
+    transition: transform 100ms ease-out, fill 100ms ease-out, stroke 100ms ease-out;
+    transition: transform 100ms ease-out, fill 100ms ease-out, stroke 100ms ease-out, -webkit-transform 100ms ease-out;
+    stroke-width: 3.5; }
+  .mdc-slider__focus-ring {
+    /* @alternate */
+    background-color: #3f51b5;
+    background-color: var(--mdc-theme-primary, #3f51b5);
+    width: 21px;
+    height: 21px;
+    -webkit-transition: opacity 266.67ms ease-out, background-color 266.67ms ease-out, -webkit-transform 266.67ms ease-out;
+    transition: opacity 266.67ms ease-out, background-color 266.67ms ease-out, -webkit-transform 266.67ms ease-out;
+    transition: transform 266.67ms ease-out, opacity 266.67ms ease-out, background-color 266.67ms ease-out;
+    transition: transform 266.67ms ease-out, opacity 266.67ms ease-out, background-color 266.67ms ease-out, -webkit-transform 266.67ms ease-out;
+    border-radius: 50%;
+    opacity: 0; }
+  .mdc-slider__pin {
+    /* @alternate */
+    background-color: #3f51b5;
+    background-color: var(--mdc-theme-primary, #3f51b5);
+    /* @alternate */
+    color: white;
+    color: var(--mdc-theme-text-primary-on-primary, white);
+    display: -webkit-box;
+    display: -ms-flexbox;
+    display: flex;
+    position: absolute;
+    top: 0;
+    left: 0;
+    -webkit-box-align: center;
+        -ms-flex-align: center;
+            align-items: center;
+    -webkit-box-pack: center;
+        -ms-flex-pack: center;
+            justify-content: center;
+    width: 26px;
+    height: 26px;
+    margin-top: -2px;
+    margin-left: -2px;
+    -webkit-transform: rotate(-45deg) scale(0) translate(0, 0);
+            transform: rotate(-45deg) scale(0) translate(0, 0);
+    -webkit-transition: -webkit-transform 100ms ease-out;
+    transition: -webkit-transform 100ms ease-out;
+    transition: transform 100ms ease-out;
+    transition: transform 100ms ease-out, -webkit-transform 100ms ease-out;
+    border-radius: 50% 50% 50% 0%;
+    /**
+     * Ensuring that the pin is higher than the thumb in the stacking order
+     * removes some rendering jank observed in Chrome.
+     */
+    z-index: 1; }
+  .mdc-slider__pin-value-marker {
+    font-family: Roboto, sans-serif;
+    -moz-osx-font-smoothing: grayscale;
+    -webkit-font-smoothing: antialiased;
+    font-size: 0.75rem;
+    font-weight: 400;
+    letter-spacing: 0.08em;
+    line-height: 1.25rem;
+    text-decoration: inherit;
+    text-transform: inherit;
+    -webkit-transform: rotate(45deg);
+            transform: rotate(45deg); }
+
+.mdc-slider--active .mdc-slider__thumb {
+  -webkit-transform: scale3d(1, 1, 1);
+          transform: scale3d(1, 1, 1); }
+
+.mdc-slider--focus .mdc-slider__thumb {
+  -webkit-animation: mdc-slider-emphasize 266.67ms linear;
+          animation: mdc-slider-emphasize 266.67ms linear; }
+
+.mdc-slider--focus .mdc-slider__focus-ring {
+  -webkit-transform: scale3d(1.55, 1.55, 1.55);
+          transform: scale3d(1.55, 1.55, 1.55);
+  opacity: .25; }
+
+.mdc-slider--disabled {
+  cursor: auto; }
+  .mdc-slider--disabled .mdc-slider__track {
+    background-color: #bdbdbd; }
+    .mdc-slider--theme-dark.mdc-slider--disabled .mdc-slider__track,
+    .mdc-theme--dark .mdc-slider--disabled .mdc-slider__track {
+      background-color: #5c5c5c; }
+  .mdc-slider--disabled .mdc-slider__thumb {
+    fill: #bdbdbd !important;
+    stroke: white !important;
+    stroke: var(--mdc-slider-bg-color-behind-component, white) !important; }
+    .mdc-slider--theme-dark.mdc-slider--disabled .mdc-slider__thumb,
+    .mdc-theme--dark .mdc-slider--disabled .mdc-slider__thumb {
+      fill: #5c5c5c !important;
+      stroke: #333 !important;
+      stroke: var(--mdc-slider-bg-color-behind-component, #333) !important; }
+
+.mdc-slider--off .mdc-slider__track {
+  opacity: 0; }
+
+.mdc-slider--off .mdc-slider__thumb {
+  fill: white;
+  fill: var(--mdc-slider-bg-color-behind-component, white);
+  stroke: #bdbdbd; }
+  .mdc-slider--theme-dark.mdc-slider--off .mdc-slider__thumb,
+  .mdc-theme--dark .mdc-slider--off .mdc-slider__thumb {
+    fill: #333;
+    fill: var(--mdc-slider-bg-color-behind-component, #333);
+    stroke: #5c5c5c; }
+
+.mdc-slider--off .mdc-slider__pin {
+  background-color: #bdbdbd; }
+  .mdc-slider--theme-dark.mdc-slider--off .mdc-slider__pin,
+  .mdc-theme--dark .mdc-slider--off .mdc-slider__pin {
+    background-color: #5c5c5c; }
+
+.mdc-slider--off.mdc-slider--focus .mdc-slider__thumb {
+  fill: #dedede; }
+  .mdc-slider--theme-dark.mdc-slider--off.mdc-slider--focus .mdc-slider__thumb,
+  .mdc-theme--dark .mdc-slider--off.mdc-slider--focus .mdc-slider__thumb {
+    fill: #82848c;
+    stroke: #82848c; }
+
+.mdc-slider--off.mdc-slider--active.mdc-slider--focus .mdc-slider__thumb {
+  stroke: #8c8c8c; }
+  .mdc-slider--theme-dark.mdc-slider--off.mdc-slider--active.mdc-slider--focus .mdc-slider__thumb,
+  .mdc-theme--dark .mdc-slider--off.mdc-slider--active.mdc-slider--focus .mdc-slider__thumb {
+    stroke: #5c5c5c; }
+
+.mdc-slider--off .mdc-slider__focus-ring {
+  background-color: #bdbdbd; }
+
+.mdc-slider--in-transit .mdc-slider__thumb {
+  -webkit-transition-delay: 140ms;
+          transition-delay: 140ms; }
+
+.mdc-slider--in-transit .mdc-slider__thumb-container,
+.mdc-slider--in-transit .mdc-slider__track,
+.mdc-slider:focus:not(.mdc-slider--active) .mdc-slider__thumb-container,
+.mdc-slider:focus:not(.mdc-slider--active) .mdc-slider__track {
+  -webkit-transition: -webkit-transform 80ms ease;
+  transition: -webkit-transform 80ms ease;
+  transition: transform 80ms ease;
+  transition: transform 80ms ease, -webkit-transform 80ms ease; }
+
+.mdc-slider--discrete.mdc-slider--active .mdc-slider__thumb {
+  -webkit-transform: scale(calc(12 / 21));
+          transform: scale(calc(12 / 21)); }
+
+.mdc-slider--discrete.mdc-slider--active .mdc-slider__pin {
+  -webkit-transform: rotate(-45deg) scale(1) translate(19px, -20px);
+          transform: rotate(-45deg) scale(1) translate(19px, -20px); }
+
+.mdc-slider--discrete.mdc-slider--focus .mdc-slider__thumb {
+  -webkit-animation: none;
+          animation: none; }
+
+.mdc-slider--discrete.mdc-slider--focus .mdc-slider__focus-ring {
+  -webkit-transform: none;
+          transform: none;
+  opacity: 0; }
+
+.mdc-slider--discrete.mdc-slider--display-markers .mdc-slider__track-marker-container {
+  visibility: visible; }

+ 83 - 0
support/client/lib/vwf/view/lib/mdc/dist/mdc.slider.css-entry

@@ -0,0 +1,83 @@
+/*!
+ Material Components for the web
+ Copyright (c) 2017 Google Inc.
+ License: Apache-2.0
+*/
+/******/ (function(modules) { // webpackBootstrap
+/******/ 	// The module cache
+/******/ 	var installedModules = {};
+/******/
+/******/ 	// The require function
+/******/ 	function __webpack_require__(moduleId) {
+/******/
+/******/ 		// Check if module is in cache
+/******/ 		if(installedModules[moduleId]) {
+/******/ 			return installedModules[moduleId].exports;
+/******/ 		}
+/******/ 		// Create a new module (and put it into the cache)
+/******/ 		var module = installedModules[moduleId] = {
+/******/ 			i: moduleId,
+/******/ 			l: false,
+/******/ 			exports: {}
+/******/ 		};
+/******/
+/******/ 		// Execute the module function
+/******/ 		modules[moduleId].call(module.exports, module, module.exports, __webpack_require__);
+/******/
+/******/ 		// Flag the module as loaded
+/******/ 		module.l = true;
+/******/
+/******/ 		// Return the exports of the module
+/******/ 		return module.exports;
+/******/ 	}
+/******/
+/******/
+/******/ 	// expose the modules object (__webpack_modules__)
+/******/ 	__webpack_require__.m = modules;
+/******/
+/******/ 	// expose the module cache
+/******/ 	__webpack_require__.c = installedModules;
+/******/
+/******/ 	// identity function for calling harmony imports with the correct context
+/******/ 	__webpack_require__.i = function(value) { return value; };
+/******/
+/******/ 	// define getter function for harmony exports
+/******/ 	__webpack_require__.d = function(exports, name, getter) {
+/******/ 		if(!__webpack_require__.o(exports, name)) {
+/******/ 			Object.defineProperty(exports, name, {
+/******/ 				configurable: false,
+/******/ 				enumerable: true,
+/******/ 				get: getter
+/******/ 			});
+/******/ 		}
+/******/ 	};
+/******/
+/******/ 	// getDefaultExport function for compatibility with non-harmony modules
+/******/ 	__webpack_require__.n = function(module) {
+/******/ 		var getter = module && module.__esModule ?
+/******/ 			function getDefault() { return module['default']; } :
+/******/ 			function getModuleExports() { return module; };
+/******/ 		__webpack_require__.d(getter, 'a', getter);
+/******/ 		return getter;
+/******/ 	};
+/******/
+/******/ 	// Object.prototype.hasOwnProperty.call
+/******/ 	__webpack_require__.o = function(object, property) { return Object.prototype.hasOwnProperty.call(object, property); };
+/******/
+/******/ 	// __webpack_public_path__
+/******/ 	__webpack_require__.p = "/assets/";
+/******/
+/******/ 	// Load entry module and return exports
+/******/ 	return __webpack_require__(__webpack_require__.s = 19);
+/******/ })
+/************************************************************************/
+/******/ ({
+
+/***/ 19:
+/***/ (function(module, exports) {
+
+// removed by extract-text-webpack-plugin
+
+/***/ })
+
+/******/ });

+ 1391 - 0
support/client/lib/vwf/view/lib/mdc/dist/mdc.slider.js

@@ -0,0 +1,1391 @@
+/*!
+ Material Components for the web
+ Copyright (c) 2017 Google Inc.
+ License: Apache-2.0
+*/
+(function webpackUniversalModuleDefinition(root, factory) {
+	if(typeof exports === 'object' && typeof module === 'object')
+		module.exports = factory();
+	else if(typeof define === 'function' && define.amd)
+		define([], factory);
+	else if(typeof exports === 'object')
+		exports["slider"] = factory();
+	else
+		root["mdc"] = root["mdc"] || {}, root["mdc"]["slider"] = factory();
+})(this, function() {
+return /******/ (function(modules) { // webpackBootstrap
+/******/ 	// The module cache
+/******/ 	var installedModules = {};
+/******/
+/******/ 	// The require function
+/******/ 	function __webpack_require__(moduleId) {
+/******/
+/******/ 		// Check if module is in cache
+/******/ 		if(installedModules[moduleId]) {
+/******/ 			return installedModules[moduleId].exports;
+/******/ 		}
+/******/ 		// Create a new module (and put it into the cache)
+/******/ 		var module = installedModules[moduleId] = {
+/******/ 			i: moduleId,
+/******/ 			l: false,
+/******/ 			exports: {}
+/******/ 		};
+/******/
+/******/ 		// Execute the module function
+/******/ 		modules[moduleId].call(module.exports, module, module.exports, __webpack_require__);
+/******/
+/******/ 		// Flag the module as loaded
+/******/ 		module.l = true;
+/******/
+/******/ 		// Return the exports of the module
+/******/ 		return module.exports;
+/******/ 	}
+/******/
+/******/
+/******/ 	// expose the modules object (__webpack_modules__)
+/******/ 	__webpack_require__.m = modules;
+/******/
+/******/ 	// expose the module cache
+/******/ 	__webpack_require__.c = installedModules;
+/******/
+/******/ 	// identity function for calling harmony imports with the correct context
+/******/ 	__webpack_require__.i = function(value) { return value; };
+/******/
+/******/ 	// define getter function for harmony exports
+/******/ 	__webpack_require__.d = function(exports, name, getter) {
+/******/ 		if(!__webpack_require__.o(exports, name)) {
+/******/ 			Object.defineProperty(exports, name, {
+/******/ 				configurable: false,
+/******/ 				enumerable: true,
+/******/ 				get: getter
+/******/ 			});
+/******/ 		}
+/******/ 	};
+/******/
+/******/ 	// getDefaultExport function for compatibility with non-harmony modules
+/******/ 	__webpack_require__.n = function(module) {
+/******/ 		var getter = module && module.__esModule ?
+/******/ 			function getDefault() { return module['default']; } :
+/******/ 			function getModuleExports() { return module; };
+/******/ 		__webpack_require__.d(getter, 'a', getter);
+/******/ 		return getter;
+/******/ 	};
+/******/
+/******/ 	// Object.prototype.hasOwnProperty.call
+/******/ 	__webpack_require__.o = function(object, property) { return Object.prototype.hasOwnProperty.call(object, property); };
+/******/
+/******/ 	// __webpack_public_path__
+/******/ 	__webpack_require__.p = "/assets/";
+/******/
+/******/ 	// Load entry module and return exports
+/******/ 	return __webpack_require__(__webpack_require__.s = 95);
+/******/ })
+/************************************************************************/
+/******/ ({
+
+/***/ 0:
+/***/ (function(module, __webpack_exports__, __webpack_require__) {
+
+"use strict";
+var _createClass = function () { function defineProperties(target, props) { for (var i = 0; i < props.length; i++) { var descriptor = props[i]; descriptor.enumerable = descriptor.enumerable || false; descriptor.configurable = true; if ("value" in descriptor) descriptor.writable = true; Object.defineProperty(target, descriptor.key, descriptor); } } return function (Constructor, protoProps, staticProps) { if (protoProps) defineProperties(Constructor.prototype, protoProps); if (staticProps) defineProperties(Constructor, staticProps); return Constructor; }; }();
+
+function _classCallCheck(instance, Constructor) { if (!(instance instanceof Constructor)) { throw new TypeError("Cannot call a class as a function"); } }
+
+/**
+ * Copyright 2016 Google Inc.
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *   http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+
+/**
+ * @template A
+ */
+var MDCFoundation = function () {
+  _createClass(MDCFoundation, null, [{
+    key: "cssClasses",
+
+    /** @return enum{cssClasses} */
+    get: function get() {
+      // Classes extending MDCFoundation should implement this method to return an object which exports every
+      // CSS class the foundation class needs as a property. e.g. {ACTIVE: 'mdc-component--active'}
+      return {};
+    }
+
+    /** @return enum{strings} */
+
+  }, {
+    key: "strings",
+    get: function get() {
+      // Classes extending MDCFoundation should implement this method to return an object which exports all
+      // semantic strings as constants. e.g. {ARIA_ROLE: 'tablist'}
+      return {};
+    }
+
+    /** @return enum{numbers} */
+
+  }, {
+    key: "numbers",
+    get: function get() {
+      // Classes extending MDCFoundation should implement this method to return an object which exports all
+      // of its semantic numbers as constants. e.g. {ANIMATION_DELAY_MS: 350}
+      return {};
+    }
+
+    /** @return {!Object} */
+
+  }, {
+    key: "defaultAdapter",
+    get: function get() {
+      // Classes extending MDCFoundation may choose to implement this getter in order to provide a convenient
+      // way of viewing the necessary methods of an adapter. In the future, this could also be used for adapter
+      // validation.
+      return {};
+    }
+
+    /**
+     * @param {A=} adapter
+     */
+
+  }]);
+
+  function MDCFoundation() {
+    var adapter = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : {};
+
+    _classCallCheck(this, MDCFoundation);
+
+    /** @protected {!A} */
+    this.adapter_ = adapter;
+  }
+
+  _createClass(MDCFoundation, [{
+    key: "init",
+    value: function init() {
+      // Subclasses should override this method to perform initialization routines (registering events, etc.)
+    }
+  }, {
+    key: "destroy",
+    value: function destroy() {
+      // Subclasses should override this method to perform de-initialization routines (de-registering events, etc.)
+    }
+  }]);
+
+  return MDCFoundation;
+}();
+
+/* harmony default export */ __webpack_exports__["a"] = (MDCFoundation);
+
+/***/ }),
+
+/***/ 1:
+/***/ (function(module, __webpack_exports__, __webpack_require__) {
+
+"use strict";
+/* harmony import */ var __WEBPACK_IMPORTED_MODULE_0__foundation__ = __webpack_require__(0);
+var _createClass = function () { function defineProperties(target, props) { for (var i = 0; i < props.length; i++) { var descriptor = props[i]; descriptor.enumerable = descriptor.enumerable || false; descriptor.configurable = true; if ("value" in descriptor) descriptor.writable = true; Object.defineProperty(target, descriptor.key, descriptor); } } return function (Constructor, protoProps, staticProps) { if (protoProps) defineProperties(Constructor.prototype, protoProps); if (staticProps) defineProperties(Constructor, staticProps); return Constructor; }; }();
+
+function _classCallCheck(instance, Constructor) { if (!(instance instanceof Constructor)) { throw new TypeError("Cannot call a class as a function"); } }
+
+/**
+ * Copyright 2016 Google Inc.
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *   http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+
+
+
+/**
+ * @template F
+ */
+
+var MDCComponent = function () {
+  _createClass(MDCComponent, null, [{
+    key: 'attachTo',
+
+    /**
+     * @param {!Element} root
+     * @return {!MDCComponent}
+     */
+    value: function attachTo(root) {
+      // Subclasses which extend MDCBase should provide an attachTo() method that takes a root element and
+      // returns an instantiated component with its root set to that element. Also note that in the cases of
+      // subclasses, an explicit foundation class will not have to be passed in; it will simply be initialized
+      // from getDefaultFoundation().
+      return new MDCComponent(root, new __WEBPACK_IMPORTED_MODULE_0__foundation__["a" /* default */]());
+    }
+
+    /**
+     * @param {!Element} root
+     * @param {F=} foundation
+     * @param {...?} args
+     */
+
+  }]);
+
+  function MDCComponent(root) {
+    var foundation = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : undefined;
+
+    _classCallCheck(this, MDCComponent);
+
+    /** @protected {!Element} */
+    this.root_ = root;
+
+    for (var _len = arguments.length, args = Array(_len > 2 ? _len - 2 : 0), _key = 2; _key < _len; _key++) {
+      args[_key - 2] = arguments[_key];
+    }
+
+    this.initialize.apply(this, args);
+    // Note that we initialize foundation here and not within the constructor's default param so that
+    // this.root_ is defined and can be used within the foundation class.
+    /** @protected {!F} */
+    this.foundation_ = foundation === undefined ? this.getDefaultFoundation() : foundation;
+    this.foundation_.init();
+    this.initialSyncWithDOM();
+  }
+
+  _createClass(MDCComponent, [{
+    key: 'initialize',
+    value: function initialize() /* ...args */{}
+    // Subclasses can override this to do any additional setup work that would be considered part of a
+    // "constructor". Essentially, it is a hook into the parent constructor before the foundation is
+    // initialized. Any additional arguments besides root and foundation will be passed in here.
+
+
+    /**
+     * @return {!F} foundation
+     */
+
+  }, {
+    key: 'getDefaultFoundation',
+    value: function getDefaultFoundation() {
+      // Subclasses must override this method to return a properly configured foundation class for the
+      // component.
+      throw new Error('Subclasses must override getDefaultFoundation to return a properly configured ' + 'foundation class');
+    }
+  }, {
+    key: 'initialSyncWithDOM',
+    value: function initialSyncWithDOM() {
+      // Subclasses should override this method if they need to perform work to synchronize with a host DOM
+      // object. An example of this would be a form control wrapper that needs to synchronize its internal state
+      // to some property or attribute of the host DOM. Please note: this is *not* the place to perform DOM
+      // reads/writes that would cause layout / paint, as this is called synchronously from within the constructor.
+    }
+  }, {
+    key: 'destroy',
+    value: function destroy() {
+      // Subclasses may implement this method to release any resources / deregister any listeners they have
+      // attached. An example of this might be deregistering a resize event from the window object.
+      this.foundation_.destroy();
+    }
+
+    /**
+     * Wrapper method to add an event listener to the component's root element. This is most useful when
+     * listening for custom events.
+     * @param {string} evtType
+     * @param {!Function} handler
+     */
+
+  }, {
+    key: 'listen',
+    value: function listen(evtType, handler) {
+      this.root_.addEventListener(evtType, handler);
+    }
+
+    /**
+     * Wrapper method to remove an event listener to the component's root element. This is most useful when
+     * unlistening for custom events.
+     * @param {string} evtType
+     * @param {!Function} handler
+     */
+
+  }, {
+    key: 'unlisten',
+    value: function unlisten(evtType, handler) {
+      this.root_.removeEventListener(evtType, handler);
+    }
+
+    /**
+     * Fires a cross-browser-compatible custom event from the component root of the given type,
+     * with the given data.
+     * @param {string} evtType
+     * @param {!Object} evtData
+     * @param {boolean=} shouldBubble
+     */
+
+  }, {
+    key: 'emit',
+    value: function emit(evtType, evtData) {
+      var shouldBubble = arguments.length > 2 && arguments[2] !== undefined ? arguments[2] : false;
+
+      var evt = void 0;
+      if (typeof CustomEvent === 'function') {
+        evt = new CustomEvent(evtType, {
+          detail: evtData,
+          bubbles: shouldBubble
+        });
+      } else {
+        evt = document.createEvent('CustomEvent');
+        evt.initCustomEvent(evtType, shouldBubble, false, evtData);
+      }
+
+      this.root_.dispatchEvent(evt);
+    }
+  }]);
+
+  return MDCComponent;
+}();
+
+/* harmony default export */ __webpack_exports__["a"] = (MDCComponent);
+
+/***/ }),
+
+/***/ 18:
+/***/ (function(module, __webpack_exports__, __webpack_require__) {
+
+"use strict";
+/* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, "b", function() { return cssClasses; });
+/* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, "a", function() { return strings; });
+/* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, "c", function() { return numbers; });
+/**
+ * Copyright 2017 Google Inc. All Rights Reserved.
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ * http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+
+var cssClasses = {
+  ACTIVE: 'mdc-slider--active',
+  DISABLED: 'mdc-slider--disabled',
+  DISCRETE: 'mdc-slider--discrete',
+  FOCUS: 'mdc-slider--focus',
+  IN_TRANSIT: 'mdc-slider--in-transit',
+  OFF: 'mdc-slider--off',
+  IS_DISCRETE: 'mdc-slider--discrete',
+  HAS_TRACK_MARKER: 'mdc-slider--display-markers'
+};
+
+var strings = {
+  TRACK_SELECTOR: '.mdc-slider__track',
+  TRACK_MARKER_CONTAINER_SELECTOR: '.mdc-slider__track-marker-container',
+  LAST_TRACK_MARKER_SELECTOR: '.mdc-slider__track-marker:last-child',
+  THUMB_CONTAINER_SELECTOR: '.mdc-slider__thumb-container',
+  PIN_VALUE_MARKER_SELECTOR: '.mdc-slider__pin-value-marker',
+  ARIA_VALUEMIN: 'aria-valuemin',
+  ARIA_VALUEMAX: 'aria-valuemax',
+  ARIA_VALUENOW: 'aria-valuenow',
+  ARIA_DISABLED: 'aria-disabled',
+  STEP_DATA_ATTR: 'data-step',
+  CHANGE_EVENT: 'MDCSlider:change',
+  INPUT_EVENT: 'MDCSlider:input'
+};
+
+var numbers = {
+  PAGE_FACTOR: 4
+};
+
+/***/ }),
+
+/***/ 33:
+/***/ (function(module, __webpack_exports__, __webpack_require__) {
+
+"use strict";
+Object.defineProperty(__webpack_exports__, "__esModule", { value: true });
+/* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, "MDCSlider", function() { return MDCSlider; });
+/* harmony import */ var __WEBPACK_IMPORTED_MODULE_0__material_base_component__ = __webpack_require__(1);
+/* harmony import */ var __WEBPACK_IMPORTED_MODULE_1__constants__ = __webpack_require__(18);
+/* harmony import */ var __WEBPACK_IMPORTED_MODULE_2__foundation__ = __webpack_require__(66);
+/* harmony reexport (binding) */ __webpack_require__.d(__webpack_exports__, "MDCSliderFoundation", function() { return __WEBPACK_IMPORTED_MODULE_2__foundation__["a"]; });
+var _createClass = function () { function defineProperties(target, props) { for (var i = 0; i < props.length; i++) { var descriptor = props[i]; descriptor.enumerable = descriptor.enumerable || false; descriptor.configurable = true; if ("value" in descriptor) descriptor.writable = true; Object.defineProperty(target, descriptor.key, descriptor); } } return function (Constructor, protoProps, staticProps) { if (protoProps) defineProperties(Constructor.prototype, protoProps); if (staticProps) defineProperties(Constructor, staticProps); return Constructor; }; }();
+
+function _classCallCheck(instance, Constructor) { if (!(instance instanceof Constructor)) { throw new TypeError("Cannot call a class as a function"); } }
+
+function _possibleConstructorReturn(self, call) { if (!self) { throw new ReferenceError("this hasn't been initialised - super() hasn't been called"); } return call && (typeof call === "object" || typeof call === "function") ? call : self; }
+
+function _inherits(subClass, superClass) { if (typeof superClass !== "function" && superClass !== null) { throw new TypeError("Super expression must either be null or a function, not " + typeof superClass); } subClass.prototype = Object.create(superClass && superClass.prototype, { constructor: { value: subClass, enumerable: false, writable: true, configurable: true } }); if (superClass) Object.setPrototypeOf ? Object.setPrototypeOf(subClass, superClass) : subClass.__proto__ = superClass; }
+
+/**
+ * Copyright 2017 Google Inc. All Rights Reserved.
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ * http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+
+
+
+
+
+
+
+
+var MDCSlider = function (_MDCComponent) {
+  _inherits(MDCSlider, _MDCComponent);
+
+  function MDCSlider() {
+    _classCallCheck(this, MDCSlider);
+
+    return _possibleConstructorReturn(this, (MDCSlider.__proto__ || Object.getPrototypeOf(MDCSlider)).apply(this, arguments));
+  }
+
+  _createClass(MDCSlider, [{
+    key: 'initialize',
+    value: function initialize() {
+      this.thumbContainer_ = this.root_.querySelector(__WEBPACK_IMPORTED_MODULE_1__constants__["a" /* strings */].THUMB_CONTAINER_SELECTOR);
+      this.track_ = this.root_.querySelector(__WEBPACK_IMPORTED_MODULE_1__constants__["a" /* strings */].TRACK_SELECTOR);
+      this.pinValueMarker_ = this.root_.querySelector(__WEBPACK_IMPORTED_MODULE_1__constants__["a" /* strings */].PIN_VALUE_MARKER_SELECTOR);
+      this.trackMarkerContainer_ = this.root_.querySelector(__WEBPACK_IMPORTED_MODULE_1__constants__["a" /* strings */].TRACK_MARKER_CONTAINER_SELECTOR);
+    }
+  }, {
+    key: 'getDefaultFoundation',
+    value: function getDefaultFoundation() {
+      var _this2 = this;
+
+      return new __WEBPACK_IMPORTED_MODULE_2__foundation__["a" /* default */]({
+        hasClass: function hasClass(className) {
+          return _this2.root_.classList.contains(className);
+        },
+        addClass: function addClass(className) {
+          return _this2.root_.classList.add(className);
+        },
+        removeClass: function removeClass(className) {
+          return _this2.root_.classList.remove(className);
+        },
+        getAttribute: function getAttribute(name) {
+          return _this2.root_.getAttribute(name);
+        },
+        setAttribute: function setAttribute(name, value) {
+          return _this2.root_.setAttribute(name, value);
+        },
+        removeAttribute: function removeAttribute(name) {
+          return _this2.root_.removeAttribute(name);
+        },
+        computeBoundingRect: function computeBoundingRect() {
+          return _this2.root_.getBoundingClientRect();
+        },
+        getTabIndex: function getTabIndex() {
+          return _this2.root_.tabIndex;
+        },
+        registerInteractionHandler: function registerInteractionHandler(type, handler) {
+          _this2.root_.addEventListener(type, handler);
+        },
+        deregisterInteractionHandler: function deregisterInteractionHandler(type, handler) {
+          _this2.root_.removeEventListener(type, handler);
+        },
+        registerThumbContainerInteractionHandler: function registerThumbContainerInteractionHandler(type, handler) {
+          _this2.thumbContainer_.addEventListener(type, handler);
+        },
+        deregisterThumbContainerInteractionHandler: function deregisterThumbContainerInteractionHandler(type, handler) {
+          _this2.thumbContainer_.removeEventListener(type, handler);
+        },
+        registerBodyInteractionHandler: function registerBodyInteractionHandler(type, handler) {
+          document.body.addEventListener(type, handler);
+        },
+        deregisterBodyInteractionHandler: function deregisterBodyInteractionHandler(type, handler) {
+          document.body.removeEventListener(type, handler);
+        },
+        registerResizeHandler: function registerResizeHandler(handler) {
+          window.addEventListener('resize', handler);
+        },
+        deregisterResizeHandler: function deregisterResizeHandler(handler) {
+          window.removeEventListener('resize', handler);
+        },
+        notifyInput: function notifyInput() {
+          _this2.emit(__WEBPACK_IMPORTED_MODULE_1__constants__["a" /* strings */].INPUT_EVENT, _this2);
+        },
+        notifyChange: function notifyChange() {
+          _this2.emit(__WEBPACK_IMPORTED_MODULE_1__constants__["a" /* strings */].CHANGE_EVENT, _this2);
+        },
+        setThumbContainerStyleProperty: function setThumbContainerStyleProperty(propertyName, value) {
+          _this2.thumbContainer_.style.setProperty(propertyName, value);
+        },
+        setTrackStyleProperty: function setTrackStyleProperty(propertyName, value) {
+          _this2.track_.style.setProperty(propertyName, value);
+        },
+        setMarkerValue: function setMarkerValue(value) {
+          _this2.pinValueMarker_.innerText = value;
+        },
+        appendTrackMarkers: function appendTrackMarkers(numMarkers) {
+          var frag = document.createDocumentFragment();
+          for (var i = 0; i < numMarkers; i++) {
+            var marker = document.createElement('div');
+            marker.classList.add('mdc-slider__track-marker');
+            frag.appendChild(marker);
+          }
+          _this2.trackMarkerContainer_.appendChild(frag);
+        },
+        removeTrackMarkers: function removeTrackMarkers() {
+          while (_this2.trackMarkerContainer_.firstChild) {
+            _this2.trackMarkerContainer_.removeChild(_this2.trackMarkerContainer_.firstChild);
+          }
+        },
+        setLastTrackMarkersStyleProperty: function setLastTrackMarkersStyleProperty(propertyName, value) {
+          // We remove and append new nodes, thus, the last track marker must be dynamically found.
+          var lastTrackMarker = _this2.root_.querySelector(__WEBPACK_IMPORTED_MODULE_1__constants__["a" /* strings */].LAST_TRACK_MARKER_SELECTOR);
+          lastTrackMarker.style.setProperty(propertyName, value);
+        },
+        isRTL: function isRTL() {
+          return getComputedStyle(_this2.root_).direction === 'rtl';
+        }
+      });
+    }
+  }, {
+    key: 'initialSyncWithDOM',
+    value: function initialSyncWithDOM() {
+      var origValueNow = parseFloat(this.root_.getAttribute(__WEBPACK_IMPORTED_MODULE_1__constants__["a" /* strings */].ARIA_VALUENOW));
+      this.min = parseFloat(this.root_.getAttribute(__WEBPACK_IMPORTED_MODULE_1__constants__["a" /* strings */].ARIA_VALUEMIN)) || this.min;
+      this.max = parseFloat(this.root_.getAttribute(__WEBPACK_IMPORTED_MODULE_1__constants__["a" /* strings */].ARIA_VALUEMAX)) || this.max;
+      this.step = parseFloat(this.root_.getAttribute(__WEBPACK_IMPORTED_MODULE_1__constants__["a" /* strings */].STEP_DATA_ATTR)) || this.step;
+      this.value = origValueNow || this.value;
+      this.disabled = this.root_.hasAttribute(__WEBPACK_IMPORTED_MODULE_1__constants__["a" /* strings */].ARIA_DISABLED) && this.root_.getAttribute(__WEBPACK_IMPORTED_MODULE_1__constants__["a" /* strings */].ARIA_DISABLED) !== 'false';
+      this.foundation_.setupTrackMarker();
+    }
+  }, {
+    key: 'layout',
+    value: function layout() {
+      this.foundation_.layout();
+    }
+  }, {
+    key: 'stepUp',
+    value: function stepUp() {
+      var amount = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : this.step || 1;
+
+      this.value += amount;
+    }
+  }, {
+    key: 'stepDown',
+    value: function stepDown() {
+      var amount = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : this.step || 1;
+
+      this.value -= amount;
+    }
+  }, {
+    key: 'value',
+    get: function get() {
+      return this.foundation_.getValue();
+    },
+    set: function set(value) {
+      this.foundation_.setValue(value);
+    }
+  }, {
+    key: 'min',
+    get: function get() {
+      return this.foundation_.getMin();
+    },
+    set: function set(min) {
+      this.foundation_.setMin(min);
+    }
+  }, {
+    key: 'max',
+    get: function get() {
+      return this.foundation_.getMax();
+    },
+    set: function set(max) {
+      this.foundation_.setMax(max);
+    }
+  }, {
+    key: 'step',
+    get: function get() {
+      return this.foundation_.getStep();
+    },
+    set: function set(step) {
+      this.foundation_.setStep(step);
+    }
+  }, {
+    key: 'disabled',
+    get: function get() {
+      return this.foundation_.isDisabled();
+    },
+    set: function set(disabled) {
+      this.foundation_.setDisabled(disabled);
+    }
+  }], [{
+    key: 'attachTo',
+    value: function attachTo(root) {
+      return new MDCSlider(root);
+    }
+  }]);
+
+  return MDCSlider;
+}(__WEBPACK_IMPORTED_MODULE_0__material_base_component__["a" /* default */]);
+
+/***/ }),
+
+/***/ 66:
+/***/ (function(module, __webpack_exports__, __webpack_require__) {
+
+"use strict";
+/* harmony import */ var __WEBPACK_IMPORTED_MODULE_0__constants__ = __webpack_require__(18);
+/* harmony import */ var __WEBPACK_IMPORTED_MODULE_1__material_animation__ = __webpack_require__(9);
+/* harmony import */ var __WEBPACK_IMPORTED_MODULE_2__material_base_foundation__ = __webpack_require__(0);
+var _extends = Object.assign || function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; };
+
+var _createClass = function () { function defineProperties(target, props) { for (var i = 0; i < props.length; i++) { var descriptor = props[i]; descriptor.enumerable = descriptor.enumerable || false; descriptor.configurable = true; if ("value" in descriptor) descriptor.writable = true; Object.defineProperty(target, descriptor.key, descriptor); } } return function (Constructor, protoProps, staticProps) { if (protoProps) defineProperties(Constructor.prototype, protoProps); if (staticProps) defineProperties(Constructor, staticProps); return Constructor; }; }();
+
+function _classCallCheck(instance, Constructor) { if (!(instance instanceof Constructor)) { throw new TypeError("Cannot call a class as a function"); } }
+
+function _possibleConstructorReturn(self, call) { if (!self) { throw new ReferenceError("this hasn't been initialised - super() hasn't been called"); } return call && (typeof call === "object" || typeof call === "function") ? call : self; }
+
+function _inherits(subClass, superClass) { if (typeof superClass !== "function" && superClass !== null) { throw new TypeError("Super expression must either be null or a function, not " + typeof superClass); } subClass.prototype = Object.create(superClass && superClass.prototype, { constructor: { value: subClass, enumerable: false, writable: true, configurable: true } }); if (superClass) Object.setPrototypeOf ? Object.setPrototypeOf(subClass, superClass) : subClass.__proto__ = superClass; }
+
+/**
+ * Copyright 2017 Google Inc. All Rights Reserved.
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ *you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ * http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+
+
+
+
+
+
+var KEY_IDS = {
+  ARROW_LEFT: 'ArrowLeft',
+  ARROW_RIGHT: 'ArrowRight',
+  ARROW_UP: 'ArrowUp',
+  ARROW_DOWN: 'ArrowDown',
+  HOME: 'Home',
+  END: 'End',
+  PAGE_UP: 'PageUp',
+  PAGE_DOWN: 'PageDown'
+};
+
+var MDCSliderFoundation = function (_MDCFoundation) {
+  _inherits(MDCSliderFoundation, _MDCFoundation);
+
+  _createClass(MDCSliderFoundation, null, [{
+    key: 'cssClasses',
+    get: function get() {
+      return __WEBPACK_IMPORTED_MODULE_0__constants__["b" /* cssClasses */];
+    }
+  }, {
+    key: 'strings',
+    get: function get() {
+      return __WEBPACK_IMPORTED_MODULE_0__constants__["a" /* strings */];
+    }
+  }, {
+    key: 'numbers',
+    get: function get() {
+      return __WEBPACK_IMPORTED_MODULE_0__constants__["c" /* numbers */];
+    }
+  }, {
+    key: 'defaultAdapter',
+    get: function get() {
+      return {
+        hasClass: function hasClass() {
+          return (/* className: string */ /* boolean */false
+          );
+        },
+        addClass: function addClass() /* className: string */{},
+        removeClass: function removeClass() /* className: string */{},
+        getAttribute: function getAttribute() {
+          return (/* name: string */ /* string|null */null
+          );
+        },
+        setAttribute: function setAttribute() /* name: string, value: string */{},
+        removeAttribute: function removeAttribute() /* name: string */{},
+        computeBoundingRect: function computeBoundingRect() {
+          return (/* ClientRect */{
+              top: 0, right: 0, bottom: 0, left: 0, width: 0, height: 0
+            }
+          );
+        },
+        getTabIndex: function getTabIndex() {
+          return (/* number */0
+          );
+        },
+        registerInteractionHandler: function registerInteractionHandler() /* type: string, handler: EventListener */{},
+        deregisterInteractionHandler: function deregisterInteractionHandler() /* type: string, handler: EventListener */{},
+        registerThumbContainerInteractionHandler: function registerThumbContainerInteractionHandler() /* type: string, handler: EventListener */{},
+        deregisterThumbContainerInteractionHandler: function deregisterThumbContainerInteractionHandler() /* type: string, handler: EventListener */{},
+        registerBodyInteractionHandler: function registerBodyInteractionHandler() /* type: string, handler: EventListener */{},
+        deregisterBodyInteractionHandler: function deregisterBodyInteractionHandler() /* type: string, handler: EventListener */{},
+        registerResizeHandler: function registerResizeHandler() /* handler: EventListener */{},
+        deregisterResizeHandler: function deregisterResizeHandler() /* handler: EventListener */{},
+        notifyInput: function notifyInput() {},
+        notifyChange: function notifyChange() {},
+        setThumbContainerStyleProperty: function setThumbContainerStyleProperty() /* propertyName: string, value: string */{},
+        setTrackStyleProperty: function setTrackStyleProperty() /* propertyName: string, value: string */{},
+        setMarkerValue: function setMarkerValue() /* value: number */{},
+        appendTrackMarkers: function appendTrackMarkers() /* numMarkers: number */{},
+        removeTrackMarkers: function removeTrackMarkers() {},
+        setLastTrackMarkersStyleProperty: function setLastTrackMarkersStyleProperty() /* propertyName: string, value: string */{},
+        isRTL: function isRTL() {
+          return (/* boolean */false
+          );
+        }
+      };
+    }
+  }]);
+
+  function MDCSliderFoundation() {
+    var adapter = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : {};
+
+    _classCallCheck(this, MDCSliderFoundation);
+
+    var _this = _possibleConstructorReturn(this, (MDCSliderFoundation.__proto__ || Object.getPrototypeOf(MDCSliderFoundation)).call(this, _extends(MDCSliderFoundation.defaultAdapter, adapter)));
+
+    _this.rect_ = null;
+    // We set this to NaN since we want it to be a number, but we can't use '0' or '-1'
+    // because those could be valid tabindices set by the client code.
+    _this.savedTabIndex_ = NaN;
+    _this.off_ = false;
+    _this.active_ = false;
+    _this.inTransit_ = false;
+    _this.isDiscrete_ = false;
+    _this.hasTrackMarker_ = false;
+    _this.handlingThumbTargetEvt_ = false;
+    _this.min_ = 0;
+    _this.max_ = 100;
+    _this.step_ = 0;
+    _this.value_ = 0;
+    _this.disabled_ = false;
+    _this.preventFocusState_ = false;
+    _this.updateUIFrame_ = 0;
+    _this.thumbContainerPointerHandler_ = function () {
+      _this.handlingThumbTargetEvt_ = true;
+    };
+    _this.mousedownHandler_ = _this.createDownHandler_('mousemove', 'mouseup');
+    _this.pointerdownHandler_ = _this.createDownHandler_('pointermove', 'pointerup');
+    _this.touchstartHandler_ = _this.createDownHandler_('touchmove', 'touchend', function (_ref) {
+      var targetTouches = _ref.targetTouches;
+      return targetTouches[0].pageX;
+    });
+    _this.keydownHandler_ = function (evt) {
+      return _this.handleKeydown_(evt);
+    };
+    _this.focusHandler_ = function () {
+      return _this.handleFocus_();
+    };
+    _this.blurHandler_ = function () {
+      return _this.handleBlur_();
+    };
+    _this.resizeHandler_ = function () {
+      return _this.layout();
+    };
+    return _this;
+  }
+
+  _createClass(MDCSliderFoundation, [{
+    key: 'init',
+    value: function init() {
+      var _this2 = this;
+
+      this.isDiscrete_ = this.adapter_.hasClass(__WEBPACK_IMPORTED_MODULE_0__constants__["b" /* cssClasses */].IS_DISCRETE);
+      this.hasTrackMarker_ = this.adapter_.hasClass(__WEBPACK_IMPORTED_MODULE_0__constants__["b" /* cssClasses */].HAS_TRACK_MARKER);
+      this.adapter_.registerInteractionHandler('mousedown', this.mousedownHandler_);
+      this.adapter_.registerInteractionHandler('pointerdown', this.pointerdownHandler_);
+      this.adapter_.registerInteractionHandler('touchstart', this.touchstartHandler_);
+      this.adapter_.registerInteractionHandler('keydown', this.keydownHandler_);
+      this.adapter_.registerInteractionHandler('focus', this.focusHandler_);
+      this.adapter_.registerInteractionHandler('blur', this.blurHandler_);
+      ['mousedown', 'pointerdown', 'touchstart'].forEach(function (evtName) {
+        _this2.adapter_.registerThumbContainerInteractionHandler(evtName, _this2.thumbContainerPointerHandler_);
+      });
+      this.adapter_.registerResizeHandler(this.resizeHandler_);
+      this.layout();
+      // At last step, provide a reasonable default value to discrete slider
+      if (this.isDiscrete_ && this.getStep() == 0) {
+        this.setStep(1);
+      }
+    }
+  }, {
+    key: 'destroy',
+    value: function destroy() {
+      var _this3 = this;
+
+      this.adapter_.deregisterInteractionHandler('mousedown', this.mousedownHandler_);
+      this.adapter_.deregisterInteractionHandler('pointerdown', this.mousedownHandler_);
+      this.adapter_.deregisterInteractionHandler('touchstart', this.mousedownHandler_);
+      this.adapter_.deregisterInteractionHandler('keydown', this.keydownHandler_);
+      this.adapter_.deregisterInteractionHandler('focus', this.focusHandler_);
+      this.adapter_.deregisterInteractionHandler('blur', this.blurHandler_);
+      ['mousedown', 'pointerdown', 'touchstart'].forEach(function (evtName) {
+        _this3.adapter_.deregisterThumbContainerInteractionHandler(evtName, _this3.thumbContainerPointerHandler_);
+      });
+      this.adapter_.deregisterResizeHandler(this.resizeHandler_);
+    }
+  }, {
+    key: 'setupTrackMarker',
+    value: function setupTrackMarker() {
+      if (this.isDiscrete_ && this.hasTrackMarker_ && this.getStep() != 0) {
+        var min = this.getMin();
+        var max = this.getMax();
+        var step = this.getStep();
+        var numMarkers = (max - min) / step;
+
+        // In case distance between max & min is indivisible to step,
+        // we place the secondary to last marker proportionally at where thumb
+        // could reach and place the last marker at max value
+        var indivisible = Math.ceil(numMarkers) !== numMarkers;
+        if (indivisible) {
+          numMarkers = Math.ceil(numMarkers);
+        }
+
+        this.adapter_.removeTrackMarkers();
+        this.adapter_.appendTrackMarkers(numMarkers);
+
+        if (indivisible) {
+          var lastStepRatio = (max - numMarkers * step) / step + 1;
+          var flex = __webpack_require__.i(__WEBPACK_IMPORTED_MODULE_1__material_animation__["getCorrectPropertyName"])(window, 'flex');
+          this.adapter_.setLastTrackMarkersStyleProperty(flex, lastStepRatio);
+        }
+      }
+    }
+  }, {
+    key: 'layout',
+    value: function layout() {
+      this.rect_ = this.adapter_.computeBoundingRect();
+      this.updateUIForCurrentValue_();
+    }
+  }, {
+    key: 'getValue',
+    value: function getValue() {
+      return this.value_;
+    }
+  }, {
+    key: 'setValue',
+    value: function setValue(value) {
+      this.setValue_(value, false);
+    }
+  }, {
+    key: 'getMax',
+    value: function getMax() {
+      return this.max_;
+    }
+  }, {
+    key: 'setMax',
+    value: function setMax(max) {
+      if (max < this.min_) {
+        throw new Error('Cannot set max to be less than the slider\'s minimum value');
+      }
+      this.max_ = max;
+      this.setValue_(this.value_, false, true);
+      this.adapter_.setAttribute(__WEBPACK_IMPORTED_MODULE_0__constants__["a" /* strings */].ARIA_VALUEMAX, String(this.max_));
+      this.setupTrackMarker();
+    }
+  }, {
+    key: 'getMin',
+    value: function getMin() {
+      return this.min_;
+    }
+  }, {
+    key: 'setMin',
+    value: function setMin(min) {
+      if (min > this.max_) {
+        throw new Error('Cannot set min to be greater than the slider\'s maximum value');
+      }
+      this.min_ = min;
+      this.setValue_(this.value_, false, true);
+      this.adapter_.setAttribute(__WEBPACK_IMPORTED_MODULE_0__constants__["a" /* strings */].ARIA_VALUEMIN, String(this.min_));
+      this.setupTrackMarker();
+    }
+  }, {
+    key: 'getStep',
+    value: function getStep() {
+      return this.step_;
+    }
+  }, {
+    key: 'setStep',
+    value: function setStep(step) {
+      if (step < 0) {
+        throw new Error('Step cannot be set to a negative number');
+      }
+      if (this.isDiscrete_ && (typeof step !== 'number' || step < 1)) {
+        step = 1;
+      }
+      this.step_ = step;
+      this.setValue_(this.value_, false, true);
+      this.setupTrackMarker();
+    }
+  }, {
+    key: 'isDisabled',
+    value: function isDisabled() {
+      return this.disabled_;
+    }
+  }, {
+    key: 'setDisabled',
+    value: function setDisabled(disabled) {
+      this.disabled_ = disabled;
+      this.toggleClass_(__WEBPACK_IMPORTED_MODULE_0__constants__["b" /* cssClasses */].DISABLED, this.disabled_);
+      if (this.disabled_) {
+        this.savedTabIndex_ = this.adapter_.getTabIndex();
+        this.adapter_.setAttribute(__WEBPACK_IMPORTED_MODULE_0__constants__["a" /* strings */].ARIA_DISABLED, 'true');
+        this.adapter_.removeAttribute('tabindex');
+      } else {
+        this.adapter_.removeAttribute(__WEBPACK_IMPORTED_MODULE_0__constants__["a" /* strings */].ARIA_DISABLED);
+        if (!isNaN(this.savedTabIndex_)) {
+          this.adapter_.setAttribute('tabindex', String(this.savedTabIndex_));
+        }
+      }
+    }
+  }, {
+    key: 'createDownHandler_',
+    value: function createDownHandler_(moveEvt, upEvt) {
+      var _this4 = this;
+
+      var getPageX = arguments.length > 2 && arguments[2] !== undefined ? arguments[2] : function (_ref2) {
+        var pageX = _ref2.pageX;
+        return pageX;
+      };
+
+      var moveHandler = function moveHandler(evt) {
+        evt.preventDefault();
+        _this4.setValueFromEvt_(evt, getPageX);
+      };
+
+      var upHandler = function upHandler() {
+        _this4.setActive_(false);
+        _this4.adapter_.deregisterBodyInteractionHandler(moveEvt, moveHandler);
+        _this4.adapter_.deregisterBodyInteractionHandler(upEvt, upHandler);
+        _this4.adapter_.notifyChange();
+      };
+
+      var downHandler = function downHandler(evt) {
+        if (_this4.disabled_) {
+          return;
+        }
+
+        _this4.preventFocusState_ = true;
+        _this4.setInTransit_(!_this4.handlingThumbTargetEvt_);
+        _this4.handlingThumbTargetEvt_ = false;
+
+        _this4.setActive_(true);
+
+        _this4.adapter_.registerBodyInteractionHandler(moveEvt, moveHandler);
+        _this4.adapter_.registerBodyInteractionHandler(upEvt, upHandler);
+        _this4.setValueFromEvt_(evt, getPageX);
+      };
+
+      return downHandler;
+    }
+  }, {
+    key: 'setValueFromEvt_',
+    value: function setValueFromEvt_(evt, getPageX) {
+      var pageX = getPageX(evt);
+      var value = this.computeValueFromPageX_(pageX);
+      this.setValue_(value, true);
+    }
+  }, {
+    key: 'computeValueFromPageX_',
+    value: function computeValueFromPageX_(pageX) {
+      var max = this.max_,
+          min = this.min_;
+
+      var xPos = pageX - this.rect_.left;
+      var pctComplete = xPos / this.rect_.width;
+      if (this.adapter_.isRTL()) {
+        pctComplete = 1 - pctComplete;
+      }
+      // Fit the percentage complete between the range [min,max]
+      // by remapping from [0, 1] to [min, min+(max-min)].
+      return min + pctComplete * (max - min);
+    }
+  }, {
+    key: 'handleKeydown_',
+    value: function handleKeydown_(evt) {
+      var keyId = this.getKeyId_(evt);
+      var value = this.getValueForKeyId_(keyId);
+      if (isNaN(value)) {
+        return;
+      }
+
+      // Prevent page from scrolling due to key presses that would normally scroll the page
+      evt.preventDefault();
+      this.adapter_.addClass(__WEBPACK_IMPORTED_MODULE_0__constants__["b" /* cssClasses */].FOCUS);
+      this.setValue_(value, true);
+      this.adapter_.notifyChange();
+    }
+  }, {
+    key: 'getKeyId_',
+    value: function getKeyId_(kbdEvt) {
+      switch (kbdEvt.key || kbdEvt.keyCode) {
+        case KEY_IDS.ARROW_LEFT:
+        case 37:
+          return KEY_IDS.ARROW_LEFT;
+        case KEY_IDS.ARROW_RIGHT:
+        case 39:
+          return KEY_IDS.ARROW_RIGHT;
+        case KEY_IDS.ARROW_UP:
+        case 38:
+          return KEY_IDS.ARROW_UP;
+        case KEY_IDS.ARROW_DOWN:
+        case 40:
+          return KEY_IDS.ARROW_DOWN;
+        case KEY_IDS.HOME:
+        case 36:
+          return KEY_IDS.HOME;
+        case KEY_IDS.END:
+        case 35:
+          return KEY_IDS.END;
+        case KEY_IDS.PAGE_UP:
+        case 33:
+          return KEY_IDS.PAGE_UP;
+        case KEY_IDS.PAGE_DOWN:
+        case 34:
+          return KEY_IDS.PAGE_DOWN;
+        default:
+          // Doesn't matter
+          return '';
+      }
+    }
+  }, {
+    key: 'getValueForKeyId_',
+    value: function getValueForKeyId_(keyId) {
+      var max = this.max_,
+          min = this.min_,
+          step = this.step_;
+
+      var delta = step || (max - min) / 100;
+      var valueNeedsToBeFlipped = this.adapter_.isRTL() && (keyId === KEY_IDS.ARROW_LEFT || keyId === KEY_IDS.ARROW_RIGHT);
+      if (valueNeedsToBeFlipped) {
+        delta = -delta;
+      }
+
+      switch (keyId) {
+        case KEY_IDS.ARROW_LEFT:
+        case KEY_IDS.ARROW_DOWN:
+          return this.value_ - delta;
+        case KEY_IDS.ARROW_RIGHT:
+        case KEY_IDS.ARROW_UP:
+          return this.value_ + delta;
+        case KEY_IDS.HOME:
+          return this.min_;
+        case KEY_IDS.END:
+          return this.max_;
+        case KEY_IDS.PAGE_UP:
+          return this.value_ + delta * __WEBPACK_IMPORTED_MODULE_0__constants__["c" /* numbers */].PAGE_FACTOR;
+        case KEY_IDS.PAGE_DOWN:
+          return this.value_ - delta * __WEBPACK_IMPORTED_MODULE_0__constants__["c" /* numbers */].PAGE_FACTOR;
+        default:
+          return NaN;
+      }
+    }
+  }, {
+    key: 'handleFocus_',
+    value: function handleFocus_() {
+      if (this.preventFocusState_) {
+        return;
+      }
+      this.adapter_.addClass(__WEBPACK_IMPORTED_MODULE_0__constants__["b" /* cssClasses */].FOCUS);
+    }
+  }, {
+    key: 'handleBlur_',
+    value: function handleBlur_() {
+      this.preventFocusState_ = false;
+      this.adapter_.removeClass(__WEBPACK_IMPORTED_MODULE_0__constants__["b" /* cssClasses */].FOCUS);
+    }
+  }, {
+    key: 'setValue_',
+    value: function setValue_(value, shouldFireInput) {
+      var force = arguments.length > 2 && arguments[2] !== undefined ? arguments[2] : false;
+
+      if (value === this.value_ && !force) {
+        return;
+      }
+
+      var min = this.min_,
+          max = this.max_;
+
+      var valueSetToBoundary = value === min || value === max;
+      if (this.step_ && !valueSetToBoundary) {
+        value = this.quantize_(value);
+      }
+      if (value < min) {
+        value = min;
+      } else if (value > max) {
+        value = max;
+      }
+      this.value_ = value;
+      this.adapter_.setAttribute(__WEBPACK_IMPORTED_MODULE_0__constants__["a" /* strings */].ARIA_VALUENOW, String(this.value_));
+      this.updateUIForCurrentValue_();
+
+      if (shouldFireInput) {
+        this.adapter_.notifyInput();
+        if (this.isDiscrete_) {
+          this.adapter_.setMarkerValue(value);
+        }
+      }
+    }
+  }, {
+    key: 'quantize_',
+    value: function quantize_(value) {
+      var numSteps = Math.round(value / this.step_);
+      var quantizedVal = numSteps * this.step_;
+      return quantizedVal;
+    }
+  }, {
+    key: 'updateUIForCurrentValue_',
+    value: function updateUIForCurrentValue_() {
+      var _this5 = this;
+
+      var max = this.max_,
+          min = this.min_,
+          value = this.value_;
+
+      var pctComplete = (value - min) / (max - min);
+      var translatePx = pctComplete * this.rect_.width;
+      if (this.adapter_.isRTL()) {
+        translatePx = this.rect_.width - translatePx;
+      }
+
+      var transformProp = __webpack_require__.i(__WEBPACK_IMPORTED_MODULE_1__material_animation__["getCorrectPropertyName"])(window, 'transform');
+      var transitionendEvtName = __webpack_require__.i(__WEBPACK_IMPORTED_MODULE_1__material_animation__["getCorrectEventName"])(window, 'transitionend');
+
+      if (this.inTransit_) {
+        var onTransitionEnd = function onTransitionEnd() {
+          _this5.setInTransit_(false);
+          _this5.adapter_.deregisterThumbContainerInteractionHandler(transitionendEvtName, onTransitionEnd);
+        };
+        this.adapter_.registerThumbContainerInteractionHandler(transitionendEvtName, onTransitionEnd);
+      }
+
+      this.updateUIFrame_ = requestAnimationFrame(function () {
+        _this5.setOff_(pctComplete === 0);
+        // NOTE(traviskaufman): It would be nice to use calc() here,
+        // but IE cannot handle calcs in transforms correctly.
+        // See: https://goo.gl/NC2itk
+        // Also note that the -50% offset is used to center the slider thumb.
+        _this5.adapter_.setThumbContainerStyleProperty(transformProp, 'translateX(' + translatePx + 'px) translateX(-50%)');
+        _this5.adapter_.setTrackStyleProperty(transformProp, 'scaleX(' + pctComplete + ')');
+      });
+    }
+  }, {
+    key: 'setOff_',
+    value: function setOff_(off) {
+      this.off_ = off;
+      this.toggleClass_(__WEBPACK_IMPORTED_MODULE_0__constants__["b" /* cssClasses */].OFF, this.off_);
+    }
+  }, {
+    key: 'setActive_',
+    value: function setActive_(active) {
+      this.active_ = active;
+      this.toggleClass_(__WEBPACK_IMPORTED_MODULE_0__constants__["b" /* cssClasses */].ACTIVE, this.active_);
+    }
+  }, {
+    key: 'setInTransit_',
+    value: function setInTransit_(inTransit) {
+      this.inTransit_ = inTransit;
+      this.toggleClass_(__WEBPACK_IMPORTED_MODULE_0__constants__["b" /* cssClasses */].IN_TRANSIT, this.inTransit_);
+    }
+  }, {
+    key: 'toggleClass_',
+    value: function toggleClass_(className, shouldBePresent) {
+      if (shouldBePresent) {
+        this.adapter_.addClass(className);
+      } else {
+        this.adapter_.removeClass(className);
+      }
+    }
+  }]);
+
+  return MDCSliderFoundation;
+}(__WEBPACK_IMPORTED_MODULE_2__material_base_foundation__["a" /* default */]);
+
+/* harmony default export */ __webpack_exports__["a"] = (MDCSliderFoundation);
+
+/***/ }),
+
+/***/ 9:
+/***/ (function(module, __webpack_exports__, __webpack_require__) {
+
+"use strict";
+Object.defineProperty(__webpack_exports__, "__esModule", { value: true });
+/* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, "transformStyleProperties", function() { return transformStyleProperties; });
+/* harmony export (immutable) */ __webpack_exports__["getCorrectEventName"] = getCorrectEventName;
+/* harmony export (immutable) */ __webpack_exports__["getCorrectPropertyName"] = getCorrectPropertyName;
+/**
+ * Copyright 2016 Google Inc. All Rights Reserved.
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *      http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+
+/**
+ * @typedef {{
+ *   noPrefix: string,
+ *   webkitPrefix: string
+ * }}
+ */
+var VendorPropertyMapType = void 0;
+
+/** @const {Object<string, !VendorPropertyMapType>} */
+var eventTypeMap = {
+  'animationstart': {
+    noPrefix: 'animationstart',
+    webkitPrefix: 'webkitAnimationStart',
+    styleProperty: 'animation'
+  },
+  'animationend': {
+    noPrefix: 'animationend',
+    webkitPrefix: 'webkitAnimationEnd',
+    styleProperty: 'animation'
+  },
+  'animationiteration': {
+    noPrefix: 'animationiteration',
+    webkitPrefix: 'webkitAnimationIteration',
+    styleProperty: 'animation'
+  },
+  'transitionend': {
+    noPrefix: 'transitionend',
+    webkitPrefix: 'webkitTransitionEnd',
+    styleProperty: 'transition'
+  }
+};
+
+/** @const {Object<string, !VendorPropertyMapType>} */
+var cssPropertyMap = {
+  'animation': {
+    noPrefix: 'animation',
+    webkitPrefix: '-webkit-animation'
+  },
+  'transform': {
+    noPrefix: 'transform',
+    webkitPrefix: '-webkit-transform'
+  },
+  'transition': {
+    noPrefix: 'transition',
+    webkitPrefix: '-webkit-transition'
+  }
+};
+
+/**
+ * @param {!Object} windowObj
+ * @return {boolean}
+ */
+function hasProperShape(windowObj) {
+  return windowObj['document'] !== undefined && typeof windowObj['document']['createElement'] === 'function';
+}
+
+/**
+ * @param {string} eventType
+ * @return {boolean}
+ */
+function eventFoundInMaps(eventType) {
+  return eventType in eventTypeMap || eventType in cssPropertyMap;
+}
+
+/**
+ * @param {string} eventType
+ * @param {!Object<string, !VendorPropertyMapType>} map
+ * @param {!Element} el
+ * @return {string}
+ */
+function getJavaScriptEventName(eventType, map, el) {
+  return map[eventType].styleProperty in el.style ? map[eventType].noPrefix : map[eventType].webkitPrefix;
+}
+
+/**
+ * Helper function to determine browser prefix for CSS3 animation events
+ * and property names.
+ * @param {!Object} windowObj
+ * @param {string} eventType
+ * @return {string}
+ */
+function getAnimationName(windowObj, eventType) {
+  if (!hasProperShape(windowObj) || !eventFoundInMaps(eventType)) {
+    return eventType;
+  }
+
+  var map = /** @type {!Object<string, !VendorPropertyMapType>} */eventType in eventTypeMap ? eventTypeMap : cssPropertyMap;
+  var el = windowObj['document']['createElement']('div');
+  var eventName = '';
+
+  if (map === eventTypeMap) {
+    eventName = getJavaScriptEventName(eventType, map, el);
+  } else {
+    eventName = map[eventType].noPrefix in el.style ? map[eventType].noPrefix : map[eventType].webkitPrefix;
+  }
+
+  return eventName;
+}
+
+// Public functions to access getAnimationName() for JavaScript events or CSS
+// property names.
+
+var transformStyleProperties = ['transform', 'WebkitTransform', 'MozTransform', 'OTransform', 'MSTransform'];
+
+/**
+ * @param {!Object} windowObj
+ * @param {string} eventType
+ * @return {string}
+ */
+function getCorrectEventName(windowObj, eventType) {
+  return getAnimationName(windowObj, eventType);
+}
+
+/**
+ * @param {!Object} windowObj
+ * @param {string} eventType
+ * @return {string}
+ */
+function getCorrectPropertyName(windowObj, eventType) {
+  return getAnimationName(windowObj, eventType);
+}
+
+/***/ }),
+
+/***/ 95:
+/***/ (function(module, exports, __webpack_require__) {
+
+module.exports = __webpack_require__(33);
+
+
+/***/ })
+
+/******/ });
+});

+ 397 - 0
support/client/lib/vwf/view/lib/mdc/dist/mdc.snackbar.css

@@ -0,0 +1,397 @@
+/*!
+ Material Components for the web
+ Copyright (c) 2017 Google Inc.
+ License: Apache-2.0
+*/
+/**
+ * Creates a rule that will be applied when an MDC-Web component is within the context of an RTL layout.
+ *
+ * Usage Example:
+ * ```scss
+ * .mdc-foo {
+ *   position: absolute;
+ *   left: 0;
+ *
+ *   @include mdc-rtl {
+ *     left: auto;
+ *     right: 0;
+ *   }
+ *
+ *   &__bar {
+ *     margin-left: 4px;
+ *     @include mdc-rtl(".mdc-foo") {
+ *       margin-left: auto;
+ *       margin-right: 4px;
+ *     }
+ *   }
+ * }
+ *
+ * .mdc-foo--mod {
+ *   padding-left: 4px;
+ *
+ *   @include mdc-rtl {
+ *     padding-left: auto;
+ *     padding-right: 4px;
+ *   }
+ * }
+ * ```
+ *
+ * Note that this works by checking for [dir="rtl"] on an ancestor element. While this will work
+ * in most cases, it will in some cases lead to false negatives, e.g.
+ *
+ * ```html
+ * <html dir="rtl">
+ *   <!-- ... -->
+ *   <div dir="ltr">
+ *     <div class="mdc-foo">Styled incorrectly as RTL!</div>
+ *   </div>
+ * </html>
+ * ```
+ *
+ * In the future, selectors such as :dir (http://mdn.io/:dir) will help us mitigate this.
+ */
+/**
+ * Takes a base box-model property - e.g. margin / border / padding - along with a default
+ * direction and value, and emits rules which apply the value to the
+ * "<base-property>-<default-direction>" property by default, but flips the direction
+ * when within an RTL context.
+ *
+ * For example:
+ *
+ * ```scss
+ * .mdc-foo {
+ *   @include mdc-rtl-reflexive-box(margin, left, 8px);
+ * }
+ * ```
+ * is equivalent to:
+ *
+ * ```scss
+ * .mdc-foo {
+ *   margin-left: 8px;
+ *
+ *   @include mdc-rtl {
+ *     margin-right: 8px;
+ *     margin-left: 0;
+ *   }
+ * }
+ * ```
+ * whereas:
+ *
+ * ```scss
+ * .mdc-foo {
+ *   @include mdc-rtl-reflexive-box(margin, right, 8px);
+ * }
+ * ```
+ * is equivalent to:
+ *
+ * ```scss
+ * .mdc-foo {
+ *   margin-right: 8px;
+ *
+ *   @include mdc-rtl {
+ *     margin-right: 0;
+ *     margin-left: 8px;
+ *   }
+ * }
+ * ```
+ *
+ * You can also pass a 4th optional $root-selector argument which will be forwarded to `mdc-rtl`,
+ * e.g. `@include mdc-rtl-reflexive-box(margin, left, 8px, ".mdc-component")`.
+ *
+ * Note that this function will always zero out the original value in an RTL context. If you're
+ * trying to flip the values, use mdc-rtl-reflexive-property().
+ */
+/**
+ * Takes a base property and emits rules that assign <base-property>-left to <left-value> and
+ * <base-property>-right to <right-value> in a LTR context, and vice versa in a RTL context.
+ * For example:
+ *
+ * ```scss
+ * .mdc-foo {
+ *   @include mdc-rtl-reflexive-property(margin, auto, 12px);
+ * }
+ * ```
+ * is equivalent to:
+ *
+ * ```scss
+ * .mdc-foo {
+ *   margin-left: auto;
+ *   margin-right: 12px;
+ *
+ *   @include mdc-rtl {
+ *     margin-left: 12px;
+ *     margin-right: auto;
+ *   }
+ * }
+ * ```
+ *
+ * A 4th optional $root-selector argument can be given, which will be passed to `mdc-rtl`.
+ */
+/**
+ * Takes an argument specifying a horizontal position property (either "left" or "right") as well
+ * as a value, and applies that value to the specified position in a LTR context, and flips it in a
+ * RTL context. For example:
+ *
+ * ```scss
+ * .mdc-foo {
+ *   @include mdc-rtl-reflexive-position(left, 0);
+ *   position: absolute;
+ * }
+ * ```
+ * is equivalent to:
+ *
+ * ```scss
+ *  .mdc-foo {
+ *    position: absolute;
+ *    left: 0;
+ *    right: initial;
+ *
+ *    @include mdc-rtl {
+ *      right: 0;
+ *      left: initial;
+ *    }
+ *  }
+ * ```
+ * An optional third $root-selector argument may also be given, which is passed to `mdc-rtl`.
+ */
+/*
+  Precomputed linear color channel values, for use in contrast calculations.
+  See https://www.w3.org/TR/WCAG20-TECHS/G17.html#G17-tests
+
+  Algorithm, for c in 0 to 255:
+  f(c) {
+    c = c / 255;
+    return c < 0.03928 ? c / 12.92 : Math.pow((c + 0.055) / 1.055, 2.4);
+  }
+
+  This lookup table is needed since there is no `pow` in SASS.
+*/
+/**
+ * Calculate the luminance for a color.
+ * See https://www.w3.org/TR/WCAG20-TECHS/G17.html#G17-tests
+ */
+/**
+ * Calculate the contrast ratio between two colors.
+ * See https://www.w3.org/TR/WCAG20-TECHS/G17.html#G17-tests
+ */
+/**
+ * Determine whether to use dark or light text on top of given color.
+ * Returns "dark" for dark text and "light" for light text.
+ */
+/*
+  Main theme colors.
+  If you're a user customizing your color scheme in SASS, these are probably the only variables you need to change.
+*/
+/* Indigo 500 */
+/* Pink A200 */
+/* White */
+/* Which set of text colors to use for each main theme color (light or dark) */
+/* Text colors according to light vs dark and text type */
+/* Primary text colors for each of the theme colors */
+/**
+ * Applies the correct theme color style to the specified property.
+ * $property is typically color or background-color, but can be any CSS property that accepts color values.
+ * $style should be one of the map keys in $mdc-theme-property-values (_variables.scss).
+ */
+/**
+ * Creates a rule to be used in MDC-Web components for dark theming, and applies the provided contents.
+ * Should provide the $root-selector option if applied to anything other than the root selector.
+ * When used with a modifier class, provide a second argument of `true` for the $compound parameter
+ * to specify that this should be attached as a compound class.
+ *
+ * Usage example:
+ *
+ * ```scss
+ * .mdc-foo {
+ *   color: black;
+ *
+ *   @include mdc-theme-dark {
+ *     color: white;
+ *   }
+ *
+ *   &__bar {
+ *     background: black;
+ *
+ *     @include mdc-theme-dark(".mdc-foo") {
+ *       background: white;
+ *     }
+ *   }
+ * }
+ *
+ * .mdc-foo--disabled {
+ *   opacity: .38;
+ *
+ *   @include mdc-theme-dark(".mdc-foo", true) {
+ *     opacity: .5;
+ *   }
+ * }
+ * ```
+ */
+/* TODO(sgomes): Figure out what to do about desktop font sizes. */
+/* TODO(sgomes): Figure out what to do about i18n and i18n font sizes. */
+/* postcss-bem-linter: define snackbar */
+.mdc-snackbar {
+  display: -webkit-box;
+  display: -ms-flexbox;
+  display: flex;
+  position: fixed;
+  bottom: 0;
+  left: 50%;
+  -webkit-box-align: center;
+      -ms-flex-align: center;
+          align-items: center;
+  -webkit-box-pack: start;
+      -ms-flex-pack: start;
+          justify-content: flex-start;
+  padding-right: 24px;
+  padding-left: 24px;
+  -webkit-transform: translate(-50%, 100%);
+          transform: translate(-50%, 100%);
+  -webkit-transition: -webkit-transform 0.25s 0ms cubic-bezier(0.4, 0, 1, 1);
+  transition: -webkit-transform 0.25s 0ms cubic-bezier(0.4, 0, 1, 1);
+  transition: transform 0.25s 0ms cubic-bezier(0.4, 0, 1, 1);
+  transition: transform 0.25s 0ms cubic-bezier(0.4, 0, 1, 1), -webkit-transform 0.25s 0ms cubic-bezier(0.4, 0, 1, 1);
+  background-color: #323232;
+  will-change: transform;
+  pointer-events: none;
+  /* stylelint-disable plugin/selector-bem-pattern */
+  /* stylelint-enable plugin/selector-bem-pattern */ }
+  .mdc-snackbar--theme-dark .mdc-snackbar,
+  .mdc-theme--dark .mdc-snackbar {
+    background-color: #fafafa; }
+  @media (max-width: 599px) {
+    .mdc-snackbar {
+      left: 0;
+      width: calc(100% - 48px);
+      -webkit-transform: translate(0, 100%);
+              transform: translate(0, 100%); } }
+  @media (min-width: 600px) {
+    .mdc-snackbar {
+      min-width: 288px;
+      max-width: 568px;
+      border-radius: 2px; } }
+  @media (min-width: 600px) {
+    .mdc-snackbar--align-start {
+      bottom: 24px;
+      left: 24px;
+      right: initial;
+      -webkit-transform: translate(0, 200%);
+              transform: translate(0, 200%); }
+      [dir="rtl"] .mdc-snackbar--align-start, .mdc-snackbar--align-start[dir="rtl"] {
+        left: initial;
+        right: 24px; } }
+  @media (max-width: 599px) {
+    .mdc-snackbar--align-start {
+      bottom: 0;
+      left: 0;
+      width: calc(100% - 48px);
+      -webkit-transform: translate(0, 100%);
+              transform: translate(0, 100%); } }
+  .mdc-snackbar--active {
+    -webkit-transform: translate(0);
+            transform: translate(0);
+    pointer-events: auto;
+    -webkit-transition: -webkit-transform 0.25s 0ms cubic-bezier(0, 0, 0.2, 1);
+    transition: -webkit-transform 0.25s 0ms cubic-bezier(0, 0, 0.2, 1);
+    transition: transform 0.25s 0ms cubic-bezier(0, 0, 0.2, 1);
+    transition: transform 0.25s 0ms cubic-bezier(0, 0, 0.2, 1), -webkit-transform 0.25s 0ms cubic-bezier(0, 0, 0.2, 1); }
+    .mdc-snackbar--active:not(.mdc-snackbar--align-start) {
+      -webkit-transform: translate(-50%, 0);
+              transform: translate(-50%, 0); }
+      @media (max-width: 599px) {
+        .mdc-snackbar--active:not(.mdc-snackbar--align-start) {
+          bottom: 0;
+          left: 0;
+          width: calc(100% - 48px);
+          -webkit-transform: translate(0);
+                  transform: translate(0); } }
+  .mdc-snackbar--action-on-bottom {
+    -webkit-box-orient: vertical;
+    -webkit-box-direction: normal;
+        -ms-flex-direction: column;
+            flex-direction: column; }
+  .mdc-snackbar--action-on-bottom .mdc-snackbar__text {
+    margin-right: inherit; }
+  .mdc-snackbar--action-on-bottom .mdc-snackbar__action-wrapper {
+    -webkit-box-orient: vertical;
+    -webkit-box-direction: normal;
+        -ms-flex-direction: column;
+            flex-direction: column;
+    -webkit-box-pack: start;
+        -ms-flex-pack: start;
+            justify-content: flex-start;
+    margin-top: -12px;
+    margin-bottom: 8px;
+    margin-left: auto;
+    margin-right: 0; }
+    [dir="rtl"] .mdc-snackbar--action-on-bottom .mdc-snackbar__action-wrapper, .mdc-snackbar--action-on-bottom .mdc-snackbar__action-wrapper[dir="rtl"] {
+      margin-left: 0;
+      margin-right: auto; }
+  .mdc-snackbar__text {
+    font-family: Roboto, sans-serif;
+    -moz-osx-font-smoothing: grayscale;
+    -webkit-font-smoothing: antialiased;
+    font-size: 0.875rem;
+    font-weight: 400;
+    letter-spacing: 0.04em;
+    line-height: 1.25rem;
+    text-decoration: inherit;
+    text-transform: inherit;
+    margin-left: 0;
+    margin-right: auto;
+    display: -webkit-box;
+    display: -ms-flexbox;
+    display: flex;
+    -webkit-box-align: center;
+        -ms-flex-align: center;
+            align-items: center;
+    height: 48px;
+    -webkit-transition: opacity 0.3s 0ms cubic-bezier(0.4, 0, 1, 1);
+    transition: opacity 0.3s 0ms cubic-bezier(0.4, 0, 1, 1);
+    color: white;
+    opacity: 0; }
+    [dir="rtl"] .mdc-snackbar .mdc-snackbar__text,
+    .mdc-snackbar[dir="rtl"] .mdc-snackbar__text {
+      margin-left: auto;
+      margin-right: 0; }
+    .mdc-snackbar--theme-dark .mdc-snackbar__text,
+    .mdc-theme--dark .mdc-snackbar__text {
+      /* @alternate */
+      color: rgba(0, 0, 0, 0.87);
+      color: var(--mdc-theme-text-primary-on-light, rgba(0, 0, 0, 0.87)); }
+  .mdc-snackbar--multiline .mdc-snackbar__text {
+    height: 80px; }
+  .mdc-snackbar--multiline.mdc-snackbar--action-on-bottom .mdc-snackbar__text {
+    margin: 0; }
+  .mdc-snackbar__action-button {
+    /* @alternate */
+    color: #ff4081;
+    color: var(--mdc-theme-accent, #ff4081);
+    margin-left: 0;
+    margin-right: -16px;
+    min-width: auto;
+    height: inherit;
+    -webkit-transition: opacity 0.3s 0ms cubic-bezier(0.4, 0, 1, 1);
+    transition: opacity 0.3s 0ms cubic-bezier(0.4, 0, 1, 1);
+    opacity: 0;
+    visibility: hidden; }
+    .mdc-snackbar--theme-dark .mdc-snackbar__action-button,
+    .mdc-theme--dark .mdc-snackbar__action-button {
+      /* @alternate */
+      color: #3f51b5;
+      color: var(--mdc-theme-primary, #3f51b5); }
+    [dir="rtl"] .mdc-snackbar .mdc-snackbar__action-button,
+    .mdc-snackbar[dir="rtl"] .mdc-snackbar__action-button {
+      margin-left: -16px;
+      margin-right: 0; }
+    .mdc-snackbar__action-button::-moz-focus-inner {
+      border: 0; }
+    .mdc-snackbar__action-button:not([aria-hidden]) {
+      visibility: inherit; }
+  .mdc-snackbar--active .mdc-snackbar__text,
+  .mdc-snackbar--active .mdc-snackbar__action-button:not([aria-hidden]) {
+    -webkit-transition: opacity 0.3s 0ms cubic-bezier(0.4, 0, 1, 1);
+    transition: opacity 0.3s 0ms cubic-bezier(0.4, 0, 1, 1);
+    opacity: 1; }
+
+/* postcss-bem-linter: end */

+ 83 - 0
support/client/lib/vwf/view/lib/mdc/dist/mdc.snackbar.css-entry

@@ -0,0 +1,83 @@
+/*!
+ Material Components for the web
+ Copyright (c) 2017 Google Inc.
+ License: Apache-2.0
+*/
+/******/ (function(modules) { // webpackBootstrap
+/******/ 	// The module cache
+/******/ 	var installedModules = {};
+/******/
+/******/ 	// The require function
+/******/ 	function __webpack_require__(moduleId) {
+/******/
+/******/ 		// Check if module is in cache
+/******/ 		if(installedModules[moduleId]) {
+/******/ 			return installedModules[moduleId].exports;
+/******/ 		}
+/******/ 		// Create a new module (and put it into the cache)
+/******/ 		var module = installedModules[moduleId] = {
+/******/ 			i: moduleId,
+/******/ 			l: false,
+/******/ 			exports: {}
+/******/ 		};
+/******/
+/******/ 		// Execute the module function
+/******/ 		modules[moduleId].call(module.exports, module, module.exports, __webpack_require__);
+/******/
+/******/ 		// Flag the module as loaded
+/******/ 		module.l = true;
+/******/
+/******/ 		// Return the exports of the module
+/******/ 		return module.exports;
+/******/ 	}
+/******/
+/******/
+/******/ 	// expose the modules object (__webpack_modules__)
+/******/ 	__webpack_require__.m = modules;
+/******/
+/******/ 	// expose the module cache
+/******/ 	__webpack_require__.c = installedModules;
+/******/
+/******/ 	// identity function for calling harmony imports with the correct context
+/******/ 	__webpack_require__.i = function(value) { return value; };
+/******/
+/******/ 	// define getter function for harmony exports
+/******/ 	__webpack_require__.d = function(exports, name, getter) {
+/******/ 		if(!__webpack_require__.o(exports, name)) {
+/******/ 			Object.defineProperty(exports, name, {
+/******/ 				configurable: false,
+/******/ 				enumerable: true,
+/******/ 				get: getter
+/******/ 			});
+/******/ 		}
+/******/ 	};
+/******/
+/******/ 	// getDefaultExport function for compatibility with non-harmony modules
+/******/ 	__webpack_require__.n = function(module) {
+/******/ 		var getter = module && module.__esModule ?
+/******/ 			function getDefault() { return module['default']; } :
+/******/ 			function getModuleExports() { return module; };
+/******/ 		__webpack_require__.d(getter, 'a', getter);
+/******/ 		return getter;
+/******/ 	};
+/******/
+/******/ 	// Object.prototype.hasOwnProperty.call
+/******/ 	__webpack_require__.o = function(object, property) { return Object.prototype.hasOwnProperty.call(object, property); };
+/******/
+/******/ 	// __webpack_public_path__
+/******/ 	__webpack_require__.p = "/assets/";
+/******/
+/******/ 	// Load entry module and return exports
+/******/ 	return __webpack_require__(__webpack_require__.s = 20);
+/******/ })
+/************************************************************************/
+/******/ ({
+
+/***/ 20:
+/***/ (function(module, exports) {
+
+// removed by extract-text-webpack-plugin
+
+/***/ })
+
+/******/ });

+ 1086 - 0
support/client/lib/vwf/view/lib/mdc/dist/mdc.snackbar.js

@@ -0,0 +1,1086 @@
+/*!
+ Material Components for the web
+ Copyright (c) 2017 Google Inc.
+ License: Apache-2.0
+*/
+(function webpackUniversalModuleDefinition(root, factory) {
+	if(typeof exports === 'object' && typeof module === 'object')
+		module.exports = factory();
+	else if(typeof define === 'function' && define.amd)
+		define([], factory);
+	else if(typeof exports === 'object')
+		exports["snackbar"] = factory();
+	else
+		root["mdc"] = root["mdc"] || {}, root["mdc"]["snackbar"] = factory();
+})(this, function() {
+return /******/ (function(modules) { // webpackBootstrap
+/******/ 	// The module cache
+/******/ 	var installedModules = {};
+/******/
+/******/ 	// The require function
+/******/ 	function __webpack_require__(moduleId) {
+/******/
+/******/ 		// Check if module is in cache
+/******/ 		if(installedModules[moduleId]) {
+/******/ 			return installedModules[moduleId].exports;
+/******/ 		}
+/******/ 		// Create a new module (and put it into the cache)
+/******/ 		var module = installedModules[moduleId] = {
+/******/ 			i: moduleId,
+/******/ 			l: false,
+/******/ 			exports: {}
+/******/ 		};
+/******/
+/******/ 		// Execute the module function
+/******/ 		modules[moduleId].call(module.exports, module, module.exports, __webpack_require__);
+/******/
+/******/ 		// Flag the module as loaded
+/******/ 		module.l = true;
+/******/
+/******/ 		// Return the exports of the module
+/******/ 		return module.exports;
+/******/ 	}
+/******/
+/******/
+/******/ 	// expose the modules object (__webpack_modules__)
+/******/ 	__webpack_require__.m = modules;
+/******/
+/******/ 	// expose the module cache
+/******/ 	__webpack_require__.c = installedModules;
+/******/
+/******/ 	// identity function for calling harmony imports with the correct context
+/******/ 	__webpack_require__.i = function(value) { return value; };
+/******/
+/******/ 	// define getter function for harmony exports
+/******/ 	__webpack_require__.d = function(exports, name, getter) {
+/******/ 		if(!__webpack_require__.o(exports, name)) {
+/******/ 			Object.defineProperty(exports, name, {
+/******/ 				configurable: false,
+/******/ 				enumerable: true,
+/******/ 				get: getter
+/******/ 			});
+/******/ 		}
+/******/ 	};
+/******/
+/******/ 	// getDefaultExport function for compatibility with non-harmony modules
+/******/ 	__webpack_require__.n = function(module) {
+/******/ 		var getter = module && module.__esModule ?
+/******/ 			function getDefault() { return module['default']; } :
+/******/ 			function getModuleExports() { return module; };
+/******/ 		__webpack_require__.d(getter, 'a', getter);
+/******/ 		return getter;
+/******/ 	};
+/******/
+/******/ 	// Object.prototype.hasOwnProperty.call
+/******/ 	__webpack_require__.o = function(object, property) { return Object.prototype.hasOwnProperty.call(object, property); };
+/******/
+/******/ 	// __webpack_public_path__
+/******/ 	__webpack_require__.p = "/assets/";
+/******/
+/******/ 	// Load entry module and return exports
+/******/ 	return __webpack_require__(__webpack_require__.s = 96);
+/******/ })
+/************************************************************************/
+/******/ ({
+
+/***/ 0:
+/***/ (function(module, __webpack_exports__, __webpack_require__) {
+
+"use strict";
+var _createClass = function () { function defineProperties(target, props) { for (var i = 0; i < props.length; i++) { var descriptor = props[i]; descriptor.enumerable = descriptor.enumerable || false; descriptor.configurable = true; if ("value" in descriptor) descriptor.writable = true; Object.defineProperty(target, descriptor.key, descriptor); } } return function (Constructor, protoProps, staticProps) { if (protoProps) defineProperties(Constructor.prototype, protoProps); if (staticProps) defineProperties(Constructor, staticProps); return Constructor; }; }();
+
+function _classCallCheck(instance, Constructor) { if (!(instance instanceof Constructor)) { throw new TypeError("Cannot call a class as a function"); } }
+
+/**
+ * Copyright 2016 Google Inc.
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *   http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+
+/**
+ * @template A
+ */
+var MDCFoundation = function () {
+  _createClass(MDCFoundation, null, [{
+    key: "cssClasses",
+
+    /** @return enum{cssClasses} */
+    get: function get() {
+      // Classes extending MDCFoundation should implement this method to return an object which exports every
+      // CSS class the foundation class needs as a property. e.g. {ACTIVE: 'mdc-component--active'}
+      return {};
+    }
+
+    /** @return enum{strings} */
+
+  }, {
+    key: "strings",
+    get: function get() {
+      // Classes extending MDCFoundation should implement this method to return an object which exports all
+      // semantic strings as constants. e.g. {ARIA_ROLE: 'tablist'}
+      return {};
+    }
+
+    /** @return enum{numbers} */
+
+  }, {
+    key: "numbers",
+    get: function get() {
+      // Classes extending MDCFoundation should implement this method to return an object which exports all
+      // of its semantic numbers as constants. e.g. {ANIMATION_DELAY_MS: 350}
+      return {};
+    }
+
+    /** @return {!Object} */
+
+  }, {
+    key: "defaultAdapter",
+    get: function get() {
+      // Classes extending MDCFoundation may choose to implement this getter in order to provide a convenient
+      // way of viewing the necessary methods of an adapter. In the future, this could also be used for adapter
+      // validation.
+      return {};
+    }
+
+    /**
+     * @param {A=} adapter
+     */
+
+  }]);
+
+  function MDCFoundation() {
+    var adapter = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : {};
+
+    _classCallCheck(this, MDCFoundation);
+
+    /** @protected {!A} */
+    this.adapter_ = adapter;
+  }
+
+  _createClass(MDCFoundation, [{
+    key: "init",
+    value: function init() {
+      // Subclasses should override this method to perform initialization routines (registering events, etc.)
+    }
+  }, {
+    key: "destroy",
+    value: function destroy() {
+      // Subclasses should override this method to perform de-initialization routines (de-registering events, etc.)
+    }
+  }]);
+
+  return MDCFoundation;
+}();
+
+/* harmony default export */ __webpack_exports__["a"] = (MDCFoundation);
+
+/***/ }),
+
+/***/ 1:
+/***/ (function(module, __webpack_exports__, __webpack_require__) {
+
+"use strict";
+/* harmony import */ var __WEBPACK_IMPORTED_MODULE_0__foundation__ = __webpack_require__(0);
+var _createClass = function () { function defineProperties(target, props) { for (var i = 0; i < props.length; i++) { var descriptor = props[i]; descriptor.enumerable = descriptor.enumerable || false; descriptor.configurable = true; if ("value" in descriptor) descriptor.writable = true; Object.defineProperty(target, descriptor.key, descriptor); } } return function (Constructor, protoProps, staticProps) { if (protoProps) defineProperties(Constructor.prototype, protoProps); if (staticProps) defineProperties(Constructor, staticProps); return Constructor; }; }();
+
+function _classCallCheck(instance, Constructor) { if (!(instance instanceof Constructor)) { throw new TypeError("Cannot call a class as a function"); } }
+
+/**
+ * Copyright 2016 Google Inc.
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *   http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+
+
+
+/**
+ * @template F
+ */
+
+var MDCComponent = function () {
+  _createClass(MDCComponent, null, [{
+    key: 'attachTo',
+
+    /**
+     * @param {!Element} root
+     * @return {!MDCComponent}
+     */
+    value: function attachTo(root) {
+      // Subclasses which extend MDCBase should provide an attachTo() method that takes a root element and
+      // returns an instantiated component with its root set to that element. Also note that in the cases of
+      // subclasses, an explicit foundation class will not have to be passed in; it will simply be initialized
+      // from getDefaultFoundation().
+      return new MDCComponent(root, new __WEBPACK_IMPORTED_MODULE_0__foundation__["a" /* default */]());
+    }
+
+    /**
+     * @param {!Element} root
+     * @param {F=} foundation
+     * @param {...?} args
+     */
+
+  }]);
+
+  function MDCComponent(root) {
+    var foundation = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : undefined;
+
+    _classCallCheck(this, MDCComponent);
+
+    /** @protected {!Element} */
+    this.root_ = root;
+
+    for (var _len = arguments.length, args = Array(_len > 2 ? _len - 2 : 0), _key = 2; _key < _len; _key++) {
+      args[_key - 2] = arguments[_key];
+    }
+
+    this.initialize.apply(this, args);
+    // Note that we initialize foundation here and not within the constructor's default param so that
+    // this.root_ is defined and can be used within the foundation class.
+    /** @protected {!F} */
+    this.foundation_ = foundation === undefined ? this.getDefaultFoundation() : foundation;
+    this.foundation_.init();
+    this.initialSyncWithDOM();
+  }
+
+  _createClass(MDCComponent, [{
+    key: 'initialize',
+    value: function initialize() /* ...args */{}
+    // Subclasses can override this to do any additional setup work that would be considered part of a
+    // "constructor". Essentially, it is a hook into the parent constructor before the foundation is
+    // initialized. Any additional arguments besides root and foundation will be passed in here.
+
+
+    /**
+     * @return {!F} foundation
+     */
+
+  }, {
+    key: 'getDefaultFoundation',
+    value: function getDefaultFoundation() {
+      // Subclasses must override this method to return a properly configured foundation class for the
+      // component.
+      throw new Error('Subclasses must override getDefaultFoundation to return a properly configured ' + 'foundation class');
+    }
+  }, {
+    key: 'initialSyncWithDOM',
+    value: function initialSyncWithDOM() {
+      // Subclasses should override this method if they need to perform work to synchronize with a host DOM
+      // object. An example of this would be a form control wrapper that needs to synchronize its internal state
+      // to some property or attribute of the host DOM. Please note: this is *not* the place to perform DOM
+      // reads/writes that would cause layout / paint, as this is called synchronously from within the constructor.
+    }
+  }, {
+    key: 'destroy',
+    value: function destroy() {
+      // Subclasses may implement this method to release any resources / deregister any listeners they have
+      // attached. An example of this might be deregistering a resize event from the window object.
+      this.foundation_.destroy();
+    }
+
+    /**
+     * Wrapper method to add an event listener to the component's root element. This is most useful when
+     * listening for custom events.
+     * @param {string} evtType
+     * @param {!Function} handler
+     */
+
+  }, {
+    key: 'listen',
+    value: function listen(evtType, handler) {
+      this.root_.addEventListener(evtType, handler);
+    }
+
+    /**
+     * Wrapper method to remove an event listener to the component's root element. This is most useful when
+     * unlistening for custom events.
+     * @param {string} evtType
+     * @param {!Function} handler
+     */
+
+  }, {
+    key: 'unlisten',
+    value: function unlisten(evtType, handler) {
+      this.root_.removeEventListener(evtType, handler);
+    }
+
+    /**
+     * Fires a cross-browser-compatible custom event from the component root of the given type,
+     * with the given data.
+     * @param {string} evtType
+     * @param {!Object} evtData
+     * @param {boolean=} shouldBubble
+     */
+
+  }, {
+    key: 'emit',
+    value: function emit(evtType, evtData) {
+      var shouldBubble = arguments.length > 2 && arguments[2] !== undefined ? arguments[2] : false;
+
+      var evt = void 0;
+      if (typeof CustomEvent === 'function') {
+        evt = new CustomEvent(evtType, {
+          detail: evtData,
+          bubbles: shouldBubble
+        });
+      } else {
+        evt = document.createEvent('CustomEvent');
+        evt.initCustomEvent(evtType, shouldBubble, false, evtData);
+      }
+
+      this.root_.dispatchEvent(evt);
+    }
+  }]);
+
+  return MDCComponent;
+}();
+
+/* harmony default export */ __webpack_exports__["a"] = (MDCComponent);
+
+/***/ }),
+
+/***/ 2:
+/***/ (function(module, __webpack_exports__, __webpack_require__) {
+
+"use strict";
+Object.defineProperty(__webpack_exports__, "__esModule", { value: true });
+/* harmony import */ var __WEBPACK_IMPORTED_MODULE_0__foundation__ = __webpack_require__(0);
+/* harmony import */ var __WEBPACK_IMPORTED_MODULE_1__component__ = __webpack_require__(1);
+/* harmony import */ var __WEBPACK_IMPORTED_MODULE_2__selection_control__ = __webpack_require__(3);
+/* harmony reexport (binding) */ __webpack_require__.d(__webpack_exports__, "MDCFoundation", function() { return __WEBPACK_IMPORTED_MODULE_0__foundation__["a"]; });
+/* harmony reexport (binding) */ __webpack_require__.d(__webpack_exports__, "MDCComponent", function() { return __WEBPACK_IMPORTED_MODULE_1__component__["a"]; });
+/* harmony reexport (binding) */ __webpack_require__.d(__webpack_exports__, "SelectionControlState", function() { return __WEBPACK_IMPORTED_MODULE_2__selection_control__["a"]; });
+/**
+ * Copyright 2016 Google Inc.
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *   http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+
+
+
+
+
+
+
+/***/ }),
+
+/***/ 3:
+/***/ (function(module, __webpack_exports__, __webpack_require__) {
+
+"use strict";
+/* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, "a", function() { return SelectionControlState; });
+/**
+ * Copyright 2017 Google Inc. All Rights Reserved.
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *      http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+
+/**
+ * @typedef {!{
+ *   checked: boolean,
+ *   indeterminate: boolean,
+ *   disabled: boolean,
+ *   value: ?string
+ * }}
+ */
+var SelectionControlState = void 0;
+
+/***/ }),
+
+/***/ 34:
+/***/ (function(module, __webpack_exports__, __webpack_require__) {
+
+"use strict";
+Object.defineProperty(__webpack_exports__, "__esModule", { value: true });
+/* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, "MDCSnackbar", function() { return MDCSnackbar; });
+/* harmony import */ var __WEBPACK_IMPORTED_MODULE_0__material_base__ = __webpack_require__(2);
+/* harmony import */ var __WEBPACK_IMPORTED_MODULE_1__foundation__ = __webpack_require__(68);
+/* harmony import */ var __WEBPACK_IMPORTED_MODULE_2__material_animation__ = __webpack_require__(9);
+/* harmony reexport (binding) */ __webpack_require__.d(__webpack_exports__, "MDCSnackbarFoundation", function() { return __WEBPACK_IMPORTED_MODULE_1__foundation__["a"]; });
+var _createClass = function () { function defineProperties(target, props) { for (var i = 0; i < props.length; i++) { var descriptor = props[i]; descriptor.enumerable = descriptor.enumerable || false; descriptor.configurable = true; if ("value" in descriptor) descriptor.writable = true; Object.defineProperty(target, descriptor.key, descriptor); } } return function (Constructor, protoProps, staticProps) { if (protoProps) defineProperties(Constructor.prototype, protoProps); if (staticProps) defineProperties(Constructor, staticProps); return Constructor; }; }();
+
+function _classCallCheck(instance, Constructor) { if (!(instance instanceof Constructor)) { throw new TypeError("Cannot call a class as a function"); } }
+
+function _possibleConstructorReturn(self, call) { if (!self) { throw new ReferenceError("this hasn't been initialised - super() hasn't been called"); } return call && (typeof call === "object" || typeof call === "function") ? call : self; }
+
+function _inherits(subClass, superClass) { if (typeof superClass !== "function" && superClass !== null) { throw new TypeError("Super expression must either be null or a function, not " + typeof superClass); } subClass.prototype = Object.create(superClass && superClass.prototype, { constructor: { value: subClass, enumerable: false, writable: true, configurable: true } }); if (superClass) Object.setPrototypeOf ? Object.setPrototypeOf(subClass, superClass) : subClass.__proto__ = superClass; }
+
+/**
+ * Copyright 2016 Google Inc. All Rights Reserved.
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *      http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+
+
+
+
+
+
+
+var MDCSnackbar = function (_MDCComponent) {
+  _inherits(MDCSnackbar, _MDCComponent);
+
+  function MDCSnackbar() {
+    _classCallCheck(this, MDCSnackbar);
+
+    return _possibleConstructorReturn(this, (MDCSnackbar.__proto__ || Object.getPrototypeOf(MDCSnackbar)).apply(this, arguments));
+  }
+
+  _createClass(MDCSnackbar, [{
+    key: 'show',
+    value: function show(data) {
+      this.foundation_.show(data);
+    }
+  }, {
+    key: 'getDefaultFoundation',
+    value: function getDefaultFoundation() {
+      var _this2 = this;
+
+      var _MDCSnackbarFoundatio = __WEBPACK_IMPORTED_MODULE_1__foundation__["a" /* default */].strings,
+          TEXT_SELECTOR = _MDCSnackbarFoundatio.TEXT_SELECTOR,
+          ACTION_BUTTON_SELECTOR = _MDCSnackbarFoundatio.ACTION_BUTTON_SELECTOR;
+
+      var getText = function getText() {
+        return _this2.root_.querySelector(TEXT_SELECTOR);
+      };
+      var getActionButton = function getActionButton() {
+        return _this2.root_.querySelector(ACTION_BUTTON_SELECTOR);
+      };
+
+      /* eslint brace-style: "off" */
+      return new __WEBPACK_IMPORTED_MODULE_1__foundation__["a" /* default */]({
+        addClass: function addClass(className) {
+          return _this2.root_.classList.add(className);
+        },
+        removeClass: function removeClass(className) {
+          return _this2.root_.classList.remove(className);
+        },
+        setAriaHidden: function setAriaHidden() {
+          return _this2.root_.setAttribute('aria-hidden', 'true');
+        },
+        unsetAriaHidden: function unsetAriaHidden() {
+          return _this2.root_.removeAttribute('aria-hidden');
+        },
+        setActionAriaHidden: function setActionAriaHidden() {
+          return getActionButton().setAttribute('aria-hidden', 'true');
+        },
+        unsetActionAriaHidden: function unsetActionAriaHidden() {
+          return getActionButton().removeAttribute('aria-hidden');
+        },
+        setActionText: function setActionText(text) {
+          getActionButton().textContent = text;
+        },
+        setMessageText: function setMessageText(text) {
+          getText().textContent = text;
+        },
+        setFocus: function setFocus() {
+          return getActionButton().focus();
+        },
+        visibilityIsHidden: function visibilityIsHidden() {
+          return document.hidden;
+        },
+        registerCapturedBlurHandler: function registerCapturedBlurHandler(handler) {
+          return getActionButton().addEventListener('blur', handler, true);
+        },
+        deregisterCapturedBlurHandler: function deregisterCapturedBlurHandler(handler) {
+          return getActionButton().removeEventListener('blur', handler, true);
+        },
+        registerVisibilityChangeHandler: function registerVisibilityChangeHandler(handler) {
+          return document.addEventListener('visibilitychange', handler);
+        },
+        deregisterVisibilityChangeHandler: function deregisterVisibilityChangeHandler(handler) {
+          return document.removeEventListener('visibilitychange', handler);
+        },
+        registerCapturedInteractionHandler: function registerCapturedInteractionHandler(evt, handler) {
+          return document.body.addEventListener(evt, handler, true);
+        },
+        deregisterCapturedInteractionHandler: function deregisterCapturedInteractionHandler(evt, handler) {
+          return document.body.removeEventListener(evt, handler, true);
+        },
+        registerActionClickHandler: function registerActionClickHandler(handler) {
+          return getActionButton().addEventListener('click', handler);
+        },
+        deregisterActionClickHandler: function deregisterActionClickHandler(handler) {
+          return getActionButton().removeEventListener('click', handler);
+        },
+        registerTransitionEndHandler: function registerTransitionEndHandler(handler) {
+          return _this2.root_.addEventListener(__webpack_require__.i(__WEBPACK_IMPORTED_MODULE_2__material_animation__["getCorrectEventName"])(window, 'transitionend'), handler);
+        },
+        deregisterTransitionEndHandler: function deregisterTransitionEndHandler(handler) {
+          return _this2.root_.removeEventListener(__webpack_require__.i(__WEBPACK_IMPORTED_MODULE_2__material_animation__["getCorrectEventName"])(window, 'transitionend'), handler);
+        }
+      });
+    }
+  }, {
+    key: 'dismissesOnAction',
+    get: function get() {
+      return this.foundation_.dismissesOnAction();
+    },
+    set: function set(dismissesOnAction) {
+      this.foundation_.setDismissOnAction(dismissesOnAction);
+    }
+  }], [{
+    key: 'attachTo',
+    value: function attachTo(root) {
+      return new MDCSnackbar(root);
+    }
+  }]);
+
+  return MDCSnackbar;
+}(__WEBPACK_IMPORTED_MODULE_0__material_base__["MDCComponent"]);
+
+/***/ }),
+
+/***/ 67:
+/***/ (function(module, __webpack_exports__, __webpack_require__) {
+
+"use strict";
+/* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, "a", function() { return cssClasses; });
+/* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, "b", function() { return strings; });
+/* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, "c", function() { return numbers; });
+/**
+ * Copyright 2016 Google Inc. All Rights Reserved.
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *      http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+var cssClasses = {
+  ROOT: 'mdc-snackbar',
+  TEXT: 'mdc-snackbar__text',
+  ACTION_WRAPPER: 'mdc-snackbar__action-wrapper',
+  ACTION_BUTTON: 'mdc-snackbar__action-button',
+  ACTIVE: 'mdc-snackbar--active',
+  MULTILINE: 'mdc-snackbar--multiline',
+  ACTION_ON_BOTTOM: 'mdc-snackbar--action-on-bottom'
+};
+
+var strings = {
+  TEXT_SELECTOR: '.mdc-snackbar__text',
+  ACTION_WRAPPER_SELECTOR: '.mdc-snackbar__action-wrapper',
+  ACTION_BUTTON_SELECTOR: '.mdc-snackbar__action-button'
+};
+
+var numbers = {
+  MESSAGE_TIMEOUT: 2750
+};
+
+/***/ }),
+
+/***/ 68:
+/***/ (function(module, __webpack_exports__, __webpack_require__) {
+
+"use strict";
+/* harmony import */ var __WEBPACK_IMPORTED_MODULE_0__material_base__ = __webpack_require__(2);
+/* harmony import */ var __WEBPACK_IMPORTED_MODULE_1__constants__ = __webpack_require__(67);
+var _extends = Object.assign || function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; };
+
+var _createClass = function () { function defineProperties(target, props) { for (var i = 0; i < props.length; i++) { var descriptor = props[i]; descriptor.enumerable = descriptor.enumerable || false; descriptor.configurable = true; if ("value" in descriptor) descriptor.writable = true; Object.defineProperty(target, descriptor.key, descriptor); } } return function (Constructor, protoProps, staticProps) { if (protoProps) defineProperties(Constructor.prototype, protoProps); if (staticProps) defineProperties(Constructor, staticProps); return Constructor; }; }();
+
+function _classCallCheck(instance, Constructor) { if (!(instance instanceof Constructor)) { throw new TypeError("Cannot call a class as a function"); } }
+
+function _possibleConstructorReturn(self, call) { if (!self) { throw new ReferenceError("this hasn't been initialised - super() hasn't been called"); } return call && (typeof call === "object" || typeof call === "function") ? call : self; }
+
+function _inherits(subClass, superClass) { if (typeof superClass !== "function" && superClass !== null) { throw new TypeError("Super expression must either be null or a function, not " + typeof superClass); } subClass.prototype = Object.create(superClass && superClass.prototype, { constructor: { value: subClass, enumerable: false, writable: true, configurable: true } }); if (superClass) Object.setPrototypeOf ? Object.setPrototypeOf(subClass, superClass) : subClass.__proto__ = superClass; }
+
+/**
+ * Copyright 2016 Google Inc. All Rights Reserved.
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *      http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+
+
+
+
+var MDCSnackbarFoundation = function (_MDCFoundation) {
+  _inherits(MDCSnackbarFoundation, _MDCFoundation);
+
+  _createClass(MDCSnackbarFoundation, [{
+    key: 'active',
+    get: function get() {
+      return this.active_;
+    }
+  }], [{
+    key: 'cssClasses',
+    get: function get() {
+      return __WEBPACK_IMPORTED_MODULE_1__constants__["a" /* cssClasses */];
+    }
+  }, {
+    key: 'strings',
+    get: function get() {
+      return __WEBPACK_IMPORTED_MODULE_1__constants__["b" /* strings */];
+    }
+  }, {
+    key: 'defaultAdapter',
+    get: function get() {
+      return {
+        addClass: function addClass() /* className: string */{},
+        removeClass: function removeClass() /* className: string */{},
+        setAriaHidden: function setAriaHidden() {},
+        unsetAriaHidden: function unsetAriaHidden() {},
+        setActionAriaHidden: function setActionAriaHidden() {},
+        unsetActionAriaHidden: function unsetActionAriaHidden() {},
+        setActionText: function setActionText() /* actionText: string */{},
+        setMessageText: function setMessageText() /* message: string */{},
+        setFocus: function setFocus() {},
+        visibilityIsHidden: function visibilityIsHidden() {
+          return (/* boolean */false
+          );
+        },
+        registerCapturedBlurHandler: function registerCapturedBlurHandler() /* handler: EventListener */{},
+        deregisterCapturedBlurHandler: function deregisterCapturedBlurHandler() /* handler: EventListener */{},
+        registerVisibilityChangeHandler: function registerVisibilityChangeHandler() /* handler: EventListener */{},
+        deregisterVisibilityChangeHandler: function deregisterVisibilityChangeHandler() /* handler: EventListener */{},
+        registerCapturedInteractionHandler: function registerCapturedInteractionHandler() /* evtType: string, handler: EventListener */{},
+        deregisterCapturedInteractionHandler: function deregisterCapturedInteractionHandler() /* evtType: string, handler: EventListener */{},
+        registerActionClickHandler: function registerActionClickHandler() /* handler: EventListener */{},
+        deregisterActionClickHandler: function deregisterActionClickHandler() /* handler: EventListener */{},
+        registerTransitionEndHandler: function registerTransitionEndHandler() /* handler: EventListener */{},
+        deregisterTransitionEndHandler: function deregisterTransitionEndHandler() /* handler: EventListener */{}
+      };
+    }
+  }]);
+
+  function MDCSnackbarFoundation(adapter) {
+    _classCallCheck(this, MDCSnackbarFoundation);
+
+    var _this = _possibleConstructorReturn(this, (MDCSnackbarFoundation.__proto__ || Object.getPrototypeOf(MDCSnackbarFoundation)).call(this, _extends(MDCSnackbarFoundation.defaultAdapter, adapter)));
+
+    _this.active_ = false;
+    _this.actionWasClicked_ = false;
+    _this.dismissOnAction_ = true;
+    _this.firstFocus_ = true;
+    _this.pointerDownRecognized_ = false;
+    _this.snackbarHasFocus_ = false;
+    _this.snackbarData_ = null;
+    _this.queue_ = [];
+    _this.actionClickHandler_ = function () {
+      _this.actionWasClicked_ = true;
+      _this.invokeAction_();
+    };
+    _this.visibilitychangeHandler_ = function () {
+      clearTimeout(_this.timeoutId_);
+      _this.snackbarHasFocus_ = true;
+
+      if (!_this.adapter_.visibilityIsHidden()) {
+        setTimeout(_this.cleanup_.bind(_this), _this.snackbarData_.timeout || __WEBPACK_IMPORTED_MODULE_1__constants__["c" /* numbers */].MESSAGE_TIMEOUT);
+      }
+    };
+    _this.interactionHandler_ = function (evt) {
+      if (evt.type == 'touchstart' || evt.type == 'mousedown') {
+        _this.pointerDownRecognized_ = true;
+      }
+      _this.handlePossibleTabKeyboardFocus_(evt);
+
+      if (evt.type == 'focus') {
+        _this.pointerDownRecognized_ = false;
+      }
+    };
+    _this.blurHandler_ = function () {
+      clearTimeout(_this.timeoutId_);
+      _this.snackbarHasFocus_ = false;
+      _this.timeoutId_ = setTimeout(_this.cleanup_.bind(_this), _this.snackbarData_.timeout || __WEBPACK_IMPORTED_MODULE_1__constants__["c" /* numbers */].MESSAGE_TIMEOUT);
+    };
+    return _this;
+  }
+
+  _createClass(MDCSnackbarFoundation, [{
+    key: 'init',
+    value: function init() {
+      this.adapter_.registerActionClickHandler(this.actionClickHandler_);
+      this.adapter_.setAriaHidden();
+      this.adapter_.setActionAriaHidden();
+    }
+  }, {
+    key: 'destroy',
+    value: function destroy() {
+      var _this2 = this;
+
+      this.adapter_.deregisterActionClickHandler(this.actionClickHandler_);
+      this.adapter_.deregisterCapturedBlurHandler(this.blurHandler_);
+      this.adapter_.deregisterVisibilityChangeHandler(this.visibilitychangeHandler_);
+      ['touchstart', 'mousedown', 'focus'].forEach(function (evtType) {
+        _this2.adapter_.deregisterCapturedInteractionHandler(evtType, _this2.interactionHandler_);
+      });
+    }
+  }, {
+    key: 'dismissesOnAction',
+    value: function dismissesOnAction() {
+      return this.dismissOnAction_;
+    }
+  }, {
+    key: 'setDismissOnAction',
+    value: function setDismissOnAction(dismissOnAction) {
+      this.dismissOnAction_ = !!dismissOnAction;
+    }
+  }, {
+    key: 'show',
+    value: function show(data) {
+      var _this3 = this;
+
+      clearTimeout(this.timeoutId_);
+      this.snackbarData_ = data;
+      this.firstFocus_ = true;
+      this.adapter_.registerVisibilityChangeHandler(this.visibilitychangeHandler_);
+      this.adapter_.registerCapturedBlurHandler(this.blurHandler_);
+      ['touchstart', 'mousedown', 'focus'].forEach(function (evtType) {
+        _this3.adapter_.registerCapturedInteractionHandler(evtType, _this3.interactionHandler_);
+      });
+
+      if (!this.snackbarData_) {
+        throw new Error('Please provide a data object with at least a message to display.');
+      }
+      if (!this.snackbarData_.message) {
+        throw new Error('Please provide a message to be displayed.');
+      }
+      if (this.snackbarData_.actionHandler && !this.snackbarData_.actionText) {
+        throw new Error('Please provide action text with the handler.');
+      }
+      if (this.active) {
+        this.queue_.push(this.snackbarData_);
+      }
+
+      var ACTIVE = __WEBPACK_IMPORTED_MODULE_1__constants__["a" /* cssClasses */].ACTIVE,
+          MULTILINE = __WEBPACK_IMPORTED_MODULE_1__constants__["a" /* cssClasses */].MULTILINE,
+          ACTION_ON_BOTTOM = __WEBPACK_IMPORTED_MODULE_1__constants__["a" /* cssClasses */].ACTION_ON_BOTTOM;
+
+
+      this.adapter_.setMessageText(this.snackbarData_.message);
+
+      if (this.snackbarData_.multiline) {
+        this.adapter_.addClass(MULTILINE);
+        if (this.snackbarData_.actionOnBottom) {
+          this.adapter_.addClass(ACTION_ON_BOTTOM);
+        }
+      }
+
+      if (this.snackbarData_.actionHandler) {
+        this.adapter_.setActionText(this.snackbarData_.actionText);
+        this.actionHandler_ = this.snackbarData_.actionHandler;
+        this.setActionHidden_(false);
+      } else {
+        this.setActionHidden_(true);
+        this.actionHandler_ = null;
+        this.adapter_.setActionText(null);
+      }
+
+      this.active_ = true;
+      this.adapter_.addClass(ACTIVE);
+      this.adapter_.unsetAriaHidden();
+
+      this.timeoutId_ = setTimeout(this.cleanup_.bind(this), this.snackbarData_.timeout || __WEBPACK_IMPORTED_MODULE_1__constants__["c" /* numbers */].MESSAGE_TIMEOUT);
+    }
+  }, {
+    key: 'handlePossibleTabKeyboardFocus_',
+    value: function handlePossibleTabKeyboardFocus_() {
+      var hijackFocus = this.firstFocus_ && !this.pointerDownRecognized_;
+
+      if (hijackFocus) {
+        this.setFocusOnAction_();
+      }
+
+      this.firstFocus_ = false;
+    }
+  }, {
+    key: 'setFocusOnAction_',
+    value: function setFocusOnAction_() {
+      this.adapter_.setFocus();
+      this.snackbarHasFocus_ = true;
+      this.firstFocus_ = false;
+    }
+  }, {
+    key: 'invokeAction_',
+    value: function invokeAction_() {
+      try {
+        if (!this.actionHandler_) {
+          return;
+        }
+
+        this.actionHandler_();
+      } finally {
+        if (this.dismissOnAction_) {
+          this.cleanup_();
+        }
+      }
+    }
+  }, {
+    key: 'cleanup_',
+    value: function cleanup_() {
+      var _this4 = this;
+
+      var allowDismissal = !this.snackbarHasFocus_ || this.actionWasClicked_;
+
+      if (allowDismissal) {
+        var ACTIVE = __WEBPACK_IMPORTED_MODULE_1__constants__["a" /* cssClasses */].ACTIVE,
+            MULTILINE = __WEBPACK_IMPORTED_MODULE_1__constants__["a" /* cssClasses */].MULTILINE,
+            ACTION_ON_BOTTOM = __WEBPACK_IMPORTED_MODULE_1__constants__["a" /* cssClasses */].ACTION_ON_BOTTOM;
+
+
+        this.adapter_.removeClass(ACTIVE);
+
+        var handler = function handler() {
+          clearTimeout(_this4.timeoutId_);
+          _this4.adapter_.deregisterTransitionEndHandler(handler);
+          _this4.adapter_.removeClass(MULTILINE);
+          _this4.adapter_.removeClass(ACTION_ON_BOTTOM);
+          _this4.setActionHidden_(true);
+          _this4.adapter_.setAriaHidden();
+          _this4.active_ = false;
+          _this4.snackbarHasFocus_ = false;
+          _this4.showNext_();
+        };
+
+        this.adapter_.registerTransitionEndHandler(handler);
+      }
+    }
+  }, {
+    key: 'showNext_',
+    value: function showNext_() {
+      if (!this.queue_.length) {
+        return;
+      }
+      this.show(this.queue_.shift());
+    }
+  }, {
+    key: 'setActionHidden_',
+    value: function setActionHidden_(isHidden) {
+      if (isHidden) {
+        this.adapter_.setActionAriaHidden();
+      } else {
+        this.adapter_.unsetActionAriaHidden();
+      }
+    }
+  }]);
+
+  return MDCSnackbarFoundation;
+}(__WEBPACK_IMPORTED_MODULE_0__material_base__["MDCFoundation"]);
+
+/* harmony default export */ __webpack_exports__["a"] = (MDCSnackbarFoundation);
+
+/***/ }),
+
+/***/ 9:
+/***/ (function(module, __webpack_exports__, __webpack_require__) {
+
+"use strict";
+Object.defineProperty(__webpack_exports__, "__esModule", { value: true });
+/* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, "transformStyleProperties", function() { return transformStyleProperties; });
+/* harmony export (immutable) */ __webpack_exports__["getCorrectEventName"] = getCorrectEventName;
+/* harmony export (immutable) */ __webpack_exports__["getCorrectPropertyName"] = getCorrectPropertyName;
+/**
+ * Copyright 2016 Google Inc. All Rights Reserved.
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *      http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+
+/**
+ * @typedef {{
+ *   noPrefix: string,
+ *   webkitPrefix: string
+ * }}
+ */
+var VendorPropertyMapType = void 0;
+
+/** @const {Object<string, !VendorPropertyMapType>} */
+var eventTypeMap = {
+  'animationstart': {
+    noPrefix: 'animationstart',
+    webkitPrefix: 'webkitAnimationStart',
+    styleProperty: 'animation'
+  },
+  'animationend': {
+    noPrefix: 'animationend',
+    webkitPrefix: 'webkitAnimationEnd',
+    styleProperty: 'animation'
+  },
+  'animationiteration': {
+    noPrefix: 'animationiteration',
+    webkitPrefix: 'webkitAnimationIteration',
+    styleProperty: 'animation'
+  },
+  'transitionend': {
+    noPrefix: 'transitionend',
+    webkitPrefix: 'webkitTransitionEnd',
+    styleProperty: 'transition'
+  }
+};
+
+/** @const {Object<string, !VendorPropertyMapType>} */
+var cssPropertyMap = {
+  'animation': {
+    noPrefix: 'animation',
+    webkitPrefix: '-webkit-animation'
+  },
+  'transform': {
+    noPrefix: 'transform',
+    webkitPrefix: '-webkit-transform'
+  },
+  'transition': {
+    noPrefix: 'transition',
+    webkitPrefix: '-webkit-transition'
+  }
+};
+
+/**
+ * @param {!Object} windowObj
+ * @return {boolean}
+ */
+function hasProperShape(windowObj) {
+  return windowObj['document'] !== undefined && typeof windowObj['document']['createElement'] === 'function';
+}
+
+/**
+ * @param {string} eventType
+ * @return {boolean}
+ */
+function eventFoundInMaps(eventType) {
+  return eventType in eventTypeMap || eventType in cssPropertyMap;
+}
+
+/**
+ * @param {string} eventType
+ * @param {!Object<string, !VendorPropertyMapType>} map
+ * @param {!Element} el
+ * @return {string}
+ */
+function getJavaScriptEventName(eventType, map, el) {
+  return map[eventType].styleProperty in el.style ? map[eventType].noPrefix : map[eventType].webkitPrefix;
+}
+
+/**
+ * Helper function to determine browser prefix for CSS3 animation events
+ * and property names.
+ * @param {!Object} windowObj
+ * @param {string} eventType
+ * @return {string}
+ */
+function getAnimationName(windowObj, eventType) {
+  if (!hasProperShape(windowObj) || !eventFoundInMaps(eventType)) {
+    return eventType;
+  }
+
+  var map = /** @type {!Object<string, !VendorPropertyMapType>} */eventType in eventTypeMap ? eventTypeMap : cssPropertyMap;
+  var el = windowObj['document']['createElement']('div');
+  var eventName = '';
+
+  if (map === eventTypeMap) {
+    eventName = getJavaScriptEventName(eventType, map, el);
+  } else {
+    eventName = map[eventType].noPrefix in el.style ? map[eventType].noPrefix : map[eventType].webkitPrefix;
+  }
+
+  return eventName;
+}
+
+// Public functions to access getAnimationName() for JavaScript events or CSS
+// property names.
+
+var transformStyleProperties = ['transform', 'WebkitTransform', 'MozTransform', 'OTransform', 'MSTransform'];
+
+/**
+ * @param {!Object} windowObj
+ * @param {string} eventType
+ * @return {string}
+ */
+function getCorrectEventName(windowObj, eventType) {
+  return getAnimationName(windowObj, eventType);
+}
+
+/**
+ * @param {!Object} windowObj
+ * @param {string} eventType
+ * @return {string}
+ */
+function getCorrectPropertyName(windowObj, eventType) {
+  return getAnimationName(windowObj, eventType);
+}
+
+/***/ }),
+
+/***/ 96:
+/***/ (function(module, exports, __webpack_require__) {
+
+module.exports = __webpack_require__(34);
+
+
+/***/ })
+
+/******/ });
+});

+ 254 - 0
support/client/lib/vwf/view/lib/mdc/dist/mdc.switch.css

@@ -0,0 +1,254 @@
+/*!
+ Material Components for the web
+ Copyright (c) 2017 Google Inc.
+ License: Apache-2.0
+*/
+/**
+ * The css property used for elevation. In most cases this should not be changed. It is exposed
+ * as a variable for abstraction / easy use when needing to reference the property directly, for
+ * example in a `will-change` rule.
+ */
+/**
+ * The default duration value for elevation transitions.
+ */
+/**
+ * The default easing value for elevation transitions.
+ */
+/**
+ * Applies the correct css rules to an element to give it the elevation specified by $z-value.
+ * The $z-value must be between 0 and 24.
+ */
+/**
+ * Returns a string that can be used as the value for a `transition` property for elevation.
+ * Calling this function directly is useful in situations where a component needs to transition
+ * more than one property.
+ *
+ * ```scss
+ * .foo {
+ *   transition: mdc-elevation-transition-rule(), opacity 100ms ease;
+ *   will-change: $mdc-elevation-property, opacity;
+ * }
+ * ```
+ */
+/**
+ * Applies the correct css rules needed to have an element transition between elevations.
+ * This mixin should be applied to elements whose elevation values will change depending on their
+ * context (e.g. when active or disabled).
+ */
+/*
+  Precomputed linear color channel values, for use in contrast calculations.
+  See https://www.w3.org/TR/WCAG20-TECHS/G17.html#G17-tests
+
+  Algorithm, for c in 0 to 255:
+  f(c) {
+    c = c / 255;
+    return c < 0.03928 ? c / 12.92 : Math.pow((c + 0.055) / 1.055, 2.4);
+  }
+
+  This lookup table is needed since there is no `pow` in SASS.
+*/
+/**
+ * Calculate the luminance for a color.
+ * See https://www.w3.org/TR/WCAG20-TECHS/G17.html#G17-tests
+ */
+/**
+ * Calculate the contrast ratio between two colors.
+ * See https://www.w3.org/TR/WCAG20-TECHS/G17.html#G17-tests
+ */
+/**
+ * Determine whether to use dark or light text on top of given color.
+ * Returns "dark" for dark text and "light" for light text.
+ */
+/*
+  Main theme colors.
+  If you're a user customizing your color scheme in SASS, these are probably the only variables you need to change.
+*/
+/* Indigo 500 */
+/* Pink A200 */
+/* White */
+/* Which set of text colors to use for each main theme color (light or dark) */
+/* Text colors according to light vs dark and text type */
+/* Primary text colors for each of the theme colors */
+/**
+ * Applies the correct theme color style to the specified property.
+ * $property is typically color or background-color, but can be any CSS property that accepts color values.
+ * $style should be one of the map keys in $mdc-theme-property-values (_variables.scss).
+ */
+/**
+ * Creates a rule to be used in MDC-Web components for dark theming, and applies the provided contents.
+ * Should provide the $root-selector option if applied to anything other than the root selector.
+ * When used with a modifier class, provide a second argument of `true` for the $compound parameter
+ * to specify that this should be attached as a compound class.
+ *
+ * Usage example:
+ *
+ * ```scss
+ * .mdc-foo {
+ *   color: black;
+ *
+ *   @include mdc-theme-dark {
+ *     color: white;
+ *   }
+ *
+ *   &__bar {
+ *     background: black;
+ *
+ *     @include mdc-theme-dark(".mdc-foo") {
+ *       background: white;
+ *     }
+ *   }
+ * }
+ *
+ * .mdc-foo--disabled {
+ *   opacity: .38;
+ *
+ *   @include mdc-theme-dark(".mdc-foo", true) {
+ *     opacity: .5;
+ *   }
+ * }
+ * ```
+ */
+.mdc-switch {
+  display: inline-block;
+  position: relative; }
+  .mdc-switch__native-control {
+    display: inline-block;
+    position: absolute;
+    top: 0;
+    left: 0;
+    width: 34px;
+    height: 14px;
+    cursor: pointer;
+    opacity: 0;
+    z-index: 2; }
+  .mdc-switch__background {
+    display: block;
+    position: relative;
+    width: 34px;
+    height: 14px;
+    border-radius: 7px;
+    outline: none;
+    background-color: transparent;
+    cursor: pointer;
+    -webkit-user-select: none;
+       -moz-user-select: none;
+        -ms-user-select: none;
+            user-select: none; }
+    .mdc-switch--theme-dark .mdc-switch__background,
+    .mdc-theme--dark .mdc-switch__background {
+      background-color: transparent; }
+    .mdc-switch__background::before {
+      display: block;
+      position: absolute;
+      top: 0;
+      right: 0;
+      bottom: 0;
+      left: 0;
+      -webkit-transition: opacity 90ms cubic-bezier(0.4, 0, 0.2, 1), background-color 90ms cubic-bezier(0.4, 0, 0.2, 1);
+      transition: opacity 90ms cubic-bezier(0.4, 0, 0.2, 1), background-color 90ms cubic-bezier(0.4, 0, 0.2, 1);
+      border-radius: 7px;
+      background-color: #000;
+      content: "";
+      opacity: .38; }
+      .mdc-switch--theme-dark .mdc-switch__background::before,
+      .mdc-theme--dark .mdc-switch__background::before {
+        background-color: #fff;
+        opacity: .3; }
+    .mdc-switch__background .mdc-switch__knob {
+      display: block;
+      position: absolute;
+      top: -3px;
+      left: 0;
+      width: 20px;
+      height: 20px;
+      -webkit-transform: translateX(0);
+              transform: translateX(0);
+      -webkit-transition: background-color 90ms cubic-bezier(0.4, 0, 0.2, 1), -webkit-transform 90ms cubic-bezier(0.4, 0, 0.2, 1);
+      transition: background-color 90ms cubic-bezier(0.4, 0, 0.2, 1), -webkit-transform 90ms cubic-bezier(0.4, 0, 0.2, 1);
+      transition: transform 90ms cubic-bezier(0.4, 0, 0.2, 1), background-color 90ms cubic-bezier(0.4, 0, 0.2, 1);
+      transition: transform 90ms cubic-bezier(0.4, 0, 0.2, 1), background-color 90ms cubic-bezier(0.4, 0, 0.2, 1), -webkit-transform 90ms cubic-bezier(0.4, 0, 0.2, 1);
+      border-radius: 10px;
+      background-color: #fafafa;
+      -webkit-box-shadow: 0px 3px 1px -2px rgba(0, 0, 0, 0.2), 0px 2px 2px 0px rgba(0, 0, 0, 0.14), 0px 1px 5px 0px rgba(0, 0, 0, 0.12);
+              box-shadow: 0px 3px 1px -2px rgba(0, 0, 0, 0.2), 0px 2px 2px 0px rgba(0, 0, 0, 0.14), 0px 1px 5px 0px rgba(0, 0, 0, 0.12);
+      z-index: 1; }
+      .mdc-switch--theme-dark .mdc-switch__background .mdc-switch__knob,
+      .mdc-theme--dark .mdc-switch__background .mdc-switch__knob {
+        background-color: #bdbdbd; }
+      .mdc-switch__background .mdc-switch__knob::before {
+        position: absolute;
+        top: -14px;
+        left: -14px;
+        width: 48px;
+        height: 48px;
+        -webkit-transform: scale(0);
+                transform: scale(0);
+        -webkit-transition: background-color 90ms cubic-bezier(0.4, 0, 0.2, 1), -webkit-transform 90ms cubic-bezier(0.4, 0, 0.2, 1);
+        transition: background-color 90ms cubic-bezier(0.4, 0, 0.2, 1), -webkit-transform 90ms cubic-bezier(0.4, 0, 0.2, 1);
+        transition: transform 90ms cubic-bezier(0.4, 0, 0.2, 1), background-color 90ms cubic-bezier(0.4, 0, 0.2, 1);
+        transition: transform 90ms cubic-bezier(0.4, 0, 0.2, 1), background-color 90ms cubic-bezier(0.4, 0, 0.2, 1), -webkit-transform 90ms cubic-bezier(0.4, 0, 0.2, 1);
+        border-radius: 24px;
+        background-color: transparent;
+        content: "";
+        opacity: .2; }
+
+.mdc-switch__native-control:focus ~ .mdc-switch__background .mdc-switch__knob::before {
+  position: absolute;
+  width: 48px;
+  height: 48px;
+  -webkit-transform: scale(1);
+          transform: scale(1);
+  -webkit-transition: background-color 90ms cubic-bezier(0.4, 0, 0.2, 1), -webkit-transform 90ms cubic-bezier(0.4, 0, 0.2, 1);
+  transition: background-color 90ms cubic-bezier(0.4, 0, 0.2, 1), -webkit-transform 90ms cubic-bezier(0.4, 0, 0.2, 1);
+  transition: transform 90ms cubic-bezier(0.4, 0, 0.2, 1), background-color 90ms cubic-bezier(0.4, 0, 0.2, 1);
+  transition: transform 90ms cubic-bezier(0.4, 0, 0.2, 1), background-color 90ms cubic-bezier(0.4, 0, 0.2, 1), -webkit-transform 90ms cubic-bezier(0.4, 0, 0.2, 1);
+  border-radius: 24px;
+  background-color: #9e9e9e; }
+  .mdc-switch--theme-dark .mdc-switch__native-control:focus ~ .mdc-switch__background .mdc-switch__knob::before,
+  .mdc-theme--dark .mdc-switch__native-control:focus ~ .mdc-switch__background .mdc-switch__knob::before {
+    background-color: #f1f1f1;
+    opacity: .14; }
+
+.mdc-switch__native-control:checked ~ .mdc-switch__background::before {
+  /* @alternate */
+  background-color: #3f51b5;
+  background-color: var(--mdc-theme-primary, #3f51b5);
+  opacity: .5; }
+
+.mdc-switch__native-control:checked ~ .mdc-switch__background .mdc-switch__knob {
+  -webkit-transform: translateX(14px);
+          transform: translateX(14px);
+  -webkit-transition: background-color 90ms cubic-bezier(0.4, 0, 0.2, 1), -webkit-transform 90ms cubic-bezier(0.4, 0, 0.2, 1);
+  transition: background-color 90ms cubic-bezier(0.4, 0, 0.2, 1), -webkit-transform 90ms cubic-bezier(0.4, 0, 0.2, 1);
+  transition: transform 90ms cubic-bezier(0.4, 0, 0.2, 1), background-color 90ms cubic-bezier(0.4, 0, 0.2, 1);
+  transition: transform 90ms cubic-bezier(0.4, 0, 0.2, 1), background-color 90ms cubic-bezier(0.4, 0, 0.2, 1), -webkit-transform 90ms cubic-bezier(0.4, 0, 0.2, 1);
+  /* @alternate */
+  background-color: #3f51b5;
+  background-color: var(--mdc-theme-primary, #3f51b5); }
+  .mdc-switch__native-control:checked ~ .mdc-switch__background .mdc-switch__knob::before {
+    /* @alternate */
+    background-color: #3f51b5;
+    background-color: var(--mdc-theme-primary, #3f51b5);
+    opacity: .15; }
+    .mdc-switch--theme-dark .mdc-switch__native-control:checked ~ .mdc-switch__background .mdc-switch__knob::before,
+    .mdc-theme--dark .mdc-switch__native-control:checked ~ .mdc-switch__background .mdc-switch__knob::before {
+      /* @alternate */
+      background-color: #3f51b5;
+      background-color: var(--mdc-theme-primary, #3f51b5); }
+
+.mdc-switch__native-control:disabled {
+  cursor: initial; }
+
+.mdc-switch__native-control:disabled ~ .mdc-switch__background::before {
+  background-color: #000;
+  opacity: .12; }
+  .mdc-switch--theme-dark .mdc-switch__native-control:disabled ~ .mdc-switch__background::before,
+  .mdc-theme--dark .mdc-switch__native-control:disabled ~ .mdc-switch__background::before {
+    background-color: #fff;
+    opacity: .1; }
+
+.mdc-switch__native-control:disabled ~ .mdc-switch__background .mdc-switch__knob {
+  background-color: #bdbdbd; }
+  .mdc-switch--theme-dark .mdc-switch__native-control:disabled ~ .mdc-switch__background .mdc-switch__knob,
+  .mdc-theme--dark .mdc-switch__native-control:disabled ~ .mdc-switch__background .mdc-switch__knob {
+    background-color: #424242; }

+ 83 - 0
support/client/lib/vwf/view/lib/mdc/dist/mdc.switch.css-entry

@@ -0,0 +1,83 @@
+/*!
+ Material Components for the web
+ Copyright (c) 2017 Google Inc.
+ License: Apache-2.0
+*/
+/******/ (function(modules) { // webpackBootstrap
+/******/ 	// The module cache
+/******/ 	var installedModules = {};
+/******/
+/******/ 	// The require function
+/******/ 	function __webpack_require__(moduleId) {
+/******/
+/******/ 		// Check if module is in cache
+/******/ 		if(installedModules[moduleId]) {
+/******/ 			return installedModules[moduleId].exports;
+/******/ 		}
+/******/ 		// Create a new module (and put it into the cache)
+/******/ 		var module = installedModules[moduleId] = {
+/******/ 			i: moduleId,
+/******/ 			l: false,
+/******/ 			exports: {}
+/******/ 		};
+/******/
+/******/ 		// Execute the module function
+/******/ 		modules[moduleId].call(module.exports, module, module.exports, __webpack_require__);
+/******/
+/******/ 		// Flag the module as loaded
+/******/ 		module.l = true;
+/******/
+/******/ 		// Return the exports of the module
+/******/ 		return module.exports;
+/******/ 	}
+/******/
+/******/
+/******/ 	// expose the modules object (__webpack_modules__)
+/******/ 	__webpack_require__.m = modules;
+/******/
+/******/ 	// expose the module cache
+/******/ 	__webpack_require__.c = installedModules;
+/******/
+/******/ 	// identity function for calling harmony imports with the correct context
+/******/ 	__webpack_require__.i = function(value) { return value; };
+/******/
+/******/ 	// define getter function for harmony exports
+/******/ 	__webpack_require__.d = function(exports, name, getter) {
+/******/ 		if(!__webpack_require__.o(exports, name)) {
+/******/ 			Object.defineProperty(exports, name, {
+/******/ 				configurable: false,
+/******/ 				enumerable: true,
+/******/ 				get: getter
+/******/ 			});
+/******/ 		}
+/******/ 	};
+/******/
+/******/ 	// getDefaultExport function for compatibility with non-harmony modules
+/******/ 	__webpack_require__.n = function(module) {
+/******/ 		var getter = module && module.__esModule ?
+/******/ 			function getDefault() { return module['default']; } :
+/******/ 			function getModuleExports() { return module; };
+/******/ 		__webpack_require__.d(getter, 'a', getter);
+/******/ 		return getter;
+/******/ 	};
+/******/
+/******/ 	// Object.prototype.hasOwnProperty.call
+/******/ 	__webpack_require__.o = function(object, property) { return Object.prototype.hasOwnProperty.call(object, property); };
+/******/
+/******/ 	// __webpack_public_path__
+/******/ 	__webpack_require__.p = "/assets/";
+/******/
+/******/ 	// Load entry module and return exports
+/******/ 	return __webpack_require__(__webpack_require__.s = 21);
+/******/ })
+/************************************************************************/
+/******/ ({
+
+/***/ 21:
+/***/ (function(module, exports) {
+
+// removed by extract-text-webpack-plugin
+
+/***/ })
+
+/******/ });

+ 1393 - 0
support/client/lib/vwf/view/lib/mdc/dist/mdc.tabs.css

@@ -0,0 +1,1393 @@
+/*!
+ Material Components for the web
+ Copyright (c) 2017 Google Inc.
+ License: Apache-2.0
+*/
+/* TODO(sgomes): Figure out what to do about desktop font sizes. */
+/* TODO(sgomes): Figure out what to do about i18n and i18n font sizes. */
+/*
+  Precomputed linear color channel values, for use in contrast calculations.
+  See https://www.w3.org/TR/WCAG20-TECHS/G17.html#G17-tests
+
+  Algorithm, for c in 0 to 255:
+  f(c) {
+    c = c / 255;
+    return c < 0.03928 ? c / 12.92 : Math.pow((c + 0.055) / 1.055, 2.4);
+  }
+
+  This lookup table is needed since there is no `pow` in SASS.
+*/
+/**
+ * Calculate the luminance for a color.
+ * See https://www.w3.org/TR/WCAG20-TECHS/G17.html#G17-tests
+ */
+/**
+ * Calculate the contrast ratio between two colors.
+ * See https://www.w3.org/TR/WCAG20-TECHS/G17.html#G17-tests
+ */
+/**
+ * Determine whether to use dark or light text on top of given color.
+ * Returns "dark" for dark text and "light" for light text.
+ */
+/*
+  Main theme colors.
+  If you're a user customizing your color scheme in SASS, these are probably the only variables you need to change.
+*/
+/* Indigo 500 */
+/* Pink A200 */
+/* White */
+/* Which set of text colors to use for each main theme color (light or dark) */
+/* Text colors according to light vs dark and text type */
+/* Primary text colors for each of the theme colors */
+/**
+ * Applies the correct theme color style to the specified property.
+ * $property is typically color or background-color, but can be any CSS property that accepts color values.
+ * $style should be one of the map keys in $mdc-theme-property-values (_variables.scss).
+ */
+/**
+ * Creates a rule to be used in MDC-Web components for dark theming, and applies the provided contents.
+ * Should provide the $root-selector option if applied to anything other than the root selector.
+ * When used with a modifier class, provide a second argument of `true` for the $compound parameter
+ * to specify that this should be attached as a compound class.
+ *
+ * Usage example:
+ *
+ * ```scss
+ * .mdc-foo {
+ *   color: black;
+ *
+ *   @include mdc-theme-dark {
+ *     color: white;
+ *   }
+ *
+ *   &__bar {
+ *     background: black;
+ *
+ *     @include mdc-theme-dark(".mdc-foo") {
+ *       background: white;
+ *     }
+ *   }
+ * }
+ *
+ * .mdc-foo--disabled {
+ *   opacity: .38;
+ *
+ *   @include mdc-theme-dark(".mdc-foo", true) {
+ *     opacity: .5;
+ *   }
+ * }
+ * ```
+ */
+/*
+  Precomputed linear color channel values, for use in contrast calculations.
+  See https://www.w3.org/TR/WCAG20-TECHS/G17.html#G17-tests
+
+  Algorithm, for c in 0 to 255:
+  f(c) {
+    c = c / 255;
+    return c < 0.03928 ? c / 12.92 : Math.pow((c + 0.055) / 1.055, 2.4);
+  }
+
+  This lookup table is needed since there is no `pow` in SASS.
+*/
+/**
+ * Calculate the luminance for a color.
+ * See https://www.w3.org/TR/WCAG20-TECHS/G17.html#G17-tests
+ */
+/**
+ * Calculate the contrast ratio between two colors.
+ * See https://www.w3.org/TR/WCAG20-TECHS/G17.html#G17-tests
+ */
+/**
+ * Determine whether to use dark or light text on top of given color.
+ * Returns "dark" for dark text and "light" for light text.
+ */
+/*
+  Main theme colors.
+  If you're a user customizing your color scheme in SASS, these are probably the only variables you need to change.
+*/
+/* Indigo 500 */
+/* Pink A200 */
+/* White */
+/* Which set of text colors to use for each main theme color (light or dark) */
+/* Text colors according to light vs dark and text type */
+/* Primary text colors for each of the theme colors */
+/** MDC Ripple keyframes are split into their own file so that _mixins.scss can rely on them. */
+@-webkit-keyframes mdc-ripple-fg-radius-in {
+  from {
+    -webkit-transform: translate(var(--mdc-ripple-fg-translate-start, 0)) scale(1);
+            transform: translate(var(--mdc-ripple-fg-translate-start, 0)) scale(1);
+    -webkit-animation-timing-function: cubic-bezier(0.4, 0, 0.2, 1);
+            animation-timing-function: cubic-bezier(0.4, 0, 0.2, 1); }
+  to {
+    -webkit-transform: translate(var(--mdc-ripple-fg-translate-end, 0)) scale(var(--mdc-ripple-fg-scale, 1));
+            transform: translate(var(--mdc-ripple-fg-translate-end, 0)) scale(var(--mdc-ripple-fg-scale, 1)); } }
+@keyframes mdc-ripple-fg-radius-in {
+  from {
+    -webkit-transform: translate(var(--mdc-ripple-fg-translate-start, 0)) scale(1);
+            transform: translate(var(--mdc-ripple-fg-translate-start, 0)) scale(1);
+    -webkit-animation-timing-function: cubic-bezier(0.4, 0, 0.2, 1);
+            animation-timing-function: cubic-bezier(0.4, 0, 0.2, 1); }
+  to {
+    -webkit-transform: translate(var(--mdc-ripple-fg-translate-end, 0)) scale(var(--mdc-ripple-fg-scale, 1));
+            transform: translate(var(--mdc-ripple-fg-translate-end, 0)) scale(var(--mdc-ripple-fg-scale, 1)); } }
+
+@-webkit-keyframes mdc-ripple-fg-opacity-in {
+  from {
+    opacity: 0;
+    -webkit-animation-timing-function: linear;
+            animation-timing-function: linear; }
+  to {
+    opacity: 1; } }
+
+@keyframes mdc-ripple-fg-opacity-in {
+  from {
+    opacity: 0;
+    -webkit-animation-timing-function: linear;
+            animation-timing-function: linear; }
+  to {
+    opacity: 1; } }
+
+@-webkit-keyframes mdc-ripple-fg-opacity-out {
+  from {
+    opacity: 1;
+    -webkit-animation-timing-function: linear;
+            animation-timing-function: linear; }
+  to {
+    opacity: 0; } }
+
+@keyframes mdc-ripple-fg-opacity-out {
+  from {
+    opacity: 1;
+    -webkit-animation-timing-function: linear;
+            animation-timing-function: linear; }
+  to {
+    opacity: 0; } }
+
+/**
+ * Creates a rule that will be applied when an MDC-Web component is within the context of an RTL layout.
+ *
+ * Usage Example:
+ * ```scss
+ * .mdc-foo {
+ *   position: absolute;
+ *   left: 0;
+ *
+ *   @include mdc-rtl {
+ *     left: auto;
+ *     right: 0;
+ *   }
+ *
+ *   &__bar {
+ *     margin-left: 4px;
+ *     @include mdc-rtl(".mdc-foo") {
+ *       margin-left: auto;
+ *       margin-right: 4px;
+ *     }
+ *   }
+ * }
+ *
+ * .mdc-foo--mod {
+ *   padding-left: 4px;
+ *
+ *   @include mdc-rtl {
+ *     padding-left: auto;
+ *     padding-right: 4px;
+ *   }
+ * }
+ * ```
+ *
+ * Note that this works by checking for [dir="rtl"] on an ancestor element. While this will work
+ * in most cases, it will in some cases lead to false negatives, e.g.
+ *
+ * ```html
+ * <html dir="rtl">
+ *   <!-- ... -->
+ *   <div dir="ltr">
+ *     <div class="mdc-foo">Styled incorrectly as RTL!</div>
+ *   </div>
+ * </html>
+ * ```
+ *
+ * In the future, selectors such as :dir (http://mdn.io/:dir) will help us mitigate this.
+ */
+/**
+ * Takes a base box-model property - e.g. margin / border / padding - along with a default
+ * direction and value, and emits rules which apply the value to the
+ * "<base-property>-<default-direction>" property by default, but flips the direction
+ * when within an RTL context.
+ *
+ * For example:
+ *
+ * ```scss
+ * .mdc-foo {
+ *   @include mdc-rtl-reflexive-box(margin, left, 8px);
+ * }
+ * ```
+ * is equivalent to:
+ *
+ * ```scss
+ * .mdc-foo {
+ *   margin-left: 8px;
+ *
+ *   @include mdc-rtl {
+ *     margin-right: 8px;
+ *     margin-left: 0;
+ *   }
+ * }
+ * ```
+ * whereas:
+ *
+ * ```scss
+ * .mdc-foo {
+ *   @include mdc-rtl-reflexive-box(margin, right, 8px);
+ * }
+ * ```
+ * is equivalent to:
+ *
+ * ```scss
+ * .mdc-foo {
+ *   margin-right: 8px;
+ *
+ *   @include mdc-rtl {
+ *     margin-right: 0;
+ *     margin-left: 8px;
+ *   }
+ * }
+ * ```
+ *
+ * You can also pass a 4th optional $root-selector argument which will be forwarded to `mdc-rtl`,
+ * e.g. `@include mdc-rtl-reflexive-box(margin, left, 8px, ".mdc-component")`.
+ *
+ * Note that this function will always zero out the original value in an RTL context. If you're
+ * trying to flip the values, use mdc-rtl-reflexive-property().
+ */
+/**
+ * Takes a base property and emits rules that assign <base-property>-left to <left-value> and
+ * <base-property>-right to <right-value> in a LTR context, and vice versa in a RTL context.
+ * For example:
+ *
+ * ```scss
+ * .mdc-foo {
+ *   @include mdc-rtl-reflexive-property(margin, auto, 12px);
+ * }
+ * ```
+ * is equivalent to:
+ *
+ * ```scss
+ * .mdc-foo {
+ *   margin-left: auto;
+ *   margin-right: 12px;
+ *
+ *   @include mdc-rtl {
+ *     margin-left: 12px;
+ *     margin-right: auto;
+ *   }
+ * }
+ * ```
+ *
+ * A 4th optional $root-selector argument can be given, which will be passed to `mdc-rtl`.
+ */
+/**
+ * Takes an argument specifying a horizontal position property (either "left" or "right") as well
+ * as a value, and applies that value to the specified position in a LTR context, and flips it in a
+ * RTL context. For example:
+ *
+ * ```scss
+ * .mdc-foo {
+ *   @include mdc-rtl-reflexive-position(left, 0);
+ *   position: absolute;
+ * }
+ * ```
+ * is equivalent to:
+ *
+ * ```scss
+ *  .mdc-foo {
+ *    position: absolute;
+ *    left: 0;
+ *    right: initial;
+ *
+ *    @include mdc-rtl {
+ *      right: 0;
+ *      left: initial;
+ *    }
+ *  }
+ * ```
+ * An optional third $root-selector argument may also be given, which is passed to `mdc-rtl`.
+ */
+.mdc-tab {
+  font-family: Roboto, sans-serif;
+  -moz-osx-font-smoothing: grayscale;
+  -webkit-font-smoothing: antialiased;
+  font-size: 0.875rem;
+  font-weight: 500;
+  letter-spacing: 0.04em;
+  line-height: 1.5rem;
+  text-decoration: inherit;
+  text-transform: inherit;
+  display: table-cell;
+  position: relative;
+  -webkit-box-sizing: border-box;
+          box-sizing: border-box;
+  min-width: 160px;
+  min-height: 48px;
+  padding: 0 24px;
+  text-align: center;
+  text-decoration: none;
+  white-space: nowrap;
+  cursor: pointer;
+  overflow: hidden;
+  vertical-align: middle;
+  /* @alternate */
+  color: rgba(0, 0, 0, 0.54);
+  color: var(--mdc-theme-text-secondary-on-light, rgba(0, 0, 0, 0.54)); }
+  .mdc-tab:hover {
+    /* @alternate */
+    color: rgba(0, 0, 0, 0.87);
+    color: var(--mdc-theme-text-primary-on-light, rgba(0, 0, 0, 0.87)); }
+  .mdc-tab:focus {
+    /* @alternate */
+    outline-color: rgba(0, 0, 0, 0.54);
+    outline-color: var(--mdc-theme-text-secondary-on-light, rgba(0, 0, 0, 0.54)); }
+  .mdc-tab-bar--theme-dark .mdc-tab,
+  .mdc-theme--dark .mdc-tab {
+    /* @alternate */
+    color: rgba(255, 255, 255, 0.7);
+    color: var(--mdc-theme-text-secondary-on-dark, rgba(255, 255, 255, 0.7)); }
+    .mdc-tab-bar--theme-dark .mdc-tab:hover,
+    .mdc-theme--dark .mdc-tab:hover {
+      /* @alternate */
+      color: white;
+      color: var(--mdc-theme-text-primary-on-dark, white); }
+    .mdc-tab-bar--theme-dark .mdc-tab:focus,
+    .mdc-theme--dark .mdc-tab:focus {
+      /* @alternate */
+      outline-color: rgba(255, 255, 255, 0.7);
+      outline-color: var(--mdc-theme-text-secondary-on-dark, rgba(255, 255, 255, 0.7)); }
+  @media screen and (max-width: 600px) {
+    .mdc-tab {
+      min-width: 72px;
+      padding: 0 12px; } }
+  .mdc-tab__icon {
+    display: block;
+    margin: 0 auto;
+    width: 24px;
+    height: 24px; }
+    .mdc-tab-bar--icons-with-text .mdc-tab__icon {
+      margin-top: 4px; }
+  .mdc-tab__icon-text {
+    display: block;
+    margin: 0 auto; }
+  .mdc-tab__icon + .mdc-tab__icon-text {
+    padding-top: 6px; }
+
+.mdc-tab--active {
+  /* @alternate */
+  color: rgba(0, 0, 0, 0.87);
+  color: var(--mdc-theme-text-primary-on-light, rgba(0, 0, 0, 0.87)); }
+  .mdc-tab-bar--theme-dark .mdc-tab--active,
+  .mdc-theme--dark .mdc-tab--active {
+    /* @alternate */
+    color: white;
+    color: var(--mdc-theme-text-primary-on-dark, white); }
+  .mdc-tab--active::before {
+    bottom: 0; }
+
+.mdc-tab-bar:not(.mdc-tab-bar-upgraded) .mdc-tab {
+  position: relative; }
+  .mdc-tab-bar:not(.mdc-tab-bar-upgraded) .mdc-tab::after {
+    display: none;
+    position: absolute;
+    top: 46px;
+    left: 0;
+    width: calc(100% - 4px);
+    height: 2px;
+    content: "";
+    pointer-events: none;
+    /* @alternate */
+    background-color: rgba(0, 0, 0, 0.87);
+    background-color: var(--mdc-theme-text-primary-on-light, rgba(0, 0, 0, 0.87)); }
+    .mdc-tab-bar--theme-dark.mdc-tab-bar:not(.mdc-tab-bar-upgraded) .mdc-tab::after,
+    .mdc-theme--dark .mdc-tab-bar:not(.mdc-tab-bar-upgraded) .mdc-tab::after {
+      /* @alternate */
+      background-color: white;
+      background-color: var(--mdc-theme-text-primary-on-dark, white); }
+    .mdc-toolbar .mdc-tab-bar:not(.mdc-tab-bar-upgraded) .mdc-tab::after {
+      /* @alternate */
+      background-color: white;
+      background-color: var(--mdc-theme-text-primary-on-primary, white); }
+  .mdc-tab-bar:not(.mdc-tab-bar-upgraded) .mdc-tab--active::after, .mdc-tab-bar:not(.mdc-tab-bar-upgraded) .mdc-tab:active::after, .mdc-tab-bar:not(.mdc-tab-bar-upgraded) .mdc-tab:hover::after {
+    display: block; }
+  .mdc-tab-bar:not(.mdc-tab-bar-upgraded) .mdc-tab:not(.mdc-tab--active):hover::after {
+    opacity: .38; }
+  .mdc-tab-bar:not(.mdc-tab-bar-upgraded) .mdc-tab--active, .mdc-tab-bar:not(.mdc-tab-bar-upgraded) .mdc-tab:not(.mdc-tab--active):active::after {
+    opacity: .87; }
+
+.mdc-tab-bar--icons-with-text:not(.mdc-tab-bar-upgraded) .mdc-tab::after {
+  top: 70px; }
+
+.mdc-tab.mdc-ripple-upgraded {
+  --mdc-ripple-surface-width: 0;
+  --mdc-ripple-surface-height: 0;
+  --mdc-ripple-fg-size: 0;
+  --mdc-ripple-left: 0;
+  --mdc-ripple-top: 0;
+  --mdc-ripple-fg-scale: 1;
+  --mdc-ripple-fg-translate-end: 0;
+  --mdc-ripple-fg-translate-start: 0;
+  will-change: transform, opacity;
+  -webkit-tap-highlight-color: transparent; }
+  .mdc-tab.mdc-ripple-upgraded:not(.mdc-ripple-upgraded):hover::before, .mdc-tab.mdc-ripple-upgraded:not(.mdc-ripple-upgraded):focus::before, .mdc-tab.mdc-ripple-upgraded:not(.mdc-ripple-upgraded):active::after {
+    -webkit-transition-duration: 85ms;
+            transition-duration: 85ms;
+    opacity: .6; }
+  .mdc-tab.mdc-ripple-upgraded::after {
+    background-color: rgba(0, 0, 0, 0.06);
+    position: absolute;
+    top: calc(50% - 100%);
+    left: calc(50% - 100%);
+    width: 200%;
+    height: 200%;
+    -webkit-transition: opacity 250ms linear;
+    transition: opacity 250ms linear;
+    border-radius: 50%;
+    opacity: 0;
+    pointer-events: none;
+    content: ""; }
+  .mdc-tab.mdc-ripple-upgraded.mdc-ripple-upgraded::after {
+    top: 0;
+    left: 0;
+    /* @alternate */
+    width: 100%;
+    width: var(--mdc-ripple-fg-size, 100%);
+    /* @alternate */
+    height: 100%;
+    height: var(--mdc-ripple-fg-size, 100%);
+    -webkit-transform: scale(0);
+            transform: scale(0);
+    -webkit-transform-origin: center center;
+            transform-origin: center center;
+    opacity: 0; }
+  .mdc-tab.mdc-ripple-upgraded:not(.mdc-ripple-upgraded--unbounded)::after {
+    -webkit-transform-origin: center center;
+            transform-origin: center center; }
+  .mdc-tab.mdc-ripple-upgraded.mdc-ripple-upgraded--unbounded::after {
+    /* @alternate */
+    top: 0;
+    top: var(--mdc-ripple-top, 0);
+    /* @alternate */
+    left: 0;
+    left: var(--mdc-ripple-left, 0);
+    /* @alternate */
+    width: 100%;
+    width: var(--mdc-ripple-fg-size, 100%);
+    /* @alternate */
+    height: 100%;
+    height: var(--mdc-ripple-fg-size, 100%);
+    -webkit-transform: scale(0);
+            transform: scale(0);
+    -webkit-transform-origin: center center;
+            transform-origin: center center; }
+  .mdc-tab.mdc-ripple-upgraded.mdc-ripple-upgraded--foreground-activation::after {
+    -webkit-animation: 300ms mdc-ripple-fg-radius-in forwards, 83ms mdc-ripple-fg-opacity-in forwards;
+            animation: 300ms mdc-ripple-fg-radius-in forwards, 83ms mdc-ripple-fg-opacity-in forwards; }
+  .mdc-tab.mdc-ripple-upgraded.mdc-ripple-upgraded--foreground-deactivation::after {
+    -webkit-transform: translate(var(--mdc-ripple-fg-translate-end, 0)) scale(var(--mdc-ripple-fg-scale, 1));
+            transform: translate(var(--mdc-ripple-fg-translate-end, 0)) scale(var(--mdc-ripple-fg-scale, 1));
+    -webkit-animation: 83ms mdc-ripple-fg-opacity-out;
+            animation: 83ms mdc-ripple-fg-opacity-out; }
+  .mdc-tab.mdc-ripple-upgraded::before {
+    background-color: rgba(0, 0, 0, 0.06);
+    position: absolute;
+    top: calc(50% - 100%);
+    left: calc(50% - 100%);
+    width: 200%;
+    height: 200%;
+    -webkit-transition: opacity 250ms linear;
+    transition: opacity 250ms linear;
+    border-radius: 50%;
+    opacity: 0;
+    pointer-events: none;
+    content: ""; }
+  .mdc-tab.mdc-ripple-upgraded.mdc-ripple-upgraded::before {
+    top: calc(50% - 100%);
+    left: calc(50% - 100%);
+    width: 200%;
+    height: 200%;
+    /* @alternate */
+    -webkit-transform: scale(0);
+            transform: scale(0);
+    -webkit-transform: scale(var(--mdc-ripple-fg-scale, 0));
+            transform: scale(var(--mdc-ripple-fg-scale, 0)); }
+  .mdc-tab.mdc-ripple-upgraded.mdc-ripple-upgraded--background-focused::before {
+    opacity: .99999; }
+  .mdc-tab.mdc-ripple-upgraded.mdc-ripple-upgraded--background-active-fill::before {
+    -webkit-transition-duration: 120ms;
+            transition-duration: 120ms;
+    opacity: 1; }
+  .mdc-tab.mdc-ripple-upgraded.mdc-ripple-upgraded--unbounded::before {
+    /* @alternate */
+    top: calc(50% - 50%);
+    top: var(--mdc-ripple-top, calc(50% - 50%));
+    /* @alternate */
+    left: calc(50% - 50%);
+    left: var(--mdc-ripple-left, calc(50% - 50%));
+    /* @alternate */
+    width: 100%;
+    width: var(--mdc-ripple-fg-size, 100%);
+    /* @alternate */
+    height: 100%;
+    height: var(--mdc-ripple-fg-size, 100%);
+    /* @alternate */
+    -webkit-transform: scale(0);
+            transform: scale(0);
+    -webkit-transform: scale(var(--mdc-ripple-fg-scale, 0));
+            transform: scale(var(--mdc-ripple-fg-scale, 0)); }
+  .mdc-tab-bar--theme-dark .mdc-tab.mdc-ripple-upgraded::before,
+  .mdc-theme--dark .mdc-tab.mdc-ripple-upgraded::before {
+    background-color: rgba(255, 255, 255, 0.16);
+    position: absolute;
+    top: calc(50% - 100%);
+    left: calc(50% - 100%);
+    width: 200%;
+    height: 200%;
+    -webkit-transition: opacity 250ms linear;
+    transition: opacity 250ms linear;
+    border-radius: 50%;
+    opacity: 0;
+    pointer-events: none;
+    content: ""; }
+  .mdc-tab-bar--theme-dark .mdc-tab.mdc-ripple-upgraded.mdc-ripple-upgraded::before,
+  .mdc-theme--dark .mdc-tab.mdc-ripple-upgraded.mdc-ripple-upgraded::before {
+    top: calc(50% - 100%);
+    left: calc(50% - 100%);
+    width: 200%;
+    height: 200%;
+    /* @alternate */
+    -webkit-transform: scale(0);
+            transform: scale(0);
+    -webkit-transform: scale(var(--mdc-ripple-fg-scale, 0));
+            transform: scale(var(--mdc-ripple-fg-scale, 0)); }
+  .mdc-tab-bar--theme-dark .mdc-tab.mdc-ripple-upgraded.mdc-ripple-upgraded--background-focused::before,
+  .mdc-theme--dark .mdc-tab.mdc-ripple-upgraded.mdc-ripple-upgraded--background-focused::before {
+    opacity: .99999; }
+  .mdc-tab-bar--theme-dark .mdc-tab.mdc-ripple-upgraded.mdc-ripple-upgraded--background-active-fill::before,
+  .mdc-theme--dark .mdc-tab.mdc-ripple-upgraded.mdc-ripple-upgraded--background-active-fill::before {
+    -webkit-transition-duration: 120ms;
+            transition-duration: 120ms;
+    opacity: 1; }
+  .mdc-tab-bar--theme-dark .mdc-tab.mdc-ripple-upgraded.mdc-ripple-upgraded--unbounded::before,
+  .mdc-theme--dark .mdc-tab.mdc-ripple-upgraded.mdc-ripple-upgraded--unbounded::before {
+    /* @alternate */
+    top: calc(50% - 50%);
+    top: var(--mdc-ripple-top, calc(50% - 50%));
+    /* @alternate */
+    left: calc(50% - 50%);
+    left: var(--mdc-ripple-left, calc(50% - 50%));
+    /* @alternate */
+    width: 100%;
+    width: var(--mdc-ripple-fg-size, 100%);
+    /* @alternate */
+    height: 100%;
+    height: var(--mdc-ripple-fg-size, 100%);
+    /* @alternate */
+    -webkit-transform: scale(0);
+            transform: scale(0);
+    -webkit-transform: scale(var(--mdc-ripple-fg-scale, 0));
+            transform: scale(var(--mdc-ripple-fg-scale, 0)); }
+  .mdc-tab-bar--theme-dark .mdc-tab.mdc-ripple-upgraded::after,
+  .mdc-theme--dark .mdc-tab.mdc-ripple-upgraded::after {
+    background-color: rgba(255, 255, 255, 0.16);
+    position: absolute;
+    top: calc(50% - 100%);
+    left: calc(50% - 100%);
+    width: 200%;
+    height: 200%;
+    -webkit-transition: opacity 250ms linear;
+    transition: opacity 250ms linear;
+    border-radius: 50%;
+    opacity: 0;
+    pointer-events: none;
+    content: ""; }
+  .mdc-tab-bar--theme-dark .mdc-tab.mdc-ripple-upgraded.mdc-ripple-upgraded::after,
+  .mdc-theme--dark .mdc-tab.mdc-ripple-upgraded.mdc-ripple-upgraded::after {
+    top: 0;
+    left: 0;
+    /* @alternate */
+    width: 100%;
+    width: var(--mdc-ripple-fg-size, 100%);
+    /* @alternate */
+    height: 100%;
+    height: var(--mdc-ripple-fg-size, 100%);
+    -webkit-transform: scale(0);
+            transform: scale(0);
+    -webkit-transform-origin: center center;
+            transform-origin: center center;
+    opacity: 0; }
+  .mdc-tab-bar--theme-dark .mdc-tab.mdc-ripple-upgraded:not(.mdc-ripple-upgraded--unbounded)::after,
+  .mdc-theme--dark .mdc-tab.mdc-ripple-upgraded:not(.mdc-ripple-upgraded--unbounded)::after {
+    -webkit-transform-origin: center center;
+            transform-origin: center center; }
+  .mdc-tab-bar--theme-dark .mdc-tab.mdc-ripple-upgraded.mdc-ripple-upgraded--unbounded::after,
+  .mdc-theme--dark .mdc-tab.mdc-ripple-upgraded.mdc-ripple-upgraded--unbounded::after {
+    /* @alternate */
+    top: 0;
+    top: var(--mdc-ripple-top, 0);
+    /* @alternate */
+    left: 0;
+    left: var(--mdc-ripple-left, 0);
+    /* @alternate */
+    width: 100%;
+    width: var(--mdc-ripple-fg-size, 100%);
+    /* @alternate */
+    height: 100%;
+    height: var(--mdc-ripple-fg-size, 100%);
+    -webkit-transform: scale(0);
+            transform: scale(0);
+    -webkit-transform-origin: center center;
+            transform-origin: center center; }
+  .mdc-tab-bar--theme-dark .mdc-tab.mdc-ripple-upgraded.mdc-ripple-upgraded--foreground-activation::after,
+  .mdc-theme--dark .mdc-tab.mdc-ripple-upgraded.mdc-ripple-upgraded--foreground-activation::after {
+    -webkit-animation: 300ms mdc-ripple-fg-radius-in forwards, 83ms mdc-ripple-fg-opacity-in forwards;
+            animation: 300ms mdc-ripple-fg-radius-in forwards, 83ms mdc-ripple-fg-opacity-in forwards; }
+  .mdc-tab-bar--theme-dark .mdc-tab.mdc-ripple-upgraded.mdc-ripple-upgraded--foreground-deactivation::after,
+  .mdc-theme--dark .mdc-tab.mdc-ripple-upgraded.mdc-ripple-upgraded--foreground-deactivation::after {
+    -webkit-transform: translate(var(--mdc-ripple-fg-translate-end, 0)) scale(var(--mdc-ripple-fg-scale, 1));
+            transform: translate(var(--mdc-ripple-fg-translate-end, 0)) scale(var(--mdc-ripple-fg-scale, 1));
+    -webkit-animation: 83ms mdc-ripple-fg-opacity-out;
+            animation: 83ms mdc-ripple-fg-opacity-out; }
+  .mdc-toolbar .mdc-tab.mdc-ripple-upgraded::before {
+    background-color: rgba(255, 255, 255, 0.16);
+    position: absolute;
+    top: calc(50% - 100%);
+    left: calc(50% - 100%);
+    width: 200%;
+    height: 200%;
+    -webkit-transition: opacity 250ms linear;
+    transition: opacity 250ms linear;
+    border-radius: 50%;
+    opacity: 0;
+    pointer-events: none;
+    content: ""; }
+  .mdc-toolbar .mdc-tab.mdc-ripple-upgraded.mdc-ripple-upgraded::before {
+    top: calc(50% - 100%);
+    left: calc(50% - 100%);
+    width: 200%;
+    height: 200%;
+    /* @alternate */
+    -webkit-transform: scale(0);
+            transform: scale(0);
+    -webkit-transform: scale(var(--mdc-ripple-fg-scale, 0));
+            transform: scale(var(--mdc-ripple-fg-scale, 0)); }
+  .mdc-toolbar .mdc-tab.mdc-ripple-upgraded.mdc-ripple-upgraded--background-focused::before {
+    opacity: .99999; }
+  .mdc-toolbar .mdc-tab.mdc-ripple-upgraded.mdc-ripple-upgraded--background-active-fill::before {
+    -webkit-transition-duration: 120ms;
+            transition-duration: 120ms;
+    opacity: 1; }
+  .mdc-toolbar .mdc-tab.mdc-ripple-upgraded.mdc-ripple-upgraded--unbounded::before {
+    /* @alternate */
+    top: calc(50% - 50%);
+    top: var(--mdc-ripple-top, calc(50% - 50%));
+    /* @alternate */
+    left: calc(50% - 50%);
+    left: var(--mdc-ripple-left, calc(50% - 50%));
+    /* @alternate */
+    width: 100%;
+    width: var(--mdc-ripple-fg-size, 100%);
+    /* @alternate */
+    height: 100%;
+    height: var(--mdc-ripple-fg-size, 100%);
+    /* @alternate */
+    -webkit-transform: scale(0);
+            transform: scale(0);
+    -webkit-transform: scale(var(--mdc-ripple-fg-scale, 0));
+            transform: scale(var(--mdc-ripple-fg-scale, 0)); }
+  .mdc-toolbar .mdc-tab.mdc-ripple-upgraded::after {
+    background-color: rgba(255, 255, 255, 0.16);
+    position: absolute;
+    top: calc(50% - 100%);
+    left: calc(50% - 100%);
+    width: 200%;
+    height: 200%;
+    -webkit-transition: opacity 250ms linear;
+    transition: opacity 250ms linear;
+    border-radius: 50%;
+    opacity: 0;
+    pointer-events: none;
+    content: ""; }
+  .mdc-toolbar .mdc-tab.mdc-ripple-upgraded.mdc-ripple-upgraded::after {
+    top: 0;
+    left: 0;
+    /* @alternate */
+    width: 100%;
+    width: var(--mdc-ripple-fg-size, 100%);
+    /* @alternate */
+    height: 100%;
+    height: var(--mdc-ripple-fg-size, 100%);
+    -webkit-transform: scale(0);
+            transform: scale(0);
+    -webkit-transform-origin: center center;
+            transform-origin: center center;
+    opacity: 0; }
+  .mdc-toolbar .mdc-tab.mdc-ripple-upgraded:not(.mdc-ripple-upgraded--unbounded)::after {
+    -webkit-transform-origin: center center;
+            transform-origin: center center; }
+  .mdc-toolbar .mdc-tab.mdc-ripple-upgraded.mdc-ripple-upgraded--unbounded::after {
+    /* @alternate */
+    top: 0;
+    top: var(--mdc-ripple-top, 0);
+    /* @alternate */
+    left: 0;
+    left: var(--mdc-ripple-left, 0);
+    /* @alternate */
+    width: 100%;
+    width: var(--mdc-ripple-fg-size, 100%);
+    /* @alternate */
+    height: 100%;
+    height: var(--mdc-ripple-fg-size, 100%);
+    -webkit-transform: scale(0);
+            transform: scale(0);
+    -webkit-transform-origin: center center;
+            transform-origin: center center; }
+  .mdc-toolbar .mdc-tab.mdc-ripple-upgraded.mdc-ripple-upgraded--foreground-activation::after {
+    -webkit-animation: 300ms mdc-ripple-fg-radius-in forwards, 83ms mdc-ripple-fg-opacity-in forwards;
+            animation: 300ms mdc-ripple-fg-radius-in forwards, 83ms mdc-ripple-fg-opacity-in forwards; }
+  .mdc-toolbar .mdc-tab.mdc-ripple-upgraded.mdc-ripple-upgraded--foreground-deactivation::after {
+    -webkit-transform: translate(var(--mdc-ripple-fg-translate-end, 0)) scale(var(--mdc-ripple-fg-scale, 1));
+            transform: translate(var(--mdc-ripple-fg-translate-end, 0)) scale(var(--mdc-ripple-fg-scale, 1));
+    -webkit-animation: 83ms mdc-ripple-fg-opacity-out;
+            animation: 83ms mdc-ripple-fg-opacity-out; }
+  .mdc-tab.mdc-ripple-upgraded:focus {
+    outline: none; }
+
+/*
+  Precomputed linear color channel values, for use in contrast calculations.
+  See https://www.w3.org/TR/WCAG20-TECHS/G17.html#G17-tests
+
+  Algorithm, for c in 0 to 255:
+  f(c) {
+    c = c / 255;
+    return c < 0.03928 ? c / 12.92 : Math.pow((c + 0.055) / 1.055, 2.4);
+  }
+
+  This lookup table is needed since there is no `pow` in SASS.
+*/
+/**
+ * Calculate the luminance for a color.
+ * See https://www.w3.org/TR/WCAG20-TECHS/G17.html#G17-tests
+ */
+/**
+ * Calculate the contrast ratio between two colors.
+ * See https://www.w3.org/TR/WCAG20-TECHS/G17.html#G17-tests
+ */
+/**
+ * Determine whether to use dark or light text on top of given color.
+ * Returns "dark" for dark text and "light" for light text.
+ */
+/*
+  Main theme colors.
+  If you're a user customizing your color scheme in SASS, these are probably the only variables you need to change.
+*/
+/* Indigo 500 */
+/* Pink A200 */
+/* White */
+/* Which set of text colors to use for each main theme color (light or dark) */
+/* Text colors according to light vs dark and text type */
+/* Primary text colors for each of the theme colors */
+/**
+ * Applies the correct theme color style to the specified property.
+ * $property is typically color or background-color, but can be any CSS property that accepts color values.
+ * $style should be one of the map keys in $mdc-theme-property-values (_variables.scss).
+ */
+/**
+ * Creates a rule to be used in MDC-Web components for dark theming, and applies the provided contents.
+ * Should provide the $root-selector option if applied to anything other than the root selector.
+ * When used with a modifier class, provide a second argument of `true` for the $compound parameter
+ * to specify that this should be attached as a compound class.
+ *
+ * Usage example:
+ *
+ * ```scss
+ * .mdc-foo {
+ *   color: black;
+ *
+ *   @include mdc-theme-dark {
+ *     color: white;
+ *   }
+ *
+ *   &__bar {
+ *     background: black;
+ *
+ *     @include mdc-theme-dark(".mdc-foo") {
+ *       background: white;
+ *     }
+ *   }
+ * }
+ *
+ * .mdc-foo--disabled {
+ *   opacity: .38;
+ *
+ *   @include mdc-theme-dark(".mdc-foo", true) {
+ *     opacity: .5;
+ *   }
+ * }
+ * ```
+ */
+/**
+ * Creates a rule that will be applied when an MDC-Web component is within the context of an RTL layout.
+ *
+ * Usage Example:
+ * ```scss
+ * .mdc-foo {
+ *   position: absolute;
+ *   left: 0;
+ *
+ *   @include mdc-rtl {
+ *     left: auto;
+ *     right: 0;
+ *   }
+ *
+ *   &__bar {
+ *     margin-left: 4px;
+ *     @include mdc-rtl(".mdc-foo") {
+ *       margin-left: auto;
+ *       margin-right: 4px;
+ *     }
+ *   }
+ * }
+ *
+ * .mdc-foo--mod {
+ *   padding-left: 4px;
+ *
+ *   @include mdc-rtl {
+ *     padding-left: auto;
+ *     padding-right: 4px;
+ *   }
+ * }
+ * ```
+ *
+ * Note that this works by checking for [dir="rtl"] on an ancestor element. While this will work
+ * in most cases, it will in some cases lead to false negatives, e.g.
+ *
+ * ```html
+ * <html dir="rtl">
+ *   <!-- ... -->
+ *   <div dir="ltr">
+ *     <div class="mdc-foo">Styled incorrectly as RTL!</div>
+ *   </div>
+ * </html>
+ * ```
+ *
+ * In the future, selectors such as :dir (http://mdn.io/:dir) will help us mitigate this.
+ */
+/**
+ * Takes a base box-model property - e.g. margin / border / padding - along with a default
+ * direction and value, and emits rules which apply the value to the
+ * "<base-property>-<default-direction>" property by default, but flips the direction
+ * when within an RTL context.
+ *
+ * For example:
+ *
+ * ```scss
+ * .mdc-foo {
+ *   @include mdc-rtl-reflexive-box(margin, left, 8px);
+ * }
+ * ```
+ * is equivalent to:
+ *
+ * ```scss
+ * .mdc-foo {
+ *   margin-left: 8px;
+ *
+ *   @include mdc-rtl {
+ *     margin-right: 8px;
+ *     margin-left: 0;
+ *   }
+ * }
+ * ```
+ * whereas:
+ *
+ * ```scss
+ * .mdc-foo {
+ *   @include mdc-rtl-reflexive-box(margin, right, 8px);
+ * }
+ * ```
+ * is equivalent to:
+ *
+ * ```scss
+ * .mdc-foo {
+ *   margin-right: 8px;
+ *
+ *   @include mdc-rtl {
+ *     margin-right: 0;
+ *     margin-left: 8px;
+ *   }
+ * }
+ * ```
+ *
+ * You can also pass a 4th optional $root-selector argument which will be forwarded to `mdc-rtl`,
+ * e.g. `@include mdc-rtl-reflexive-box(margin, left, 8px, ".mdc-component")`.
+ *
+ * Note that this function will always zero out the original value in an RTL context. If you're
+ * trying to flip the values, use mdc-rtl-reflexive-property().
+ */
+/**
+ * Takes a base property and emits rules that assign <base-property>-left to <left-value> and
+ * <base-property>-right to <right-value> in a LTR context, and vice versa in a RTL context.
+ * For example:
+ *
+ * ```scss
+ * .mdc-foo {
+ *   @include mdc-rtl-reflexive-property(margin, auto, 12px);
+ * }
+ * ```
+ * is equivalent to:
+ *
+ * ```scss
+ * .mdc-foo {
+ *   margin-left: auto;
+ *   margin-right: 12px;
+ *
+ *   @include mdc-rtl {
+ *     margin-left: 12px;
+ *     margin-right: auto;
+ *   }
+ * }
+ * ```
+ *
+ * A 4th optional $root-selector argument can be given, which will be passed to `mdc-rtl`.
+ */
+/**
+ * Takes an argument specifying a horizontal position property (either "left" or "right") as well
+ * as a value, and applies that value to the specified position in a LTR context, and flips it in a
+ * RTL context. For example:
+ *
+ * ```scss
+ * .mdc-foo {
+ *   @include mdc-rtl-reflexive-position(left, 0);
+ *   position: absolute;
+ * }
+ * ```
+ * is equivalent to:
+ *
+ * ```scss
+ *  .mdc-foo {
+ *    position: absolute;
+ *    left: 0;
+ *    right: initial;
+ *
+ *    @include mdc-rtl {
+ *      right: 0;
+ *      left: initial;
+ *    }
+ *  }
+ * ```
+ * An optional third $root-selector argument may also be given, which is passed to `mdc-rtl`.
+ */
+.mdc-tab-bar {
+  display: table;
+  position: relative;
+  height: 48px;
+  margin: 0 auto;
+  text-transform: uppercase; }
+  .mdc-tab-bar__indicator {
+    position: absolute;
+    bottom: 0;
+    left: 0;
+    width: 100%;
+    height: 2px;
+    /* @alternate */
+    background-color: rgba(0, 0, 0, 0.87);
+    background-color: var(--mdc-theme-text-primary-on-light, rgba(0, 0, 0, 0.87));
+    -webkit-transform-origin: left top;
+            transform-origin: left top;
+    -webkit-transition: -webkit-transform 240ms 0ms cubic-bezier(0, 0, 0.2, 1);
+    transition: -webkit-transform 240ms 0ms cubic-bezier(0, 0, 0.2, 1);
+    transition: transform 240ms 0ms cubic-bezier(0, 0, 0.2, 1);
+    transition: transform 240ms 0ms cubic-bezier(0, 0, 0.2, 1), -webkit-transform 240ms 0ms cubic-bezier(0, 0, 0.2, 1);
+    will-change: transform;
+    visibility: hidden; }
+    .mdc-tab-bar--theme-dark .mdc-tab-bar__indicator,
+    .mdc-theme--dark .mdc-tab-bar__indicator {
+      /* @alternate */
+      background-color: white;
+      background-color: var(--mdc-theme-text-primary-on-dark, white); }
+  .mdc-toolbar .mdc-tab-bar .mdc-tab {
+    /* @alternate */
+    color: rgba(255, 255, 255, 0.7);
+    color: var(--mdc-theme-text-secondary-on-primary, rgba(255, 255, 255, 0.7)); }
+    .mdc-tab-bar--theme-dark .mdc-toolbar .mdc-tab-bar .mdc-tab,
+    .mdc-theme--dark .mdc-toolbar .mdc-tab-bar .mdc-tab {
+      /* @alternate */
+      color: rgba(255, 255, 255, 0.7);
+      color: var(--mdc-theme-text-secondary-on-dark, rgba(255, 255, 255, 0.7)); }
+  .mdc-toolbar .mdc-tab-bar .mdc-tab--active,
+  .mdc-toolbar .mdc-tab-bar .mdc-tab:hover {
+    /* @alternate */
+    color: white;
+    color: var(--mdc-theme-text-primary-on-primary, white); }
+    .mdc-tab-bar--theme-dark .mdc-toolbar .mdc-tab-bar .mdc-tab--active,
+    .mdc-theme--dark .mdc-toolbar .mdc-tab-bar .mdc-tab--active, .mdc-tab-bar--theme-dark
+    .mdc-toolbar .mdc-tab-bar .mdc-tab:hover,
+    .mdc-theme--dark
+    .mdc-toolbar .mdc-tab-bar .mdc-tab:hover {
+      /* @alternate */
+      color: white;
+      color: var(--mdc-theme-text-primary-on-dark, white); }
+  .mdc-toolbar .mdc-tab-bar .mdc-tab-bar__indicator {
+    /* @alternate */
+    background-color: white;
+    background-color: var(--mdc-theme-text-primary-on-primary, white); }
+    .mdc-tab-bar--theme-dark .mdc-toolbar .mdc-tab-bar .mdc-tab-bar__indicator,
+    .mdc-theme--dark .mdc-toolbar .mdc-tab-bar .mdc-tab-bar__indicator {
+      /* @alternate */
+      background-color: white;
+      background-color: var(--mdc-theme-text-primary-on-dark, white); }
+
+.mdc-tab-bar--icons-with-text {
+  height: 72px; }
+
+.mdc-tab-bar--indicator-primary .mdc-tab-bar__indicator,
+.mdc-toolbar .mdc-tab-bar--indicator-primary .mdc-tab-bar__indicator {
+  /* @alternate */
+  background-color: #3f51b5;
+  background-color: var(--mdc-theme-primary, #3f51b5); }
+  .mdc-tab-bar--theme-dark .mdc-tab-bar--indicator-primary .mdc-tab-bar__indicator,
+  .mdc-theme--dark .mdc-tab-bar--indicator-primary .mdc-tab-bar__indicator, .mdc-tab-bar--theme-dark
+  .mdc-toolbar .mdc-tab-bar--indicator-primary .mdc-tab-bar__indicator,
+  .mdc-theme--dark
+  .mdc-toolbar .mdc-tab-bar--indicator-primary .mdc-tab-bar__indicator {
+    /* @alternate */
+    background-color: #3f51b5;
+    background-color: var(--mdc-theme-primary, #3f51b5); }
+
+.mdc-tab-bar--indicator-primary.mdc-tab-bar:not(.mdc-tab-bar-upgraded) .mdc-tab::after,
+.mdc-toolbar .mdc-tab-bar--indicator-primary.mdc-tab-bar:not(.mdc-tab-bar-upgraded) .mdc-tab::after {
+  /* @alternate */
+  background-color: #3f51b5;
+  background-color: var(--mdc-theme-primary, #3f51b5); }
+
+.mdc-tab-bar--indicator-accent .mdc-tab-bar__indicator,
+.mdc-toolbar .mdc-tab-bar--indicator-accent .mdc-tab-bar__indicator {
+  /* @alternate */
+  background-color: #ff4081;
+  background-color: var(--mdc-theme-accent, #ff4081); }
+  .mdc-tab-bar--theme-dark .mdc-tab-bar--indicator-accent .mdc-tab-bar__indicator,
+  .mdc-theme--dark .mdc-tab-bar--indicator-accent .mdc-tab-bar__indicator, .mdc-tab-bar--theme-dark
+  .mdc-toolbar .mdc-tab-bar--indicator-accent .mdc-tab-bar__indicator,
+  .mdc-theme--dark
+  .mdc-toolbar .mdc-tab-bar--indicator-accent .mdc-tab-bar__indicator {
+    /* @alternate */
+    background-color: #ff4081;
+    background-color: var(--mdc-theme-accent, #ff4081); }
+
+.mdc-tab-bar--indicator-accent.mdc-tab-bar:not(.mdc-tab-bar-upgraded) .mdc-tab::after,
+.mdc-toolbar .mdc-tab-bar--indicator-accent.mdc-tab-bar:not(.mdc-tab-bar-upgraded) .mdc-tab::after {
+  /* @alternate */
+  background-color: #ff4081;
+  background-color: var(--mdc-theme-accent, #ff4081); }
+
+/*
+  Precomputed linear color channel values, for use in contrast calculations.
+  See https://www.w3.org/TR/WCAG20-TECHS/G17.html#G17-tests
+
+  Algorithm, for c in 0 to 255:
+  f(c) {
+    c = c / 255;
+    return c < 0.03928 ? c / 12.92 : Math.pow((c + 0.055) / 1.055, 2.4);
+  }
+
+  This lookup table is needed since there is no `pow` in SASS.
+*/
+/**
+ * Calculate the luminance for a color.
+ * See https://www.w3.org/TR/WCAG20-TECHS/G17.html#G17-tests
+ */
+/**
+ * Calculate the contrast ratio between two colors.
+ * See https://www.w3.org/TR/WCAG20-TECHS/G17.html#G17-tests
+ */
+/**
+ * Determine whether to use dark or light text on top of given color.
+ * Returns "dark" for dark text and "light" for light text.
+ */
+/*
+  Main theme colors.
+  If you're a user customizing your color scheme in SASS, these are probably the only variables you need to change.
+*/
+/* Indigo 500 */
+/* Pink A200 */
+/* White */
+/* Which set of text colors to use for each main theme color (light or dark) */
+/* Text colors according to light vs dark and text type */
+/* Primary text colors for each of the theme colors */
+/**
+ * Applies the correct theme color style to the specified property.
+ * $property is typically color or background-color, but can be any CSS property that accepts color values.
+ * $style should be one of the map keys in $mdc-theme-property-values (_variables.scss).
+ */
+/**
+ * Creates a rule to be used in MDC-Web components for dark theming, and applies the provided contents.
+ * Should provide the $root-selector option if applied to anything other than the root selector.
+ * When used with a modifier class, provide a second argument of `true` for the $compound parameter
+ * to specify that this should be attached as a compound class.
+ *
+ * Usage example:
+ *
+ * ```scss
+ * .mdc-foo {
+ *   color: black;
+ *
+ *   @include mdc-theme-dark {
+ *     color: white;
+ *   }
+ *
+ *   &__bar {
+ *     background: black;
+ *
+ *     @include mdc-theme-dark(".mdc-foo") {
+ *       background: white;
+ *     }
+ *   }
+ * }
+ *
+ * .mdc-foo--disabled {
+ *   opacity: .38;
+ *
+ *   @include mdc-theme-dark(".mdc-foo", true) {
+ *     opacity: .5;
+ *   }
+ * }
+ * ```
+ */
+/**
+ * Creates a rule that will be applied when an MDC-Web component is within the context of an RTL layout.
+ *
+ * Usage Example:
+ * ```scss
+ * .mdc-foo {
+ *   position: absolute;
+ *   left: 0;
+ *
+ *   @include mdc-rtl {
+ *     left: auto;
+ *     right: 0;
+ *   }
+ *
+ *   &__bar {
+ *     margin-left: 4px;
+ *     @include mdc-rtl(".mdc-foo") {
+ *       margin-left: auto;
+ *       margin-right: 4px;
+ *     }
+ *   }
+ * }
+ *
+ * .mdc-foo--mod {
+ *   padding-left: 4px;
+ *
+ *   @include mdc-rtl {
+ *     padding-left: auto;
+ *     padding-right: 4px;
+ *   }
+ * }
+ * ```
+ *
+ * Note that this works by checking for [dir="rtl"] on an ancestor element. While this will work
+ * in most cases, it will in some cases lead to false negatives, e.g.
+ *
+ * ```html
+ * <html dir="rtl">
+ *   <!-- ... -->
+ *   <div dir="ltr">
+ *     <div class="mdc-foo">Styled incorrectly as RTL!</div>
+ *   </div>
+ * </html>
+ * ```
+ *
+ * In the future, selectors such as :dir (http://mdn.io/:dir) will help us mitigate this.
+ */
+/**
+ * Takes a base box-model property - e.g. margin / border / padding - along with a default
+ * direction and value, and emits rules which apply the value to the
+ * "<base-property>-<default-direction>" property by default, but flips the direction
+ * when within an RTL context.
+ *
+ * For example:
+ *
+ * ```scss
+ * .mdc-foo {
+ *   @include mdc-rtl-reflexive-box(margin, left, 8px);
+ * }
+ * ```
+ * is equivalent to:
+ *
+ * ```scss
+ * .mdc-foo {
+ *   margin-left: 8px;
+ *
+ *   @include mdc-rtl {
+ *     margin-right: 8px;
+ *     margin-left: 0;
+ *   }
+ * }
+ * ```
+ * whereas:
+ *
+ * ```scss
+ * .mdc-foo {
+ *   @include mdc-rtl-reflexive-box(margin, right, 8px);
+ * }
+ * ```
+ * is equivalent to:
+ *
+ * ```scss
+ * .mdc-foo {
+ *   margin-right: 8px;
+ *
+ *   @include mdc-rtl {
+ *     margin-right: 0;
+ *     margin-left: 8px;
+ *   }
+ * }
+ * ```
+ *
+ * You can also pass a 4th optional $root-selector argument which will be forwarded to `mdc-rtl`,
+ * e.g. `@include mdc-rtl-reflexive-box(margin, left, 8px, ".mdc-component")`.
+ *
+ * Note that this function will always zero out the original value in an RTL context. If you're
+ * trying to flip the values, use mdc-rtl-reflexive-property().
+ */
+/**
+ * Takes a base property and emits rules that assign <base-property>-left to <left-value> and
+ * <base-property>-right to <right-value> in a LTR context, and vice versa in a RTL context.
+ * For example:
+ *
+ * ```scss
+ * .mdc-foo {
+ *   @include mdc-rtl-reflexive-property(margin, auto, 12px);
+ * }
+ * ```
+ * is equivalent to:
+ *
+ * ```scss
+ * .mdc-foo {
+ *   margin-left: auto;
+ *   margin-right: 12px;
+ *
+ *   @include mdc-rtl {
+ *     margin-left: 12px;
+ *     margin-right: auto;
+ *   }
+ * }
+ * ```
+ *
+ * A 4th optional $root-selector argument can be given, which will be passed to `mdc-rtl`.
+ */
+/**
+ * Takes an argument specifying a horizontal position property (either "left" or "right") as well
+ * as a value, and applies that value to the specified position in a LTR context, and flips it in a
+ * RTL context. For example:
+ *
+ * ```scss
+ * .mdc-foo {
+ *   @include mdc-rtl-reflexive-position(left, 0);
+ *   position: absolute;
+ * }
+ * ```
+ * is equivalent to:
+ *
+ * ```scss
+ *  .mdc-foo {
+ *    position: absolute;
+ *    left: 0;
+ *    right: initial;
+ *
+ *    @include mdc-rtl {
+ *      right: 0;
+ *      left: initial;
+ *    }
+ *  }
+ * ```
+ * An optional third $root-selector argument may also be given, which is passed to `mdc-rtl`.
+ */
+.mdc-tab-bar-scroller {
+  display: -webkit-box;
+  display: -ms-flexbox;
+  display: flex;
+  -webkit-box-align: center;
+      -ms-flex-align: center;
+          align-items: center;
+  -webkit-box-sizing: border-box;
+          box-sizing: border-box;
+  width: 100%;
+  background-color: inherit;
+  overflow: hidden; }
+  .mdc-tab-bar-scroller__scroll-frame {
+    display: -webkit-box;
+    display: -ms-flexbox;
+    display: flex;
+    position: relative;
+    -webkit-box-flex: 1;
+        -ms-flex: 1;
+            flex: 1;
+    -webkit-box-pack: start;
+        -ms-flex-pack: start;
+            justify-content: flex-start;
+    overflow: hidden; }
+    .mdc-tab-bar-scroller__scroll-frame__tabs {
+      -webkit-transition: -webkit-transform 240ms 0ms cubic-bezier(0, 0, 0.2, 1);
+      transition: -webkit-transform 240ms 0ms cubic-bezier(0, 0, 0.2, 1);
+      transition: transform 240ms 0ms cubic-bezier(0, 0, 0.2, 1);
+      transition: transform 240ms 0ms cubic-bezier(0, 0, 0.2, 1), -webkit-transform 240ms 0ms cubic-bezier(0, 0, 0.2, 1);
+      will-change: transform; }
+  .mdc-tab-bar-scroller__indicator {
+    display: -webkit-box;
+    display: -ms-flexbox;
+    display: flex;
+    -webkit-box-align: center;
+        -ms-flex-align: center;
+            align-items: center;
+    -webkit-box-pack: center;
+        -ms-flex-pack: center;
+            justify-content: center;
+    width: 48px;
+    cursor: pointer;
+    visibility: hidden;
+    /* @alternate */
+    color: rgba(0, 0, 0, 0.54);
+    color: var(--mdc-theme-text-secondary-on-light, rgba(0, 0, 0, 0.54)); }
+    .mdc-tab-bar--theme-dark .mdc-tab-bar-scroller__indicator,
+    .mdc-theme--dark .mdc-tab-bar-scroller__indicator {
+      /* @alternate */
+      color: rgba(255, 255, 255, 0.7);
+      color: var(--mdc-theme-text-secondary-on-dark, rgba(255, 255, 255, 0.7)); }
+    .mdc-tab-bar-scroller__indicator:hover {
+      /* @alternate */
+      color: rgba(0, 0, 0, 0.87);
+      color: var(--mdc-theme-text-primary-on-light, rgba(0, 0, 0, 0.87)); }
+      .mdc-tab-bar--theme-dark .mdc-tab-bar-scroller__indicator:hover,
+      .mdc-theme--dark .mdc-tab-bar-scroller__indicator:hover {
+        /* @alternate */
+        color: white;
+        color: var(--mdc-theme-text-primary-on-dark, white); }
+    .mdc-tab-bar-scroller__indicator__inner {
+      color: inherit;
+      text-decoration: inherit;
+      cursor: inherit; }
+      .mdc-tab-bar-scroller__indicator__inner:focus {
+        outline-color: inherit; }
+      [dir="rtl"] .mdc-tab-bar-scroller .mdc-tab-bar-scroller__indicator__inner,
+      .mdc-tab-bar-scroller[dir="rtl"] .mdc-tab-bar-scroller__indicator__inner {
+        -webkit-transform: rotate(180deg);
+                transform: rotate(180deg); }
+    .mdc-tab-bar-scroller__indicator__inner:hover {
+      color: inherit; }
+      .mdc-tab-bar--theme-dark .mdc-tab-bar-scroller__indicator__inner:hover,
+      .mdc-theme--dark .mdc-tab-bar-scroller__indicator__inner:hover {
+        /* @alternate */
+        color: rgba(255, 255, 255, 0.7);
+        color: var(--mdc-theme-text-secondary-on-dark, rgba(255, 255, 255, 0.7)); }
+  .mdc-tab-bar-scroller__indicator--enabled {
+    visibility: visible; }

+ 83 - 0
support/client/lib/vwf/view/lib/mdc/dist/mdc.tabs.css-entry

@@ -0,0 +1,83 @@
+/*!
+ Material Components for the web
+ Copyright (c) 2017 Google Inc.
+ License: Apache-2.0
+*/
+/******/ (function(modules) { // webpackBootstrap
+/******/ 	// The module cache
+/******/ 	var installedModules = {};
+/******/
+/******/ 	// The require function
+/******/ 	function __webpack_require__(moduleId) {
+/******/
+/******/ 		// Check if module is in cache
+/******/ 		if(installedModules[moduleId]) {
+/******/ 			return installedModules[moduleId].exports;
+/******/ 		}
+/******/ 		// Create a new module (and put it into the cache)
+/******/ 		var module = installedModules[moduleId] = {
+/******/ 			i: moduleId,
+/******/ 			l: false,
+/******/ 			exports: {}
+/******/ 		};
+/******/
+/******/ 		// Execute the module function
+/******/ 		modules[moduleId].call(module.exports, module, module.exports, __webpack_require__);
+/******/
+/******/ 		// Flag the module as loaded
+/******/ 		module.l = true;
+/******/
+/******/ 		// Return the exports of the module
+/******/ 		return module.exports;
+/******/ 	}
+/******/
+/******/
+/******/ 	// expose the modules object (__webpack_modules__)
+/******/ 	__webpack_require__.m = modules;
+/******/
+/******/ 	// expose the module cache
+/******/ 	__webpack_require__.c = installedModules;
+/******/
+/******/ 	// identity function for calling harmony imports with the correct context
+/******/ 	__webpack_require__.i = function(value) { return value; };
+/******/
+/******/ 	// define getter function for harmony exports
+/******/ 	__webpack_require__.d = function(exports, name, getter) {
+/******/ 		if(!__webpack_require__.o(exports, name)) {
+/******/ 			Object.defineProperty(exports, name, {
+/******/ 				configurable: false,
+/******/ 				enumerable: true,
+/******/ 				get: getter
+/******/ 			});
+/******/ 		}
+/******/ 	};
+/******/
+/******/ 	// getDefaultExport function for compatibility with non-harmony modules
+/******/ 	__webpack_require__.n = function(module) {
+/******/ 		var getter = module && module.__esModule ?
+/******/ 			function getDefault() { return module['default']; } :
+/******/ 			function getModuleExports() { return module; };
+/******/ 		__webpack_require__.d(getter, 'a', getter);
+/******/ 		return getter;
+/******/ 	};
+/******/
+/******/ 	// Object.prototype.hasOwnProperty.call
+/******/ 	__webpack_require__.o = function(object, property) { return Object.prototype.hasOwnProperty.call(object, property); };
+/******/
+/******/ 	// __webpack_public_path__
+/******/ 	__webpack_require__.p = "/assets/";
+/******/
+/******/ 	// Load entry module and return exports
+/******/ 	return __webpack_require__(__webpack_require__.s = 22);
+/******/ })
+/************************************************************************/
+/******/ ({
+
+/***/ 22:
+/***/ (function(module, exports) {
+
+// removed by extract-text-webpack-plugin
+
+/***/ })
+
+/******/ });

+ 3164 - 0
support/client/lib/vwf/view/lib/mdc/dist/mdc.tabs.js

@@ -0,0 +1,3164 @@
+/*!
+ Material Components for the web
+ Copyright (c) 2017 Google Inc.
+ License: Apache-2.0
+*/
+(function webpackUniversalModuleDefinition(root, factory) {
+	if(typeof exports === 'object' && typeof module === 'object')
+		module.exports = factory();
+	else if(typeof define === 'function' && define.amd)
+		define([], factory);
+	else if(typeof exports === 'object')
+		exports["tabs"] = factory();
+	else
+		root["mdc"] = root["mdc"] || {}, root["mdc"]["tabs"] = factory();
+})(this, function() {
+return /******/ (function(modules) { // webpackBootstrap
+/******/ 	// The module cache
+/******/ 	var installedModules = {};
+/******/
+/******/ 	// The require function
+/******/ 	function __webpack_require__(moduleId) {
+/******/
+/******/ 		// Check if module is in cache
+/******/ 		if(installedModules[moduleId]) {
+/******/ 			return installedModules[moduleId].exports;
+/******/ 		}
+/******/ 		// Create a new module (and put it into the cache)
+/******/ 		var module = installedModules[moduleId] = {
+/******/ 			i: moduleId,
+/******/ 			l: false,
+/******/ 			exports: {}
+/******/ 		};
+/******/
+/******/ 		// Execute the module function
+/******/ 		modules[moduleId].call(module.exports, module, module.exports, __webpack_require__);
+/******/
+/******/ 		// Flag the module as loaded
+/******/ 		module.l = true;
+/******/
+/******/ 		// Return the exports of the module
+/******/ 		return module.exports;
+/******/ 	}
+/******/
+/******/
+/******/ 	// expose the modules object (__webpack_modules__)
+/******/ 	__webpack_require__.m = modules;
+/******/
+/******/ 	// expose the module cache
+/******/ 	__webpack_require__.c = installedModules;
+/******/
+/******/ 	// identity function for calling harmony imports with the correct context
+/******/ 	__webpack_require__.i = function(value) { return value; };
+/******/
+/******/ 	// define getter function for harmony exports
+/******/ 	__webpack_require__.d = function(exports, name, getter) {
+/******/ 		if(!__webpack_require__.o(exports, name)) {
+/******/ 			Object.defineProperty(exports, name, {
+/******/ 				configurable: false,
+/******/ 				enumerable: true,
+/******/ 				get: getter
+/******/ 			});
+/******/ 		}
+/******/ 	};
+/******/
+/******/ 	// getDefaultExport function for compatibility with non-harmony modules
+/******/ 	__webpack_require__.n = function(module) {
+/******/ 		var getter = module && module.__esModule ?
+/******/ 			function getDefault() { return module['default']; } :
+/******/ 			function getModuleExports() { return module; };
+/******/ 		__webpack_require__.d(getter, 'a', getter);
+/******/ 		return getter;
+/******/ 	};
+/******/
+/******/ 	// Object.prototype.hasOwnProperty.call
+/******/ 	__webpack_require__.o = function(object, property) { return Object.prototype.hasOwnProperty.call(object, property); };
+/******/
+/******/ 	// __webpack_public_path__
+/******/ 	__webpack_require__.p = "/assets/";
+/******/
+/******/ 	// Load entry module and return exports
+/******/ 	return __webpack_require__(__webpack_require__.s = 97);
+/******/ })
+/************************************************************************/
+/******/ ({
+
+/***/ 0:
+/***/ (function(module, __webpack_exports__, __webpack_require__) {
+
+"use strict";
+var _createClass = function () { function defineProperties(target, props) { for (var i = 0; i < props.length; i++) { var descriptor = props[i]; descriptor.enumerable = descriptor.enumerable || false; descriptor.configurable = true; if ("value" in descriptor) descriptor.writable = true; Object.defineProperty(target, descriptor.key, descriptor); } } return function (Constructor, protoProps, staticProps) { if (protoProps) defineProperties(Constructor.prototype, protoProps); if (staticProps) defineProperties(Constructor, staticProps); return Constructor; }; }();
+
+function _classCallCheck(instance, Constructor) { if (!(instance instanceof Constructor)) { throw new TypeError("Cannot call a class as a function"); } }
+
+/**
+ * Copyright 2016 Google Inc.
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *   http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+
+/**
+ * @template A
+ */
+var MDCFoundation = function () {
+  _createClass(MDCFoundation, null, [{
+    key: "cssClasses",
+
+    /** @return enum{cssClasses} */
+    get: function get() {
+      // Classes extending MDCFoundation should implement this method to return an object which exports every
+      // CSS class the foundation class needs as a property. e.g. {ACTIVE: 'mdc-component--active'}
+      return {};
+    }
+
+    /** @return enum{strings} */
+
+  }, {
+    key: "strings",
+    get: function get() {
+      // Classes extending MDCFoundation should implement this method to return an object which exports all
+      // semantic strings as constants. e.g. {ARIA_ROLE: 'tablist'}
+      return {};
+    }
+
+    /** @return enum{numbers} */
+
+  }, {
+    key: "numbers",
+    get: function get() {
+      // Classes extending MDCFoundation should implement this method to return an object which exports all
+      // of its semantic numbers as constants. e.g. {ANIMATION_DELAY_MS: 350}
+      return {};
+    }
+
+    /** @return {!Object} */
+
+  }, {
+    key: "defaultAdapter",
+    get: function get() {
+      // Classes extending MDCFoundation may choose to implement this getter in order to provide a convenient
+      // way of viewing the necessary methods of an adapter. In the future, this could also be used for adapter
+      // validation.
+      return {};
+    }
+
+    /**
+     * @param {A=} adapter
+     */
+
+  }]);
+
+  function MDCFoundation() {
+    var adapter = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : {};
+
+    _classCallCheck(this, MDCFoundation);
+
+    /** @protected {!A} */
+    this.adapter_ = adapter;
+  }
+
+  _createClass(MDCFoundation, [{
+    key: "init",
+    value: function init() {
+      // Subclasses should override this method to perform initialization routines (registering events, etc.)
+    }
+  }, {
+    key: "destroy",
+    value: function destroy() {
+      // Subclasses should override this method to perform de-initialization routines (de-registering events, etc.)
+    }
+  }]);
+
+  return MDCFoundation;
+}();
+
+/* harmony default export */ __webpack_exports__["a"] = (MDCFoundation);
+
+/***/ }),
+
+/***/ 1:
+/***/ (function(module, __webpack_exports__, __webpack_require__) {
+
+"use strict";
+/* harmony import */ var __WEBPACK_IMPORTED_MODULE_0__foundation__ = __webpack_require__(0);
+var _createClass = function () { function defineProperties(target, props) { for (var i = 0; i < props.length; i++) { var descriptor = props[i]; descriptor.enumerable = descriptor.enumerable || false; descriptor.configurable = true; if ("value" in descriptor) descriptor.writable = true; Object.defineProperty(target, descriptor.key, descriptor); } } return function (Constructor, protoProps, staticProps) { if (protoProps) defineProperties(Constructor.prototype, protoProps); if (staticProps) defineProperties(Constructor, staticProps); return Constructor; }; }();
+
+function _classCallCheck(instance, Constructor) { if (!(instance instanceof Constructor)) { throw new TypeError("Cannot call a class as a function"); } }
+
+/**
+ * Copyright 2016 Google Inc.
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *   http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+
+
+
+/**
+ * @template F
+ */
+
+var MDCComponent = function () {
+  _createClass(MDCComponent, null, [{
+    key: 'attachTo',
+
+    /**
+     * @param {!Element} root
+     * @return {!MDCComponent}
+     */
+    value: function attachTo(root) {
+      // Subclasses which extend MDCBase should provide an attachTo() method that takes a root element and
+      // returns an instantiated component with its root set to that element. Also note that in the cases of
+      // subclasses, an explicit foundation class will not have to be passed in; it will simply be initialized
+      // from getDefaultFoundation().
+      return new MDCComponent(root, new __WEBPACK_IMPORTED_MODULE_0__foundation__["a" /* default */]());
+    }
+
+    /**
+     * @param {!Element} root
+     * @param {F=} foundation
+     * @param {...?} args
+     */
+
+  }]);
+
+  function MDCComponent(root) {
+    var foundation = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : undefined;
+
+    _classCallCheck(this, MDCComponent);
+
+    /** @protected {!Element} */
+    this.root_ = root;
+
+    for (var _len = arguments.length, args = Array(_len > 2 ? _len - 2 : 0), _key = 2; _key < _len; _key++) {
+      args[_key - 2] = arguments[_key];
+    }
+
+    this.initialize.apply(this, args);
+    // Note that we initialize foundation here and not within the constructor's default param so that
+    // this.root_ is defined and can be used within the foundation class.
+    /** @protected {!F} */
+    this.foundation_ = foundation === undefined ? this.getDefaultFoundation() : foundation;
+    this.foundation_.init();
+    this.initialSyncWithDOM();
+  }
+
+  _createClass(MDCComponent, [{
+    key: 'initialize',
+    value: function initialize() /* ...args */{}
+    // Subclasses can override this to do any additional setup work that would be considered part of a
+    // "constructor". Essentially, it is a hook into the parent constructor before the foundation is
+    // initialized. Any additional arguments besides root and foundation will be passed in here.
+
+
+    /**
+     * @return {!F} foundation
+     */
+
+  }, {
+    key: 'getDefaultFoundation',
+    value: function getDefaultFoundation() {
+      // Subclasses must override this method to return a properly configured foundation class for the
+      // component.
+      throw new Error('Subclasses must override getDefaultFoundation to return a properly configured ' + 'foundation class');
+    }
+  }, {
+    key: 'initialSyncWithDOM',
+    value: function initialSyncWithDOM() {
+      // Subclasses should override this method if they need to perform work to synchronize with a host DOM
+      // object. An example of this would be a form control wrapper that needs to synchronize its internal state
+      // to some property or attribute of the host DOM. Please note: this is *not* the place to perform DOM
+      // reads/writes that would cause layout / paint, as this is called synchronously from within the constructor.
+    }
+  }, {
+    key: 'destroy',
+    value: function destroy() {
+      // Subclasses may implement this method to release any resources / deregister any listeners they have
+      // attached. An example of this might be deregistering a resize event from the window object.
+      this.foundation_.destroy();
+    }
+
+    /**
+     * Wrapper method to add an event listener to the component's root element. This is most useful when
+     * listening for custom events.
+     * @param {string} evtType
+     * @param {!Function} handler
+     */
+
+  }, {
+    key: 'listen',
+    value: function listen(evtType, handler) {
+      this.root_.addEventListener(evtType, handler);
+    }
+
+    /**
+     * Wrapper method to remove an event listener to the component's root element. This is most useful when
+     * unlistening for custom events.
+     * @param {string} evtType
+     * @param {!Function} handler
+     */
+
+  }, {
+    key: 'unlisten',
+    value: function unlisten(evtType, handler) {
+      this.root_.removeEventListener(evtType, handler);
+    }
+
+    /**
+     * Fires a cross-browser-compatible custom event from the component root of the given type,
+     * with the given data.
+     * @param {string} evtType
+     * @param {!Object} evtData
+     * @param {boolean=} shouldBubble
+     */
+
+  }, {
+    key: 'emit',
+    value: function emit(evtType, evtData) {
+      var shouldBubble = arguments.length > 2 && arguments[2] !== undefined ? arguments[2] : false;
+
+      var evt = void 0;
+      if (typeof CustomEvent === 'function') {
+        evt = new CustomEvent(evtType, {
+          detail: evtData,
+          bubbles: shouldBubble
+        });
+      } else {
+        evt = document.createEvent('CustomEvent');
+        evt.initCustomEvent(evtType, shouldBubble, false, evtData);
+      }
+
+      this.root_.dispatchEvent(evt);
+    }
+  }]);
+
+  return MDCComponent;
+}();
+
+/* harmony default export */ __webpack_exports__["a"] = (MDCComponent);
+
+/***/ }),
+
+/***/ 19:
+/***/ (function(module, __webpack_exports__, __webpack_require__) {
+
+"use strict";
+/* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, "b", function() { return MDCTabBar; });
+/* harmony import */ var __WEBPACK_IMPORTED_MODULE_0__material_base_component__ = __webpack_require__(1);
+/* harmony import */ var __WEBPACK_IMPORTED_MODULE_1__tab__ = __webpack_require__(21);
+/* harmony import */ var __WEBPACK_IMPORTED_MODULE_2__foundation__ = __webpack_require__(73);
+/* harmony reexport (binding) */ __webpack_require__.d(__webpack_exports__, "a", function() { return __WEBPACK_IMPORTED_MODULE_2__foundation__["a"]; });
+var _createClass = function () { function defineProperties(target, props) { for (var i = 0; i < props.length; i++) { var descriptor = props[i]; descriptor.enumerable = descriptor.enumerable || false; descriptor.configurable = true; if ("value" in descriptor) descriptor.writable = true; Object.defineProperty(target, descriptor.key, descriptor); } } return function (Constructor, protoProps, staticProps) { if (protoProps) defineProperties(Constructor.prototype, protoProps); if (staticProps) defineProperties(Constructor, staticProps); return Constructor; }; }();
+
+function _classCallCheck(instance, Constructor) { if (!(instance instanceof Constructor)) { throw new TypeError("Cannot call a class as a function"); } }
+
+function _possibleConstructorReturn(self, call) { if (!self) { throw new ReferenceError("this hasn't been initialised - super() hasn't been called"); } return call && (typeof call === "object" || typeof call === "function") ? call : self; }
+
+function _inherits(subClass, superClass) { if (typeof superClass !== "function" && superClass !== null) { throw new TypeError("Super expression must either be null or a function, not " + typeof superClass); } subClass.prototype = Object.create(superClass && superClass.prototype, { constructor: { value: subClass, enumerable: false, writable: true, configurable: true } }); if (superClass) Object.setPrototypeOf ? Object.setPrototypeOf(subClass, superClass) : subClass.__proto__ = superClass; }
+
+/**
+ * Copyright 2017 Google Inc. All Rights Reserved.
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *      http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+
+
+
+
+
+
+
+
+var MDCTabBar = function (_MDCComponent) {
+  _inherits(MDCTabBar, _MDCComponent);
+
+  function MDCTabBar() {
+    _classCallCheck(this, MDCTabBar);
+
+    return _possibleConstructorReturn(this, (MDCTabBar.__proto__ || Object.getPrototypeOf(MDCTabBar)).apply(this, arguments));
+  }
+
+  _createClass(MDCTabBar, [{
+    key: 'initialize',
+    value: function initialize() {
+      var _this2 = this;
+
+      var tabFactory = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : function (el) {
+        return new __WEBPACK_IMPORTED_MODULE_1__tab__["b" /* MDCTab */](el);
+      };
+
+      this.indicator_ = this.root_.querySelector(__WEBPACK_IMPORTED_MODULE_2__foundation__["a" /* default */].strings.INDICATOR_SELECTOR);
+      this.tabs_ = this.gatherTabs_(tabFactory);
+      this.tabSelectedHandler_ = function (_ref) {
+        var detail = _ref.detail;
+        var tab = detail.tab;
+
+        _this2.setActiveTab_(tab, true);
+      };
+    }
+  }, {
+    key: 'getDefaultFoundation',
+    value: function getDefaultFoundation() {
+      var _this3 = this;
+
+      return new __WEBPACK_IMPORTED_MODULE_2__foundation__["a" /* default */]({
+        addClass: function addClass(className) {
+          return _this3.root_.classList.add(className);
+        },
+        removeClass: function removeClass(className) {
+          return _this3.root_.classList.remove(className);
+        },
+        bindOnMDCTabSelectedEvent: function bindOnMDCTabSelectedEvent() {
+          return _this3.listen(__WEBPACK_IMPORTED_MODULE_1__tab__["a" /* MDCTabFoundation */].strings.SELECTED_EVENT, _this3.tabSelectedHandler_);
+        },
+        unbindOnMDCTabSelectedEvent: function unbindOnMDCTabSelectedEvent() {
+          return _this3.unlisten(__WEBPACK_IMPORTED_MODULE_1__tab__["a" /* MDCTabFoundation */].strings.SELECTED_EVENT, _this3.tabSelectedHandler_);
+        },
+        registerResizeHandler: function registerResizeHandler(handler) {
+          return window.addEventListener('resize', handler);
+        },
+        deregisterResizeHandler: function deregisterResizeHandler(handler) {
+          return window.removeEventListener('resize', handler);
+        },
+        getOffsetWidth: function getOffsetWidth() {
+          return _this3.root_.offsetWidth;
+        },
+        setStyleForIndicator: function setStyleForIndicator(propertyName, value) {
+          return _this3.indicator_.style.setProperty(propertyName, value);
+        },
+        getOffsetWidthForIndicator: function getOffsetWidthForIndicator() {
+          return _this3.indicator_.offsetWidth;
+        },
+        notifyChange: function notifyChange(evtData) {
+          return _this3.emit(__WEBPACK_IMPORTED_MODULE_2__foundation__["a" /* default */].strings.CHANGE_EVENT, evtData);
+        },
+        getNumberOfTabs: function getNumberOfTabs() {
+          return _this3.tabs.length;
+        },
+        isTabActiveAtIndex: function isTabActiveAtIndex(index) {
+          return _this3.tabs[index].isActive;
+        },
+        setTabActiveAtIndex: function setTabActiveAtIndex(index, isActive) {
+          _this3.tabs[index].isActive = isActive;
+        },
+        isDefaultPreventedOnClickForTabAtIndex: function isDefaultPreventedOnClickForTabAtIndex(index) {
+          return _this3.tabs[index].preventDefaultOnClick;
+        },
+        setPreventDefaultOnClickForTabAtIndex: function setPreventDefaultOnClickForTabAtIndex(index, preventDefaultOnClick) {
+          _this3.tabs[index].preventDefaultOnClick = preventDefaultOnClick;
+        },
+        measureTabAtIndex: function measureTabAtIndex(index) {
+          return _this3.tabs[index].measureSelf();
+        },
+        getComputedWidthForTabAtIndex: function getComputedWidthForTabAtIndex(index) {
+          return _this3.tabs[index].computedWidth;
+        },
+        getComputedLeftForTabAtIndex: function getComputedLeftForTabAtIndex(index) {
+          return _this3.tabs[index].computedLeft;
+        }
+      });
+    }
+  }, {
+    key: 'gatherTabs_',
+    value: function gatherTabs_(tabFactory) {
+      var tabElements = [].slice.call(this.root_.querySelectorAll(__WEBPACK_IMPORTED_MODULE_2__foundation__["a" /* default */].strings.TAB_SELECTOR));
+      return tabElements.map(function (el) {
+        return tabFactory(el);
+      });
+    }
+  }, {
+    key: 'setActiveTabIndex_',
+    value: function setActiveTabIndex_(activeTabIndex, notifyChange) {
+      this.foundation_.switchToTabAtIndex(activeTabIndex, notifyChange);
+    }
+  }, {
+    key: 'layout',
+    value: function layout() {
+      this.foundation_.layout();
+    }
+  }, {
+    key: 'setActiveTab_',
+    value: function setActiveTab_(activeTab, notifyChange) {
+      var indexOfTab = this.tabs.indexOf(activeTab);
+      if (indexOfTab < 0) {
+        throw new Error('Invalid tab component given as activeTab: Tab not found within this component\'s tab list');
+      }
+      this.setActiveTabIndex_(indexOfTab, notifyChange);
+    }
+  }, {
+    key: 'tabs',
+    get: function get() {
+      return this.tabs_;
+    }
+  }, {
+    key: 'activeTab',
+    get: function get() {
+      var activeIndex = this.foundation_.getActiveTabIndex();
+      return this.tabs[activeIndex];
+    },
+    set: function set(tab) {
+      this.setActiveTab_(tab, false);
+    }
+  }, {
+    key: 'activeTabIndex',
+    get: function get() {
+      return this.foundation_.getActiveTabIndex();
+    },
+    set: function set(index) {
+      this.setActiveTabIndex_(index, false);
+    }
+  }], [{
+    key: 'attachTo',
+    value: function attachTo(root) {
+      return new MDCTabBar(root);
+    }
+  }]);
+
+  return MDCTabBar;
+}(__WEBPACK_IMPORTED_MODULE_0__material_base_component__["a" /* default */]);
+
+/***/ }),
+
+/***/ 20:
+/***/ (function(module, __webpack_exports__, __webpack_require__) {
+
+"use strict";
+/* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, "a", function() { return cssClasses; });
+/* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, "b", function() { return strings; });
+/**
+ * Copyright 2017 Google Inc. All Rights Reserved.
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *      http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+
+var cssClasses = {
+  ACTIVE: 'mdc-tab--active'
+};
+
+var strings = {
+  SELECTED_EVENT: 'MDCTab:selected'
+};
+
+/***/ }),
+
+/***/ 21:
+/***/ (function(module, __webpack_exports__, __webpack_require__) {
+
+"use strict";
+/* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, "b", function() { return MDCTab; });
+/* harmony import */ var __WEBPACK_IMPORTED_MODULE_0__material_base_component__ = __webpack_require__(1);
+/* harmony import */ var __WEBPACK_IMPORTED_MODULE_1__material_ripple__ = __webpack_require__(6);
+/* harmony import */ var __WEBPACK_IMPORTED_MODULE_2__constants__ = __webpack_require__(20);
+/* harmony import */ var __WEBPACK_IMPORTED_MODULE_3__foundation__ = __webpack_require__(74);
+/* harmony reexport (binding) */ __webpack_require__.d(__webpack_exports__, "a", function() { return __WEBPACK_IMPORTED_MODULE_3__foundation__["a"]; });
+var _get = function get(object, property, receiver) { if (object === null) object = Function.prototype; var desc = Object.getOwnPropertyDescriptor(object, property); if (desc === undefined) { var parent = Object.getPrototypeOf(object); if (parent === null) { return undefined; } else { return get(parent, property, receiver); } } else if ("value" in desc) { return desc.value; } else { var getter = desc.get; if (getter === undefined) { return undefined; } return getter.call(receiver); } };
+
+var _createClass = function () { function defineProperties(target, props) { for (var i = 0; i < props.length; i++) { var descriptor = props[i]; descriptor.enumerable = descriptor.enumerable || false; descriptor.configurable = true; if ("value" in descriptor) descriptor.writable = true; Object.defineProperty(target, descriptor.key, descriptor); } } return function (Constructor, protoProps, staticProps) { if (protoProps) defineProperties(Constructor.prototype, protoProps); if (staticProps) defineProperties(Constructor, staticProps); return Constructor; }; }();
+
+function _classCallCheck(instance, Constructor) { if (!(instance instanceof Constructor)) { throw new TypeError("Cannot call a class as a function"); } }
+
+function _possibleConstructorReturn(self, call) { if (!self) { throw new ReferenceError("this hasn't been initialised - super() hasn't been called"); } return call && (typeof call === "object" || typeof call === "function") ? call : self; }
+
+function _inherits(subClass, superClass) { if (typeof superClass !== "function" && superClass !== null) { throw new TypeError("Super expression must either be null or a function, not " + typeof superClass); } subClass.prototype = Object.create(superClass && superClass.prototype, { constructor: { value: subClass, enumerable: false, writable: true, configurable: true } }); if (superClass) Object.setPrototypeOf ? Object.setPrototypeOf(subClass, superClass) : subClass.__proto__ = superClass; }
+
+/**
+ * Copyright 2017 Google Inc. All Rights Reserved.
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *      http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+
+
+
+
+
+
+
+
+
+var MDCTab = function (_MDCComponent) {
+  _inherits(MDCTab, _MDCComponent);
+
+  _createClass(MDCTab, [{
+    key: 'computedWidth',
+    get: function get() {
+      return this.foundation_.getComputedWidth();
+    }
+  }, {
+    key: 'computedLeft',
+    get: function get() {
+      return this.foundation_.getComputedLeft();
+    }
+  }, {
+    key: 'isActive',
+    get: function get() {
+      return this.foundation_.isActive();
+    },
+    set: function set(isActive) {
+      this.foundation_.setActive(isActive);
+    }
+  }, {
+    key: 'preventDefaultOnClick',
+    get: function get() {
+      return this.foundation_.preventsDefaultOnClick();
+    },
+    set: function set(preventDefaultOnClick) {
+      this.foundation_.setPreventDefaultOnClick(preventDefaultOnClick);
+    }
+  }], [{
+    key: 'attachTo',
+    value: function attachTo(root) {
+      return new MDCTab(root);
+    }
+  }]);
+
+  function MDCTab() {
+    var _ref;
+
+    _classCallCheck(this, MDCTab);
+
+    for (var _len = arguments.length, args = Array(_len), _key = 0; _key < _len; _key++) {
+      args[_key] = arguments[_key];
+    }
+
+    var _this = _possibleConstructorReturn(this, (_ref = MDCTab.__proto__ || Object.getPrototypeOf(MDCTab)).call.apply(_ref, [this].concat(args)));
+
+    _this.ripple_ = __WEBPACK_IMPORTED_MODULE_1__material_ripple__["MDCRipple"].attachTo(_this.root_);
+    return _this;
+  }
+
+  _createClass(MDCTab, [{
+    key: 'destroy',
+    value: function destroy() {
+      this.ripple_.destroy();
+      _get(MDCTab.prototype.__proto__ || Object.getPrototypeOf(MDCTab.prototype), 'destroy', this).call(this);
+    }
+  }, {
+    key: 'getDefaultFoundation',
+    value: function getDefaultFoundation() {
+      var _this2 = this;
+
+      return new __WEBPACK_IMPORTED_MODULE_3__foundation__["a" /* default */]({
+        addClass: function addClass(className) {
+          return _this2.root_.classList.add(className);
+        },
+        removeClass: function removeClass(className) {
+          return _this2.root_.classList.remove(className);
+        },
+        registerInteractionHandler: function registerInteractionHandler(type, handler) {
+          return _this2.root_.addEventListener(type, handler);
+        },
+        deregisterInteractionHandler: function deregisterInteractionHandler(type, handler) {
+          return _this2.root_.removeEventListener(type, handler);
+        },
+        getOffsetWidth: function getOffsetWidth() {
+          return _this2.root_.offsetWidth;
+        },
+        getOffsetLeft: function getOffsetLeft() {
+          return _this2.root_.offsetLeft;
+        },
+        notifySelected: function notifySelected() {
+          return _this2.emit(__WEBPACK_IMPORTED_MODULE_3__foundation__["a" /* default */].strings.SELECTED_EVENT, { tab: _this2 }, true);
+        }
+      });
+    }
+  }, {
+    key: 'initialSyncWithDOM',
+    value: function initialSyncWithDOM() {
+      this.isActive = this.root_.classList.contains(__WEBPACK_IMPORTED_MODULE_2__constants__["a" /* cssClasses */].ACTIVE);
+    }
+  }, {
+    key: 'measureSelf',
+    value: function measureSelf() {
+      this.foundation_.measureSelf();
+    }
+  }]);
+
+  return MDCTab;
+}(__WEBPACK_IMPORTED_MODULE_0__material_base_component__["a" /* default */]);
+
+/***/ }),
+
+/***/ 35:
+/***/ (function(module, __webpack_exports__, __webpack_require__) {
+
+"use strict";
+Object.defineProperty(__webpack_exports__, "__esModule", { value: true });
+/* harmony import */ var __WEBPACK_IMPORTED_MODULE_0__tab__ = __webpack_require__(21);
+/* harmony reexport (binding) */ __webpack_require__.d(__webpack_exports__, "MDCTabFoundation", function() { return __WEBPACK_IMPORTED_MODULE_0__tab__["a"]; });
+/* harmony reexport (binding) */ __webpack_require__.d(__webpack_exports__, "MDCTab", function() { return __WEBPACK_IMPORTED_MODULE_0__tab__["b"]; });
+/* harmony import */ var __WEBPACK_IMPORTED_MODULE_1__tab_bar__ = __webpack_require__(19);
+/* harmony reexport (binding) */ __webpack_require__.d(__webpack_exports__, "MDCTabBarFoundation", function() { return __WEBPACK_IMPORTED_MODULE_1__tab_bar__["a"]; });
+/* harmony reexport (binding) */ __webpack_require__.d(__webpack_exports__, "MDCTabBar", function() { return __WEBPACK_IMPORTED_MODULE_1__tab_bar__["b"]; });
+/* harmony import */ var __WEBPACK_IMPORTED_MODULE_2__tab_bar_scroller__ = __webpack_require__(71);
+/* harmony reexport (binding) */ __webpack_require__.d(__webpack_exports__, "MDCTabBarScrollerFoundation", function() { return __WEBPACK_IMPORTED_MODULE_2__tab_bar_scroller__["a"]; });
+/* harmony reexport (binding) */ __webpack_require__.d(__webpack_exports__, "MDCTabBarScroller", function() { return __WEBPACK_IMPORTED_MODULE_2__tab_bar_scroller__["b"]; });
+/**
+ * Copyright 2017 Google Inc. All Rights Reserved.
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *      http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+
+
+
+
+
+/***/ }),
+
+/***/ 4:
+/***/ (function(module, __webpack_exports__, __webpack_require__) {
+
+"use strict";
+var _createClass = function () { function defineProperties(target, props) { for (var i = 0; i < props.length; i++) { var descriptor = props[i]; descriptor.enumerable = descriptor.enumerable || false; descriptor.configurable = true; if ("value" in descriptor) descriptor.writable = true; Object.defineProperty(target, descriptor.key, descriptor); } } return function (Constructor, protoProps, staticProps) { if (protoProps) defineProperties(Constructor.prototype, protoProps); if (staticProps) defineProperties(Constructor, staticProps); return Constructor; }; }();
+
+function _classCallCheck(instance, Constructor) { if (!(instance instanceof Constructor)) { throw new TypeError("Cannot call a class as a function"); } }
+
+/**
+ * Copyright 2016 Google Inc. All Rights Reserved.
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *      http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+
+/* eslint no-unused-vars: [2, {"args": "none"}] */
+
+/**
+ * Adapter for MDC Ripple. Provides an interface for managing
+ * - classes
+ * - dom
+ * - CSS variables
+ * - position
+ * - dimensions
+ * - scroll position
+ * - event handlers
+ * - unbounded, active and disabled states
+ *
+ * Additionally, provides type information for the adapter to the Closure
+ * compiler.
+ *
+ * Implement this adapter for your framework of choice to delegate updates to
+ * the component in your framework of choice. See architecture documentation
+ * for more details.
+ * https://github.com/material-components/material-components-web/blob/master/docs/architecture.md
+ *
+ * @record
+ */
+var MDCRippleAdapter = function () {
+  function MDCRippleAdapter() {
+    _classCallCheck(this, MDCRippleAdapter);
+  }
+
+  _createClass(MDCRippleAdapter, [{
+    key: "browserSupportsCssVars",
+
+    /** @return {boolean} */
+    value: function browserSupportsCssVars() {}
+
+    /** @return {boolean} */
+
+  }, {
+    key: "isUnbounded",
+    value: function isUnbounded() {}
+
+    /** @return {boolean} */
+
+  }, {
+    key: "isSurfaceActive",
+    value: function isSurfaceActive() {}
+
+    /** @return {boolean} */
+
+  }, {
+    key: "isSurfaceDisabled",
+    value: function isSurfaceDisabled() {}
+
+    /** @param {string} className */
+
+  }, {
+    key: "addClass",
+    value: function addClass(className) {}
+
+    /** @param {string} className */
+
+  }, {
+    key: "removeClass",
+    value: function removeClass(className) {}
+
+    /**
+     * @param {string} evtType
+     * @param {!Function} handler
+     */
+
+  }, {
+    key: "registerInteractionHandler",
+    value: function registerInteractionHandler(evtType, handler) {}
+
+    /**
+     * @param {string} evtType
+     * @param {!Function} handler
+     */
+
+  }, {
+    key: "deregisterInteractionHandler",
+    value: function deregisterInteractionHandler(evtType, handler) {}
+
+    /**
+     * @param {!Function} handler
+     */
+
+  }, {
+    key: "registerResizeHandler",
+    value: function registerResizeHandler(handler) {}
+
+    /**
+     * @param {!Function} handler
+     */
+
+  }, {
+    key: "deregisterResizeHandler",
+    value: function deregisterResizeHandler(handler) {}
+
+    /**
+     * @param {string} varName
+     * @param {?number|string} value
+     */
+
+  }, {
+    key: "updateCssVariable",
+    value: function updateCssVariable(varName, value) {}
+
+    /** @return {!ClientRect} */
+
+  }, {
+    key: "computeBoundingRect",
+    value: function computeBoundingRect() {}
+
+    /** @return {{x: number, y: number}} */
+
+  }, {
+    key: "getWindowPageOffset",
+    value: function getWindowPageOffset() {}
+  }]);
+
+  return MDCRippleAdapter;
+}();
+
+/* unused harmony default export */ var _unused_webpack_default_export = (MDCRippleAdapter);
+
+/***/ }),
+
+/***/ 5:
+/***/ (function(module, __webpack_exports__, __webpack_require__) {
+
+"use strict";
+Object.defineProperty(__webpack_exports__, "__esModule", { value: true });
+/* harmony export (immutable) */ __webpack_exports__["supportsCssVariables"] = supportsCssVariables;
+/* harmony export (immutable) */ __webpack_exports__["applyPassive"] = applyPassive;
+/* harmony export (immutable) */ __webpack_exports__["getMatchesProperty"] = getMatchesProperty;
+/* harmony export (immutable) */ __webpack_exports__["getNormalizedEventCoords"] = getNormalizedEventCoords;
+/**
+ * Copyright 2016 Google Inc. All Rights Reserved.
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *      http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+
+/**
+ * Stores result from supportsCssVariables to avoid redundant processing to detect CSS custom variable support.
+ * @private {boolean|undefined}
+ */
+var supportsCssVariables_ = void 0;
+
+/**
+ * Stores result from applyPassive to avoid redundant processing to detect passive event listener support.
+ * @private {boolean|undefined}
+ */
+var supportsPassive_ = void 0;
+
+/**
+ * @param {!Window} windowObj
+ * @return {boolean}
+ */
+function detectEdgePseudoVarBug(windowObj) {
+  // Detect versions of Edge with buggy var() support
+  // See: https://developer.microsoft.com/en-us/microsoft-edge/platform/issues/11495448/
+  var document = windowObj.document;
+  var className = 'test-edge-css-var';
+  var styleNode = document.createElement('style');
+  document.head.appendChild(styleNode);
+  var sheet = styleNode.sheet;
+  // Internet Explorer 11 requires indices to always be specified to insertRule
+  sheet.insertRule(':root { --' + className + ': 1px solid #000; }', 0);
+  sheet.insertRule('.' + className + ' { visibility: hidden; }', 1);
+  sheet.insertRule('.' + className + '::before { border: var(--' + className + '); }', 2);
+  var node = document.createElement('div');
+  node.className = className;
+  document.body.appendChild(node);
+  // Bug exists if ::before style ends up propagating to the parent element
+  var hasPseudoVarBug = windowObj.getComputedStyle(node).borderTopStyle === 'solid';
+  node.remove();
+  styleNode.remove();
+  return hasPseudoVarBug;
+}
+
+/**
+ * @param {!Window} windowObj
+ * @param {boolean=} forceRefresh
+ * @return {boolean|undefined}
+ */
+function supportsCssVariables(windowObj) {
+  var forceRefresh = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : false;
+
+  if (typeof supportsCssVariables_ === 'boolean' && !forceRefresh) {
+    return supportsCssVariables_;
+  }
+
+  var supportsFunctionPresent = windowObj.CSS && typeof windowObj.CSS.supports === 'function';
+  if (!supportsFunctionPresent) {
+    return;
+  }
+
+  var explicitlySupportsCssVars = windowObj.CSS.supports('--css-vars', 'yes');
+  // See: https://bugs.webkit.org/show_bug.cgi?id=154669
+  // See: README section on Safari
+  var weAreFeatureDetectingSafari10plus = windowObj.CSS.supports('(--css-vars: yes)') && windowObj.CSS.supports('color', '#00000000');
+
+  if (explicitlySupportsCssVars || weAreFeatureDetectingSafari10plus) {
+    supportsCssVariables_ = !detectEdgePseudoVarBug(windowObj);
+  } else {
+    supportsCssVariables_ = false;
+  }
+  return supportsCssVariables_;
+}
+
+//
+/**
+ * Determine whether the current browser supports passive event listeners, and if so, use them.
+ * @param {!Window=} globalObj
+ * @param {boolean=} forceRefresh
+ * @return {boolean|{passive: boolean}}
+ */
+function applyPassive() {
+  var globalObj = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : window;
+  var forceRefresh = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : false;
+
+  if (supportsPassive_ === undefined || forceRefresh) {
+    var isSupported = false;
+    try {
+      globalObj.document.addEventListener('test', null, { get passive() {
+          isSupported = true;
+        } });
+    } catch (e) {}
+
+    supportsPassive_ = isSupported;
+  }
+
+  return supportsPassive_ ? { passive: true } : false;
+}
+
+/**
+ * @param {!Object} HTMLElementPrototype
+ * @return {!Array<string>}
+ */
+function getMatchesProperty(HTMLElementPrototype) {
+  return ['webkitMatchesSelector', 'msMatchesSelector', 'matches'].filter(function (p) {
+    return p in HTMLElementPrototype;
+  }).pop();
+}
+
+/**
+ * @param {!Event} ev
+ * @param {!{x: number, y: number}} pageOffset
+ * @param {!ClientRect} clientRect
+ * @return {!{x: number, y: number}}
+ */
+function getNormalizedEventCoords(ev, pageOffset, clientRect) {
+  var x = pageOffset.x,
+      y = pageOffset.y;
+
+  var documentX = x + clientRect.left;
+  var documentY = y + clientRect.top;
+
+  var normalizedX = void 0;
+  var normalizedY = void 0;
+  // Determine touch point relative to the ripple container.
+  if (ev.type === 'touchstart') {
+    normalizedX = ev.changedTouches[0].pageX - documentX;
+    normalizedY = ev.changedTouches[0].pageY - documentY;
+  } else {
+    normalizedX = ev.pageX - documentX;
+    normalizedY = ev.pageY - documentY;
+  }
+
+  return { x: normalizedX, y: normalizedY };
+}
+
+/***/ }),
+
+/***/ 6:
+/***/ (function(module, __webpack_exports__, __webpack_require__) {
+
+"use strict";
+Object.defineProperty(__webpack_exports__, "__esModule", { value: true });
+/* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, "MDCRipple", function() { return MDCRipple; });
+/* harmony import */ var __WEBPACK_IMPORTED_MODULE_0__material_base_component__ = __webpack_require__(1);
+/* harmony import */ var __WEBPACK_IMPORTED_MODULE_1__adapter__ = __webpack_require__(4);
+/* harmony import */ var __WEBPACK_IMPORTED_MODULE_2__foundation__ = __webpack_require__(8);
+/* harmony import */ var __WEBPACK_IMPORTED_MODULE_3__util__ = __webpack_require__(5);
+/* harmony reexport (binding) */ __webpack_require__.d(__webpack_exports__, "MDCRippleFoundation", function() { return __WEBPACK_IMPORTED_MODULE_2__foundation__["a"]; });
+/* harmony reexport (module object) */ __webpack_require__.d(__webpack_exports__, "util", function() { return __WEBPACK_IMPORTED_MODULE_3__util__; });
+var _createClass = function () { function defineProperties(target, props) { for (var i = 0; i < props.length; i++) { var descriptor = props[i]; descriptor.enumerable = descriptor.enumerable || false; descriptor.configurable = true; if ("value" in descriptor) descriptor.writable = true; Object.defineProperty(target, descriptor.key, descriptor); } } return function (Constructor, protoProps, staticProps) { if (protoProps) defineProperties(Constructor.prototype, protoProps); if (staticProps) defineProperties(Constructor, staticProps); return Constructor; }; }();
+
+function _classCallCheck(instance, Constructor) { if (!(instance instanceof Constructor)) { throw new TypeError("Cannot call a class as a function"); } }
+
+function _possibleConstructorReturn(self, call) { if (!self) { throw new ReferenceError("this hasn't been initialised - super() hasn't been called"); } return call && (typeof call === "object" || typeof call === "function") ? call : self; }
+
+function _inherits(subClass, superClass) { if (typeof superClass !== "function" && superClass !== null) { throw new TypeError("Super expression must either be null or a function, not " + typeof superClass); } subClass.prototype = Object.create(superClass && superClass.prototype, { constructor: { value: subClass, enumerable: false, writable: true, configurable: true } }); if (superClass) Object.setPrototypeOf ? Object.setPrototypeOf(subClass, superClass) : subClass.__proto__ = superClass; }
+
+/**
+ * Copyright 2016 Google Inc. All Rights Reserved.
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *      http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+
+
+
+
+
+
+
+
+
+/**
+ * @extends MDCComponent<!MDCRippleFoundation>
+ */
+var MDCRipple = function (_MDCComponent) {
+  _inherits(MDCRipple, _MDCComponent);
+
+  /** @param {...?} args */
+  function MDCRipple() {
+    var _ref;
+
+    _classCallCheck(this, MDCRipple);
+
+    for (var _len = arguments.length, args = Array(_len), _key = 0; _key < _len; _key++) {
+      args[_key] = arguments[_key];
+    }
+
+    /** @type {boolean} */
+    var _this = _possibleConstructorReturn(this, (_ref = MDCRipple.__proto__ || Object.getPrototypeOf(MDCRipple)).call.apply(_ref, [this].concat(args)));
+
+    _this.disabled = false;
+
+    /** @private {boolean} */
+    _this.unbounded_;
+    return _this;
+  }
+
+  /**
+   * @param {!Element} root
+   * @param {{isUnbounded: (boolean|undefined)}=} options
+   * @return {!MDCRipple}
+   */
+
+
+  _createClass(MDCRipple, [{
+    key: 'activate',
+    value: function activate() {
+      this.foundation_.activate();
+    }
+  }, {
+    key: 'deactivate',
+    value: function deactivate() {
+      this.foundation_.deactivate();
+    }
+  }, {
+    key: 'layout',
+    value: function layout() {
+      this.foundation_.layout();
+    }
+
+    /** @return {!MDCRippleFoundation} */
+
+  }, {
+    key: 'getDefaultFoundation',
+    value: function getDefaultFoundation() {
+      return new __WEBPACK_IMPORTED_MODULE_2__foundation__["a" /* default */](MDCRipple.createAdapter(this));
+    }
+  }, {
+    key: 'initialSyncWithDOM',
+    value: function initialSyncWithDOM() {
+      this.unbounded = 'mdcRippleIsUnbounded' in this.root_.dataset;
+    }
+  }, {
+    key: 'unbounded',
+
+
+    /** @return {boolean} */
+    get: function get() {
+      return this.unbounded_;
+    }
+
+    /** @param {boolean} unbounded */
+    ,
+    set: function set(unbounded) {
+      var UNBOUNDED = __WEBPACK_IMPORTED_MODULE_2__foundation__["a" /* default */].cssClasses.UNBOUNDED;
+
+      this.unbounded_ = Boolean(unbounded);
+      if (this.unbounded_) {
+        this.root_.classList.add(UNBOUNDED);
+      } else {
+        this.root_.classList.remove(UNBOUNDED);
+      }
+    }
+  }], [{
+    key: 'attachTo',
+    value: function attachTo(root) {
+      var _ref2 = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : {},
+          _ref2$isUnbounded = _ref2.isUnbounded,
+          isUnbounded = _ref2$isUnbounded === undefined ? undefined : _ref2$isUnbounded;
+
+      var ripple = new MDCRipple(root);
+      // Only override unbounded behavior if option is explicitly specified
+      if (isUnbounded !== undefined) {
+        ripple.unbounded = /** @type {boolean} */isUnbounded;
+      }
+      return ripple;
+    }
+
+    /**
+     * @param {!RippleCapableSurface} instance
+     * @return {!MDCRippleAdapter}
+     */
+
+  }, {
+    key: 'createAdapter',
+    value: function createAdapter(instance) {
+      var MATCHES = __WEBPACK_IMPORTED_MODULE_3__util__["getMatchesProperty"](HTMLElement.prototype);
+
+      return {
+        browserSupportsCssVars: function browserSupportsCssVars() {
+          return __WEBPACK_IMPORTED_MODULE_3__util__["supportsCssVariables"](window);
+        },
+        isUnbounded: function isUnbounded() {
+          return instance.unbounded;
+        },
+        isSurfaceActive: function isSurfaceActive() {
+          return instance.root_[MATCHES](':active');
+        },
+        isSurfaceDisabled: function isSurfaceDisabled() {
+          return instance.disabled;
+        },
+        addClass: function addClass(className) {
+          return instance.root_.classList.add(className);
+        },
+        removeClass: function removeClass(className) {
+          return instance.root_.classList.remove(className);
+        },
+        registerInteractionHandler: function registerInteractionHandler(evtType, handler) {
+          return instance.root_.addEventListener(evtType, handler, __WEBPACK_IMPORTED_MODULE_3__util__["applyPassive"]());
+        },
+        deregisterInteractionHandler: function deregisterInteractionHandler(evtType, handler) {
+          return instance.root_.removeEventListener(evtType, handler, __WEBPACK_IMPORTED_MODULE_3__util__["applyPassive"]());
+        },
+        registerResizeHandler: function registerResizeHandler(handler) {
+          return window.addEventListener('resize', handler);
+        },
+        deregisterResizeHandler: function deregisterResizeHandler(handler) {
+          return window.removeEventListener('resize', handler);
+        },
+        updateCssVariable: function updateCssVariable(varName, value) {
+          return instance.root_.style.setProperty(varName, value);
+        },
+        computeBoundingRect: function computeBoundingRect() {
+          return instance.root_.getBoundingClientRect();
+        },
+        getWindowPageOffset: function getWindowPageOffset() {
+          return { x: window.pageXOffset, y: window.pageYOffset };
+        }
+      };
+    }
+  }]);
+
+  return MDCRipple;
+}(__WEBPACK_IMPORTED_MODULE_0__material_base_component__["a" /* default */]);
+
+/**
+ * See Material Design spec for more details on when to use ripples.
+ * https://material.io/guidelines/motion/choreography.html#choreography-creation
+ * @record
+ */
+
+var RippleCapableSurface = function RippleCapableSurface() {
+  _classCallCheck(this, RippleCapableSurface);
+};
+
+/** @protected {!Element} */
+
+
+RippleCapableSurface.prototype.root_;
+
+/**
+ * Whether or not the ripple bleeds out of the bounds of the element.
+ * @type {boolean|undefined}
+ */
+RippleCapableSurface.prototype.unbounded;
+
+/**
+ * Whether or not the ripple is attached to a disabled component.
+ * @type {boolean|undefined}
+ */
+RippleCapableSurface.prototype.disabled;
+
+/***/ }),
+
+/***/ 69:
+/***/ (function(module, __webpack_exports__, __webpack_require__) {
+
+"use strict";
+/* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, "a", function() { return cssClasses; });
+/* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, "b", function() { return strings; });
+/**
+ * Copyright 2017 Google Inc. All Rights Reserved.
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *      http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+
+var cssClasses = {
+  INDICATOR_FORWARD: 'mdc-tab-bar-scroller__indicator--forward',
+  INDICATOR_BACK: 'mdc-tab-bar-scroller__indicator--back',
+  INDICATOR_ENABLED: 'mdc-tab-bar-scroller__indicator--enabled',
+  TAB: 'mdc-tab'
+};
+
+var strings = {
+  FRAME_SELECTOR: '.mdc-tab-bar-scroller__scroll-frame',
+  TABS_SELECTOR: '.mdc-tab-bar-scroller__scroll-frame__tabs',
+  TAB_SELECTOR: '.mdc-tab',
+  INDICATOR_FORWARD_SELECTOR: '.mdc-tab-bar-scroller__indicator--forward',
+  INDICATOR_BACK_SELECTOR: '.mdc-tab-bar-scroller__indicator--back'
+};
+
+/***/ }),
+
+/***/ 7:
+/***/ (function(module, __webpack_exports__, __webpack_require__) {
+
+"use strict";
+/* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, "a", function() { return cssClasses; });
+/* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, "b", function() { return strings; });
+/* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, "c", function() { return numbers; });
+/**
+ * Copyright 2016 Google Inc. All Rights Reserved.
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *      http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+
+var cssClasses = {
+  // Ripple is a special case where the "root" component is really a "mixin" of sorts,
+  // given that it's an 'upgrade' to an existing component. That being said it is the root
+  // CSS class that all other CSS classes derive from.
+  ROOT: 'mdc-ripple-upgraded',
+  UNBOUNDED: 'mdc-ripple-upgraded--unbounded',
+  BG_FOCUSED: 'mdc-ripple-upgraded--background-focused',
+  BG_ACTIVE_FILL: 'mdc-ripple-upgraded--background-active-fill',
+  FG_ACTIVATION: 'mdc-ripple-upgraded--foreground-activation',
+  FG_DEACTIVATION: 'mdc-ripple-upgraded--foreground-deactivation'
+};
+
+var strings = {
+  VAR_SURFACE_WIDTH: '--mdc-ripple-surface-width',
+  VAR_SURFACE_HEIGHT: '--mdc-ripple-surface-height',
+  VAR_FG_SIZE: '--mdc-ripple-fg-size',
+  VAR_LEFT: '--mdc-ripple-left',
+  VAR_TOP: '--mdc-ripple-top',
+  VAR_FG_SCALE: '--mdc-ripple-fg-scale',
+  VAR_FG_TRANSLATE_START: '--mdc-ripple-fg-translate-start',
+  VAR_FG_TRANSLATE_END: '--mdc-ripple-fg-translate-end'
+};
+
+var numbers = {
+  PADDING: 10,
+  INITIAL_ORIGIN_SCALE: 0.6,
+  DEACTIVATION_TIMEOUT_MS: 300,
+  FG_DEACTIVATION_MS: 83
+};
+
+/***/ }),
+
+/***/ 70:
+/***/ (function(module, __webpack_exports__, __webpack_require__) {
+
+"use strict";
+/* harmony import */ var __WEBPACK_IMPORTED_MODULE_0__material_base_foundation__ = __webpack_require__(0);
+/* harmony import */ var __WEBPACK_IMPORTED_MODULE_1__constants__ = __webpack_require__(69);
+var _extends = Object.assign || function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; };
+
+var _createClass = function () { function defineProperties(target, props) { for (var i = 0; i < props.length; i++) { var descriptor = props[i]; descriptor.enumerable = descriptor.enumerable || false; descriptor.configurable = true; if ("value" in descriptor) descriptor.writable = true; Object.defineProperty(target, descriptor.key, descriptor); } } return function (Constructor, protoProps, staticProps) { if (protoProps) defineProperties(Constructor.prototype, protoProps); if (staticProps) defineProperties(Constructor, staticProps); return Constructor; }; }();
+
+function _classCallCheck(instance, Constructor) { if (!(instance instanceof Constructor)) { throw new TypeError("Cannot call a class as a function"); } }
+
+function _possibleConstructorReturn(self, call) { if (!self) { throw new ReferenceError("this hasn't been initialised - super() hasn't been called"); } return call && (typeof call === "object" || typeof call === "function") ? call : self; }
+
+function _inherits(subClass, superClass) { if (typeof superClass !== "function" && superClass !== null) { throw new TypeError("Super expression must either be null or a function, not " + typeof superClass); } subClass.prototype = Object.create(superClass && superClass.prototype, { constructor: { value: subClass, enumerable: false, writable: true, configurable: true } }); if (superClass) Object.setPrototypeOf ? Object.setPrototypeOf(subClass, superClass) : subClass.__proto__ = superClass; }
+
+/**
+ * Copyright 2017 Google Inc. All Rights Reserved.
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *      http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+
+
+
+
+
+var MDCTabBarScrollerFoundation = function (_MDCFoundation) {
+  _inherits(MDCTabBarScrollerFoundation, _MDCFoundation);
+
+  _createClass(MDCTabBarScrollerFoundation, null, [{
+    key: 'cssClasses',
+    get: function get() {
+      return __WEBPACK_IMPORTED_MODULE_1__constants__["a" /* cssClasses */];
+    }
+  }, {
+    key: 'strings',
+    get: function get() {
+      return __WEBPACK_IMPORTED_MODULE_1__constants__["b" /* strings */];
+    }
+  }, {
+    key: 'defaultAdapter',
+    get: function get() {
+      return {
+        addClass: function addClass() /* className: string */{},
+        removeClass: function removeClass() /* className: string */{},
+        eventTargetHasClass: function eventTargetHasClass() {
+          return (/* target: EventTarget, className: string */ /* boolean */false
+          );
+        },
+        addClassToForwardIndicator: function addClassToForwardIndicator() /* className: string */{},
+        removeClassFromForwardIndicator: function removeClassFromForwardIndicator() /* className: string */{},
+        addClassToBackIndicator: function addClassToBackIndicator() /* className: string */{},
+        removeClassFromBackIndicator: function removeClassFromBackIndicator() /* className: string */{},
+        isRTL: function isRTL() {
+          return (/* boolean */false
+          );
+        },
+        registerBackIndicatorClickHandler: function registerBackIndicatorClickHandler() /* handler: EventListener */{},
+        deregisterBackIndicatorClickHandler: function deregisterBackIndicatorClickHandler() /* handler: EventListener */{},
+        registerForwardIndicatorClickHandler: function registerForwardIndicatorClickHandler() /* handler: EventListener */{},
+        deregisterForwardIndicatorClickHandler: function deregisterForwardIndicatorClickHandler() /* handler: EventListener */{},
+        registerCapturedInteractionHandler: function registerCapturedInteractionHandler() /* evt: string, handler: EventListener */{},
+        deregisterCapturedInteractionHandler: function deregisterCapturedInteractionHandler() /* evt: string, handler: EventListener */{},
+        registerWindowResizeHandler: function registerWindowResizeHandler() /* handler: EventListener */{},
+        deregisterWindowResizeHandler: function deregisterWindowResizeHandler() /* handler: EventListener */{},
+        getNumberOfTabs: function getNumberOfTabs() {
+          return (/* number */0
+          );
+        },
+        getComputedWidthForTabAtIndex: function getComputedWidthForTabAtIndex() {
+          return (/* number */0
+          );
+        },
+        getComputedLeftForTabAtIndex: function getComputedLeftForTabAtIndex() {
+          return (/* number */0
+          );
+        },
+        getOffsetWidthForScrollFrame: function getOffsetWidthForScrollFrame() {
+          return (/* number */0
+          );
+        },
+        getScrollLeftForScrollFrame: function getScrollLeftForScrollFrame() {
+          return (/* number */0
+          );
+        },
+        setScrollLeftForScrollFrame: function setScrollLeftForScrollFrame() /* scrollLeftAmount: number */{},
+        getOffsetWidthForTabBar: function getOffsetWidthForTabBar() {
+          return (/* number */0
+          );
+        },
+        setTransformStyleForTabBar: function setTransformStyleForTabBar() /* value: string */{},
+        getOffsetLeftForEventTarget: function getOffsetLeftForEventTarget() {
+          return (/* target: EventTarget */ /* number */0
+          );
+        },
+        getOffsetWidthForEventTarget: function getOffsetWidthForEventTarget() {
+          return (/* target: EventTarget */ /* number */0
+          );
+        }
+      };
+    }
+  }]);
+
+  function MDCTabBarScrollerFoundation(adapter) {
+    _classCallCheck(this, MDCTabBarScrollerFoundation);
+
+    var _this = _possibleConstructorReturn(this, (MDCTabBarScrollerFoundation.__proto__ || Object.getPrototypeOf(MDCTabBarScrollerFoundation)).call(this, _extends(MDCTabBarScrollerFoundation.defaultAdapter, adapter)));
+
+    _this.pointerDownRecognized_ = false;
+    _this.currentTranslateOffset_ = 0;
+    _this.focusedTarget_ = null;
+    _this.layoutFrame_ = 0;
+    _this.scrollFrameScrollLeft_ = 0;
+    _this.forwardIndicatorClickHandler_ = function (evt) {
+      return _this.scrollForward(evt);
+    };
+    _this.backIndicatorClickHandler_ = function (evt) {
+      return _this.scrollBack(evt);
+    };
+    _this.resizeHandler_ = function () {
+      return _this.layout();
+    };
+    _this.interactionHandler_ = function (evt) {
+      if (evt.type == 'touchstart' || evt.type == 'mousedown') {
+        _this.pointerDownRecognized_ = true;
+      }
+      _this.handlePossibleTabKeyboardFocus_(evt);
+
+      if (evt.type == 'focus') {
+        _this.pointerDownRecognized_ = false;
+      }
+    };
+    return _this;
+  }
+
+  _createClass(MDCTabBarScrollerFoundation, [{
+    key: 'init',
+    value: function init() {
+      var _this2 = this;
+
+      this.adapter_.registerBackIndicatorClickHandler(this.backIndicatorClickHandler_);
+      this.adapter_.registerForwardIndicatorClickHandler(this.forwardIndicatorClickHandler_);
+      this.adapter_.registerWindowResizeHandler(this.resizeHandler_);
+      ['touchstart', 'mousedown', 'focus'].forEach(function (evtType) {
+        _this2.adapter_.registerCapturedInteractionHandler(evtType, _this2.interactionHandler_);
+      });
+      this.layout();
+    }
+  }, {
+    key: 'destroy',
+    value: function destroy() {
+      var _this3 = this;
+
+      this.adapter_.deregisterBackIndicatorClickHandler(this.backIndicatorClickHandler_);
+      this.adapter_.deregisterForwardIndicatorClickHandler(this.forwardIndicatorClickHandler_);
+      this.adapter_.deregisterWindowResizeHandler(this.resizeHandler_);
+      ['touchstart', 'mousedown', 'focus'].forEach(function (evtType) {
+        _this3.adapter_.deregisterCapturedInteractionHandler(evtType, _this3.interactionHandler_);
+      });
+    }
+  }, {
+    key: 'scrollBack',
+    value: function scrollBack() {
+      var evt = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : null;
+
+      if (evt) {
+        evt.preventDefault();
+      }
+
+      var tabWidthAccumulator = 0;
+      var scrollTargetIndex = 0;
+
+      for (var i = this.adapter_.getNumberOfTabs() - 1; i > 0; i--) {
+        var tabOffsetLeft = this.adapter_.getComputedLeftForTabAtIndex(i);
+        var tabBarWidthLessTabOffsetLeft = this.adapter_.getOffsetWidthForTabBar() - tabOffsetLeft;
+
+        var tabIsNotOccluded = tabOffsetLeft > this.currentTranslateOffset_;
+        if (this.isRTL_()) {
+          tabIsNotOccluded = tabBarWidthLessTabOffsetLeft > this.currentTranslateOffset_;
+        }
+
+        if (tabIsNotOccluded) {
+          continue;
+        }
+
+        tabWidthAccumulator += this.adapter_.getComputedWidthForTabAtIndex(i);
+
+        var scrollTargetDetermined = tabWidthAccumulator > this.adapter_.getOffsetWidthForScrollFrame();
+        if (scrollTargetDetermined) {
+          scrollTargetIndex = this.isRTL_() ? i + 1 : i;
+          break;
+        }
+      }
+
+      this.scrollToTabAtIndex_(scrollTargetIndex);
+    }
+  }, {
+    key: 'scrollForward',
+    value: function scrollForward() {
+      var evt = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : null;
+
+      if (evt) {
+        evt.preventDefault();
+      }
+
+      var scrollFrameOffsetWidth = this.adapter_.getOffsetWidthForScrollFrame() + this.currentTranslateOffset_;
+      var scrollTargetIndex = 0;
+
+      for (var i = 0; i < this.adapter_.getNumberOfTabs(); i++) {
+        var tabOffsetLeftAndWidth = this.adapter_.getComputedLeftForTabAtIndex(i) + this.adapter_.getComputedWidthForTabAtIndex(i);
+        var scrollTargetDetermined = tabOffsetLeftAndWidth > scrollFrameOffsetWidth;
+
+        if (this.isRTL_()) {
+          var frameOffsetAndTabWidth = scrollFrameOffsetWidth - this.adapter_.getComputedWidthForTabAtIndex(i);
+          var _tabOffsetLeftAndWidth = this.adapter_.getComputedLeftForTabAtIndex(i) + this.adapter_.getComputedWidthForTabAtIndex(i);
+          var tabRightOffset = this.adapter_.getOffsetWidthForTabBar() - _tabOffsetLeftAndWidth;
+
+          scrollTargetDetermined = tabRightOffset > frameOffsetAndTabWidth;
+        }
+
+        if (scrollTargetDetermined) {
+          scrollTargetIndex = i;
+          break;
+        }
+      }
+
+      this.scrollToTabAtIndex_(scrollTargetIndex);
+    }
+  }, {
+    key: 'layout',
+    value: function layout() {
+      var _this4 = this;
+
+      cancelAnimationFrame(this.layoutFrame_);
+      this.scrollFrameScrollLeft_ = this.adapter_.getScrollLeftForScrollFrame();
+      this.layoutFrame_ = requestAnimationFrame(function () {
+        return _this4.layout_();
+      });
+    }
+  }, {
+    key: 'isRTL_',
+    value: function isRTL_() {
+      return this.adapter_.isRTL();
+    }
+  }, {
+    key: 'handlePossibleTabKeyboardFocus_',
+    value: function handlePossibleTabKeyboardFocus_(evt) {
+      if (!this.adapter_.eventTargetHasClass(evt.target, __WEBPACK_IMPORTED_MODULE_1__constants__["a" /* cssClasses */].TAB) || this.pointerDownRecognized_) {
+        return;
+      }
+
+      var resetAmt = this.isRTL_() ? this.scrollFrameScrollLeft_ : 0;
+      this.adapter_.setScrollLeftForScrollFrame(resetAmt);
+
+      this.focusedTarget_ = evt.target;
+      var scrollFrameWidth = this.adapter_.getOffsetWidthForScrollFrame();
+      var tabBarWidth = this.adapter_.getOffsetWidthForTabBar();
+      var leftEdge = this.adapter_.getOffsetLeftForEventTarget(this.focusedTarget_);
+      var rightEdge = leftEdge + this.adapter_.getOffsetWidthForEventTarget(this.focusedTarget_);
+
+      var shouldScrollBack = rightEdge <= this.currentTranslateOffset_;
+      var shouldScrollForward = rightEdge > this.currentTranslateOffset_ + scrollFrameWidth;
+
+      if (this.isRTL_()) {
+        var normalizedLeftOffset = tabBarWidth - leftEdge;
+        shouldScrollBack = leftEdge >= tabBarWidth - this.currentTranslateOffset_;
+        shouldScrollForward = normalizedLeftOffset > scrollFrameWidth + this.currentTranslateOffset_;
+      }
+
+      if (shouldScrollForward) {
+        this.scrollForward();
+      } else if (shouldScrollBack) {
+        this.scrollBack();
+      }
+
+      this.pointerDownRecognized_ = false;
+    }
+  }, {
+    key: 'layout_',
+    value: function layout_() {
+      var frameWidth = this.adapter_.getOffsetWidthForScrollFrame();
+      var isOverflowing = this.adapter_.getOffsetWidthForTabBar() > frameWidth;
+
+      if (!isOverflowing) {
+        this.currentTranslateOffset_ = 0;
+      }
+
+      this.shiftFrame_();
+      this.updateIndicatorEnabledStates_();
+    }
+  }, {
+    key: 'scrollToTabAtIndex_',
+    value: function scrollToTabAtIndex_(index) {
+      var _this5 = this;
+
+      var scrollTargetOffsetLeft = this.adapter_.getComputedLeftForTabAtIndex(index);
+      var scrollTargetOffsetWidth = this.adapter_.getComputedWidthForTabAtIndex(index);
+
+      this.currentTranslateOffset_ = this.normalizeForRTL_(scrollTargetOffsetLeft, scrollTargetOffsetWidth);
+
+      requestAnimationFrame(function () {
+        return _this5.shiftFrame_();
+      });
+    }
+  }, {
+    key: 'normalizeForRTL_',
+    value: function normalizeForRTL_(left, width) {
+      return this.isRTL_() ? this.adapter_.getOffsetWidthForTabBar() - (left + width) : left;
+    }
+  }, {
+    key: 'shiftFrame_',
+    value: function shiftFrame_() {
+      var shiftAmount = this.isRTL_() ? this.currentTranslateOffset_ : -this.currentTranslateOffset_;
+
+      this.adapter_.setTransformStyleForTabBar('translateX(' + shiftAmount + 'px)');
+      this.updateIndicatorEnabledStates_();
+    }
+  }, {
+    key: 'updateIndicatorEnabledStates_',
+    value: function updateIndicatorEnabledStates_() {
+      var INDICATOR_ENABLED = __WEBPACK_IMPORTED_MODULE_1__constants__["a" /* cssClasses */].INDICATOR_ENABLED;
+
+      if (this.currentTranslateOffset_ === 0) {
+        this.adapter_.removeClassFromBackIndicator(INDICATOR_ENABLED);
+      } else {
+        this.adapter_.addClassToBackIndicator(INDICATOR_ENABLED);
+      }
+
+      var remainingTabBarWidth = this.adapter_.getOffsetWidthForTabBar() - this.currentTranslateOffset_;
+      if (remainingTabBarWidth > this.adapter_.getOffsetWidthForScrollFrame()) {
+        this.adapter_.addClassToForwardIndicator(INDICATOR_ENABLED);
+      } else {
+        this.adapter_.removeClassFromForwardIndicator(INDICATOR_ENABLED);
+      }
+    }
+  }]);
+
+  return MDCTabBarScrollerFoundation;
+}(__WEBPACK_IMPORTED_MODULE_0__material_base_foundation__["a" /* default */]);
+
+/* harmony default export */ __webpack_exports__["a"] = (MDCTabBarScrollerFoundation);
+
+/***/ }),
+
+/***/ 71:
+/***/ (function(module, __webpack_exports__, __webpack_require__) {
+
+"use strict";
+/* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, "b", function() { return MDCTabBarScroller; });
+/* harmony import */ var __WEBPACK_IMPORTED_MODULE_0__material_animation__ = __webpack_require__(9);
+/* harmony import */ var __WEBPACK_IMPORTED_MODULE_1__material_base_component__ = __webpack_require__(1);
+/* harmony import */ var __WEBPACK_IMPORTED_MODULE_2__tab_bar__ = __webpack_require__(19);
+/* harmony import */ var __WEBPACK_IMPORTED_MODULE_3__foundation__ = __webpack_require__(70);
+/* harmony reexport (binding) */ __webpack_require__.d(__webpack_exports__, "a", function() { return __WEBPACK_IMPORTED_MODULE_3__foundation__["a"]; });
+var _createClass = function () { function defineProperties(target, props) { for (var i = 0; i < props.length; i++) { var descriptor = props[i]; descriptor.enumerable = descriptor.enumerable || false; descriptor.configurable = true; if ("value" in descriptor) descriptor.writable = true; Object.defineProperty(target, descriptor.key, descriptor); } } return function (Constructor, protoProps, staticProps) { if (protoProps) defineProperties(Constructor.prototype, protoProps); if (staticProps) defineProperties(Constructor, staticProps); return Constructor; }; }();
+
+function _classCallCheck(instance, Constructor) { if (!(instance instanceof Constructor)) { throw new TypeError("Cannot call a class as a function"); } }
+
+function _possibleConstructorReturn(self, call) { if (!self) { throw new ReferenceError("this hasn't been initialised - super() hasn't been called"); } return call && (typeof call === "object" || typeof call === "function") ? call : self; }
+
+function _inherits(subClass, superClass) { if (typeof superClass !== "function" && superClass !== null) { throw new TypeError("Super expression must either be null or a function, not " + typeof superClass); } subClass.prototype = Object.create(superClass && superClass.prototype, { constructor: { value: subClass, enumerable: false, writable: true, configurable: true } }); if (superClass) Object.setPrototypeOf ? Object.setPrototypeOf(subClass, superClass) : subClass.__proto__ = superClass; }
+
+/**
+ * Copyright 2017 Google Inc. All Rights Reserved.
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *      http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+
+
+
+
+
+
+
+
+
+var MDCTabBarScroller = function (_MDCComponent) {
+  _inherits(MDCTabBarScroller, _MDCComponent);
+
+  function MDCTabBarScroller() {
+    _classCallCheck(this, MDCTabBarScroller);
+
+    return _possibleConstructorReturn(this, (MDCTabBarScroller.__proto__ || Object.getPrototypeOf(MDCTabBarScroller)).apply(this, arguments));
+  }
+
+  _createClass(MDCTabBarScroller, [{
+    key: 'initialize',
+    value: function initialize() {
+      var tabBarFactory = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : function (root) {
+        return new __WEBPACK_IMPORTED_MODULE_2__tab_bar__["b" /* MDCTabBar */](root);
+      };
+
+      this.scrollFrame_ = this.root_.querySelector(__WEBPACK_IMPORTED_MODULE_3__foundation__["a" /* default */].strings.FRAME_SELECTOR);
+      this.tabBarEl_ = this.root_.querySelector(__WEBPACK_IMPORTED_MODULE_3__foundation__["a" /* default */].strings.TABS_SELECTOR);
+      this.forwardIndicator_ = this.root_.querySelector(__WEBPACK_IMPORTED_MODULE_3__foundation__["a" /* default */].strings.INDICATOR_FORWARD_SELECTOR);
+      this.backIndicator_ = this.root_.querySelector(__WEBPACK_IMPORTED_MODULE_3__foundation__["a" /* default */].strings.INDICATOR_BACK_SELECTOR);
+      this.tabBar_ = tabBarFactory(this.tabBarEl_);
+    }
+  }, {
+    key: 'getDefaultFoundation',
+    value: function getDefaultFoundation() {
+      var _this2 = this;
+
+      return new __WEBPACK_IMPORTED_MODULE_3__foundation__["a" /* default */]({
+        addClass: function addClass(className) {
+          return _this2.root_.classList.add(className);
+        },
+        removeClass: function removeClass(className) {
+          return _this2.root_.classList.remove(className);
+        },
+        eventTargetHasClass: function eventTargetHasClass(target, className) {
+          return target.classList.contains(className);
+        },
+        addClassToForwardIndicator: function addClassToForwardIndicator(className) {
+          return _this2.forwardIndicator_.classList.add(className);
+        },
+        removeClassFromForwardIndicator: function removeClassFromForwardIndicator(className) {
+          return _this2.forwardIndicator_.classList.remove(className);
+        },
+        addClassToBackIndicator: function addClassToBackIndicator(className) {
+          return _this2.backIndicator_.classList.add(className);
+        },
+        removeClassFromBackIndicator: function removeClassFromBackIndicator(className) {
+          return _this2.backIndicator_.classList.remove(className);
+        },
+        isRTL: function isRTL() {
+          return getComputedStyle(_this2.root_).getPropertyValue('direction') === 'rtl';
+        },
+        registerBackIndicatorClickHandler: function registerBackIndicatorClickHandler(handler) {
+          return _this2.backIndicator_.addEventListener('click', handler);
+        },
+        deregisterBackIndicatorClickHandler: function deregisterBackIndicatorClickHandler(handler) {
+          return _this2.backIndicator_.removeEventListener('click', handler);
+        },
+        registerForwardIndicatorClickHandler: function registerForwardIndicatorClickHandler(handler) {
+          return _this2.forwardIndicator_.addEventListener('click', handler);
+        },
+        deregisterForwardIndicatorClickHandler: function deregisterForwardIndicatorClickHandler(handler) {
+          return _this2.forwardIndicator_.removeEventListener('click', handler);
+        },
+        registerCapturedInteractionHandler: function registerCapturedInteractionHandler(evt, handler) {
+          return _this2.root_.addEventListener(evt, handler, true);
+        },
+        deregisterCapturedInteractionHandler: function deregisterCapturedInteractionHandler(evt, handler) {
+          return _this2.root_.removeEventListener(evt, handler, true);
+        },
+        registerWindowResizeHandler: function registerWindowResizeHandler(handler) {
+          return window.addEventListener('resize', handler);
+        },
+        deregisterWindowResizeHandler: function deregisterWindowResizeHandler(handler) {
+          return window.removeEventListener('resize', handler);
+        },
+        getNumberOfTabs: function getNumberOfTabs() {
+          return _this2.tabBar.tabs.length;
+        },
+        getComputedWidthForTabAtIndex: function getComputedWidthForTabAtIndex(index) {
+          return _this2.tabBar.tabs[index].computedWidth;
+        },
+        getComputedLeftForTabAtIndex: function getComputedLeftForTabAtIndex(index) {
+          return _this2.tabBar.tabs[index].computedLeft;
+        },
+        getOffsetWidthForScrollFrame: function getOffsetWidthForScrollFrame() {
+          return _this2.scrollFrame_.offsetWidth;
+        },
+        getScrollLeftForScrollFrame: function getScrollLeftForScrollFrame() {
+          return _this2.scrollFrame_.scrollLeft;
+        },
+        setScrollLeftForScrollFrame: function setScrollLeftForScrollFrame(scrollLeftAmount) {
+          return _this2.scrollFrame_.scrollLeft = scrollLeftAmount;
+        },
+        getOffsetWidthForTabBar: function getOffsetWidthForTabBar() {
+          return _this2.tabBarEl_.offsetWidth;
+        },
+        setTransformStyleForTabBar: function setTransformStyleForTabBar(value) {
+          _this2.tabBarEl_.style.setProperty(__webpack_require__.i(__WEBPACK_IMPORTED_MODULE_0__material_animation__["getCorrectPropertyName"])(window, 'transform'), value);
+        },
+        getOffsetLeftForEventTarget: function getOffsetLeftForEventTarget(target) {
+          return target.offsetLeft;
+        },
+        getOffsetWidthForEventTarget: function getOffsetWidthForEventTarget(target) {
+          return target.offsetWidth;
+        }
+      });
+    }
+  }, {
+    key: 'layout',
+    value: function layout() {
+      this.foundation_.layout();
+    }
+  }, {
+    key: 'tabBar',
+    get: function get() {
+      return this.tabBar_;
+    }
+  }], [{
+    key: 'attachTo',
+    value: function attachTo(root) {
+      return new MDCTabBarScroller(root);
+    }
+  }]);
+
+  return MDCTabBarScroller;
+}(__WEBPACK_IMPORTED_MODULE_1__material_base_component__["a" /* default */]);
+
+/***/ }),
+
+/***/ 72:
+/***/ (function(module, __webpack_exports__, __webpack_require__) {
+
+"use strict";
+/* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, "a", function() { return cssClasses; });
+/* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, "b", function() { return strings; });
+/**
+ * Copyright 2017 Google Inc. All Rights Reserved.
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *      http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+
+var cssClasses = {
+  UPGRADED: 'mdc-tab-bar-upgraded'
+};
+
+var strings = {
+  TAB_SELECTOR: '.mdc-tab',
+  INDICATOR_SELECTOR: '.mdc-tab-bar__indicator',
+  CHANGE_EVENT: 'MDCTabBar:change'
+};
+
+/***/ }),
+
+/***/ 73:
+/***/ (function(module, __webpack_exports__, __webpack_require__) {
+
+"use strict";
+/* harmony import */ var __WEBPACK_IMPORTED_MODULE_0__material_base_foundation__ = __webpack_require__(0);
+/* harmony import */ var __WEBPACK_IMPORTED_MODULE_1__material_animation__ = __webpack_require__(9);
+/* harmony import */ var __WEBPACK_IMPORTED_MODULE_2__constants__ = __webpack_require__(72);
+var _extends = Object.assign || function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; };
+
+var _createClass = function () { function defineProperties(target, props) { for (var i = 0; i < props.length; i++) { var descriptor = props[i]; descriptor.enumerable = descriptor.enumerable || false; descriptor.configurable = true; if ("value" in descriptor) descriptor.writable = true; Object.defineProperty(target, descriptor.key, descriptor); } } return function (Constructor, protoProps, staticProps) { if (protoProps) defineProperties(Constructor.prototype, protoProps); if (staticProps) defineProperties(Constructor, staticProps); return Constructor; }; }();
+
+function _classCallCheck(instance, Constructor) { if (!(instance instanceof Constructor)) { throw new TypeError("Cannot call a class as a function"); } }
+
+function _possibleConstructorReturn(self, call) { if (!self) { throw new ReferenceError("this hasn't been initialised - super() hasn't been called"); } return call && (typeof call === "object" || typeof call === "function") ? call : self; }
+
+function _inherits(subClass, superClass) { if (typeof superClass !== "function" && superClass !== null) { throw new TypeError("Super expression must either be null or a function, not " + typeof superClass); } subClass.prototype = Object.create(superClass && superClass.prototype, { constructor: { value: subClass, enumerable: false, writable: true, configurable: true } }); if (superClass) Object.setPrototypeOf ? Object.setPrototypeOf(subClass, superClass) : subClass.__proto__ = superClass; }
+
+/**
+ * Copyright 2017 Google Inc. All Rights Reserved.
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *      http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+
+
+
+
+
+
+var MDCTabBarFoundation = function (_MDCFoundation) {
+  _inherits(MDCTabBarFoundation, _MDCFoundation);
+
+  _createClass(MDCTabBarFoundation, null, [{
+    key: 'cssClasses',
+    get: function get() {
+      return __WEBPACK_IMPORTED_MODULE_2__constants__["a" /* cssClasses */];
+    }
+  }, {
+    key: 'strings',
+    get: function get() {
+      return __WEBPACK_IMPORTED_MODULE_2__constants__["b" /* strings */];
+    }
+  }, {
+    key: 'defaultAdapter',
+    get: function get() {
+      return {
+        addClass: function addClass() /* className: string */{},
+        removeClass: function removeClass() /* className: string */{},
+        bindOnMDCTabSelectedEvent: function bindOnMDCTabSelectedEvent() {},
+        unbindOnMDCTabSelectedEvent: function unbindOnMDCTabSelectedEvent() {},
+        registerResizeHandler: function registerResizeHandler() /* handler: EventListener */{},
+        deregisterResizeHandler: function deregisterResizeHandler() /* handler: EventListener */{},
+        getOffsetWidth: function getOffsetWidth() {
+          return (/* number */0
+          );
+        },
+        setStyleForIndicator: function setStyleForIndicator() /* propertyName: string, value: string */{},
+        getOffsetWidthForIndicator: function getOffsetWidthForIndicator() {
+          return (/* number */0
+          );
+        },
+        notifyChange: function notifyChange() /* evtData: {activeTabIndex: number} */{},
+        getNumberOfTabs: function getNumberOfTabs() {
+          return (/* number */0
+          );
+        },
+        isTabActiveAtIndex: function isTabActiveAtIndex() {
+          return (/* index: number */ /* boolean */false
+          );
+        },
+        setTabActiveAtIndex: function setTabActiveAtIndex() /* index: number, isActive: true */{},
+        isDefaultPreventedOnClickForTabAtIndex: function isDefaultPreventedOnClickForTabAtIndex() {
+          return (/* index: number */ /* boolean */false
+          );
+        },
+        setPreventDefaultOnClickForTabAtIndex: function setPreventDefaultOnClickForTabAtIndex() /* index: number, preventDefaultOnClick: boolean */{},
+        measureTabAtIndex: function measureTabAtIndex() /* index: number */{},
+        getComputedWidthForTabAtIndex: function getComputedWidthForTabAtIndex() {
+          return (/* index: number */ /* number */0
+          );
+        },
+        getComputedLeftForTabAtIndex: function getComputedLeftForTabAtIndex() {
+          return (/* index: number */ /* number */0
+          );
+        }
+      };
+    }
+  }]);
+
+  function MDCTabBarFoundation(adapter) {
+    _classCallCheck(this, MDCTabBarFoundation);
+
+    var _this = _possibleConstructorReturn(this, (MDCTabBarFoundation.__proto__ || Object.getPrototypeOf(MDCTabBarFoundation)).call(this, _extends(MDCTabBarFoundation.defaultAdapter, adapter)));
+
+    _this.isIndicatorShown_ = false;
+    _this.computedWidth_ = 0;
+    _this.computedLeft_ = 0;
+    _this.activeTabIndex_ = 0;
+    _this.layoutFrame_ = 0;
+    _this.resizeHandler_ = function () {
+      return _this.layout();
+    };
+    return _this;
+  }
+
+  _createClass(MDCTabBarFoundation, [{
+    key: 'init',
+    value: function init() {
+      this.adapter_.addClass(__WEBPACK_IMPORTED_MODULE_2__constants__["a" /* cssClasses */].UPGRADED);
+      this.adapter_.bindOnMDCTabSelectedEvent();
+      this.adapter_.registerResizeHandler(this.resizeHandler_);
+      var activeTabIndex = this.findActiveTabIndex_();
+      if (activeTabIndex >= 0) {
+        this.activeTabIndex_ = activeTabIndex;
+      }
+      this.layout();
+    }
+  }, {
+    key: 'destroy',
+    value: function destroy() {
+      this.adapter_.removeClass(__WEBPACK_IMPORTED_MODULE_2__constants__["a" /* cssClasses */].UPGRADED);
+      this.adapter_.unbindOnMDCTabSelectedEvent();
+      this.adapter_.deregisterResizeHandler(this.resizeHandler_);
+    }
+  }, {
+    key: 'layoutInternal_',
+    value: function layoutInternal_() {
+      var _this2 = this;
+
+      this.forEachTabIndex_(function (index) {
+        return _this2.adapter_.measureTabAtIndex(index);
+      });
+      this.computedWidth_ = this.adapter_.getOffsetWidth();
+      this.layoutIndicator_();
+    }
+  }, {
+    key: 'layoutIndicator_',
+    value: function layoutIndicator_() {
+      var isIndicatorFirstRender = !this.isIndicatorShown_;
+
+      // Ensure that indicator appears in the right position immediately for correct first render.
+      if (isIndicatorFirstRender) {
+        this.adapter_.setStyleForIndicator('transition', 'none');
+      }
+
+      var translateAmtForActiveTabLeft = this.adapter_.getComputedLeftForTabAtIndex(this.activeTabIndex_);
+      var scaleAmtForActiveTabWidth = this.adapter_.getComputedWidthForTabAtIndex(this.activeTabIndex_) / this.adapter_.getOffsetWidth();
+
+      var transformValue = 'translateX(' + translateAmtForActiveTabLeft + 'px) scale(' + scaleAmtForActiveTabWidth + ', 1)';
+      this.adapter_.setStyleForIndicator(__webpack_require__.i(__WEBPACK_IMPORTED_MODULE_1__material_animation__["getCorrectPropertyName"])(window, 'transform'), transformValue);
+
+      if (isIndicatorFirstRender) {
+        // Force layout so that transform styles to take effect.
+        this.adapter_.getOffsetWidthForIndicator();
+        this.adapter_.setStyleForIndicator('transition', '');
+        this.adapter_.setStyleForIndicator('visibility', 'visible');
+        this.isIndicatorShown_ = true;
+      }
+    }
+  }, {
+    key: 'findActiveTabIndex_',
+    value: function findActiveTabIndex_() {
+      var _this3 = this;
+
+      var activeTabIndex = -1;
+      this.forEachTabIndex_(function (index) {
+        if (_this3.adapter_.isTabActiveAtIndex(index)) {
+          activeTabIndex = index;
+          return true;
+        }
+      });
+      return activeTabIndex;
+    }
+  }, {
+    key: 'forEachTabIndex_',
+    value: function forEachTabIndex_(iterator) {
+      var numTabs = this.adapter_.getNumberOfTabs();
+      for (var index = 0; index < numTabs; index++) {
+        var shouldBreak = iterator(index);
+        if (shouldBreak) {
+          break;
+        }
+      }
+    }
+  }, {
+    key: 'layout',
+    value: function layout() {
+      var _this4 = this;
+
+      if (this.layoutFrame_) {
+        cancelAnimationFrame(this.layoutFrame_);
+      }
+
+      this.layoutFrame_ = requestAnimationFrame(function () {
+        _this4.layoutInternal_();
+        _this4.layoutFrame_ = 0;
+      });
+    }
+  }, {
+    key: 'switchToTabAtIndex',
+    value: function switchToTabAtIndex(index, shouldNotify) {
+      var _this5 = this;
+
+      if (index === this.activeTabIndex_) {
+        return;
+      }
+
+      if (index < 0 || index >= this.adapter_.getNumberOfTabs()) {
+        throw new Error('Out of bounds index specified for tab: ' + index);
+      }
+
+      var prevActiveTabIndex = this.activeTabIndex_;
+      this.activeTabIndex_ = index;
+      requestAnimationFrame(function () {
+        if (prevActiveTabIndex >= 0) {
+          _this5.adapter_.setTabActiveAtIndex(prevActiveTabIndex, false);
+        }
+        _this5.adapter_.setTabActiveAtIndex(_this5.activeTabIndex_, true);
+        _this5.layoutIndicator_();
+        if (shouldNotify) {
+          _this5.adapter_.notifyChange({ activeTabIndex: _this5.activeTabIndex_ });
+        }
+      });
+    }
+  }, {
+    key: 'getActiveTabIndex',
+    value: function getActiveTabIndex() {
+      return this.findActiveTabIndex_();
+    }
+  }]);
+
+  return MDCTabBarFoundation;
+}(__WEBPACK_IMPORTED_MODULE_0__material_base_foundation__["a" /* default */]);
+
+/* harmony default export */ __webpack_exports__["a"] = (MDCTabBarFoundation);
+
+/***/ }),
+
+/***/ 74:
+/***/ (function(module, __webpack_exports__, __webpack_require__) {
+
+"use strict";
+/* harmony import */ var __WEBPACK_IMPORTED_MODULE_0__material_base_foundation__ = __webpack_require__(0);
+/* harmony import */ var __WEBPACK_IMPORTED_MODULE_1__constants__ = __webpack_require__(20);
+var _extends = Object.assign || function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; };
+
+var _createClass = function () { function defineProperties(target, props) { for (var i = 0; i < props.length; i++) { var descriptor = props[i]; descriptor.enumerable = descriptor.enumerable || false; descriptor.configurable = true; if ("value" in descriptor) descriptor.writable = true; Object.defineProperty(target, descriptor.key, descriptor); } } return function (Constructor, protoProps, staticProps) { if (protoProps) defineProperties(Constructor.prototype, protoProps); if (staticProps) defineProperties(Constructor, staticProps); return Constructor; }; }();
+
+function _classCallCheck(instance, Constructor) { if (!(instance instanceof Constructor)) { throw new TypeError("Cannot call a class as a function"); } }
+
+function _possibleConstructorReturn(self, call) { if (!self) { throw new ReferenceError("this hasn't been initialised - super() hasn't been called"); } return call && (typeof call === "object" || typeof call === "function") ? call : self; }
+
+function _inherits(subClass, superClass) { if (typeof superClass !== "function" && superClass !== null) { throw new TypeError("Super expression must either be null or a function, not " + typeof superClass); } subClass.prototype = Object.create(superClass && superClass.prototype, { constructor: { value: subClass, enumerable: false, writable: true, configurable: true } }); if (superClass) Object.setPrototypeOf ? Object.setPrototypeOf(subClass, superClass) : subClass.__proto__ = superClass; }
+
+/**
+ * Copyright 2017 Google Inc. All Rights Reserved.
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *      http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+
+
+
+
+var MDCTabFoundation = function (_MDCFoundation) {
+  _inherits(MDCTabFoundation, _MDCFoundation);
+
+  _createClass(MDCTabFoundation, null, [{
+    key: 'cssClasses',
+    get: function get() {
+      return __WEBPACK_IMPORTED_MODULE_1__constants__["a" /* cssClasses */];
+    }
+  }, {
+    key: 'strings',
+    get: function get() {
+      return __WEBPACK_IMPORTED_MODULE_1__constants__["b" /* strings */];
+    }
+  }, {
+    key: 'defaultAdapter',
+    get: function get() {
+      return {
+        addClass: function addClass() /* className: string */{},
+        removeClass: function removeClass() /* className: string */{},
+        registerInteractionHandler: function registerInteractionHandler() /* type: string, handler: EventListener */{},
+        deregisterInteractionHandler: function deregisterInteractionHandler() /* type: string, handler: EventListener */{},
+        getOffsetWidth: function getOffsetWidth() {
+          return (/* number */0
+          );
+        },
+        getOffsetLeft: function getOffsetLeft() {
+          return (/* number */0
+          );
+        },
+        notifySelected: function notifySelected() {}
+      };
+    }
+  }]);
+
+  function MDCTabFoundation() {
+    var adapter = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : {};
+
+    _classCallCheck(this, MDCTabFoundation);
+
+    var _this = _possibleConstructorReturn(this, (MDCTabFoundation.__proto__ || Object.getPrototypeOf(MDCTabFoundation)).call(this, _extends(MDCTabFoundation.defaultAdapter, adapter)));
+
+    _this.computedWidth_ = 0;
+    _this.computedLeft_ = 0;
+    _this.isActive_ = false;
+    _this.preventDefaultOnClick_ = false;
+
+    _this.clickHandler_ = function (evt) {
+      if (_this.preventDefaultOnClick_) {
+        evt.preventDefault();
+      }
+      _this.adapter_.notifySelected();
+    };
+
+    _this.keydownHandler_ = function (evt) {
+      if (evt.key && evt.key === 'Enter' || evt.keyCode === 13) {
+        _this.adapter_.notifySelected();
+      }
+    };
+    return _this;
+  }
+
+  _createClass(MDCTabFoundation, [{
+    key: 'init',
+    value: function init() {
+      this.adapter_.registerInteractionHandler('click', this.clickHandler_);
+      this.adapter_.registerInteractionHandler('keydown', this.keydownHandler_);
+    }
+  }, {
+    key: 'destroy',
+    value: function destroy() {
+      this.adapter_.deregisterInteractionHandler('click', this.clickHandler_);
+      this.adapter_.deregisterInteractionHandler('keydown', this.keydownHandler_);
+    }
+  }, {
+    key: 'getComputedWidth',
+    value: function getComputedWidth() {
+      return this.computedWidth_;
+    }
+  }, {
+    key: 'getComputedLeft',
+    value: function getComputedLeft() {
+      return this.computedLeft_;
+    }
+  }, {
+    key: 'isActive',
+    value: function isActive() {
+      return this.isActive_;
+    }
+  }, {
+    key: 'setActive',
+    value: function setActive(isActive) {
+      this.isActive_ = isActive;
+      if (this.isActive_) {
+        this.adapter_.addClass(__WEBPACK_IMPORTED_MODULE_1__constants__["a" /* cssClasses */].ACTIVE);
+      } else {
+        this.adapter_.removeClass(__WEBPACK_IMPORTED_MODULE_1__constants__["a" /* cssClasses */].ACTIVE);
+      }
+    }
+  }, {
+    key: 'preventsDefaultOnClick',
+    value: function preventsDefaultOnClick() {
+      return this.preventDefaultOnClick_;
+    }
+  }, {
+    key: 'setPreventDefaultOnClick',
+    value: function setPreventDefaultOnClick(preventDefaultOnClick) {
+      this.preventDefaultOnClick_ = preventDefaultOnClick;
+    }
+  }, {
+    key: 'measureSelf',
+    value: function measureSelf() {
+      this.computedWidth_ = this.adapter_.getOffsetWidth();
+      this.computedLeft_ = this.adapter_.getOffsetLeft();
+    }
+  }]);
+
+  return MDCTabFoundation;
+}(__WEBPACK_IMPORTED_MODULE_0__material_base_foundation__["a" /* default */]);
+
+/* harmony default export */ __webpack_exports__["a"] = (MDCTabFoundation);
+
+/***/ }),
+
+/***/ 8:
+/***/ (function(module, __webpack_exports__, __webpack_require__) {
+
+"use strict";
+/* harmony import */ var __WEBPACK_IMPORTED_MODULE_0__material_base_foundation__ = __webpack_require__(0);
+/* harmony import */ var __WEBPACK_IMPORTED_MODULE_1__adapter__ = __webpack_require__(4);
+/* harmony import */ var __WEBPACK_IMPORTED_MODULE_2__constants__ = __webpack_require__(7);
+/* harmony import */ var __WEBPACK_IMPORTED_MODULE_3__util__ = __webpack_require__(5);
+var _extends = Object.assign || function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; };
+
+var _createClass = function () { function defineProperties(target, props) { for (var i = 0; i < props.length; i++) { var descriptor = props[i]; descriptor.enumerable = descriptor.enumerable || false; descriptor.configurable = true; if ("value" in descriptor) descriptor.writable = true; Object.defineProperty(target, descriptor.key, descriptor); } } return function (Constructor, protoProps, staticProps) { if (protoProps) defineProperties(Constructor.prototype, protoProps); if (staticProps) defineProperties(Constructor, staticProps); return Constructor; }; }();
+
+function _classCallCheck(instance, Constructor) { if (!(instance instanceof Constructor)) { throw new TypeError("Cannot call a class as a function"); } }
+
+function _possibleConstructorReturn(self, call) { if (!self) { throw new ReferenceError("this hasn't been initialised - super() hasn't been called"); } return call && (typeof call === "object" || typeof call === "function") ? call : self; }
+
+function _inherits(subClass, superClass) { if (typeof superClass !== "function" && superClass !== null) { throw new TypeError("Super expression must either be null or a function, not " + typeof superClass); } subClass.prototype = Object.create(superClass && superClass.prototype, { constructor: { value: subClass, enumerable: false, writable: true, configurable: true } }); if (superClass) Object.setPrototypeOf ? Object.setPrototypeOf(subClass, superClass) : subClass.__proto__ = superClass; }
+
+/**
+ * Copyright 2016 Google Inc. All Rights Reserved.
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *      http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+
+
+
+
+
+
+/**
+ * @typedef {!{
+ *   isActivated: (boolean|undefined),
+ *   hasDeactivationUXRun: (boolean|undefined),
+ *   wasActivatedByPointer: (boolean|undefined),
+ *   wasElementMadeActive: (boolean|undefined),
+ *   activationStartTime: (number|undefined),
+ *   activationEvent: Event,
+ *   isProgrammatic: (boolean|undefined)
+ * }}
+ */
+var ActivationStateType = void 0;
+
+/**
+ * @typedef {!{
+ *   activate: (string|undefined),
+ *   deactivate: (string|undefined),
+ *   focus: (string|undefined),
+ *   blur: (string|undefined)
+ * }}
+ */
+var ListenerInfoType = void 0;
+
+/**
+ * @typedef {!{
+ *   activate: function(!Event),
+ *   deactivate: function(!Event),
+ *   focus: function(),
+ *   blur: function()
+ * }}
+ */
+var ListenersType = void 0;
+
+/**
+ * @typedef {!{
+ *   x: number,
+ *   y: number
+ * }}
+ */
+var PointType = void 0;
+
+/**
+ * @enum {string}
+ */
+var DEACTIVATION_ACTIVATION_PAIRS = {
+  mouseup: 'mousedown',
+  pointerup: 'pointerdown',
+  touchend: 'touchstart',
+  keyup: 'keydown',
+  blur: 'focus'
+};
+
+/**
+ * @extends {MDCFoundation<!MDCRippleAdapter>}
+ */
+
+var MDCRippleFoundation = function (_MDCFoundation) {
+  _inherits(MDCRippleFoundation, _MDCFoundation);
+
+  _createClass(MDCRippleFoundation, [{
+    key: 'isSupported_',
+
+
+    /**
+     * We compute this property so that we are not querying information about the client
+     * until the point in time where the foundation requests it. This prevents scenarios where
+     * client-side feature-detection may happen too early, such as when components are rendered on the server
+     * and then initialized at mount time on the client.
+     * @return {boolean}
+     */
+    get: function get() {
+      return this.adapter_.browserSupportsCssVars();
+    }
+  }], [{
+    key: 'cssClasses',
+    get: function get() {
+      return __WEBPACK_IMPORTED_MODULE_2__constants__["a" /* cssClasses */];
+    }
+  }, {
+    key: 'strings',
+    get: function get() {
+      return __WEBPACK_IMPORTED_MODULE_2__constants__["b" /* strings */];
+    }
+  }, {
+    key: 'numbers',
+    get: function get() {
+      return __WEBPACK_IMPORTED_MODULE_2__constants__["c" /* numbers */];
+    }
+  }, {
+    key: 'defaultAdapter',
+    get: function get() {
+      return {
+        browserSupportsCssVars: function browserSupportsCssVars() /* boolean - cached */{},
+        isUnbounded: function isUnbounded() /* boolean */{},
+        isSurfaceActive: function isSurfaceActive() /* boolean */{},
+        isSurfaceDisabled: function isSurfaceDisabled() /* boolean */{},
+        addClass: function addClass() /* className: string */{},
+        removeClass: function removeClass() /* className: string */{},
+        registerInteractionHandler: function registerInteractionHandler() /* evtType: string, handler: EventListener */{},
+        deregisterInteractionHandler: function deregisterInteractionHandler() /* evtType: string, handler: EventListener */{},
+        registerResizeHandler: function registerResizeHandler() /* handler: EventListener */{},
+        deregisterResizeHandler: function deregisterResizeHandler() /* handler: EventListener */{},
+        updateCssVariable: function updateCssVariable() /* varName: string, value: string */{},
+        computeBoundingRect: function computeBoundingRect() /* ClientRect */{},
+        getWindowPageOffset: function getWindowPageOffset() /* {x: number, y: number} */{}
+      };
+    }
+  }]);
+
+  function MDCRippleFoundation(adapter) {
+    _classCallCheck(this, MDCRippleFoundation);
+
+    /** @private {number} */
+    var _this = _possibleConstructorReturn(this, (MDCRippleFoundation.__proto__ || Object.getPrototypeOf(MDCRippleFoundation)).call(this, _extends(MDCRippleFoundation.defaultAdapter, adapter)));
+
+    _this.layoutFrame_ = 0;
+
+    /** @private {!ClientRect} */
+    _this.frame_ = /** @type {!ClientRect} */{ width: 0, height: 0 };
+
+    /** @private {!ActivationStateType} */
+    _this.activationState_ = _this.defaultActivationState_();
+
+    /** @private {number} */
+    _this.xfDuration_ = 0;
+
+    /** @private {number} */
+    _this.initialSize_ = 0;
+
+    /** @private {number} */
+    _this.maxRadius_ = 0;
+
+    /** @private {!Array<{ListenerInfoType}>} */
+    _this.listenerInfos_ = [{ activate: 'touchstart', deactivate: 'touchend' }, { activate: 'pointerdown', deactivate: 'pointerup' }, { activate: 'mousedown', deactivate: 'mouseup' }, { activate: 'keydown', deactivate: 'keyup' }, { focus: 'focus', blur: 'blur' }];
+
+    /** @private {!ListenersType} */
+    _this.listeners_ = {
+      activate: function activate(e) {
+        return _this.activate_(e);
+      },
+      deactivate: function deactivate(e) {
+        return _this.deactivate_(e);
+      },
+      focus: function focus() {
+        return requestAnimationFrame(function () {
+          return _this.adapter_.addClass(MDCRippleFoundation.cssClasses.BG_FOCUSED);
+        });
+      },
+      blur: function blur() {
+        return requestAnimationFrame(function () {
+          return _this.adapter_.removeClass(MDCRippleFoundation.cssClasses.BG_FOCUSED);
+        });
+      }
+    };
+
+    /** @private {!Function} */
+    _this.resizeHandler_ = function () {
+      return _this.layout();
+    };
+
+    /** @private {!{left: number, top:number}} */
+    _this.unboundedCoords_ = {
+      left: 0,
+      top: 0
+    };
+
+    /** @private {number} */
+    _this.fgScale_ = 0;
+
+    /** @private {number} */
+    _this.activationTimer_ = 0;
+
+    /** @private {number} */
+    _this.fgDeactivationRemovalTimer_ = 0;
+
+    /** @private {boolean} */
+    _this.activationAnimationHasEnded_ = false;
+
+    /** @private {!Function} */
+    _this.activationTimerCallback_ = function () {
+      _this.activationAnimationHasEnded_ = true;
+      _this.runDeactivationUXLogicIfReady_();
+    };
+    return _this;
+  }
+
+  /**
+   * @return {!ActivationStateType}
+   */
+
+
+  _createClass(MDCRippleFoundation, [{
+    key: 'defaultActivationState_',
+    value: function defaultActivationState_() {
+      return {
+        isActivated: false,
+        hasDeactivationUXRun: false,
+        wasActivatedByPointer: false,
+        wasElementMadeActive: false,
+        activationStartTime: 0,
+        activationEvent: null,
+        isProgrammatic: false
+      };
+    }
+  }, {
+    key: 'init',
+    value: function init() {
+      var _this2 = this;
+
+      if (!this.isSupported_) {
+        return;
+      }
+      this.addEventListeners_();
+
+      var _MDCRippleFoundation$ = MDCRippleFoundation.cssClasses,
+          ROOT = _MDCRippleFoundation$.ROOT,
+          UNBOUNDED = _MDCRippleFoundation$.UNBOUNDED;
+
+      requestAnimationFrame(function () {
+        _this2.adapter_.addClass(ROOT);
+        if (_this2.adapter_.isUnbounded()) {
+          _this2.adapter_.addClass(UNBOUNDED);
+        }
+        _this2.layoutInternal_();
+      });
+    }
+
+    /** @private */
+
+  }, {
+    key: 'addEventListeners_',
+    value: function addEventListeners_() {
+      var _this3 = this;
+
+      this.listenerInfos_.forEach(function (info) {
+        Object.keys(info).forEach(function (k) {
+          _this3.adapter_.registerInteractionHandler(info[k], _this3.listeners_[k]);
+        });
+      });
+      this.adapter_.registerResizeHandler(this.resizeHandler_);
+    }
+
+    /**
+     * @param {Event} e
+     * @private
+     */
+
+  }, {
+    key: 'activate_',
+    value: function activate_(e) {
+      var _this4 = this;
+
+      if (this.adapter_.isSurfaceDisabled()) {
+        return;
+      }
+
+      var activationState = this.activationState_;
+
+      if (activationState.isActivated) {
+        return;
+      }
+
+      activationState.isActivated = true;
+      activationState.isProgrammatic = e === null;
+      activationState.activationEvent = e;
+      activationState.wasActivatedByPointer = activationState.isProgrammatic ? false : e.type === 'mousedown' || e.type === 'touchstart' || e.type === 'pointerdown';
+      activationState.activationStartTime = Date.now();
+
+      requestAnimationFrame(function () {
+        // This needs to be wrapped in an rAF call b/c web browsers
+        // report active states inconsistently when they're called within
+        // event handling code:
+        // - https://bugs.chromium.org/p/chromium/issues/detail?id=635971
+        // - https://bugzilla.mozilla.org/show_bug.cgi?id=1293741
+        activationState.wasElementMadeActive = e && e.type === 'keydown' ? _this4.adapter_.isSurfaceActive() : true;
+        if (activationState.wasElementMadeActive) {
+          _this4.animateActivation_();
+        } else {
+          // Reset activation state immediately if element was not made active.
+          _this4.activationState_ = _this4.defaultActivationState_();
+        }
+      });
+    }
+  }, {
+    key: 'activate',
+    value: function activate() {
+      this.activate_(null);
+    }
+
+    /** @private */
+
+  }, {
+    key: 'animateActivation_',
+    value: function animateActivation_() {
+      var _this5 = this;
+
+      var _MDCRippleFoundation$2 = MDCRippleFoundation.strings,
+          VAR_FG_TRANSLATE_START = _MDCRippleFoundation$2.VAR_FG_TRANSLATE_START,
+          VAR_FG_TRANSLATE_END = _MDCRippleFoundation$2.VAR_FG_TRANSLATE_END;
+      var _MDCRippleFoundation$3 = MDCRippleFoundation.cssClasses,
+          BG_ACTIVE_FILL = _MDCRippleFoundation$3.BG_ACTIVE_FILL,
+          FG_DEACTIVATION = _MDCRippleFoundation$3.FG_DEACTIVATION,
+          FG_ACTIVATION = _MDCRippleFoundation$3.FG_ACTIVATION;
+      var DEACTIVATION_TIMEOUT_MS = MDCRippleFoundation.numbers.DEACTIVATION_TIMEOUT_MS;
+
+
+      var translateStart = '';
+      var translateEnd = '';
+
+      if (!this.adapter_.isUnbounded()) {
+        var _getFgTranslationCoor = this.getFgTranslationCoordinates_(),
+            startPoint = _getFgTranslationCoor.startPoint,
+            endPoint = _getFgTranslationCoor.endPoint;
+
+        translateStart = startPoint.x + 'px, ' + startPoint.y + 'px';
+        translateEnd = endPoint.x + 'px, ' + endPoint.y + 'px';
+      }
+
+      this.adapter_.updateCssVariable(VAR_FG_TRANSLATE_START, translateStart);
+      this.adapter_.updateCssVariable(VAR_FG_TRANSLATE_END, translateEnd);
+      // Cancel any ongoing activation/deactivation animations
+      clearTimeout(this.activationTimer_);
+      clearTimeout(this.fgDeactivationRemovalTimer_);
+      this.rmBoundedActivationClasses_();
+      this.adapter_.removeClass(FG_DEACTIVATION);
+
+      // Force layout in order to re-trigger the animation.
+      this.adapter_.computeBoundingRect();
+      this.adapter_.addClass(BG_ACTIVE_FILL);
+      this.adapter_.addClass(FG_ACTIVATION);
+      this.activationTimer_ = setTimeout(function () {
+        return _this5.activationTimerCallback_();
+      }, DEACTIVATION_TIMEOUT_MS);
+    }
+
+    /**
+     * @private
+     * @return {{startPoint: PointType, endPoint: PointType}}
+     */
+
+  }, {
+    key: 'getFgTranslationCoordinates_',
+    value: function getFgTranslationCoordinates_() {
+      var activationState = this.activationState_;
+      var activationEvent = activationState.activationEvent,
+          wasActivatedByPointer = activationState.wasActivatedByPointer;
+
+
+      var startPoint = void 0;
+      if (wasActivatedByPointer) {
+        startPoint = __webpack_require__.i(__WEBPACK_IMPORTED_MODULE_3__util__["getNormalizedEventCoords"])(
+        /** @type {!Event} */activationEvent, this.adapter_.getWindowPageOffset(), this.adapter_.computeBoundingRect());
+      } else {
+        startPoint = {
+          x: this.frame_.width / 2,
+          y: this.frame_.height / 2
+        };
+      }
+      // Center the element around the start point.
+      startPoint = {
+        x: startPoint.x - this.initialSize_ / 2,
+        y: startPoint.y - this.initialSize_ / 2
+      };
+
+      var endPoint = {
+        x: this.frame_.width / 2 - this.initialSize_ / 2,
+        y: this.frame_.height / 2 - this.initialSize_ / 2
+      };
+
+      return { startPoint: startPoint, endPoint: endPoint };
+    }
+
+    /** @private */
+
+  }, {
+    key: 'runDeactivationUXLogicIfReady_',
+    value: function runDeactivationUXLogicIfReady_() {
+      var _this6 = this;
+
+      var FG_DEACTIVATION = MDCRippleFoundation.cssClasses.FG_DEACTIVATION;
+      var _activationState_ = this.activationState_,
+          hasDeactivationUXRun = _activationState_.hasDeactivationUXRun,
+          isActivated = _activationState_.isActivated;
+
+      var activationHasEnded = hasDeactivationUXRun || !isActivated;
+      if (activationHasEnded && this.activationAnimationHasEnded_) {
+        this.rmBoundedActivationClasses_();
+        this.adapter_.addClass(FG_DEACTIVATION);
+        this.fgDeactivationRemovalTimer_ = setTimeout(function () {
+          _this6.adapter_.removeClass(FG_DEACTIVATION);
+        }, __WEBPACK_IMPORTED_MODULE_2__constants__["c" /* numbers */].FG_DEACTIVATION_MS);
+      }
+    }
+
+    /** @private */
+
+  }, {
+    key: 'rmBoundedActivationClasses_',
+    value: function rmBoundedActivationClasses_() {
+      var _MDCRippleFoundation$4 = MDCRippleFoundation.cssClasses,
+          BG_ACTIVE_FILL = _MDCRippleFoundation$4.BG_ACTIVE_FILL,
+          FG_ACTIVATION = _MDCRippleFoundation$4.FG_ACTIVATION;
+
+      this.adapter_.removeClass(BG_ACTIVE_FILL);
+      this.adapter_.removeClass(FG_ACTIVATION);
+      this.activationAnimationHasEnded_ = false;
+      this.adapter_.computeBoundingRect();
+    }
+
+    /**
+     * @param {Event} e
+     * @private
+     */
+
+  }, {
+    key: 'deactivate_',
+    value: function deactivate_(e) {
+      var _this7 = this;
+
+      var activationState = this.activationState_;
+      // This can happen in scenarios such as when you have a keyup event that blurs the element.
+
+      if (!activationState.isActivated) {
+        return;
+      }
+      // Programmatic deactivation.
+      if (activationState.isProgrammatic) {
+        var evtObject = null;
+        var _state = /** @type {!ActivationStateType} */_extends({}, activationState);
+        requestAnimationFrame(function () {
+          return _this7.animateDeactivation_(evtObject, _state);
+        });
+        this.activationState_ = this.defaultActivationState_();
+        return;
+      }
+
+      var actualActivationType = DEACTIVATION_ACTIVATION_PAIRS[e.type];
+      var expectedActivationType = activationState.activationEvent.type;
+      // NOTE: Pointer events are tricky - https://patrickhlauke.github.io/touch/tests/results/
+      // Essentially, what we need to do here is decouple the deactivation UX from the actual
+      // deactivation state itself. This way, touch/pointer events in sequence do not trample one
+      // another.
+      var needsDeactivationUX = actualActivationType === expectedActivationType;
+      var needsActualDeactivation = needsDeactivationUX;
+      if (activationState.wasActivatedByPointer) {
+        needsActualDeactivation = e.type === 'mouseup';
+      }
+
+      var state = /** @type {!ActivationStateType} */_extends({}, activationState);
+      requestAnimationFrame(function () {
+        if (needsDeactivationUX) {
+          _this7.activationState_.hasDeactivationUXRun = true;
+          _this7.animateDeactivation_(e, state);
+        }
+
+        if (needsActualDeactivation) {
+          _this7.activationState_ = _this7.defaultActivationState_();
+        }
+      });
+    }
+  }, {
+    key: 'deactivate',
+    value: function deactivate() {
+      this.deactivate_(null);
+    }
+
+    /**
+     * @param {Event} e
+     * @param {!ActivationStateType} options
+     * @private
+     */
+
+  }, {
+    key: 'animateDeactivation_',
+    value: function animateDeactivation_(e, _ref) {
+      var wasActivatedByPointer = _ref.wasActivatedByPointer,
+          wasElementMadeActive = _ref.wasElementMadeActive;
+      var BG_FOCUSED = MDCRippleFoundation.cssClasses.BG_FOCUSED;
+
+      if (wasActivatedByPointer || wasElementMadeActive) {
+        // Remove class left over by element being focused
+        this.adapter_.removeClass(BG_FOCUSED);
+        this.runDeactivationUXLogicIfReady_();
+      }
+    }
+  }, {
+    key: 'destroy',
+    value: function destroy() {
+      var _this8 = this;
+
+      if (!this.isSupported_) {
+        return;
+      }
+      this.removeEventListeners_();
+
+      var _MDCRippleFoundation$5 = MDCRippleFoundation.cssClasses,
+          ROOT = _MDCRippleFoundation$5.ROOT,
+          UNBOUNDED = _MDCRippleFoundation$5.UNBOUNDED;
+
+      requestAnimationFrame(function () {
+        _this8.adapter_.removeClass(ROOT);
+        _this8.adapter_.removeClass(UNBOUNDED);
+        _this8.removeCssVars_();
+      });
+    }
+
+    /** @private */
+
+  }, {
+    key: 'removeEventListeners_',
+    value: function removeEventListeners_() {
+      var _this9 = this;
+
+      this.listenerInfos_.forEach(function (info) {
+        Object.keys(info).forEach(function (k) {
+          _this9.adapter_.deregisterInteractionHandler(info[k], _this9.listeners_[k]);
+        });
+      });
+      this.adapter_.deregisterResizeHandler(this.resizeHandler_);
+    }
+
+    /** @private */
+
+  }, {
+    key: 'removeCssVars_',
+    value: function removeCssVars_() {
+      var _this10 = this;
+
+      var strings = MDCRippleFoundation.strings;
+
+      Object.keys(strings).forEach(function (k) {
+        if (k.indexOf('VAR_') === 0) {
+          _this10.adapter_.updateCssVariable(strings[k], null);
+        }
+      });
+    }
+  }, {
+    key: 'layout',
+    value: function layout() {
+      var _this11 = this;
+
+      if (this.layoutFrame_) {
+        cancelAnimationFrame(this.layoutFrame_);
+      }
+      this.layoutFrame_ = requestAnimationFrame(function () {
+        _this11.layoutInternal_();
+        _this11.layoutFrame_ = 0;
+      });
+    }
+
+    /** @private */
+
+  }, {
+    key: 'layoutInternal_',
+    value: function layoutInternal_() {
+      this.frame_ = this.adapter_.computeBoundingRect();
+
+      var maxDim = Math.max(this.frame_.height, this.frame_.width);
+      var surfaceDiameter = Math.sqrt(Math.pow(this.frame_.width, 2) + Math.pow(this.frame_.height, 2));
+
+      // 60% of the largest dimension of the surface
+      this.initialSize_ = maxDim * MDCRippleFoundation.numbers.INITIAL_ORIGIN_SCALE;
+
+      // Diameter of the surface + 10px
+      this.maxRadius_ = surfaceDiameter + MDCRippleFoundation.numbers.PADDING;
+      this.fgScale_ = this.maxRadius_ / this.initialSize_;
+      this.xfDuration_ = 1000 * Math.sqrt(this.maxRadius_ / 1024);
+      this.updateLayoutCssVars_();
+    }
+
+    /** @private */
+
+  }, {
+    key: 'updateLayoutCssVars_',
+    value: function updateLayoutCssVars_() {
+      var _MDCRippleFoundation$6 = MDCRippleFoundation.strings,
+          VAR_SURFACE_WIDTH = _MDCRippleFoundation$6.VAR_SURFACE_WIDTH,
+          VAR_SURFACE_HEIGHT = _MDCRippleFoundation$6.VAR_SURFACE_HEIGHT,
+          VAR_FG_SIZE = _MDCRippleFoundation$6.VAR_FG_SIZE,
+          VAR_LEFT = _MDCRippleFoundation$6.VAR_LEFT,
+          VAR_TOP = _MDCRippleFoundation$6.VAR_TOP,
+          VAR_FG_SCALE = _MDCRippleFoundation$6.VAR_FG_SCALE;
+
+
+      this.adapter_.updateCssVariable(VAR_SURFACE_WIDTH, this.frame_.width + 'px');
+      this.adapter_.updateCssVariable(VAR_SURFACE_HEIGHT, this.frame_.height + 'px');
+      this.adapter_.updateCssVariable(VAR_FG_SIZE, this.initialSize_ + 'px');
+      this.adapter_.updateCssVariable(VAR_FG_SCALE, this.fgScale_);
+
+      if (this.adapter_.isUnbounded()) {
+        this.unboundedCoords_ = {
+          left: Math.round(this.frame_.width / 2 - this.initialSize_ / 2),
+          top: Math.round(this.frame_.height / 2 - this.initialSize_ / 2)
+        };
+
+        this.adapter_.updateCssVariable(VAR_LEFT, this.unboundedCoords_.left + 'px');
+        this.adapter_.updateCssVariable(VAR_TOP, this.unboundedCoords_.top + 'px');
+      }
+    }
+  }]);
+
+  return MDCRippleFoundation;
+}(__WEBPACK_IMPORTED_MODULE_0__material_base_foundation__["a" /* default */]);
+
+/* harmony default export */ __webpack_exports__["a"] = (MDCRippleFoundation);
+
+/***/ }),
+
+/***/ 9:
+/***/ (function(module, __webpack_exports__, __webpack_require__) {
+
+"use strict";
+Object.defineProperty(__webpack_exports__, "__esModule", { value: true });
+/* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, "transformStyleProperties", function() { return transformStyleProperties; });
+/* harmony export (immutable) */ __webpack_exports__["getCorrectEventName"] = getCorrectEventName;
+/* harmony export (immutable) */ __webpack_exports__["getCorrectPropertyName"] = getCorrectPropertyName;
+/**
+ * Copyright 2016 Google Inc. All Rights Reserved.
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *      http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+
+/**
+ * @typedef {{
+ *   noPrefix: string,
+ *   webkitPrefix: string
+ * }}
+ */
+var VendorPropertyMapType = void 0;
+
+/** @const {Object<string, !VendorPropertyMapType>} */
+var eventTypeMap = {
+  'animationstart': {
+    noPrefix: 'animationstart',
+    webkitPrefix: 'webkitAnimationStart',
+    styleProperty: 'animation'
+  },
+  'animationend': {
+    noPrefix: 'animationend',
+    webkitPrefix: 'webkitAnimationEnd',
+    styleProperty: 'animation'
+  },
+  'animationiteration': {
+    noPrefix: 'animationiteration',
+    webkitPrefix: 'webkitAnimationIteration',
+    styleProperty: 'animation'
+  },
+  'transitionend': {
+    noPrefix: 'transitionend',
+    webkitPrefix: 'webkitTransitionEnd',
+    styleProperty: 'transition'
+  }
+};
+
+/** @const {Object<string, !VendorPropertyMapType>} */
+var cssPropertyMap = {
+  'animation': {
+    noPrefix: 'animation',
+    webkitPrefix: '-webkit-animation'
+  },
+  'transform': {
+    noPrefix: 'transform',
+    webkitPrefix: '-webkit-transform'
+  },
+  'transition': {
+    noPrefix: 'transition',
+    webkitPrefix: '-webkit-transition'
+  }
+};
+
+/**
+ * @param {!Object} windowObj
+ * @return {boolean}
+ */
+function hasProperShape(windowObj) {
+  return windowObj['document'] !== undefined && typeof windowObj['document']['createElement'] === 'function';
+}
+
+/**
+ * @param {string} eventType
+ * @return {boolean}
+ */
+function eventFoundInMaps(eventType) {
+  return eventType in eventTypeMap || eventType in cssPropertyMap;
+}
+
+/**
+ * @param {string} eventType
+ * @param {!Object<string, !VendorPropertyMapType>} map
+ * @param {!Element} el
+ * @return {string}
+ */
+function getJavaScriptEventName(eventType, map, el) {
+  return map[eventType].styleProperty in el.style ? map[eventType].noPrefix : map[eventType].webkitPrefix;
+}
+
+/**
+ * Helper function to determine browser prefix for CSS3 animation events
+ * and property names.
+ * @param {!Object} windowObj
+ * @param {string} eventType
+ * @return {string}
+ */
+function getAnimationName(windowObj, eventType) {
+  if (!hasProperShape(windowObj) || !eventFoundInMaps(eventType)) {
+    return eventType;
+  }
+
+  var map = /** @type {!Object<string, !VendorPropertyMapType>} */eventType in eventTypeMap ? eventTypeMap : cssPropertyMap;
+  var el = windowObj['document']['createElement']('div');
+  var eventName = '';
+
+  if (map === eventTypeMap) {
+    eventName = getJavaScriptEventName(eventType, map, el);
+  } else {
+    eventName = map[eventType].noPrefix in el.style ? map[eventType].noPrefix : map[eventType].webkitPrefix;
+  }
+
+  return eventName;
+}
+
+// Public functions to access getAnimationName() for JavaScript events or CSS
+// property names.
+
+var transformStyleProperties = ['transform', 'WebkitTransform', 'MozTransform', 'OTransform', 'MSTransform'];
+
+/**
+ * @param {!Object} windowObj
+ * @param {string} eventType
+ * @return {string}
+ */
+function getCorrectEventName(windowObj, eventType) {
+  return getAnimationName(windowObj, eventType);
+}
+
+/**
+ * @param {!Object} windowObj
+ * @param {string} eventType
+ * @return {string}
+ */
+function getCorrectPropertyName(windowObj, eventType) {
+  return getAnimationName(windowObj, eventType);
+}
+
+/***/ }),
+
+/***/ 97:
+/***/ (function(module, exports, __webpack_require__) {
+
+module.exports = __webpack_require__(35);
+
+
+/***/ })
+
+/******/ });
+});

+ 1068 - 0
support/client/lib/vwf/view/lib/mdc/dist/mdc.textfield.css

@@ -0,0 +1,1068 @@
+/*!
+ Material Components for the web
+ Copyright (c) 2017 Google Inc.
+ License: Apache-2.0
+*/
+/*
+  Precomputed linear color channel values, for use in contrast calculations.
+  See https://www.w3.org/TR/WCAG20-TECHS/G17.html#G17-tests
+
+  Algorithm, for c in 0 to 255:
+  f(c) {
+    c = c / 255;
+    return c < 0.03928 ? c / 12.92 : Math.pow((c + 0.055) / 1.055, 2.4);
+  }
+
+  This lookup table is needed since there is no `pow` in SASS.
+*/
+/**
+ * Calculate the luminance for a color.
+ * See https://www.w3.org/TR/WCAG20-TECHS/G17.html#G17-tests
+ */
+/**
+ * Calculate the contrast ratio between two colors.
+ * See https://www.w3.org/TR/WCAG20-TECHS/G17.html#G17-tests
+ */
+/**
+ * Determine whether to use dark or light text on top of given color.
+ * Returns "dark" for dark text and "light" for light text.
+ */
+/*
+  Main theme colors.
+  If you're a user customizing your color scheme in SASS, these are probably the only variables you need to change.
+*/
+/* Indigo 500 */
+/* Pink A200 */
+/* White */
+/* Which set of text colors to use for each main theme color (light or dark) */
+/* Text colors according to light vs dark and text type */
+/* Primary text colors for each of the theme colors */
+/** MDC Ripple keyframes are split into their own file so that _mixins.scss can rely on them. */
+@-webkit-keyframes mdc-ripple-fg-radius-in {
+  from {
+    -webkit-transform: translate(var(--mdc-ripple-fg-translate-start, 0)) scale(1);
+            transform: translate(var(--mdc-ripple-fg-translate-start, 0)) scale(1);
+    -webkit-animation-timing-function: cubic-bezier(0.4, 0, 0.2, 1);
+            animation-timing-function: cubic-bezier(0.4, 0, 0.2, 1); }
+  to {
+    -webkit-transform: translate(var(--mdc-ripple-fg-translate-end, 0)) scale(var(--mdc-ripple-fg-scale, 1));
+            transform: translate(var(--mdc-ripple-fg-translate-end, 0)) scale(var(--mdc-ripple-fg-scale, 1)); } }
+@keyframes mdc-ripple-fg-radius-in {
+  from {
+    -webkit-transform: translate(var(--mdc-ripple-fg-translate-start, 0)) scale(1);
+            transform: translate(var(--mdc-ripple-fg-translate-start, 0)) scale(1);
+    -webkit-animation-timing-function: cubic-bezier(0.4, 0, 0.2, 1);
+            animation-timing-function: cubic-bezier(0.4, 0, 0.2, 1); }
+  to {
+    -webkit-transform: translate(var(--mdc-ripple-fg-translate-end, 0)) scale(var(--mdc-ripple-fg-scale, 1));
+            transform: translate(var(--mdc-ripple-fg-translate-end, 0)) scale(var(--mdc-ripple-fg-scale, 1)); } }
+
+@-webkit-keyframes mdc-ripple-fg-opacity-in {
+  from {
+    opacity: 0;
+    -webkit-animation-timing-function: linear;
+            animation-timing-function: linear; }
+  to {
+    opacity: 1; } }
+
+@keyframes mdc-ripple-fg-opacity-in {
+  from {
+    opacity: 0;
+    -webkit-animation-timing-function: linear;
+            animation-timing-function: linear; }
+  to {
+    opacity: 1; } }
+
+@-webkit-keyframes mdc-ripple-fg-opacity-out {
+  from {
+    opacity: 1;
+    -webkit-animation-timing-function: linear;
+            animation-timing-function: linear; }
+  to {
+    opacity: 0; } }
+
+@keyframes mdc-ripple-fg-opacity-out {
+  from {
+    opacity: 1;
+    -webkit-animation-timing-function: linear;
+            animation-timing-function: linear; }
+  to {
+    opacity: 0; } }
+
+/**
+ * Creates a rule that will be applied when an MDC-Web component is within the context of an RTL layout.
+ *
+ * Usage Example:
+ * ```scss
+ * .mdc-foo {
+ *   position: absolute;
+ *   left: 0;
+ *
+ *   @include mdc-rtl {
+ *     left: auto;
+ *     right: 0;
+ *   }
+ *
+ *   &__bar {
+ *     margin-left: 4px;
+ *     @include mdc-rtl(".mdc-foo") {
+ *       margin-left: auto;
+ *       margin-right: 4px;
+ *     }
+ *   }
+ * }
+ *
+ * .mdc-foo--mod {
+ *   padding-left: 4px;
+ *
+ *   @include mdc-rtl {
+ *     padding-left: auto;
+ *     padding-right: 4px;
+ *   }
+ * }
+ * ```
+ *
+ * Note that this works by checking for [dir="rtl"] on an ancestor element. While this will work
+ * in most cases, it will in some cases lead to false negatives, e.g.
+ *
+ * ```html
+ * <html dir="rtl">
+ *   <!-- ... -->
+ *   <div dir="ltr">
+ *     <div class="mdc-foo">Styled incorrectly as RTL!</div>
+ *   </div>
+ * </html>
+ * ```
+ *
+ * In the future, selectors such as :dir (http://mdn.io/:dir) will help us mitigate this.
+ */
+/**
+ * Takes a base box-model property - e.g. margin / border / padding - along with a default
+ * direction and value, and emits rules which apply the value to the
+ * "<base-property>-<default-direction>" property by default, but flips the direction
+ * when within an RTL context.
+ *
+ * For example:
+ *
+ * ```scss
+ * .mdc-foo {
+ *   @include mdc-rtl-reflexive-box(margin, left, 8px);
+ * }
+ * ```
+ * is equivalent to:
+ *
+ * ```scss
+ * .mdc-foo {
+ *   margin-left: 8px;
+ *
+ *   @include mdc-rtl {
+ *     margin-right: 8px;
+ *     margin-left: 0;
+ *   }
+ * }
+ * ```
+ * whereas:
+ *
+ * ```scss
+ * .mdc-foo {
+ *   @include mdc-rtl-reflexive-box(margin, right, 8px);
+ * }
+ * ```
+ * is equivalent to:
+ *
+ * ```scss
+ * .mdc-foo {
+ *   margin-right: 8px;
+ *
+ *   @include mdc-rtl {
+ *     margin-right: 0;
+ *     margin-left: 8px;
+ *   }
+ * }
+ * ```
+ *
+ * You can also pass a 4th optional $root-selector argument which will be forwarded to `mdc-rtl`,
+ * e.g. `@include mdc-rtl-reflexive-box(margin, left, 8px, ".mdc-component")`.
+ *
+ * Note that this function will always zero out the original value in an RTL context. If you're
+ * trying to flip the values, use mdc-rtl-reflexive-property().
+ */
+/**
+ * Takes a base property and emits rules that assign <base-property>-left to <left-value> and
+ * <base-property>-right to <right-value> in a LTR context, and vice versa in a RTL context.
+ * For example:
+ *
+ * ```scss
+ * .mdc-foo {
+ *   @include mdc-rtl-reflexive-property(margin, auto, 12px);
+ * }
+ * ```
+ * is equivalent to:
+ *
+ * ```scss
+ * .mdc-foo {
+ *   margin-left: auto;
+ *   margin-right: 12px;
+ *
+ *   @include mdc-rtl {
+ *     margin-left: 12px;
+ *     margin-right: auto;
+ *   }
+ * }
+ * ```
+ *
+ * A 4th optional $root-selector argument can be given, which will be passed to `mdc-rtl`.
+ */
+/**
+ * Takes an argument specifying a horizontal position property (either "left" or "right") as well
+ * as a value, and applies that value to the specified position in a LTR context, and flips it in a
+ * RTL context. For example:
+ *
+ * ```scss
+ * .mdc-foo {
+ *   @include mdc-rtl-reflexive-position(left, 0);
+ *   position: absolute;
+ * }
+ * ```
+ * is equivalent to:
+ *
+ * ```scss
+ *  .mdc-foo {
+ *    position: absolute;
+ *    left: 0;
+ *    right: initial;
+ *
+ *    @include mdc-rtl {
+ *      right: 0;
+ *      left: initial;
+ *    }
+ *  }
+ * ```
+ * An optional third $root-selector argument may also be given, which is passed to `mdc-rtl`.
+ */
+/*
+  Precomputed linear color channel values, for use in contrast calculations.
+  See https://www.w3.org/TR/WCAG20-TECHS/G17.html#G17-tests
+
+  Algorithm, for c in 0 to 255:
+  f(c) {
+    c = c / 255;
+    return c < 0.03928 ? c / 12.92 : Math.pow((c + 0.055) / 1.055, 2.4);
+  }
+
+  This lookup table is needed since there is no `pow` in SASS.
+*/
+/**
+ * Calculate the luminance for a color.
+ * See https://www.w3.org/TR/WCAG20-TECHS/G17.html#G17-tests
+ */
+/**
+ * Calculate the contrast ratio between two colors.
+ * See https://www.w3.org/TR/WCAG20-TECHS/G17.html#G17-tests
+ */
+/**
+ * Determine whether to use dark or light text on top of given color.
+ * Returns "dark" for dark text and "light" for light text.
+ */
+/*
+  Main theme colors.
+  If you're a user customizing your color scheme in SASS, these are probably the only variables you need to change.
+*/
+/* Indigo 500 */
+/* Pink A200 */
+/* White */
+/* Which set of text colors to use for each main theme color (light or dark) */
+/* Text colors according to light vs dark and text type */
+/* Primary text colors for each of the theme colors */
+/*
+  Precomputed linear color channel values, for use in contrast calculations.
+  See https://www.w3.org/TR/WCAG20-TECHS/G17.html#G17-tests
+
+  Algorithm, for c in 0 to 255:
+  f(c) {
+    c = c / 255;
+    return c < 0.03928 ? c / 12.92 : Math.pow((c + 0.055) / 1.055, 2.4);
+  }
+
+  This lookup table is needed since there is no `pow` in SASS.
+*/
+/**
+ * Calculate the luminance for a color.
+ * See https://www.w3.org/TR/WCAG20-TECHS/G17.html#G17-tests
+ */
+/**
+ * Calculate the contrast ratio between two colors.
+ * See https://www.w3.org/TR/WCAG20-TECHS/G17.html#G17-tests
+ */
+/**
+ * Determine whether to use dark or light text on top of given color.
+ * Returns "dark" for dark text and "light" for light text.
+ */
+/*
+  Main theme colors.
+  If you're a user customizing your color scheme in SASS, these are probably the only variables you need to change.
+*/
+/* Indigo 500 */
+/* Pink A200 */
+/* White */
+/* Which set of text colors to use for each main theme color (light or dark) */
+/* Text colors according to light vs dark and text type */
+/* Primary text colors for each of the theme colors */
+/**
+ * Applies the correct theme color style to the specified property.
+ * $property is typically color or background-color, but can be any CSS property that accepts color values.
+ * $style should be one of the map keys in $mdc-theme-property-values (_variables.scss).
+ */
+/**
+ * Creates a rule to be used in MDC-Web components for dark theming, and applies the provided contents.
+ * Should provide the $root-selector option if applied to anything other than the root selector.
+ * When used with a modifier class, provide a second argument of `true` for the $compound parameter
+ * to specify that this should be attached as a compound class.
+ *
+ * Usage example:
+ *
+ * ```scss
+ * .mdc-foo {
+ *   color: black;
+ *
+ *   @include mdc-theme-dark {
+ *     color: white;
+ *   }
+ *
+ *   &__bar {
+ *     background: black;
+ *
+ *     @include mdc-theme-dark(".mdc-foo") {
+ *       background: white;
+ *     }
+ *   }
+ * }
+ *
+ * .mdc-foo--disabled {
+ *   opacity: .38;
+ *
+ *   @include mdc-theme-dark(".mdc-foo", true) {
+ *     opacity: .5;
+ *   }
+ * }
+ * ```
+ */
+/* TODO(sgomes): Figure out what to do about desktop font sizes. */
+/* TODO(sgomes): Figure out what to do about i18n and i18n font sizes. */
+/* TODO(sgomes): Figure out what to do about desktop font sizes. */
+/* TODO(sgomes): Figure out what to do about i18n and i18n font sizes. */
+.mdc-textfield {
+  display: inline-block;
+  margin-bottom: 8px;
+  will-change: opacity, transform, color; }
+  .mdc-textfield__input {
+    /* @alternate */
+    color: rgba(0, 0, 0, 0.87);
+    color: var(--mdc-theme-text-primary-on-light, rgba(0, 0, 0, 0.87));
+    font-family: Roboto, sans-serif;
+    -moz-osx-font-smoothing: grayscale;
+    -webkit-font-smoothing: antialiased;
+    font-size: 1rem;
+    letter-spacing: 0.04em;
+    width: 100%;
+    padding: 0 0 8px;
+    border: none;
+    background: none;
+    font-size: inherit;
+    -webkit-appearance: none;
+       -moz-appearance: none;
+            appearance: none; }
+    .mdc-textfield__input::-webkit-input-placeholder {
+      /* @alternate */
+      color: rgba(0, 0, 0, 0.38);
+      color: var(--mdc-theme-text-hint-on-light, rgba(0, 0, 0, 0.38));
+      -webkit-transition: color 180ms cubic-bezier(0.4, 0, 0.2, 1);
+      transition: color 180ms cubic-bezier(0.4, 0, 0.2, 1);
+      opacity: 1; }
+    .mdc-textfield__input::-moz-placeholder {
+      /* @alternate */
+      color: rgba(0, 0, 0, 0.38);
+      color: var(--mdc-theme-text-hint-on-light, rgba(0, 0, 0, 0.38));
+      -webkit-transition: color 180ms cubic-bezier(0.4, 0, 0.2, 1);
+      transition: color 180ms cubic-bezier(0.4, 0, 0.2, 1);
+      opacity: 1; }
+    .mdc-textfield__input:-ms-input-placeholder {
+      /* @alternate */
+      color: rgba(0, 0, 0, 0.38);
+      color: var(--mdc-theme-text-hint-on-light, rgba(0, 0, 0, 0.38));
+      -webkit-transition: color 180ms cubic-bezier(0.4, 0, 0.2, 1);
+      transition: color 180ms cubic-bezier(0.4, 0, 0.2, 1);
+      opacity: 1; }
+    .mdc-textfield__input::placeholder {
+      /* @alternate */
+      color: rgba(0, 0, 0, 0.38);
+      color: var(--mdc-theme-text-hint-on-light, rgba(0, 0, 0, 0.38));
+      -webkit-transition: color 180ms cubic-bezier(0.4, 0, 0.2, 1);
+      transition: color 180ms cubic-bezier(0.4, 0, 0.2, 1);
+      opacity: 1; }
+    .mdc-textfield__input:focus {
+      outline: none; }
+      .mdc-textfield__input:focus::-webkit-input-placeholder {
+        /* @alternate */
+        color: rgba(0, 0, 0, 0.54);
+        color: var(--mdc-theme-text-secondary-on-light, rgba(0, 0, 0, 0.54)); }
+      .mdc-textfield__input:focus::-moz-placeholder {
+        /* @alternate */
+        color: rgba(0, 0, 0, 0.54);
+        color: var(--mdc-theme-text-secondary-on-light, rgba(0, 0, 0, 0.54)); }
+      .mdc-textfield__input:focus:-ms-input-placeholder {
+        /* @alternate */
+        color: rgba(0, 0, 0, 0.54);
+        color: var(--mdc-theme-text-secondary-on-light, rgba(0, 0, 0, 0.54)); }
+      .mdc-textfield__input:focus::placeholder {
+        /* @alternate */
+        color: rgba(0, 0, 0, 0.54);
+        color: var(--mdc-theme-text-secondary-on-light, rgba(0, 0, 0, 0.54)); }
+    .mdc-textfield__input:invalid {
+      -webkit-box-shadow: none;
+              box-shadow: none; }
+    .mdc-textfield__input--theme-dark,
+    .mdc-theme--dark .mdc-textfield__input {
+      /* @alternate */
+      color: white;
+      color: var(--mdc-theme-text-primary-on-dark, white); }
+      .mdc-textfield__input--theme-dark::-webkit-input-placeholder,
+      .mdc-theme--dark .mdc-textfield__input::-webkit-input-placeholder {
+        /* @alternate */
+        color: rgba(255, 255, 255, 0.5);
+        color: var(--mdc-theme-text-hint-on-dark, rgba(255, 255, 255, 0.5)); }
+      .mdc-textfield__input--theme-dark::-moz-placeholder,
+      .mdc-theme--dark .mdc-textfield__input::-moz-placeholder {
+        /* @alternate */
+        color: rgba(255, 255, 255, 0.5);
+        color: var(--mdc-theme-text-hint-on-dark, rgba(255, 255, 255, 0.5)); }
+      .mdc-textfield__input--theme-dark:-ms-input-placeholder,
+      .mdc-theme--dark .mdc-textfield__input:-ms-input-placeholder {
+        /* @alternate */
+        color: rgba(255, 255, 255, 0.5);
+        color: var(--mdc-theme-text-hint-on-dark, rgba(255, 255, 255, 0.5)); }
+      .mdc-textfield__input--theme-dark::placeholder,
+      .mdc-theme--dark .mdc-textfield__input::placeholder {
+        /* @alternate */
+        color: rgba(255, 255, 255, 0.5);
+        color: var(--mdc-theme-text-hint-on-dark, rgba(255, 255, 255, 0.5)); }
+      .mdc-textfield__input--theme-dark:focus::-webkit-input-placeholder,
+      .mdc-theme--dark .mdc-textfield__input:focus::-webkit-input-placeholder {
+        /* @alternate */
+        color: rgba(255, 255, 255, 0.7);
+        color: var(--mdc-theme-text-secondary-on-dark, rgba(255, 255, 255, 0.7)); }
+      .mdc-textfield__input--theme-dark:focus::-moz-placeholder,
+      .mdc-theme--dark .mdc-textfield__input:focus::-moz-placeholder {
+        /* @alternate */
+        color: rgba(255, 255, 255, 0.7);
+        color: var(--mdc-theme-text-secondary-on-dark, rgba(255, 255, 255, 0.7)); }
+      .mdc-textfield__input--theme-dark:focus:-ms-input-placeholder,
+      .mdc-theme--dark .mdc-textfield__input:focus:-ms-input-placeholder {
+        /* @alternate */
+        color: rgba(255, 255, 255, 0.7);
+        color: var(--mdc-theme-text-secondary-on-dark, rgba(255, 255, 255, 0.7)); }
+      .mdc-textfield__input--theme-dark:focus::placeholder,
+      .mdc-theme--dark .mdc-textfield__input:focus::placeholder {
+        /* @alternate */
+        color: rgba(255, 255, 255, 0.7);
+        color: var(--mdc-theme-text-secondary-on-dark, rgba(255, 255, 255, 0.7)); }
+  .mdc-textfield__label {
+    /* @alternate */
+    color: rgba(0, 0, 0, 0.38);
+    color: var(--mdc-theme-text-hint-on-light, rgba(0, 0, 0, 0.38));
+    position: absolute;
+    bottom: 8px;
+    left: 0;
+    -webkit-transform-origin: left top;
+            transform-origin: left top;
+    -webkit-transition: color 180ms cubic-bezier(0.4, 0, 0.2, 1), -webkit-transform 180ms cubic-bezier(0.4, 0, 0.2, 1);
+    transition: color 180ms cubic-bezier(0.4, 0, 0.2, 1), -webkit-transform 180ms cubic-bezier(0.4, 0, 0.2, 1);
+    transition: transform 180ms cubic-bezier(0.4, 0, 0.2, 1), color 180ms cubic-bezier(0.4, 0, 0.2, 1);
+    transition: transform 180ms cubic-bezier(0.4, 0, 0.2, 1), color 180ms cubic-bezier(0.4, 0, 0.2, 1), -webkit-transform 180ms cubic-bezier(0.4, 0, 0.2, 1);
+    cursor: text; }
+    [dir="rtl"] .mdc-textfield .mdc-textfield__label,
+    .mdc-textfield[dir="rtl"] .mdc-textfield__label {
+      right: 0;
+      left: auto;
+      -webkit-transform-origin: right top;
+              transform-origin: right top; }
+    .mdc-textfield--theme-dark .mdc-textfield__label,
+    .mdc-theme--dark .mdc-textfield__label {
+      /* @alternate */
+      color: rgba(255, 255, 255, 0.5);
+      color: var(--mdc-theme-text-hint-on-dark, rgba(255, 255, 255, 0.5)); }
+    .mdc-textfield__label--float-above {
+      -webkit-transform: translateY(-100%) scale(0.75, 0.75);
+              transform: translateY(-100%) scale(0.75, 0.75);
+      cursor: auto; }
+
+.mdc-textfield__input:-webkit-autofill + .mdc-textfield__label {
+  -webkit-transform: translateY(-100%) scale(0.75, 0.75);
+          transform: translateY(-100%) scale(0.75, 0.75);
+  cursor: auto; }
+
+.mdc-textfield--box {
+  display: -webkit-inline-box;
+  display: -ms-inline-flexbox;
+  display: inline-flex;
+  position: relative;
+  height: 56px;
+  border-radius: 4px 4px 0 0;
+  background-color: rgba(0, 0, 0, 0.04);
+  overflow: hidden; }
+  .mdc-textfield--theme-dark.mdc-textfield--box,
+  .mdc-theme--dark .mdc-textfield--box {
+    background-color: rgba(255, 255, 255, 0.1); }
+  .mdc-textfield--box::before, .mdc-textfield--box::after {
+    position: absolute;
+    top: 0;
+    left: 0;
+    width: 100%;
+    height: 100%;
+    border-radius: 50%;
+    background-color: inherit;
+    content: "";
+    opacity: 0;
+    pointer-events: none; }
+  .mdc-textfield--box::before {
+    -webkit-transition: opacity 17ms linear, -webkit-transform 0ms 85ms linear;
+    transition: opacity 17ms linear, -webkit-transform 0ms 85ms linear;
+    transition: opacity 17ms linear, transform 0ms 85ms linear;
+    transition: opacity 17ms linear, transform 0ms 85ms linear, -webkit-transform 0ms 85ms linear; }
+  .mdc-textfield--box:hover::before {
+    -webkit-transition: opacity 83ms linear 17ms, -webkit-transform 250ms cubic-bezier(0, 0, 0.2, 1) 17ms;
+    transition: opacity 83ms linear 17ms, -webkit-transform 250ms cubic-bezier(0, 0, 0.2, 1) 17ms;
+    transition: opacity 83ms linear 17ms, transform 250ms cubic-bezier(0, 0, 0.2, 1) 17ms;
+    transition: opacity 83ms linear 17ms, transform 250ms cubic-bezier(0, 0, 0.2, 1) 17ms, -webkit-transform 250ms cubic-bezier(0, 0, 0.2, 1) 17ms;
+    opacity: 1; }
+  .mdc-textfield--box .mdc-textfield__input {
+    -ms-flex-item-align: end;
+        align-self: flex-end;
+    height: 100%;
+    -webkit-box-sizing: border-box;
+            box-sizing: border-box;
+    padding: 20px 16px 0; }
+  .mdc-textfield--box .mdc-textfield__label {
+    left: 16px;
+    right: initial;
+    position: absolute;
+    bottom: 20px;
+    color: rgba(0, 0, 0, 0.6);
+    pointer-events: none;
+    will-change: transform; }
+    [dir="rtl"] .mdc-textfield--box .mdc-textfield__label, .mdc-textfield--box .mdc-textfield__label[dir="rtl"] {
+      left: initial;
+      right: 16px; }
+    .mdc-textfield--theme-dark .mdc-textfield--box .mdc-textfield__label,
+    .mdc-theme--dark .mdc-textfield--box .mdc-textfield__label {
+      /* @alternate */
+      color: rgba(255, 255, 255, 0.7);
+      color: var(--mdc-theme-text-secondary-on-dark, rgba(255, 255, 255, 0.7)); }
+    .mdc-textfield--box .mdc-textfield__label--float-above {
+      -webkit-transform: translateY(-50%) scale(0.75, 0.75);
+              transform: translateY(-50%) scale(0.75, 0.75); }
+  .mdc-textfield--box.mdc-ripple-upgraded {
+    --mdc-ripple-surface-width: 0;
+    --mdc-ripple-surface-height: 0;
+    --mdc-ripple-fg-size: 0;
+    --mdc-ripple-left: 0;
+    --mdc-ripple-top: 0;
+    --mdc-ripple-fg-scale: 1;
+    --mdc-ripple-fg-translate-end: 0;
+    --mdc-ripple-fg-translate-start: 0;
+    will-change: transform, opacity;
+    -webkit-tap-highlight-color: transparent; }
+    .mdc-textfield--box.mdc-ripple-upgraded:not(.mdc-ripple-upgraded):hover::before, .mdc-textfield--box.mdc-ripple-upgraded:not(.mdc-ripple-upgraded):focus::before, .mdc-textfield--box.mdc-ripple-upgraded:not(.mdc-ripple-upgraded):active::after {
+      -webkit-transition-duration: 85ms;
+              transition-duration: 85ms;
+      opacity: .6; }
+    .mdc-textfield--box.mdc-ripple-upgraded::after {
+      background-color: rgba(0, 0, 0, 0.04);
+      position: absolute;
+      top: calc(50% - 100%);
+      left: calc(50% - 100%);
+      width: 200%;
+      height: 200%;
+      -webkit-transition: opacity 250ms linear;
+      transition: opacity 250ms linear;
+      border-radius: 50%;
+      opacity: 0;
+      pointer-events: none;
+      content: ""; }
+    .mdc-textfield--box.mdc-ripple-upgraded.mdc-ripple-upgraded::after {
+      top: 0;
+      left: 0;
+      /* @alternate */
+      width: 100%;
+      width: var(--mdc-ripple-fg-size, 100%);
+      /* @alternate */
+      height: 100%;
+      height: var(--mdc-ripple-fg-size, 100%);
+      -webkit-transform: scale(0);
+              transform: scale(0);
+      -webkit-transform-origin: center center;
+              transform-origin: center center;
+      opacity: 0; }
+    .mdc-textfield--box.mdc-ripple-upgraded:not(.mdc-ripple-upgraded--unbounded)::after {
+      -webkit-transform-origin: center center;
+              transform-origin: center center; }
+    .mdc-textfield--box.mdc-ripple-upgraded.mdc-ripple-upgraded--unbounded::after {
+      /* @alternate */
+      top: 0;
+      top: var(--mdc-ripple-top, 0);
+      /* @alternate */
+      left: 0;
+      left: var(--mdc-ripple-left, 0);
+      /* @alternate */
+      width: 100%;
+      width: var(--mdc-ripple-fg-size, 100%);
+      /* @alternate */
+      height: 100%;
+      height: var(--mdc-ripple-fg-size, 100%);
+      -webkit-transform: scale(0);
+              transform: scale(0);
+      -webkit-transform-origin: center center;
+              transform-origin: center center; }
+    .mdc-textfield--box.mdc-ripple-upgraded.mdc-ripple-upgraded--foreground-activation::after {
+      -webkit-animation: 300ms mdc-ripple-fg-radius-in forwards, 83ms mdc-ripple-fg-opacity-in forwards;
+              animation: 300ms mdc-ripple-fg-radius-in forwards, 83ms mdc-ripple-fg-opacity-in forwards; }
+    .mdc-textfield--box.mdc-ripple-upgraded.mdc-ripple-upgraded--foreground-deactivation::after {
+      -webkit-transform: translate(var(--mdc-ripple-fg-translate-end, 0)) scale(var(--mdc-ripple-fg-scale, 1));
+              transform: translate(var(--mdc-ripple-fg-translate-end, 0)) scale(var(--mdc-ripple-fg-scale, 1));
+      -webkit-animation: 83ms mdc-ripple-fg-opacity-out;
+              animation: 83ms mdc-ripple-fg-opacity-out; }
+    .mdc-textfield--box.mdc-ripple-upgraded::before {
+      top: calc(50% - var(--mdc-ripple-fg-size, 100%) / 2);
+      left: calc(50% - var(--mdc-ripple-fg-size, 100%) / 2);
+      width: var(--mdc-ripple-fg-size, 100%);
+      height: var(--mdc-ripple-fg-size, 100%);
+      -webkit-transform: scale(0.8);
+              transform: scale(0.8); }
+    .mdc-textfield--box.mdc-ripple-upgraded:hover::before {
+      -webkit-transform: scale(calc(var(--mdc-ripple-fg-scale, 1) + .1));
+              transform: scale(calc(var(--mdc-ripple-fg-scale, 1) + .1)); }
+    .mdc-textfield--theme-dark.mdc-textfield--box.mdc-ripple-upgraded::after,
+    .mdc-theme--dark .mdc-textfield--box.mdc-ripple-upgraded::after {
+      background-color: rgba(255, 255, 255, 0.05);
+      position: absolute;
+      top: calc(50% - 100%);
+      left: calc(50% - 100%);
+      width: 200%;
+      height: 200%;
+      -webkit-transition: opacity 250ms linear;
+      transition: opacity 250ms linear;
+      border-radius: 50%;
+      opacity: 0;
+      pointer-events: none;
+      content: ""; }
+    .mdc-textfield--theme-dark.mdc-textfield--box.mdc-ripple-upgraded.mdc-ripple-upgraded::after,
+    .mdc-theme--dark .mdc-textfield--box.mdc-ripple-upgraded.mdc-ripple-upgraded::after {
+      top: 0;
+      left: 0;
+      /* @alternate */
+      width: 100%;
+      width: var(--mdc-ripple-fg-size, 100%);
+      /* @alternate */
+      height: 100%;
+      height: var(--mdc-ripple-fg-size, 100%);
+      -webkit-transform: scale(0);
+              transform: scale(0);
+      -webkit-transform-origin: center center;
+              transform-origin: center center;
+      opacity: 0; }
+    .mdc-textfield--theme-dark.mdc-textfield--box.mdc-ripple-upgraded:not(.mdc-ripple-upgraded--unbounded)::after,
+    .mdc-theme--dark .mdc-textfield--box.mdc-ripple-upgraded:not(.mdc-ripple-upgraded--unbounded)::after {
+      -webkit-transform-origin: center center;
+              transform-origin: center center; }
+    .mdc-textfield--theme-dark.mdc-textfield--box.mdc-ripple-upgraded.mdc-ripple-upgraded--unbounded::after,
+    .mdc-theme--dark .mdc-textfield--box.mdc-ripple-upgraded.mdc-ripple-upgraded--unbounded::after {
+      /* @alternate */
+      top: 0;
+      top: var(--mdc-ripple-top, 0);
+      /* @alternate */
+      left: 0;
+      left: var(--mdc-ripple-left, 0);
+      /* @alternate */
+      width: 100%;
+      width: var(--mdc-ripple-fg-size, 100%);
+      /* @alternate */
+      height: 100%;
+      height: var(--mdc-ripple-fg-size, 100%);
+      -webkit-transform: scale(0);
+              transform: scale(0);
+      -webkit-transform-origin: center center;
+              transform-origin: center center; }
+    .mdc-textfield--theme-dark.mdc-textfield--box.mdc-ripple-upgraded.mdc-ripple-upgraded--foreground-activation::after,
+    .mdc-theme--dark .mdc-textfield--box.mdc-ripple-upgraded.mdc-ripple-upgraded--foreground-activation::after {
+      -webkit-animation: 300ms mdc-ripple-fg-radius-in forwards, 83ms mdc-ripple-fg-opacity-in forwards;
+              animation: 300ms mdc-ripple-fg-radius-in forwards, 83ms mdc-ripple-fg-opacity-in forwards; }
+    .mdc-textfield--theme-dark.mdc-textfield--box.mdc-ripple-upgraded.mdc-ripple-upgraded--foreground-deactivation::after,
+    .mdc-theme--dark .mdc-textfield--box.mdc-ripple-upgraded.mdc-ripple-upgraded--foreground-deactivation::after {
+      -webkit-transform: translate(var(--mdc-ripple-fg-translate-end, 0)) scale(var(--mdc-ripple-fg-scale, 1));
+              transform: translate(var(--mdc-ripple-fg-translate-end, 0)) scale(var(--mdc-ripple-fg-scale, 1));
+      -webkit-animation: 83ms mdc-ripple-fg-opacity-out;
+              animation: 83ms mdc-ripple-fg-opacity-out; }
+  .mdc-textfield--box.mdc-textfield--disabled {
+    border-bottom: none;
+    background-color: rgba(0, 0, 0, 0.02);
+    color: rgba(0, 0, 0, 0.38); }
+    .mdc-textfield--theme-dark.mdc-textfield--box.mdc-textfield--disabled,
+    .mdc-theme--dark .mdc-textfield--box.mdc-textfield--disabled {
+      border-bottom: none;
+      background-color: rgba(255, 255, 255, 0.05); }
+    .mdc-textfield--box.mdc-textfield--disabled .mdc-textfield__label {
+      bottom: 20px; }
+    .mdc-textfield--box.mdc-textfield--disabled .mdc-textfield__input {
+      padding-bottom: 0; }
+  .mdc-textfield--box .mdc-textfield__bottom-line {
+    position: absolute;
+    bottom: 0;
+    left: 0;
+    width: 100%;
+    height: 1px;
+    -webkit-transform: scaleY(1);
+            transform: scaleY(1);
+    -webkit-transform-origin: center bottom;
+            transform-origin: center bottom;
+    -webkit-transition: background-color 33ms cubic-bezier(0.4, 0, 0.2, 1), -webkit-transform 180ms cubic-bezier(0.4, 0, 0.2, 1);
+    transition: background-color 33ms cubic-bezier(0.4, 0, 0.2, 1), -webkit-transform 180ms cubic-bezier(0.4, 0, 0.2, 1);
+    transition: background-color 33ms cubic-bezier(0.4, 0, 0.2, 1), transform 180ms cubic-bezier(0.4, 0, 0.2, 1);
+    transition: background-color 33ms cubic-bezier(0.4, 0, 0.2, 1), transform 180ms cubic-bezier(0.4, 0, 0.2, 1), -webkit-transform 180ms cubic-bezier(0.4, 0, 0.2, 1);
+    background-color: rgba(0, 0, 0, 0.42);
+    pointer-events: none; }
+    .mdc-textfield--box .mdc-textfield__bottom-line::after {
+      position: absolute;
+      top: 0;
+      left: 0;
+      width: 100%;
+      height: 100%;
+      -webkit-transition: opacity 180ms cubic-bezier(0.4, 0, 0.2, 1);
+      transition: opacity 180ms cubic-bezier(0.4, 0, 0.2, 1);
+      background-color: #d50000;
+      content: "";
+      opacity: 0; }
+    .mdc-textfield--theme-dark .mdc-textfield--box .mdc-textfield__bottom-line,
+    .mdc-theme--dark .mdc-textfield--box .mdc-textfield__bottom-line {
+      /* @alternate */
+      background-color: rgba(255, 255, 255, 0.5);
+      background-color: var(--mdc-theme-text-hint-on-dark, rgba(255, 255, 255, 0.5)); }
+      .mdc-textfield--theme-dark .mdc-textfield--box .mdc-textfield__bottom-line::after,
+      .mdc-theme--dark .mdc-textfield--box .mdc-textfield__bottom-line::after {
+        background-color: #ff6e6e; }
+  .mdc-textfield--box.mdc-textfield--focused .mdc-textfield__bottom-line {
+    /* @alternate */
+    background-color: #3f51b5;
+    background-color: var(--mdc-theme-primary, #3f51b5);
+    -webkit-transform: scaleY(2);
+            transform: scaleY(2); }
+  .mdc-textfield--box.mdc-textfield--disabled .mdc-textfield__bottom-line {
+    display: none; }
+  .mdc-textfield--box.mdc-textfield--invalid .mdc-textfield__bottom-line::after {
+    opacity: 1; }
+  .mdc-textfield--box.mdc-textfield--dense {
+    height: 44px; }
+    .mdc-textfield--box.mdc-textfield--dense .mdc-textfield__input {
+      padding: 12px 12px 0; }
+    .mdc-textfield--box.mdc-textfield--dense .mdc-textfield__label {
+      left: 12px;
+      right: initial;
+      bottom: 12px; }
+      [dir="rtl"] .mdc-textfield--box.mdc-textfield--dense .mdc-textfield__label, .mdc-textfield--box.mdc-textfield--dense .mdc-textfield__label[dir="rtl"] {
+        left: initial;
+        right: 12px; }
+      .mdc-textfield--box.mdc-textfield--dense .mdc-textfield__label--float-above {
+        -webkit-transform: translateY(calc(-75% - 2px)) scale(0.923, 0.923);
+                transform: translateY(calc(-75% - 2px)) scale(0.923, 0.923); }
+
+.mdc-textfield--upgraded:not(.mdc-textfield--fullwidth):not(.mdc-textfield--box) {
+  display: -webkit-inline-box;
+  display: -ms-inline-flexbox;
+  display: inline-flex;
+  position: relative;
+  -webkit-box-sizing: border-box;
+          box-sizing: border-box;
+  -webkit-box-align: end;
+      -ms-flex-align: end;
+          align-items: flex-end;
+  margin-top: 16px; }
+  .mdc-textfield--upgraded:not(.mdc-textfield--fullwidth):not(.mdc-textfield--box):not(.mdc-textfield--multiline) {
+    height: 48px; }
+    .mdc-textfield--upgraded:not(.mdc-textfield--fullwidth):not(.mdc-textfield--box):not(.mdc-textfield--multiline)::after {
+      position: absolute;
+      bottom: 0;
+      left: 0;
+      width: 100%;
+      height: 1px;
+      -webkit-transform: translateY(50%) scaleY(1);
+              transform: translateY(50%) scaleY(1);
+      -webkit-transform-origin: center bottom;
+              transform-origin: center bottom;
+      -webkit-transition: background-color 180ms cubic-bezier(0.4, 0, 0.2, 1), -webkit-transform 180ms cubic-bezier(0.4, 0, 0.2, 1);
+      transition: background-color 180ms cubic-bezier(0.4, 0, 0.2, 1), -webkit-transform 180ms cubic-bezier(0.4, 0, 0.2, 1);
+      transition: background-color 180ms cubic-bezier(0.4, 0, 0.2, 1), transform 180ms cubic-bezier(0.4, 0, 0.2, 1);
+      transition: background-color 180ms cubic-bezier(0.4, 0, 0.2, 1), transform 180ms cubic-bezier(0.4, 0, 0.2, 1), -webkit-transform 180ms cubic-bezier(0.4, 0, 0.2, 1);
+      background-color: rgba(0, 0, 0, 0.12);
+      content: ""; }
+      .mdc-textfield--theme-dark .mdc-textfield--upgraded:not(.mdc-textfield--fullwidth):not(.mdc-textfield--box):not(.mdc-textfield--multiline)::after,
+      .mdc-theme--dark .mdc-textfield--upgraded:not(.mdc-textfield--fullwidth):not(.mdc-textfield--box):not(.mdc-textfield--multiline)::after {
+        background-color: rgba(255, 255, 255, 0.12); }
+  .mdc-textfield--upgraded:not(.mdc-textfield--fullwidth):not(.mdc-textfield--box) .mdc-textfield__label {
+    pointer-events: none; }
+
+.mdc-textfield--focused.mdc-textfield--upgraded:not(.mdc-textfield--fullwidth):not(.mdc-textfield--multiline):not(.mdc-textfield--box)::after {
+  /* @alternate */
+  background-color: #3f51b5;
+  background-color: var(--mdc-theme-primary, #3f51b5);
+  -webkit-transform: translateY(100%) scaleY(2);
+          transform: translateY(100%) scaleY(2);
+  -webkit-transition: -webkit-transform 180ms cubic-bezier(0.4, 0, 0.2, 1);
+  transition: -webkit-transform 180ms cubic-bezier(0.4, 0, 0.2, 1);
+  transition: transform 180ms cubic-bezier(0.4, 0, 0.2, 1);
+  transition: transform 180ms cubic-bezier(0.4, 0, 0.2, 1), -webkit-transform 180ms cubic-bezier(0.4, 0, 0.2, 1); }
+  .mdc-textfield--theme-dark.mdc-textfield--focused.mdc-textfield--upgraded:not(.mdc-textfield--fullwidth):not(.mdc-textfield--multiline):not(.mdc-textfield--box)::after,
+  .mdc-theme--dark .mdc-textfield--focused.mdc-textfield--upgraded:not(.mdc-textfield--fullwidth):not(.mdc-textfield--multiline):not(.mdc-textfield--box)::after {
+    /* @alternate */
+    background-color: #3f51b5;
+    background-color: var(--mdc-theme-primary, #3f51b5);
+    -webkit-transform: translateY(100%) scaleY(2);
+            transform: translateY(100%) scaleY(2);
+    -webkit-transition: -webkit-transform 180ms cubic-bezier(0.4, 0, 0.2, 1);
+    transition: -webkit-transform 180ms cubic-bezier(0.4, 0, 0.2, 1);
+    transition: transform 180ms cubic-bezier(0.4, 0, 0.2, 1);
+    transition: transform 180ms cubic-bezier(0.4, 0, 0.2, 1), -webkit-transform 180ms cubic-bezier(0.4, 0, 0.2, 1); }
+
+.mdc-textfield--focused .mdc-textfield__label {
+  /* @alternate */
+  color: #3f51b5;
+  color: var(--mdc-theme-primary, #3f51b5); }
+  .mdc-textfield--theme-dark .mdc-textfield--focused .mdc-textfield__label,
+  .mdc-theme--dark .mdc-textfield--focused .mdc-textfield__label {
+    /* @alternate */
+    color: #3f51b5;
+    color: var(--mdc-theme-primary, #3f51b5); }
+
+.mdc-textfield--dense {
+  margin-top: 12px;
+  margin-bottom: 4px;
+  font-size: .813rem; }
+  .mdc-textfield--dense .mdc-textfield__label--float-above {
+    -webkit-transform: translateY(calc(-100% - 2px)) scale(0.923, 0.923);
+            transform: translateY(calc(-100% - 2px)) scale(0.923, 0.923); }
+
+.mdc-textfield--invalid:not(.mdc-textfield--focused):not(.mdc-textfield--box)::after, .mdc-textfield--invalid:not(.mdc-textfield--focused):not(.mdc-textfield--box).mdc-textfield--upgraded::after {
+  background-color: #d50000; }
+
+.mdc-textfield--invalid:not(.mdc-textfield--focused):not(.mdc-textfield--box) .mdc-textfield__label {
+  color: #d50000; }
+
+.mdc-textfield--theme-dark.mdc-textfield--invalid:not(.mdc-textfield--focused)::after, .mdc-textfield--theme-dark.mdc-textfield--invalid:not(.mdc-textfield--focused).mdc-textfield--upgraded::after,
+.mdc-theme--dark .mdc-textfield--invalid:not(.mdc-textfield--focused)::after,
+.mdc-theme--dark .mdc-textfield--invalid:not(.mdc-textfield--focused).mdc-textfield--upgraded::after {
+  background-color: #ff6e6e; }
+
+.mdc-textfield--theme-dark.mdc-textfield--invalid:not(.mdc-textfield--focused) .mdc-textfield__label,
+.mdc-theme--dark .mdc-textfield--invalid:not(.mdc-textfield--focused) .mdc-textfield__label {
+  color: #ff6e6e; }
+
+.mdc-textfield--disabled {
+  pointer-events: none;
+  border-bottom: 1px dotted rgba(35, 31, 32, 0.26); }
+  .mdc-textfield--disabled::after {
+    display: none; }
+  .mdc-textfield--disabled .mdc-textfield__input {
+    padding-bottom: 7px; }
+  .mdc-textfield--theme-dark.mdc-textfield--disabled,
+  .mdc-theme--dark .mdc-textfield--disabled {
+    border-bottom: 1px dotted rgba(255, 255, 255, 0.3); }
+  .mdc-textfield--disabled .mdc-textfield__input,
+  .mdc-textfield--disabled .mdc-textfield__label,
+  .mdc-textfield--disabled + .mdc-textfield-helptext {
+    /* @alternate */
+    color: rgba(0, 0, 0, 0.38);
+    color: var(--mdc-theme-text-disabled-on-light, rgba(0, 0, 0, 0.38)); }
+  .mdc-textfield--theme-dark .mdc-textfield--disabled .mdc-textfield__input,
+  .mdc-theme--dark .mdc-textfield--disabled .mdc-textfield__input, .mdc-textfield--theme-dark
+  .mdc-textfield--disabled .mdc-textfield__label,
+  .mdc-theme--dark
+  .mdc-textfield--disabled .mdc-textfield__label {
+    /* @alternate */
+    color: rgba(255, 255, 255, 0.5);
+    color: var(--mdc-theme-text-disabled-on-dark, rgba(255, 255, 255, 0.5)); }
+  .mdc-textfield--theme-dark.mdc-textfield--disabled + .mdc-textfield-helptext,
+  .mdc-theme--dark .mdc-textfield--disabled + .mdc-textfield-helptext {
+    /* @alternate */
+    color: rgba(255, 255, 255, 0.5);
+    color: var(--mdc-theme-text-disabled-on-dark, rgba(255, 255, 255, 0.5)); }
+  .mdc-textfield--disabled .mdc-textfield__label {
+    bottom: 7px;
+    cursor: default; }
+
+.mdc-textfield__input:required + .mdc-textfield__label::after {
+  margin-left: 1px;
+  content: "*"; }
+  .mdc-textfield--focused .mdc-textfield__input:required + .mdc-textfield__label::after {
+    color: #d50000; }
+    .mdc-textfield--theme-dark.mdc-textfield--focused .mdc-textfield__input:required + .mdc-textfield__label::after,
+    .mdc-theme--dark .mdc-textfield--focused .mdc-textfield__input:required + .mdc-textfield__label::after {
+      color: #ff6e6e; }
+
+.mdc-textfield--multiline {
+  display: -webkit-box;
+  display: -ms-flexbox;
+  display: flex;
+  height: initial;
+  -webkit-transition: none;
+  transition: none; }
+  .mdc-textfield--multiline::after {
+    content: initial; }
+  .mdc-textfield--multiline .mdc-textfield__input {
+    padding: 4px;
+    -webkit-transition: border-color 180ms cubic-bezier(0.4, 0, 0.2, 1);
+    transition: border-color 180ms cubic-bezier(0.4, 0, 0.2, 1);
+    border: 1px solid rgba(0, 0, 0, 0.12);
+    border-radius: 2px; }
+    .mdc-textfield--theme-dark .mdc-textfield--multiline .mdc-textfield__input,
+    .mdc-theme--dark .mdc-textfield--multiline .mdc-textfield__input {
+      border-color: rgba(255, 255, 255, 0.12); }
+    .mdc-textfield--multiline .mdc-textfield__input:focus {
+      /* @alternate */
+      border-color: #3f51b5;
+      border-color: var(--mdc-theme-primary, #3f51b5); }
+    .mdc-textfield--multiline .mdc-textfield__input:invalid:not(:focus) {
+      border-color: #d50000; }
+    .mdc-textfield--theme-dark .mdc-textfield--multiline .mdc-textfield__input:invalid:not(:focus),
+    .mdc-theme--dark .mdc-textfield--multiline .mdc-textfield__input:invalid:not(:focus) {
+      border-color: #ff6e6e; }
+  .mdc-textfield--multiline .mdc-textfield__label {
+    top: 6px;
+    bottom: initial;
+    left: 4px; }
+    [dir="rtl"] .mdc-textfield--multiline .mdc-textfield--multiline .mdc-textfield__label,
+    .mdc-textfield--multiline[dir="rtl"] .mdc-textfield--multiline .mdc-textfield__label {
+      right: 4px;
+      left: auto; }
+    .mdc-textfield--multiline .mdc-textfield__label--float-above {
+      -webkit-transform: translateY(calc(-100% - 6px)) scale(0.923, 0.923);
+              transform: translateY(calc(-100% - 6px)) scale(0.923, 0.923); }
+  .mdc-textfield--multiline.mdc-textfield--disabled {
+    border-bottom: none; }
+    .mdc-textfield--multiline.mdc-textfield--disabled .mdc-textfield__input {
+      border: 1px dotted rgba(35, 31, 32, 0.26); }
+      .mdc-textfield--theme-dark .mdc-textfield--multiline.mdc-textfield--disabled .mdc-textfield__input,
+      .mdc-theme--dark .mdc-textfield--multiline.mdc-textfield--disabled .mdc-textfield__input {
+        border-color: rgba(255, 255, 255, 0.3); }
+
+.mdc-textfield--fullwidth {
+  display: block;
+  width: 100%;
+  -webkit-box-sizing: border-box;
+          box-sizing: border-box;
+  margin: 0;
+  border: none;
+  border-bottom: 1px solid rgba(0, 0, 0, 0.12);
+  outline: none; }
+  .mdc-textfield--fullwidth:not(.mdc-textfield--multiline) {
+    height: 56px; }
+  .mdc-textfield--fullwidth.mdc-textfield--multiline {
+    padding: 20px 0 0; }
+  .mdc-textfield--fullwidth.mdc-textfield--dense:not(.mdc-textfield--multiline) {
+    height: 48px; }
+  .mdc-textfield--fullwidth.mdc-textfield--dense.mdc-textfield--multiline {
+    padding: 16px 0 0; }
+  .mdc-textfield--fullwidth.mdc-textfield--disabled, .mdc-textfield--fullwidth.mdc-textfield--disabled.mdc-textfield--multiline {
+    border-bottom: 1px dotted rgba(0, 0, 0, 0.12); }
+  .mdc-textfield--fullwidth--theme-dark,
+  .mdc-theme--dark .mdc-textfield--fullwidth {
+    border-bottom: 1px solid rgba(255, 255, 255, 0.12); }
+    .mdc-textfield--fullwidth--theme-dark.mdc-textfield--disabled, .mdc-textfield--fullwidth--theme-dark.mdc-textfield--disabled.mdc-textfield--multiline,
+    .mdc-theme--dark .mdc-textfield--fullwidth.mdc-textfield--disabled,
+    .mdc-theme--dark .mdc-textfield--fullwidth.mdc-textfield--disabled.mdc-textfield--multiline {
+      border-bottom: 1px dotted rgba(255, 255, 255, 0.12); }
+  .mdc-textfield--fullwidth .mdc-textfield__input {
+    width: 100%;
+    height: 100%;
+    padding: 0;
+    resize: none;
+    border: none !important; }
+
+.mdc-textfield:not(.mdc-textfield--upgraded):not(.mdc-textfield--multiline) .mdc-textfield__input {
+  -webkit-transition: border-bottom-color 180ms cubic-bezier(0.4, 0, 0.2, 1);
+  transition: border-bottom-color 180ms cubic-bezier(0.4, 0, 0.2, 1);
+  border-bottom: 1px solid rgba(0, 0, 0, 0.12); }
+
+.mdc-textfield:not(.mdc-textfield--upgraded) .mdc-textfield__input:focus {
+  /* @alternate */
+  border-color: #3f51b5;
+  border-color: var(--mdc-theme-primary, #3f51b5); }
+
+.mdc-textfield:not(.mdc-textfield--upgraded) .mdc-textfield__input:disabled {
+  /* @alternate */
+  color: rgba(0, 0, 0, 0.38);
+  color: var(--mdc-theme-text-disabled-on-light, rgba(0, 0, 0, 0.38));
+  border-style: dotted;
+  border-color: rgba(35, 31, 32, 0.26); }
+
+.mdc-textfield:not(.mdc-textfield--upgraded) .mdc-textfield__input:invalid:not(:focus) {
+  border-color: #d50000; }
+
+.mdc-textfield--theme-dark:not(.mdc-textfield--upgraded) .mdc-textfield__input:not(:focus),
+.mdc-theme--dark .mdc-textfield:not(.mdc-textfield--upgraded) .mdc-textfield__input:not(:focus) {
+  border-color: rgba(255, 255, 255, 0.12); }
+
+.mdc-textfield--theme-dark:not(.mdc-textfield--upgraded) .mdc-textfield__input:disabled,
+.mdc-theme--dark .mdc-textfield:not(.mdc-textfield--upgraded) .mdc-textfield__input:disabled {
+  /* @alternate */
+  color: rgba(255, 255, 255, 0.5);
+  color: var(--mdc-theme-text-disabled-on-dark, rgba(255, 255, 255, 0.5));
+  border-color: rgba(255, 255, 255, 0.3); }
+
+.mdc-textfield--theme-dark:not(.mdc-textfield--upgraded) .mdc-textfield__input:invalid:not(:focus),
+.mdc-theme--dark .mdc-textfield:not(.mdc-textfield--upgraded) .mdc-textfield__input:invalid:not(:focus) {
+  border-color: #ff6e6e; }
+
+.mdc-textfield--box:not(.mdc-textfield--upgraded) {
+  height: 36px; }
+  .mdc-textfield--box:not(.mdc-textfield--upgraded)::before, .mdc-textfield--box:not(.mdc-textfield--upgraded)::after {
+    border-radius: 0; }
+  .mdc-textfield--box:not(.mdc-textfield--upgraded) .mdc-textfield__input {
+    padding-top: 0; }
+
+.mdc-textfield-helptext {
+  /* @alternate */
+  color: rgba(0, 0, 0, 0.38);
+  color: var(--mdc-theme-text-hint-on-light, rgba(0, 0, 0, 0.38));
+  margin: 0;
+  -webkit-transition: opacity 180ms cubic-bezier(0.4, 0, 0.2, 1);
+  transition: opacity 180ms cubic-bezier(0.4, 0, 0.2, 1);
+  font-size: .75rem;
+  opacity: 0;
+  will-change: opacity; }
+  .mdc-textfield-helptext--theme-dark,
+  .mdc-theme--dark .mdc-textfield-helptext {
+    /* @alternate */
+    color: rgba(255, 255, 255, 0.5);
+    color: var(--mdc-theme-text-hint-on-dark, rgba(255, 255, 255, 0.5)); }
+  .mdc-textfield + .mdc-textfield-helptext {
+    margin-bottom: 8px; }
+  .mdc-textfield--dense + .mdc-textfield-helptext {
+    margin-bottom: 4px; }
+  .mdc-textfield--focused + .mdc-textfield-helptext:not(.mdc-textfield-helptext--validation-msg) {
+    opacity: 1; }
+
+.mdc-textfield-helptext--persistent {
+  -webkit-transition: none;
+  transition: none;
+  opacity: 1;
+  will-change: initial; }
+
+.mdc-textfield--invalid + .mdc-textfield-helptext--validation-msg {
+  color: #d50000;
+  opacity: 1; }
+
+.mdc-textfield--theme-dark.mdc-textfield--invalid + .mdc-textfield-helptext--validation-msg,
+.mdc-theme--dark .mdc-textfield--invalid + .mdc-textfield-helptext--validation-msg {
+  color: #ff6e6e; }
+
+.mdc-form-field > .mdc-textfield + label {
+  -ms-flex-item-align: start;
+      align-self: flex-start; }

+ 83 - 0
support/client/lib/vwf/view/lib/mdc/dist/mdc.textfield.css-entry

@@ -0,0 +1,83 @@
+/*!
+ Material Components for the web
+ Copyright (c) 2017 Google Inc.
+ License: Apache-2.0
+*/
+/******/ (function(modules) { // webpackBootstrap
+/******/ 	// The module cache
+/******/ 	var installedModules = {};
+/******/
+/******/ 	// The require function
+/******/ 	function __webpack_require__(moduleId) {
+/******/
+/******/ 		// Check if module is in cache
+/******/ 		if(installedModules[moduleId]) {
+/******/ 			return installedModules[moduleId].exports;
+/******/ 		}
+/******/ 		// Create a new module (and put it into the cache)
+/******/ 		var module = installedModules[moduleId] = {
+/******/ 			i: moduleId,
+/******/ 			l: false,
+/******/ 			exports: {}
+/******/ 		};
+/******/
+/******/ 		// Execute the module function
+/******/ 		modules[moduleId].call(module.exports, module, module.exports, __webpack_require__);
+/******/
+/******/ 		// Flag the module as loaded
+/******/ 		module.l = true;
+/******/
+/******/ 		// Return the exports of the module
+/******/ 		return module.exports;
+/******/ 	}
+/******/
+/******/
+/******/ 	// expose the modules object (__webpack_modules__)
+/******/ 	__webpack_require__.m = modules;
+/******/
+/******/ 	// expose the module cache
+/******/ 	__webpack_require__.c = installedModules;
+/******/
+/******/ 	// identity function for calling harmony imports with the correct context
+/******/ 	__webpack_require__.i = function(value) { return value; };
+/******/
+/******/ 	// define getter function for harmony exports
+/******/ 	__webpack_require__.d = function(exports, name, getter) {
+/******/ 		if(!__webpack_require__.o(exports, name)) {
+/******/ 			Object.defineProperty(exports, name, {
+/******/ 				configurable: false,
+/******/ 				enumerable: true,
+/******/ 				get: getter
+/******/ 			});
+/******/ 		}
+/******/ 	};
+/******/
+/******/ 	// getDefaultExport function for compatibility with non-harmony modules
+/******/ 	__webpack_require__.n = function(module) {
+/******/ 		var getter = module && module.__esModule ?
+/******/ 			function getDefault() { return module['default']; } :
+/******/ 			function getModuleExports() { return module; };
+/******/ 		__webpack_require__.d(getter, 'a', getter);
+/******/ 		return getter;
+/******/ 	};
+/******/
+/******/ 	// Object.prototype.hasOwnProperty.call
+/******/ 	__webpack_require__.o = function(object, property) { return Object.prototype.hasOwnProperty.call(object, property); };
+/******/
+/******/ 	// __webpack_public_path__
+/******/ 	__webpack_require__.p = "/assets/";
+/******/
+/******/ 	// Load entry module and return exports
+/******/ 	return __webpack_require__(__webpack_require__.s = 23);
+/******/ })
+/************************************************************************/
+/******/ ({
+
+/***/ 23:
+/***/ (function(module, exports) {
+
+// removed by extract-text-webpack-plugin
+
+/***/ })
+
+/******/ });

+ 2167 - 0
support/client/lib/vwf/view/lib/mdc/dist/mdc.textfield.js

@@ -0,0 +1,2167 @@
+/*!
+ Material Components for the web
+ Copyright (c) 2017 Google Inc.
+ License: Apache-2.0
+*/
+(function webpackUniversalModuleDefinition(root, factory) {
+	if(typeof exports === 'object' && typeof module === 'object')
+		module.exports = factory();
+	else if(typeof define === 'function' && define.amd)
+		define([], factory);
+	else if(typeof exports === 'object')
+		exports["textfield"] = factory();
+	else
+		root["mdc"] = root["mdc"] || {}, root["mdc"]["textfield"] = factory();
+})(this, function() {
+return /******/ (function(modules) { // webpackBootstrap
+/******/ 	// The module cache
+/******/ 	var installedModules = {};
+/******/
+/******/ 	// The require function
+/******/ 	function __webpack_require__(moduleId) {
+/******/
+/******/ 		// Check if module is in cache
+/******/ 		if(installedModules[moduleId]) {
+/******/ 			return installedModules[moduleId].exports;
+/******/ 		}
+/******/ 		// Create a new module (and put it into the cache)
+/******/ 		var module = installedModules[moduleId] = {
+/******/ 			i: moduleId,
+/******/ 			l: false,
+/******/ 			exports: {}
+/******/ 		};
+/******/
+/******/ 		// Execute the module function
+/******/ 		modules[moduleId].call(module.exports, module, module.exports, __webpack_require__);
+/******/
+/******/ 		// Flag the module as loaded
+/******/ 		module.l = true;
+/******/
+/******/ 		// Return the exports of the module
+/******/ 		return module.exports;
+/******/ 	}
+/******/
+/******/
+/******/ 	// expose the modules object (__webpack_modules__)
+/******/ 	__webpack_require__.m = modules;
+/******/
+/******/ 	// expose the module cache
+/******/ 	__webpack_require__.c = installedModules;
+/******/
+/******/ 	// identity function for calling harmony imports with the correct context
+/******/ 	__webpack_require__.i = function(value) { return value; };
+/******/
+/******/ 	// define getter function for harmony exports
+/******/ 	__webpack_require__.d = function(exports, name, getter) {
+/******/ 		if(!__webpack_require__.o(exports, name)) {
+/******/ 			Object.defineProperty(exports, name, {
+/******/ 				configurable: false,
+/******/ 				enumerable: true,
+/******/ 				get: getter
+/******/ 			});
+/******/ 		}
+/******/ 	};
+/******/
+/******/ 	// getDefaultExport function for compatibility with non-harmony modules
+/******/ 	__webpack_require__.n = function(module) {
+/******/ 		var getter = module && module.__esModule ?
+/******/ 			function getDefault() { return module['default']; } :
+/******/ 			function getModuleExports() { return module; };
+/******/ 		__webpack_require__.d(getter, 'a', getter);
+/******/ 		return getter;
+/******/ 	};
+/******/
+/******/ 	// Object.prototype.hasOwnProperty.call
+/******/ 	__webpack_require__.o = function(object, property) { return Object.prototype.hasOwnProperty.call(object, property); };
+/******/
+/******/ 	// __webpack_public_path__
+/******/ 	__webpack_require__.p = "/assets/";
+/******/
+/******/ 	// Load entry module and return exports
+/******/ 	return __webpack_require__(__webpack_require__.s = 98);
+/******/ })
+/************************************************************************/
+/******/ ({
+
+/***/ 0:
+/***/ (function(module, __webpack_exports__, __webpack_require__) {
+
+"use strict";
+var _createClass = function () { function defineProperties(target, props) { for (var i = 0; i < props.length; i++) { var descriptor = props[i]; descriptor.enumerable = descriptor.enumerable || false; descriptor.configurable = true; if ("value" in descriptor) descriptor.writable = true; Object.defineProperty(target, descriptor.key, descriptor); } } return function (Constructor, protoProps, staticProps) { if (protoProps) defineProperties(Constructor.prototype, protoProps); if (staticProps) defineProperties(Constructor, staticProps); return Constructor; }; }();
+
+function _classCallCheck(instance, Constructor) { if (!(instance instanceof Constructor)) { throw new TypeError("Cannot call a class as a function"); } }
+
+/**
+ * Copyright 2016 Google Inc.
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *   http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+
+/**
+ * @template A
+ */
+var MDCFoundation = function () {
+  _createClass(MDCFoundation, null, [{
+    key: "cssClasses",
+
+    /** @return enum{cssClasses} */
+    get: function get() {
+      // Classes extending MDCFoundation should implement this method to return an object which exports every
+      // CSS class the foundation class needs as a property. e.g. {ACTIVE: 'mdc-component--active'}
+      return {};
+    }
+
+    /** @return enum{strings} */
+
+  }, {
+    key: "strings",
+    get: function get() {
+      // Classes extending MDCFoundation should implement this method to return an object which exports all
+      // semantic strings as constants. e.g. {ARIA_ROLE: 'tablist'}
+      return {};
+    }
+
+    /** @return enum{numbers} */
+
+  }, {
+    key: "numbers",
+    get: function get() {
+      // Classes extending MDCFoundation should implement this method to return an object which exports all
+      // of its semantic numbers as constants. e.g. {ANIMATION_DELAY_MS: 350}
+      return {};
+    }
+
+    /** @return {!Object} */
+
+  }, {
+    key: "defaultAdapter",
+    get: function get() {
+      // Classes extending MDCFoundation may choose to implement this getter in order to provide a convenient
+      // way of viewing the necessary methods of an adapter. In the future, this could also be used for adapter
+      // validation.
+      return {};
+    }
+
+    /**
+     * @param {A=} adapter
+     */
+
+  }]);
+
+  function MDCFoundation() {
+    var adapter = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : {};
+
+    _classCallCheck(this, MDCFoundation);
+
+    /** @protected {!A} */
+    this.adapter_ = adapter;
+  }
+
+  _createClass(MDCFoundation, [{
+    key: "init",
+    value: function init() {
+      // Subclasses should override this method to perform initialization routines (registering events, etc.)
+    }
+  }, {
+    key: "destroy",
+    value: function destroy() {
+      // Subclasses should override this method to perform de-initialization routines (de-registering events, etc.)
+    }
+  }]);
+
+  return MDCFoundation;
+}();
+
+/* harmony default export */ __webpack_exports__["a"] = (MDCFoundation);
+
+/***/ }),
+
+/***/ 1:
+/***/ (function(module, __webpack_exports__, __webpack_require__) {
+
+"use strict";
+/* harmony import */ var __WEBPACK_IMPORTED_MODULE_0__foundation__ = __webpack_require__(0);
+var _createClass = function () { function defineProperties(target, props) { for (var i = 0; i < props.length; i++) { var descriptor = props[i]; descriptor.enumerable = descriptor.enumerable || false; descriptor.configurable = true; if ("value" in descriptor) descriptor.writable = true; Object.defineProperty(target, descriptor.key, descriptor); } } return function (Constructor, protoProps, staticProps) { if (protoProps) defineProperties(Constructor.prototype, protoProps); if (staticProps) defineProperties(Constructor, staticProps); return Constructor; }; }();
+
+function _classCallCheck(instance, Constructor) { if (!(instance instanceof Constructor)) { throw new TypeError("Cannot call a class as a function"); } }
+
+/**
+ * Copyright 2016 Google Inc.
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *   http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+
+
+
+/**
+ * @template F
+ */
+
+var MDCComponent = function () {
+  _createClass(MDCComponent, null, [{
+    key: 'attachTo',
+
+    /**
+     * @param {!Element} root
+     * @return {!MDCComponent}
+     */
+    value: function attachTo(root) {
+      // Subclasses which extend MDCBase should provide an attachTo() method that takes a root element and
+      // returns an instantiated component with its root set to that element. Also note that in the cases of
+      // subclasses, an explicit foundation class will not have to be passed in; it will simply be initialized
+      // from getDefaultFoundation().
+      return new MDCComponent(root, new __WEBPACK_IMPORTED_MODULE_0__foundation__["a" /* default */]());
+    }
+
+    /**
+     * @param {!Element} root
+     * @param {F=} foundation
+     * @param {...?} args
+     */
+
+  }]);
+
+  function MDCComponent(root) {
+    var foundation = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : undefined;
+
+    _classCallCheck(this, MDCComponent);
+
+    /** @protected {!Element} */
+    this.root_ = root;
+
+    for (var _len = arguments.length, args = Array(_len > 2 ? _len - 2 : 0), _key = 2; _key < _len; _key++) {
+      args[_key - 2] = arguments[_key];
+    }
+
+    this.initialize.apply(this, args);
+    // Note that we initialize foundation here and not within the constructor's default param so that
+    // this.root_ is defined and can be used within the foundation class.
+    /** @protected {!F} */
+    this.foundation_ = foundation === undefined ? this.getDefaultFoundation() : foundation;
+    this.foundation_.init();
+    this.initialSyncWithDOM();
+  }
+
+  _createClass(MDCComponent, [{
+    key: 'initialize',
+    value: function initialize() /* ...args */{}
+    // Subclasses can override this to do any additional setup work that would be considered part of a
+    // "constructor". Essentially, it is a hook into the parent constructor before the foundation is
+    // initialized. Any additional arguments besides root and foundation will be passed in here.
+
+
+    /**
+     * @return {!F} foundation
+     */
+
+  }, {
+    key: 'getDefaultFoundation',
+    value: function getDefaultFoundation() {
+      // Subclasses must override this method to return a properly configured foundation class for the
+      // component.
+      throw new Error('Subclasses must override getDefaultFoundation to return a properly configured ' + 'foundation class');
+    }
+  }, {
+    key: 'initialSyncWithDOM',
+    value: function initialSyncWithDOM() {
+      // Subclasses should override this method if they need to perform work to synchronize with a host DOM
+      // object. An example of this would be a form control wrapper that needs to synchronize its internal state
+      // to some property or attribute of the host DOM. Please note: this is *not* the place to perform DOM
+      // reads/writes that would cause layout / paint, as this is called synchronously from within the constructor.
+    }
+  }, {
+    key: 'destroy',
+    value: function destroy() {
+      // Subclasses may implement this method to release any resources / deregister any listeners they have
+      // attached. An example of this might be deregistering a resize event from the window object.
+      this.foundation_.destroy();
+    }
+
+    /**
+     * Wrapper method to add an event listener to the component's root element. This is most useful when
+     * listening for custom events.
+     * @param {string} evtType
+     * @param {!Function} handler
+     */
+
+  }, {
+    key: 'listen',
+    value: function listen(evtType, handler) {
+      this.root_.addEventListener(evtType, handler);
+    }
+
+    /**
+     * Wrapper method to remove an event listener to the component's root element. This is most useful when
+     * unlistening for custom events.
+     * @param {string} evtType
+     * @param {!Function} handler
+     */
+
+  }, {
+    key: 'unlisten',
+    value: function unlisten(evtType, handler) {
+      this.root_.removeEventListener(evtType, handler);
+    }
+
+    /**
+     * Fires a cross-browser-compatible custom event from the component root of the given type,
+     * with the given data.
+     * @param {string} evtType
+     * @param {!Object} evtData
+     * @param {boolean=} shouldBubble
+     */
+
+  }, {
+    key: 'emit',
+    value: function emit(evtType, evtData) {
+      var shouldBubble = arguments.length > 2 && arguments[2] !== undefined ? arguments[2] : false;
+
+      var evt = void 0;
+      if (typeof CustomEvent === 'function') {
+        evt = new CustomEvent(evtType, {
+          detail: evtData,
+          bubbles: shouldBubble
+        });
+      } else {
+        evt = document.createEvent('CustomEvent');
+        evt.initCustomEvent(evtType, shouldBubble, false, evtData);
+      }
+
+      this.root_.dispatchEvent(evt);
+    }
+  }]);
+
+  return MDCComponent;
+}();
+
+/* harmony default export */ __webpack_exports__["a"] = (MDCComponent);
+
+/***/ }),
+
+/***/ 2:
+/***/ (function(module, __webpack_exports__, __webpack_require__) {
+
+"use strict";
+Object.defineProperty(__webpack_exports__, "__esModule", { value: true });
+/* harmony import */ var __WEBPACK_IMPORTED_MODULE_0__foundation__ = __webpack_require__(0);
+/* harmony import */ var __WEBPACK_IMPORTED_MODULE_1__component__ = __webpack_require__(1);
+/* harmony import */ var __WEBPACK_IMPORTED_MODULE_2__selection_control__ = __webpack_require__(3);
+/* harmony reexport (binding) */ __webpack_require__.d(__webpack_exports__, "MDCFoundation", function() { return __WEBPACK_IMPORTED_MODULE_0__foundation__["a"]; });
+/* harmony reexport (binding) */ __webpack_require__.d(__webpack_exports__, "MDCComponent", function() { return __WEBPACK_IMPORTED_MODULE_1__component__["a"]; });
+/* harmony reexport (binding) */ __webpack_require__.d(__webpack_exports__, "SelectionControlState", function() { return __WEBPACK_IMPORTED_MODULE_2__selection_control__["a"]; });
+/**
+ * Copyright 2016 Google Inc.
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *   http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+
+
+
+
+
+
+
+/***/ }),
+
+/***/ 22:
+/***/ (function(module, __webpack_exports__, __webpack_require__) {
+
+"use strict";
+/* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, "a", function() { return strings; });
+/* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, "b", function() { return cssClasses; });
+/**
+ * Copyright 2016 Google Inc. All Rights Reserved.
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *      http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+var strings = {
+  ARIA_HIDDEN: 'aria-hidden',
+  ROLE: 'role',
+  INPUT_SELECTOR: '.mdc-textfield__input',
+  LABEL_SELECTOR: '.mdc-textfield__label'
+};
+
+var cssClasses = {
+  ROOT: 'mdc-textfield',
+  UPGRADED: 'mdc-textfield--upgraded',
+  DISABLED: 'mdc-textfield--disabled',
+  FOCUSED: 'mdc-textfield--focused',
+  INVALID: 'mdc-textfield--invalid',
+  HELPTEXT_PERSISTENT: 'mdc-textfield-helptext--persistent',
+  HELPTEXT_VALIDATION_MSG: 'mdc-textfield-helptext--validation-msg',
+  LABEL_FLOAT_ABOVE: 'mdc-textfield__label--float-above',
+  BOX: 'mdc-textfield--box'
+};
+
+/***/ }),
+
+/***/ 3:
+/***/ (function(module, __webpack_exports__, __webpack_require__) {
+
+"use strict";
+/* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, "a", function() { return SelectionControlState; });
+/**
+ * Copyright 2017 Google Inc. All Rights Reserved.
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *      http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+
+/**
+ * @typedef {!{
+ *   checked: boolean,
+ *   indeterminate: boolean,
+ *   disabled: boolean,
+ *   value: ?string
+ * }}
+ */
+var SelectionControlState = void 0;
+
+/***/ }),
+
+/***/ 36:
+/***/ (function(module, __webpack_exports__, __webpack_require__) {
+
+"use strict";
+Object.defineProperty(__webpack_exports__, "__esModule", { value: true });
+/* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, "MDCTextfield", function() { return MDCTextfield; });
+/* harmony import */ var __WEBPACK_IMPORTED_MODULE_0__material_base__ = __webpack_require__(2);
+/* harmony import */ var __WEBPACK_IMPORTED_MODULE_1__material_ripple__ = __webpack_require__(6);
+/* harmony import */ var __WEBPACK_IMPORTED_MODULE_2__constants__ = __webpack_require__(22);
+/* harmony import */ var __WEBPACK_IMPORTED_MODULE_3__foundation__ = __webpack_require__(75);
+/* harmony reexport (binding) */ __webpack_require__.d(__webpack_exports__, "MDCTextfieldFoundation", function() { return __WEBPACK_IMPORTED_MODULE_3__foundation__["a"]; });
+var _extends = Object.assign || function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; };
+
+var _createClass = function () { function defineProperties(target, props) { for (var i = 0; i < props.length; i++) { var descriptor = props[i]; descriptor.enumerable = descriptor.enumerable || false; descriptor.configurable = true; if ("value" in descriptor) descriptor.writable = true; Object.defineProperty(target, descriptor.key, descriptor); } } return function (Constructor, protoProps, staticProps) { if (protoProps) defineProperties(Constructor.prototype, protoProps); if (staticProps) defineProperties(Constructor, staticProps); return Constructor; }; }();
+
+var _get = function get(object, property, receiver) { if (object === null) object = Function.prototype; var desc = Object.getOwnPropertyDescriptor(object, property); if (desc === undefined) { var parent = Object.getPrototypeOf(object); if (parent === null) { return undefined; } else { return get(parent, property, receiver); } } else if ("value" in desc) { return desc.value; } else { var getter = desc.get; if (getter === undefined) { return undefined; } return getter.call(receiver); } };
+
+function _classCallCheck(instance, Constructor) { if (!(instance instanceof Constructor)) { throw new TypeError("Cannot call a class as a function"); } }
+
+function _possibleConstructorReturn(self, call) { if (!self) { throw new ReferenceError("this hasn't been initialised - super() hasn't been called"); } return call && (typeof call === "object" || typeof call === "function") ? call : self; }
+
+function _inherits(subClass, superClass) { if (typeof superClass !== "function" && superClass !== null) { throw new TypeError("Super expression must either be null or a function, not " + typeof superClass); } subClass.prototype = Object.create(superClass && superClass.prototype, { constructor: { value: subClass, enumerable: false, writable: true, configurable: true } }); if (superClass) Object.setPrototypeOf ? Object.setPrototypeOf(subClass, superClass) : subClass.__proto__ = superClass; }
+
+/**
+ * Copyright 2016 Google Inc. All Rights Reserved.
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *      http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+
+
+
+
+
+
+
+
+
+var MDCTextfield = function (_MDCComponent) {
+  _inherits(MDCTextfield, _MDCComponent);
+
+  function MDCTextfield() {
+    _classCallCheck(this, MDCTextfield);
+
+    return _possibleConstructorReturn(this, (MDCTextfield.__proto__ || Object.getPrototypeOf(MDCTextfield)).apply(this, arguments));
+  }
+
+  _createClass(MDCTextfield, [{
+    key: 'initialize',
+    value: function initialize() {
+      var rippleFactory = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : function (el) {
+        return new __WEBPACK_IMPORTED_MODULE_1__material_ripple__["MDCRipple"](el);
+      };
+
+      this.input_ = this.root_.querySelector(__WEBPACK_IMPORTED_MODULE_2__constants__["a" /* strings */].INPUT_SELECTOR);
+      this.label_ = this.root_.querySelector(__WEBPACK_IMPORTED_MODULE_2__constants__["a" /* strings */].LABEL_SELECTOR);
+      this.helptextElement = null;
+      this.ripple = null;
+      if (this.input_.hasAttribute('aria-controls')) {
+        this.helptextElement = document.getElementById(this.input_.getAttribute('aria-controls'));
+      }
+      if (this.root_.classList.contains(__WEBPACK_IMPORTED_MODULE_2__constants__["b" /* cssClasses */].BOX)) {
+        this.ripple = rippleFactory(this.root_);
+      };
+    }
+  }, {
+    key: 'destroy',
+    value: function destroy() {
+      if (this.ripple) {
+        this.ripple.destroy();
+      }
+      _get(MDCTextfield.prototype.__proto__ || Object.getPrototypeOf(MDCTextfield.prototype), 'destroy', this).call(this);
+    }
+  }, {
+    key: 'initialSyncWithDom',
+    value: function initialSyncWithDom() {
+      this.disabled = this.input_.disabled;
+    }
+  }, {
+    key: 'getDefaultFoundation',
+    value: function getDefaultFoundation() {
+      var _this2 = this;
+
+      return new __WEBPACK_IMPORTED_MODULE_3__foundation__["a" /* default */](_extends({
+        addClass: function addClass(className) {
+          return _this2.root_.classList.add(className);
+        },
+        removeClass: function removeClass(className) {
+          return _this2.root_.classList.remove(className);
+        },
+        addClassToLabel: function addClassToLabel(className) {
+          var label = _this2.label_;
+          if (label) {
+            label.classList.add(className);
+          }
+        },
+        removeClassFromLabel: function removeClassFromLabel(className) {
+          var label = _this2.label_;
+          if (label) {
+            label.classList.remove(className);
+          }
+        }
+      }, this.getInputAdapterMethods_(), this.getHelptextAdapterMethods_()));
+    }
+  }, {
+    key: 'getInputAdapterMethods_',
+    value: function getInputAdapterMethods_() {
+      var _this3 = this;
+
+      return {
+        registerInputFocusHandler: function registerInputFocusHandler(handler) {
+          return _this3.input_.addEventListener('focus', handler);
+        },
+        registerInputBlurHandler: function registerInputBlurHandler(handler) {
+          return _this3.input_.addEventListener('blur', handler);
+        },
+        registerInputInputHandler: function registerInputInputHandler(handler) {
+          return _this3.input_.addEventListener('input', handler);
+        },
+        registerInputKeydownHandler: function registerInputKeydownHandler(handler) {
+          return _this3.input_.addEventListener('keydown', handler);
+        },
+        deregisterInputFocusHandler: function deregisterInputFocusHandler(handler) {
+          return _this3.input_.removeEventListener('focus', handler);
+        },
+        deregisterInputBlurHandler: function deregisterInputBlurHandler(handler) {
+          return _this3.input_.removeEventListener('blur', handler);
+        },
+        deregisterInputInputHandler: function deregisterInputInputHandler(handler) {
+          return _this3.input_.removeEventListener('input', handler);
+        },
+        deregisterInputKeydownHandler: function deregisterInputKeydownHandler(handler) {
+          return _this3.input_.removeEventListener('keydown', handler);
+        },
+        getNativeInput: function getNativeInput() {
+          return _this3.input_;
+        }
+      };
+    }
+  }, {
+    key: 'getHelptextAdapterMethods_',
+    value: function getHelptextAdapterMethods_() {
+      var _this4 = this;
+
+      return {
+        addClassToHelptext: function addClassToHelptext(className) {
+          if (_this4.helptextElement) {
+            _this4.helptextElement.classList.add(className);
+          }
+        },
+        removeClassFromHelptext: function removeClassFromHelptext(className) {
+          if (_this4.helptextElement) {
+            _this4.helptextElement.classList.remove(className);
+          }
+        },
+        helptextHasClass: function helptextHasClass(className) {
+          if (!_this4.helptextElement) {
+            return false;
+          }
+          return _this4.helptextElement.classList.contains(className);
+        },
+        setHelptextAttr: function setHelptextAttr(name, value) {
+          if (_this4.helptextElement) {
+            _this4.helptextElement.setAttribute(name, value);
+          }
+        },
+        removeHelptextAttr: function removeHelptextAttr(name) {
+          if (_this4.helptextElement) {
+            _this4.helptextElement.removeAttribute(name);
+          }
+        }
+      };
+    }
+  }, {
+    key: 'disabled',
+    get: function get() {
+      return this.foundation_.isDisabled();
+    },
+    set: function set(disabled) {
+      this.foundation_.setDisabled(disabled);
+    }
+  }], [{
+    key: 'attachTo',
+    value: function attachTo(root) {
+      return new MDCTextfield(root);
+    }
+  }]);
+
+  return MDCTextfield;
+}(__WEBPACK_IMPORTED_MODULE_0__material_base__["MDCComponent"]);
+
+/***/ }),
+
+/***/ 4:
+/***/ (function(module, __webpack_exports__, __webpack_require__) {
+
+"use strict";
+var _createClass = function () { function defineProperties(target, props) { for (var i = 0; i < props.length; i++) { var descriptor = props[i]; descriptor.enumerable = descriptor.enumerable || false; descriptor.configurable = true; if ("value" in descriptor) descriptor.writable = true; Object.defineProperty(target, descriptor.key, descriptor); } } return function (Constructor, protoProps, staticProps) { if (protoProps) defineProperties(Constructor.prototype, protoProps); if (staticProps) defineProperties(Constructor, staticProps); return Constructor; }; }();
+
+function _classCallCheck(instance, Constructor) { if (!(instance instanceof Constructor)) { throw new TypeError("Cannot call a class as a function"); } }
+
+/**
+ * Copyright 2016 Google Inc. All Rights Reserved.
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *      http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+
+/* eslint no-unused-vars: [2, {"args": "none"}] */
+
+/**
+ * Adapter for MDC Ripple. Provides an interface for managing
+ * - classes
+ * - dom
+ * - CSS variables
+ * - position
+ * - dimensions
+ * - scroll position
+ * - event handlers
+ * - unbounded, active and disabled states
+ *
+ * Additionally, provides type information for the adapter to the Closure
+ * compiler.
+ *
+ * Implement this adapter for your framework of choice to delegate updates to
+ * the component in your framework of choice. See architecture documentation
+ * for more details.
+ * https://github.com/material-components/material-components-web/blob/master/docs/architecture.md
+ *
+ * @record
+ */
+var MDCRippleAdapter = function () {
+  function MDCRippleAdapter() {
+    _classCallCheck(this, MDCRippleAdapter);
+  }
+
+  _createClass(MDCRippleAdapter, [{
+    key: "browserSupportsCssVars",
+
+    /** @return {boolean} */
+    value: function browserSupportsCssVars() {}
+
+    /** @return {boolean} */
+
+  }, {
+    key: "isUnbounded",
+    value: function isUnbounded() {}
+
+    /** @return {boolean} */
+
+  }, {
+    key: "isSurfaceActive",
+    value: function isSurfaceActive() {}
+
+    /** @return {boolean} */
+
+  }, {
+    key: "isSurfaceDisabled",
+    value: function isSurfaceDisabled() {}
+
+    /** @param {string} className */
+
+  }, {
+    key: "addClass",
+    value: function addClass(className) {}
+
+    /** @param {string} className */
+
+  }, {
+    key: "removeClass",
+    value: function removeClass(className) {}
+
+    /**
+     * @param {string} evtType
+     * @param {!Function} handler
+     */
+
+  }, {
+    key: "registerInteractionHandler",
+    value: function registerInteractionHandler(evtType, handler) {}
+
+    /**
+     * @param {string} evtType
+     * @param {!Function} handler
+     */
+
+  }, {
+    key: "deregisterInteractionHandler",
+    value: function deregisterInteractionHandler(evtType, handler) {}
+
+    /**
+     * @param {!Function} handler
+     */
+
+  }, {
+    key: "registerResizeHandler",
+    value: function registerResizeHandler(handler) {}
+
+    /**
+     * @param {!Function} handler
+     */
+
+  }, {
+    key: "deregisterResizeHandler",
+    value: function deregisterResizeHandler(handler) {}
+
+    /**
+     * @param {string} varName
+     * @param {?number|string} value
+     */
+
+  }, {
+    key: "updateCssVariable",
+    value: function updateCssVariable(varName, value) {}
+
+    /** @return {!ClientRect} */
+
+  }, {
+    key: "computeBoundingRect",
+    value: function computeBoundingRect() {}
+
+    /** @return {{x: number, y: number}} */
+
+  }, {
+    key: "getWindowPageOffset",
+    value: function getWindowPageOffset() {}
+  }]);
+
+  return MDCRippleAdapter;
+}();
+
+/* unused harmony default export */ var _unused_webpack_default_export = (MDCRippleAdapter);
+
+/***/ }),
+
+/***/ 5:
+/***/ (function(module, __webpack_exports__, __webpack_require__) {
+
+"use strict";
+Object.defineProperty(__webpack_exports__, "__esModule", { value: true });
+/* harmony export (immutable) */ __webpack_exports__["supportsCssVariables"] = supportsCssVariables;
+/* harmony export (immutable) */ __webpack_exports__["applyPassive"] = applyPassive;
+/* harmony export (immutable) */ __webpack_exports__["getMatchesProperty"] = getMatchesProperty;
+/* harmony export (immutable) */ __webpack_exports__["getNormalizedEventCoords"] = getNormalizedEventCoords;
+/**
+ * Copyright 2016 Google Inc. All Rights Reserved.
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *      http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+
+/**
+ * Stores result from supportsCssVariables to avoid redundant processing to detect CSS custom variable support.
+ * @private {boolean|undefined}
+ */
+var supportsCssVariables_ = void 0;
+
+/**
+ * Stores result from applyPassive to avoid redundant processing to detect passive event listener support.
+ * @private {boolean|undefined}
+ */
+var supportsPassive_ = void 0;
+
+/**
+ * @param {!Window} windowObj
+ * @return {boolean}
+ */
+function detectEdgePseudoVarBug(windowObj) {
+  // Detect versions of Edge with buggy var() support
+  // See: https://developer.microsoft.com/en-us/microsoft-edge/platform/issues/11495448/
+  var document = windowObj.document;
+  var className = 'test-edge-css-var';
+  var styleNode = document.createElement('style');
+  document.head.appendChild(styleNode);
+  var sheet = styleNode.sheet;
+  // Internet Explorer 11 requires indices to always be specified to insertRule
+  sheet.insertRule(':root { --' + className + ': 1px solid #000; }', 0);
+  sheet.insertRule('.' + className + ' { visibility: hidden; }', 1);
+  sheet.insertRule('.' + className + '::before { border: var(--' + className + '); }', 2);
+  var node = document.createElement('div');
+  node.className = className;
+  document.body.appendChild(node);
+  // Bug exists if ::before style ends up propagating to the parent element
+  var hasPseudoVarBug = windowObj.getComputedStyle(node).borderTopStyle === 'solid';
+  node.remove();
+  styleNode.remove();
+  return hasPseudoVarBug;
+}
+
+/**
+ * @param {!Window} windowObj
+ * @param {boolean=} forceRefresh
+ * @return {boolean|undefined}
+ */
+function supportsCssVariables(windowObj) {
+  var forceRefresh = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : false;
+
+  if (typeof supportsCssVariables_ === 'boolean' && !forceRefresh) {
+    return supportsCssVariables_;
+  }
+
+  var supportsFunctionPresent = windowObj.CSS && typeof windowObj.CSS.supports === 'function';
+  if (!supportsFunctionPresent) {
+    return;
+  }
+
+  var explicitlySupportsCssVars = windowObj.CSS.supports('--css-vars', 'yes');
+  // See: https://bugs.webkit.org/show_bug.cgi?id=154669
+  // See: README section on Safari
+  var weAreFeatureDetectingSafari10plus = windowObj.CSS.supports('(--css-vars: yes)') && windowObj.CSS.supports('color', '#00000000');
+
+  if (explicitlySupportsCssVars || weAreFeatureDetectingSafari10plus) {
+    supportsCssVariables_ = !detectEdgePseudoVarBug(windowObj);
+  } else {
+    supportsCssVariables_ = false;
+  }
+  return supportsCssVariables_;
+}
+
+//
+/**
+ * Determine whether the current browser supports passive event listeners, and if so, use them.
+ * @param {!Window=} globalObj
+ * @param {boolean=} forceRefresh
+ * @return {boolean|{passive: boolean}}
+ */
+function applyPassive() {
+  var globalObj = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : window;
+  var forceRefresh = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : false;
+
+  if (supportsPassive_ === undefined || forceRefresh) {
+    var isSupported = false;
+    try {
+      globalObj.document.addEventListener('test', null, { get passive() {
+          isSupported = true;
+        } });
+    } catch (e) {}
+
+    supportsPassive_ = isSupported;
+  }
+
+  return supportsPassive_ ? { passive: true } : false;
+}
+
+/**
+ * @param {!Object} HTMLElementPrototype
+ * @return {!Array<string>}
+ */
+function getMatchesProperty(HTMLElementPrototype) {
+  return ['webkitMatchesSelector', 'msMatchesSelector', 'matches'].filter(function (p) {
+    return p in HTMLElementPrototype;
+  }).pop();
+}
+
+/**
+ * @param {!Event} ev
+ * @param {!{x: number, y: number}} pageOffset
+ * @param {!ClientRect} clientRect
+ * @return {!{x: number, y: number}}
+ */
+function getNormalizedEventCoords(ev, pageOffset, clientRect) {
+  var x = pageOffset.x,
+      y = pageOffset.y;
+
+  var documentX = x + clientRect.left;
+  var documentY = y + clientRect.top;
+
+  var normalizedX = void 0;
+  var normalizedY = void 0;
+  // Determine touch point relative to the ripple container.
+  if (ev.type === 'touchstart') {
+    normalizedX = ev.changedTouches[0].pageX - documentX;
+    normalizedY = ev.changedTouches[0].pageY - documentY;
+  } else {
+    normalizedX = ev.pageX - documentX;
+    normalizedY = ev.pageY - documentY;
+  }
+
+  return { x: normalizedX, y: normalizedY };
+}
+
+/***/ }),
+
+/***/ 6:
+/***/ (function(module, __webpack_exports__, __webpack_require__) {
+
+"use strict";
+Object.defineProperty(__webpack_exports__, "__esModule", { value: true });
+/* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, "MDCRipple", function() { return MDCRipple; });
+/* harmony import */ var __WEBPACK_IMPORTED_MODULE_0__material_base_component__ = __webpack_require__(1);
+/* harmony import */ var __WEBPACK_IMPORTED_MODULE_1__adapter__ = __webpack_require__(4);
+/* harmony import */ var __WEBPACK_IMPORTED_MODULE_2__foundation__ = __webpack_require__(8);
+/* harmony import */ var __WEBPACK_IMPORTED_MODULE_3__util__ = __webpack_require__(5);
+/* harmony reexport (binding) */ __webpack_require__.d(__webpack_exports__, "MDCRippleFoundation", function() { return __WEBPACK_IMPORTED_MODULE_2__foundation__["a"]; });
+/* harmony reexport (module object) */ __webpack_require__.d(__webpack_exports__, "util", function() { return __WEBPACK_IMPORTED_MODULE_3__util__; });
+var _createClass = function () { function defineProperties(target, props) { for (var i = 0; i < props.length; i++) { var descriptor = props[i]; descriptor.enumerable = descriptor.enumerable || false; descriptor.configurable = true; if ("value" in descriptor) descriptor.writable = true; Object.defineProperty(target, descriptor.key, descriptor); } } return function (Constructor, protoProps, staticProps) { if (protoProps) defineProperties(Constructor.prototype, protoProps); if (staticProps) defineProperties(Constructor, staticProps); return Constructor; }; }();
+
+function _classCallCheck(instance, Constructor) { if (!(instance instanceof Constructor)) { throw new TypeError("Cannot call a class as a function"); } }
+
+function _possibleConstructorReturn(self, call) { if (!self) { throw new ReferenceError("this hasn't been initialised - super() hasn't been called"); } return call && (typeof call === "object" || typeof call === "function") ? call : self; }
+
+function _inherits(subClass, superClass) { if (typeof superClass !== "function" && superClass !== null) { throw new TypeError("Super expression must either be null or a function, not " + typeof superClass); } subClass.prototype = Object.create(superClass && superClass.prototype, { constructor: { value: subClass, enumerable: false, writable: true, configurable: true } }); if (superClass) Object.setPrototypeOf ? Object.setPrototypeOf(subClass, superClass) : subClass.__proto__ = superClass; }
+
+/**
+ * Copyright 2016 Google Inc. All Rights Reserved.
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *      http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+
+
+
+
+
+
+
+
+
+/**
+ * @extends MDCComponent<!MDCRippleFoundation>
+ */
+var MDCRipple = function (_MDCComponent) {
+  _inherits(MDCRipple, _MDCComponent);
+
+  /** @param {...?} args */
+  function MDCRipple() {
+    var _ref;
+
+    _classCallCheck(this, MDCRipple);
+
+    for (var _len = arguments.length, args = Array(_len), _key = 0; _key < _len; _key++) {
+      args[_key] = arguments[_key];
+    }
+
+    /** @type {boolean} */
+    var _this = _possibleConstructorReturn(this, (_ref = MDCRipple.__proto__ || Object.getPrototypeOf(MDCRipple)).call.apply(_ref, [this].concat(args)));
+
+    _this.disabled = false;
+
+    /** @private {boolean} */
+    _this.unbounded_;
+    return _this;
+  }
+
+  /**
+   * @param {!Element} root
+   * @param {{isUnbounded: (boolean|undefined)}=} options
+   * @return {!MDCRipple}
+   */
+
+
+  _createClass(MDCRipple, [{
+    key: 'activate',
+    value: function activate() {
+      this.foundation_.activate();
+    }
+  }, {
+    key: 'deactivate',
+    value: function deactivate() {
+      this.foundation_.deactivate();
+    }
+  }, {
+    key: 'layout',
+    value: function layout() {
+      this.foundation_.layout();
+    }
+
+    /** @return {!MDCRippleFoundation} */
+
+  }, {
+    key: 'getDefaultFoundation',
+    value: function getDefaultFoundation() {
+      return new __WEBPACK_IMPORTED_MODULE_2__foundation__["a" /* default */](MDCRipple.createAdapter(this));
+    }
+  }, {
+    key: 'initialSyncWithDOM',
+    value: function initialSyncWithDOM() {
+      this.unbounded = 'mdcRippleIsUnbounded' in this.root_.dataset;
+    }
+  }, {
+    key: 'unbounded',
+
+
+    /** @return {boolean} */
+    get: function get() {
+      return this.unbounded_;
+    }
+
+    /** @param {boolean} unbounded */
+    ,
+    set: function set(unbounded) {
+      var UNBOUNDED = __WEBPACK_IMPORTED_MODULE_2__foundation__["a" /* default */].cssClasses.UNBOUNDED;
+
+      this.unbounded_ = Boolean(unbounded);
+      if (this.unbounded_) {
+        this.root_.classList.add(UNBOUNDED);
+      } else {
+        this.root_.classList.remove(UNBOUNDED);
+      }
+    }
+  }], [{
+    key: 'attachTo',
+    value: function attachTo(root) {
+      var _ref2 = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : {},
+          _ref2$isUnbounded = _ref2.isUnbounded,
+          isUnbounded = _ref2$isUnbounded === undefined ? undefined : _ref2$isUnbounded;
+
+      var ripple = new MDCRipple(root);
+      // Only override unbounded behavior if option is explicitly specified
+      if (isUnbounded !== undefined) {
+        ripple.unbounded = /** @type {boolean} */isUnbounded;
+      }
+      return ripple;
+    }
+
+    /**
+     * @param {!RippleCapableSurface} instance
+     * @return {!MDCRippleAdapter}
+     */
+
+  }, {
+    key: 'createAdapter',
+    value: function createAdapter(instance) {
+      var MATCHES = __WEBPACK_IMPORTED_MODULE_3__util__["getMatchesProperty"](HTMLElement.prototype);
+
+      return {
+        browserSupportsCssVars: function browserSupportsCssVars() {
+          return __WEBPACK_IMPORTED_MODULE_3__util__["supportsCssVariables"](window);
+        },
+        isUnbounded: function isUnbounded() {
+          return instance.unbounded;
+        },
+        isSurfaceActive: function isSurfaceActive() {
+          return instance.root_[MATCHES](':active');
+        },
+        isSurfaceDisabled: function isSurfaceDisabled() {
+          return instance.disabled;
+        },
+        addClass: function addClass(className) {
+          return instance.root_.classList.add(className);
+        },
+        removeClass: function removeClass(className) {
+          return instance.root_.classList.remove(className);
+        },
+        registerInteractionHandler: function registerInteractionHandler(evtType, handler) {
+          return instance.root_.addEventListener(evtType, handler, __WEBPACK_IMPORTED_MODULE_3__util__["applyPassive"]());
+        },
+        deregisterInteractionHandler: function deregisterInteractionHandler(evtType, handler) {
+          return instance.root_.removeEventListener(evtType, handler, __WEBPACK_IMPORTED_MODULE_3__util__["applyPassive"]());
+        },
+        registerResizeHandler: function registerResizeHandler(handler) {
+          return window.addEventListener('resize', handler);
+        },
+        deregisterResizeHandler: function deregisterResizeHandler(handler) {
+          return window.removeEventListener('resize', handler);
+        },
+        updateCssVariable: function updateCssVariable(varName, value) {
+          return instance.root_.style.setProperty(varName, value);
+        },
+        computeBoundingRect: function computeBoundingRect() {
+          return instance.root_.getBoundingClientRect();
+        },
+        getWindowPageOffset: function getWindowPageOffset() {
+          return { x: window.pageXOffset, y: window.pageYOffset };
+        }
+      };
+    }
+  }]);
+
+  return MDCRipple;
+}(__WEBPACK_IMPORTED_MODULE_0__material_base_component__["a" /* default */]);
+
+/**
+ * See Material Design spec for more details on when to use ripples.
+ * https://material.io/guidelines/motion/choreography.html#choreography-creation
+ * @record
+ */
+
+var RippleCapableSurface = function RippleCapableSurface() {
+  _classCallCheck(this, RippleCapableSurface);
+};
+
+/** @protected {!Element} */
+
+
+RippleCapableSurface.prototype.root_;
+
+/**
+ * Whether or not the ripple bleeds out of the bounds of the element.
+ * @type {boolean|undefined}
+ */
+RippleCapableSurface.prototype.unbounded;
+
+/**
+ * Whether or not the ripple is attached to a disabled component.
+ * @type {boolean|undefined}
+ */
+RippleCapableSurface.prototype.disabled;
+
+/***/ }),
+
+/***/ 7:
+/***/ (function(module, __webpack_exports__, __webpack_require__) {
+
+"use strict";
+/* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, "a", function() { return cssClasses; });
+/* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, "b", function() { return strings; });
+/* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, "c", function() { return numbers; });
+/**
+ * Copyright 2016 Google Inc. All Rights Reserved.
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *      http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+
+var cssClasses = {
+  // Ripple is a special case where the "root" component is really a "mixin" of sorts,
+  // given that it's an 'upgrade' to an existing component. That being said it is the root
+  // CSS class that all other CSS classes derive from.
+  ROOT: 'mdc-ripple-upgraded',
+  UNBOUNDED: 'mdc-ripple-upgraded--unbounded',
+  BG_FOCUSED: 'mdc-ripple-upgraded--background-focused',
+  BG_ACTIVE_FILL: 'mdc-ripple-upgraded--background-active-fill',
+  FG_ACTIVATION: 'mdc-ripple-upgraded--foreground-activation',
+  FG_DEACTIVATION: 'mdc-ripple-upgraded--foreground-deactivation'
+};
+
+var strings = {
+  VAR_SURFACE_WIDTH: '--mdc-ripple-surface-width',
+  VAR_SURFACE_HEIGHT: '--mdc-ripple-surface-height',
+  VAR_FG_SIZE: '--mdc-ripple-fg-size',
+  VAR_LEFT: '--mdc-ripple-left',
+  VAR_TOP: '--mdc-ripple-top',
+  VAR_FG_SCALE: '--mdc-ripple-fg-scale',
+  VAR_FG_TRANSLATE_START: '--mdc-ripple-fg-translate-start',
+  VAR_FG_TRANSLATE_END: '--mdc-ripple-fg-translate-end'
+};
+
+var numbers = {
+  PADDING: 10,
+  INITIAL_ORIGIN_SCALE: 0.6,
+  DEACTIVATION_TIMEOUT_MS: 300,
+  FG_DEACTIVATION_MS: 83
+};
+
+/***/ }),
+
+/***/ 75:
+/***/ (function(module, __webpack_exports__, __webpack_require__) {
+
+"use strict";
+/* harmony import */ var __WEBPACK_IMPORTED_MODULE_0__material_base__ = __webpack_require__(2);
+/* harmony import */ var __WEBPACK_IMPORTED_MODULE_1__constants__ = __webpack_require__(22);
+var _extends = Object.assign || function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; };
+
+var _createClass = function () { function defineProperties(target, props) { for (var i = 0; i < props.length; i++) { var descriptor = props[i]; descriptor.enumerable = descriptor.enumerable || false; descriptor.configurable = true; if ("value" in descriptor) descriptor.writable = true; Object.defineProperty(target, descriptor.key, descriptor); } } return function (Constructor, protoProps, staticProps) { if (protoProps) defineProperties(Constructor.prototype, protoProps); if (staticProps) defineProperties(Constructor, staticProps); return Constructor; }; }();
+
+function _classCallCheck(instance, Constructor) { if (!(instance instanceof Constructor)) { throw new TypeError("Cannot call a class as a function"); } }
+
+function _possibleConstructorReturn(self, call) { if (!self) { throw new ReferenceError("this hasn't been initialised - super() hasn't been called"); } return call && (typeof call === "object" || typeof call === "function") ? call : self; }
+
+function _inherits(subClass, superClass) { if (typeof superClass !== "function" && superClass !== null) { throw new TypeError("Super expression must either be null or a function, not " + typeof superClass); } subClass.prototype = Object.create(superClass && superClass.prototype, { constructor: { value: subClass, enumerable: false, writable: true, configurable: true } }); if (superClass) Object.setPrototypeOf ? Object.setPrototypeOf(subClass, superClass) : subClass.__proto__ = superClass; }
+
+/**
+ * Copyright 2016 Google Inc. All Rights Reserved.
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *      http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+
+
+
+
+var MDCTextfieldFoundation = function (_MDCFoundation) {
+  _inherits(MDCTextfieldFoundation, _MDCFoundation);
+
+  _createClass(MDCTextfieldFoundation, null, [{
+    key: 'cssClasses',
+    get: function get() {
+      return __WEBPACK_IMPORTED_MODULE_1__constants__["b" /* cssClasses */];
+    }
+  }, {
+    key: 'strings',
+    get: function get() {
+      return __WEBPACK_IMPORTED_MODULE_1__constants__["a" /* strings */];
+    }
+  }, {
+    key: 'defaultAdapter',
+    get: function get() {
+      return {
+        addClass: function addClass() /* className: string */{},
+        removeClass: function removeClass() /* className: string */{},
+        addClassToLabel: function addClassToLabel() /* className: string */{},
+        removeClassFromLabel: function removeClassFromLabel() /* className: string */{},
+        addClassToHelptext: function addClassToHelptext() /* className: string */{},
+        removeClassFromHelptext: function removeClassFromHelptext() /* className: string */{},
+        helptextHasClass: function helptextHasClass() {
+          return (/* className: string */ /* boolean */false
+          );
+        },
+        registerInputFocusHandler: function registerInputFocusHandler() /* handler: EventListener */{},
+        deregisterInputFocusHandler: function deregisterInputFocusHandler() /* handler: EventListener */{},
+        registerInputBlurHandler: function registerInputBlurHandler() /* handler: EventListener */{},
+        deregisterInputBlurHandler: function deregisterInputBlurHandler() /* handler: EventListener */{},
+        registerInputInputHandler: function registerInputInputHandler() /* handler: EventListener */{},
+        deregisterInputInputHandler: function deregisterInputInputHandler() /* handler: EventListener */{},
+        registerInputKeydownHandler: function registerInputKeydownHandler() /* handler: EventListener */{},
+        deregisterInputKeydownHandler: function deregisterInputKeydownHandler() /* handler: EventListener */{},
+        setHelptextAttr: function setHelptextAttr() /* name: string, value: string */{},
+        removeHelptextAttr: function removeHelptextAttr() /* name: string */{},
+        getNativeInput: function getNativeInput() {
+          return (/* HTMLInputElement */{}
+          );
+        }
+      };
+    }
+  }]);
+
+  function MDCTextfieldFoundation() {
+    var adapter = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : {};
+
+    _classCallCheck(this, MDCTextfieldFoundation);
+
+    var _this = _possibleConstructorReturn(this, (MDCTextfieldFoundation.__proto__ || Object.getPrototypeOf(MDCTextfieldFoundation)).call(this, _extends(MDCTextfieldFoundation.defaultAdapter, adapter)));
+
+    _this.receivedUserInput_ = false;
+    _this.inputFocusHandler_ = function () {
+      return _this.activateFocus_();
+    };
+    _this.inputBlurHandler_ = function () {
+      return _this.deactivateFocus_();
+    };
+    _this.inputInputHandler_ = function () {
+      return _this.autoCompleteFocus_();
+    };
+    _this.inputKeydownHandler_ = function () {
+      return _this.receivedUserInput_ = true;
+    };
+    return _this;
+  }
+
+  _createClass(MDCTextfieldFoundation, [{
+    key: 'init',
+    value: function init() {
+      this.adapter_.addClass(MDCTextfieldFoundation.cssClasses.UPGRADED);
+      this.adapter_.registerInputFocusHandler(this.inputFocusHandler_);
+      this.adapter_.registerInputBlurHandler(this.inputBlurHandler_);
+      this.adapter_.registerInputInputHandler(this.inputInputHandler_);
+      this.adapter_.registerInputKeydownHandler(this.inputKeydownHandler_);
+
+      // Ensure label does not collide with any pre-filled value.
+      if (this.getNativeInput_().value) {
+        this.adapter_.addClassToLabel(MDCTextfieldFoundation.cssClasses.LABEL_FLOAT_ABOVE);
+      }
+    }
+  }, {
+    key: 'destroy',
+    value: function destroy() {
+      this.adapter_.removeClass(MDCTextfieldFoundation.cssClasses.UPGRADED);
+      this.adapter_.deregisterInputFocusHandler(this.inputFocusHandler_);
+      this.adapter_.deregisterInputBlurHandler(this.inputBlurHandler_);
+      this.adapter_.deregisterInputInputHandler(this.inputInputHandler_);
+      this.adapter_.deregisterInputKeydownHandler(this.inputKeydownHandler_);
+    }
+  }, {
+    key: 'activateFocus_',
+    value: function activateFocus_() {
+      var _MDCTextfieldFoundati = MDCTextfieldFoundation.cssClasses,
+          FOCUSED = _MDCTextfieldFoundati.FOCUSED,
+          LABEL_FLOAT_ABOVE = _MDCTextfieldFoundati.LABEL_FLOAT_ABOVE;
+
+      this.adapter_.addClass(FOCUSED);
+      this.adapter_.addClassToLabel(LABEL_FLOAT_ABOVE);
+      this.showHelptext_();
+    }
+  }, {
+    key: 'autoCompleteFocus_',
+    value: function autoCompleteFocus_() {
+      if (!this.receivedUserInput_) {
+        this.activateFocus_();
+      }
+    }
+  }, {
+    key: 'showHelptext_',
+    value: function showHelptext_() {
+      var ARIA_HIDDEN = MDCTextfieldFoundation.strings.ARIA_HIDDEN;
+
+      this.adapter_.removeHelptextAttr(ARIA_HIDDEN);
+    }
+  }, {
+    key: 'deactivateFocus_',
+    value: function deactivateFocus_() {
+      var _MDCTextfieldFoundati2 = MDCTextfieldFoundation.cssClasses,
+          FOCUSED = _MDCTextfieldFoundati2.FOCUSED,
+          INVALID = _MDCTextfieldFoundati2.INVALID,
+          LABEL_FLOAT_ABOVE = _MDCTextfieldFoundati2.LABEL_FLOAT_ABOVE;
+
+      var input = this.getNativeInput_();
+      var isValid = input.checkValidity();
+
+      this.adapter_.removeClass(FOCUSED);
+      if (!input.value && !this.isBadInput_()) {
+        this.adapter_.removeClassFromLabel(LABEL_FLOAT_ABOVE);
+        this.receivedUserInput_ = false;
+      }
+      if (isValid) {
+        this.adapter_.removeClass(INVALID);
+      } else {
+        this.adapter_.addClass(INVALID);
+      }
+      this.updateHelptextOnDeactivation_(isValid);
+    }
+  }, {
+    key: 'updateHelptextOnDeactivation_',
+    value: function updateHelptextOnDeactivation_(isValid) {
+      var _MDCTextfieldFoundati3 = MDCTextfieldFoundation.cssClasses,
+          HELPTEXT_PERSISTENT = _MDCTextfieldFoundati3.HELPTEXT_PERSISTENT,
+          HELPTEXT_VALIDATION_MSG = _MDCTextfieldFoundati3.HELPTEXT_VALIDATION_MSG;
+      var ROLE = MDCTextfieldFoundation.strings.ROLE;
+
+      var helptextIsPersistent = this.adapter_.helptextHasClass(HELPTEXT_PERSISTENT);
+      var helptextIsValidationMsg = this.adapter_.helptextHasClass(HELPTEXT_VALIDATION_MSG);
+      var validationMsgNeedsDisplay = helptextIsValidationMsg && !isValid;
+
+      if (validationMsgNeedsDisplay) {
+        this.adapter_.setHelptextAttr(ROLE, 'alert');
+      } else {
+        this.adapter_.removeHelptextAttr(ROLE);
+      }
+
+      if (helptextIsPersistent || validationMsgNeedsDisplay) {
+        return;
+      }
+      this.hideHelptext_();
+    }
+  }, {
+    key: 'hideHelptext_',
+    value: function hideHelptext_() {
+      var ARIA_HIDDEN = MDCTextfieldFoundation.strings.ARIA_HIDDEN;
+
+      this.adapter_.setHelptextAttr(ARIA_HIDDEN, 'true');
+    }
+  }, {
+    key: 'isBadInput_',
+    value: function isBadInput_() {
+      var input = this.getNativeInput_();
+      return input.validity ? input.validity.badInput : input.badInput;
+    }
+  }, {
+    key: 'isDisabled',
+    value: function isDisabled() {
+      return this.getNativeInput_().disabled;
+    }
+  }, {
+    key: 'setDisabled',
+    value: function setDisabled(disabled) {
+      var DISABLED = MDCTextfieldFoundation.cssClasses.DISABLED;
+
+      this.getNativeInput_().disabled = disabled;
+      if (disabled) {
+        this.adapter_.addClass(DISABLED);
+      } else {
+        this.adapter_.removeClass(DISABLED);
+      }
+    }
+  }, {
+    key: 'getNativeInput_',
+    value: function getNativeInput_() {
+      return this.adapter_.getNativeInput() || {
+        checkValidity: function checkValidity() {
+          return true;
+        },
+        value: '',
+        disabled: false,
+        badInput: false
+      };
+    }
+  }]);
+
+  return MDCTextfieldFoundation;
+}(__WEBPACK_IMPORTED_MODULE_0__material_base__["MDCFoundation"]);
+
+/* harmony default export */ __webpack_exports__["a"] = (MDCTextfieldFoundation);
+
+/***/ }),
+
+/***/ 8:
+/***/ (function(module, __webpack_exports__, __webpack_require__) {
+
+"use strict";
+/* harmony import */ var __WEBPACK_IMPORTED_MODULE_0__material_base_foundation__ = __webpack_require__(0);
+/* harmony import */ var __WEBPACK_IMPORTED_MODULE_1__adapter__ = __webpack_require__(4);
+/* harmony import */ var __WEBPACK_IMPORTED_MODULE_2__constants__ = __webpack_require__(7);
+/* harmony import */ var __WEBPACK_IMPORTED_MODULE_3__util__ = __webpack_require__(5);
+var _extends = Object.assign || function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; };
+
+var _createClass = function () { function defineProperties(target, props) { for (var i = 0; i < props.length; i++) { var descriptor = props[i]; descriptor.enumerable = descriptor.enumerable || false; descriptor.configurable = true; if ("value" in descriptor) descriptor.writable = true; Object.defineProperty(target, descriptor.key, descriptor); } } return function (Constructor, protoProps, staticProps) { if (protoProps) defineProperties(Constructor.prototype, protoProps); if (staticProps) defineProperties(Constructor, staticProps); return Constructor; }; }();
+
+function _classCallCheck(instance, Constructor) { if (!(instance instanceof Constructor)) { throw new TypeError("Cannot call a class as a function"); } }
+
+function _possibleConstructorReturn(self, call) { if (!self) { throw new ReferenceError("this hasn't been initialised - super() hasn't been called"); } return call && (typeof call === "object" || typeof call === "function") ? call : self; }
+
+function _inherits(subClass, superClass) { if (typeof superClass !== "function" && superClass !== null) { throw new TypeError("Super expression must either be null or a function, not " + typeof superClass); } subClass.prototype = Object.create(superClass && superClass.prototype, { constructor: { value: subClass, enumerable: false, writable: true, configurable: true } }); if (superClass) Object.setPrototypeOf ? Object.setPrototypeOf(subClass, superClass) : subClass.__proto__ = superClass; }
+
+/**
+ * Copyright 2016 Google Inc. All Rights Reserved.
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *      http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+
+
+
+
+
+
+/**
+ * @typedef {!{
+ *   isActivated: (boolean|undefined),
+ *   hasDeactivationUXRun: (boolean|undefined),
+ *   wasActivatedByPointer: (boolean|undefined),
+ *   wasElementMadeActive: (boolean|undefined),
+ *   activationStartTime: (number|undefined),
+ *   activationEvent: Event,
+ *   isProgrammatic: (boolean|undefined)
+ * }}
+ */
+var ActivationStateType = void 0;
+
+/**
+ * @typedef {!{
+ *   activate: (string|undefined),
+ *   deactivate: (string|undefined),
+ *   focus: (string|undefined),
+ *   blur: (string|undefined)
+ * }}
+ */
+var ListenerInfoType = void 0;
+
+/**
+ * @typedef {!{
+ *   activate: function(!Event),
+ *   deactivate: function(!Event),
+ *   focus: function(),
+ *   blur: function()
+ * }}
+ */
+var ListenersType = void 0;
+
+/**
+ * @typedef {!{
+ *   x: number,
+ *   y: number
+ * }}
+ */
+var PointType = void 0;
+
+/**
+ * @enum {string}
+ */
+var DEACTIVATION_ACTIVATION_PAIRS = {
+  mouseup: 'mousedown',
+  pointerup: 'pointerdown',
+  touchend: 'touchstart',
+  keyup: 'keydown',
+  blur: 'focus'
+};
+
+/**
+ * @extends {MDCFoundation<!MDCRippleAdapter>}
+ */
+
+var MDCRippleFoundation = function (_MDCFoundation) {
+  _inherits(MDCRippleFoundation, _MDCFoundation);
+
+  _createClass(MDCRippleFoundation, [{
+    key: 'isSupported_',
+
+
+    /**
+     * We compute this property so that we are not querying information about the client
+     * until the point in time where the foundation requests it. This prevents scenarios where
+     * client-side feature-detection may happen too early, such as when components are rendered on the server
+     * and then initialized at mount time on the client.
+     * @return {boolean}
+     */
+    get: function get() {
+      return this.adapter_.browserSupportsCssVars();
+    }
+  }], [{
+    key: 'cssClasses',
+    get: function get() {
+      return __WEBPACK_IMPORTED_MODULE_2__constants__["a" /* cssClasses */];
+    }
+  }, {
+    key: 'strings',
+    get: function get() {
+      return __WEBPACK_IMPORTED_MODULE_2__constants__["b" /* strings */];
+    }
+  }, {
+    key: 'numbers',
+    get: function get() {
+      return __WEBPACK_IMPORTED_MODULE_2__constants__["c" /* numbers */];
+    }
+  }, {
+    key: 'defaultAdapter',
+    get: function get() {
+      return {
+        browserSupportsCssVars: function browserSupportsCssVars() /* boolean - cached */{},
+        isUnbounded: function isUnbounded() /* boolean */{},
+        isSurfaceActive: function isSurfaceActive() /* boolean */{},
+        isSurfaceDisabled: function isSurfaceDisabled() /* boolean */{},
+        addClass: function addClass() /* className: string */{},
+        removeClass: function removeClass() /* className: string */{},
+        registerInteractionHandler: function registerInteractionHandler() /* evtType: string, handler: EventListener */{},
+        deregisterInteractionHandler: function deregisterInteractionHandler() /* evtType: string, handler: EventListener */{},
+        registerResizeHandler: function registerResizeHandler() /* handler: EventListener */{},
+        deregisterResizeHandler: function deregisterResizeHandler() /* handler: EventListener */{},
+        updateCssVariable: function updateCssVariable() /* varName: string, value: string */{},
+        computeBoundingRect: function computeBoundingRect() /* ClientRect */{},
+        getWindowPageOffset: function getWindowPageOffset() /* {x: number, y: number} */{}
+      };
+    }
+  }]);
+
+  function MDCRippleFoundation(adapter) {
+    _classCallCheck(this, MDCRippleFoundation);
+
+    /** @private {number} */
+    var _this = _possibleConstructorReturn(this, (MDCRippleFoundation.__proto__ || Object.getPrototypeOf(MDCRippleFoundation)).call(this, _extends(MDCRippleFoundation.defaultAdapter, adapter)));
+
+    _this.layoutFrame_ = 0;
+
+    /** @private {!ClientRect} */
+    _this.frame_ = /** @type {!ClientRect} */{ width: 0, height: 0 };
+
+    /** @private {!ActivationStateType} */
+    _this.activationState_ = _this.defaultActivationState_();
+
+    /** @private {number} */
+    _this.xfDuration_ = 0;
+
+    /** @private {number} */
+    _this.initialSize_ = 0;
+
+    /** @private {number} */
+    _this.maxRadius_ = 0;
+
+    /** @private {!Array<{ListenerInfoType}>} */
+    _this.listenerInfos_ = [{ activate: 'touchstart', deactivate: 'touchend' }, { activate: 'pointerdown', deactivate: 'pointerup' }, { activate: 'mousedown', deactivate: 'mouseup' }, { activate: 'keydown', deactivate: 'keyup' }, { focus: 'focus', blur: 'blur' }];
+
+    /** @private {!ListenersType} */
+    _this.listeners_ = {
+      activate: function activate(e) {
+        return _this.activate_(e);
+      },
+      deactivate: function deactivate(e) {
+        return _this.deactivate_(e);
+      },
+      focus: function focus() {
+        return requestAnimationFrame(function () {
+          return _this.adapter_.addClass(MDCRippleFoundation.cssClasses.BG_FOCUSED);
+        });
+      },
+      blur: function blur() {
+        return requestAnimationFrame(function () {
+          return _this.adapter_.removeClass(MDCRippleFoundation.cssClasses.BG_FOCUSED);
+        });
+      }
+    };
+
+    /** @private {!Function} */
+    _this.resizeHandler_ = function () {
+      return _this.layout();
+    };
+
+    /** @private {!{left: number, top:number}} */
+    _this.unboundedCoords_ = {
+      left: 0,
+      top: 0
+    };
+
+    /** @private {number} */
+    _this.fgScale_ = 0;
+
+    /** @private {number} */
+    _this.activationTimer_ = 0;
+
+    /** @private {number} */
+    _this.fgDeactivationRemovalTimer_ = 0;
+
+    /** @private {boolean} */
+    _this.activationAnimationHasEnded_ = false;
+
+    /** @private {!Function} */
+    _this.activationTimerCallback_ = function () {
+      _this.activationAnimationHasEnded_ = true;
+      _this.runDeactivationUXLogicIfReady_();
+    };
+    return _this;
+  }
+
+  /**
+   * @return {!ActivationStateType}
+   */
+
+
+  _createClass(MDCRippleFoundation, [{
+    key: 'defaultActivationState_',
+    value: function defaultActivationState_() {
+      return {
+        isActivated: false,
+        hasDeactivationUXRun: false,
+        wasActivatedByPointer: false,
+        wasElementMadeActive: false,
+        activationStartTime: 0,
+        activationEvent: null,
+        isProgrammatic: false
+      };
+    }
+  }, {
+    key: 'init',
+    value: function init() {
+      var _this2 = this;
+
+      if (!this.isSupported_) {
+        return;
+      }
+      this.addEventListeners_();
+
+      var _MDCRippleFoundation$ = MDCRippleFoundation.cssClasses,
+          ROOT = _MDCRippleFoundation$.ROOT,
+          UNBOUNDED = _MDCRippleFoundation$.UNBOUNDED;
+
+      requestAnimationFrame(function () {
+        _this2.adapter_.addClass(ROOT);
+        if (_this2.adapter_.isUnbounded()) {
+          _this2.adapter_.addClass(UNBOUNDED);
+        }
+        _this2.layoutInternal_();
+      });
+    }
+
+    /** @private */
+
+  }, {
+    key: 'addEventListeners_',
+    value: function addEventListeners_() {
+      var _this3 = this;
+
+      this.listenerInfos_.forEach(function (info) {
+        Object.keys(info).forEach(function (k) {
+          _this3.adapter_.registerInteractionHandler(info[k], _this3.listeners_[k]);
+        });
+      });
+      this.adapter_.registerResizeHandler(this.resizeHandler_);
+    }
+
+    /**
+     * @param {Event} e
+     * @private
+     */
+
+  }, {
+    key: 'activate_',
+    value: function activate_(e) {
+      var _this4 = this;
+
+      if (this.adapter_.isSurfaceDisabled()) {
+        return;
+      }
+
+      var activationState = this.activationState_;
+
+      if (activationState.isActivated) {
+        return;
+      }
+
+      activationState.isActivated = true;
+      activationState.isProgrammatic = e === null;
+      activationState.activationEvent = e;
+      activationState.wasActivatedByPointer = activationState.isProgrammatic ? false : e.type === 'mousedown' || e.type === 'touchstart' || e.type === 'pointerdown';
+      activationState.activationStartTime = Date.now();
+
+      requestAnimationFrame(function () {
+        // This needs to be wrapped in an rAF call b/c web browsers
+        // report active states inconsistently when they're called within
+        // event handling code:
+        // - https://bugs.chromium.org/p/chromium/issues/detail?id=635971
+        // - https://bugzilla.mozilla.org/show_bug.cgi?id=1293741
+        activationState.wasElementMadeActive = e && e.type === 'keydown' ? _this4.adapter_.isSurfaceActive() : true;
+        if (activationState.wasElementMadeActive) {
+          _this4.animateActivation_();
+        } else {
+          // Reset activation state immediately if element was not made active.
+          _this4.activationState_ = _this4.defaultActivationState_();
+        }
+      });
+    }
+  }, {
+    key: 'activate',
+    value: function activate() {
+      this.activate_(null);
+    }
+
+    /** @private */
+
+  }, {
+    key: 'animateActivation_',
+    value: function animateActivation_() {
+      var _this5 = this;
+
+      var _MDCRippleFoundation$2 = MDCRippleFoundation.strings,
+          VAR_FG_TRANSLATE_START = _MDCRippleFoundation$2.VAR_FG_TRANSLATE_START,
+          VAR_FG_TRANSLATE_END = _MDCRippleFoundation$2.VAR_FG_TRANSLATE_END;
+      var _MDCRippleFoundation$3 = MDCRippleFoundation.cssClasses,
+          BG_ACTIVE_FILL = _MDCRippleFoundation$3.BG_ACTIVE_FILL,
+          FG_DEACTIVATION = _MDCRippleFoundation$3.FG_DEACTIVATION,
+          FG_ACTIVATION = _MDCRippleFoundation$3.FG_ACTIVATION;
+      var DEACTIVATION_TIMEOUT_MS = MDCRippleFoundation.numbers.DEACTIVATION_TIMEOUT_MS;
+
+
+      var translateStart = '';
+      var translateEnd = '';
+
+      if (!this.adapter_.isUnbounded()) {
+        var _getFgTranslationCoor = this.getFgTranslationCoordinates_(),
+            startPoint = _getFgTranslationCoor.startPoint,
+            endPoint = _getFgTranslationCoor.endPoint;
+
+        translateStart = startPoint.x + 'px, ' + startPoint.y + 'px';
+        translateEnd = endPoint.x + 'px, ' + endPoint.y + 'px';
+      }
+
+      this.adapter_.updateCssVariable(VAR_FG_TRANSLATE_START, translateStart);
+      this.adapter_.updateCssVariable(VAR_FG_TRANSLATE_END, translateEnd);
+      // Cancel any ongoing activation/deactivation animations
+      clearTimeout(this.activationTimer_);
+      clearTimeout(this.fgDeactivationRemovalTimer_);
+      this.rmBoundedActivationClasses_();
+      this.adapter_.removeClass(FG_DEACTIVATION);
+
+      // Force layout in order to re-trigger the animation.
+      this.adapter_.computeBoundingRect();
+      this.adapter_.addClass(BG_ACTIVE_FILL);
+      this.adapter_.addClass(FG_ACTIVATION);
+      this.activationTimer_ = setTimeout(function () {
+        return _this5.activationTimerCallback_();
+      }, DEACTIVATION_TIMEOUT_MS);
+    }
+
+    /**
+     * @private
+     * @return {{startPoint: PointType, endPoint: PointType}}
+     */
+
+  }, {
+    key: 'getFgTranslationCoordinates_',
+    value: function getFgTranslationCoordinates_() {
+      var activationState = this.activationState_;
+      var activationEvent = activationState.activationEvent,
+          wasActivatedByPointer = activationState.wasActivatedByPointer;
+
+
+      var startPoint = void 0;
+      if (wasActivatedByPointer) {
+        startPoint = __webpack_require__.i(__WEBPACK_IMPORTED_MODULE_3__util__["getNormalizedEventCoords"])(
+        /** @type {!Event} */activationEvent, this.adapter_.getWindowPageOffset(), this.adapter_.computeBoundingRect());
+      } else {
+        startPoint = {
+          x: this.frame_.width / 2,
+          y: this.frame_.height / 2
+        };
+      }
+      // Center the element around the start point.
+      startPoint = {
+        x: startPoint.x - this.initialSize_ / 2,
+        y: startPoint.y - this.initialSize_ / 2
+      };
+
+      var endPoint = {
+        x: this.frame_.width / 2 - this.initialSize_ / 2,
+        y: this.frame_.height / 2 - this.initialSize_ / 2
+      };
+
+      return { startPoint: startPoint, endPoint: endPoint };
+    }
+
+    /** @private */
+
+  }, {
+    key: 'runDeactivationUXLogicIfReady_',
+    value: function runDeactivationUXLogicIfReady_() {
+      var _this6 = this;
+
+      var FG_DEACTIVATION = MDCRippleFoundation.cssClasses.FG_DEACTIVATION;
+      var _activationState_ = this.activationState_,
+          hasDeactivationUXRun = _activationState_.hasDeactivationUXRun,
+          isActivated = _activationState_.isActivated;
+
+      var activationHasEnded = hasDeactivationUXRun || !isActivated;
+      if (activationHasEnded && this.activationAnimationHasEnded_) {
+        this.rmBoundedActivationClasses_();
+        this.adapter_.addClass(FG_DEACTIVATION);
+        this.fgDeactivationRemovalTimer_ = setTimeout(function () {
+          _this6.adapter_.removeClass(FG_DEACTIVATION);
+        }, __WEBPACK_IMPORTED_MODULE_2__constants__["c" /* numbers */].FG_DEACTIVATION_MS);
+      }
+    }
+
+    /** @private */
+
+  }, {
+    key: 'rmBoundedActivationClasses_',
+    value: function rmBoundedActivationClasses_() {
+      var _MDCRippleFoundation$4 = MDCRippleFoundation.cssClasses,
+          BG_ACTIVE_FILL = _MDCRippleFoundation$4.BG_ACTIVE_FILL,
+          FG_ACTIVATION = _MDCRippleFoundation$4.FG_ACTIVATION;
+
+      this.adapter_.removeClass(BG_ACTIVE_FILL);
+      this.adapter_.removeClass(FG_ACTIVATION);
+      this.activationAnimationHasEnded_ = false;
+      this.adapter_.computeBoundingRect();
+    }
+
+    /**
+     * @param {Event} e
+     * @private
+     */
+
+  }, {
+    key: 'deactivate_',
+    value: function deactivate_(e) {
+      var _this7 = this;
+
+      var activationState = this.activationState_;
+      // This can happen in scenarios such as when you have a keyup event that blurs the element.
+
+      if (!activationState.isActivated) {
+        return;
+      }
+      // Programmatic deactivation.
+      if (activationState.isProgrammatic) {
+        var evtObject = null;
+        var _state = /** @type {!ActivationStateType} */_extends({}, activationState);
+        requestAnimationFrame(function () {
+          return _this7.animateDeactivation_(evtObject, _state);
+        });
+        this.activationState_ = this.defaultActivationState_();
+        return;
+      }
+
+      var actualActivationType = DEACTIVATION_ACTIVATION_PAIRS[e.type];
+      var expectedActivationType = activationState.activationEvent.type;
+      // NOTE: Pointer events are tricky - https://patrickhlauke.github.io/touch/tests/results/
+      // Essentially, what we need to do here is decouple the deactivation UX from the actual
+      // deactivation state itself. This way, touch/pointer events in sequence do not trample one
+      // another.
+      var needsDeactivationUX = actualActivationType === expectedActivationType;
+      var needsActualDeactivation = needsDeactivationUX;
+      if (activationState.wasActivatedByPointer) {
+        needsActualDeactivation = e.type === 'mouseup';
+      }
+
+      var state = /** @type {!ActivationStateType} */_extends({}, activationState);
+      requestAnimationFrame(function () {
+        if (needsDeactivationUX) {
+          _this7.activationState_.hasDeactivationUXRun = true;
+          _this7.animateDeactivation_(e, state);
+        }
+
+        if (needsActualDeactivation) {
+          _this7.activationState_ = _this7.defaultActivationState_();
+        }
+      });
+    }
+  }, {
+    key: 'deactivate',
+    value: function deactivate() {
+      this.deactivate_(null);
+    }
+
+    /**
+     * @param {Event} e
+     * @param {!ActivationStateType} options
+     * @private
+     */
+
+  }, {
+    key: 'animateDeactivation_',
+    value: function animateDeactivation_(e, _ref) {
+      var wasActivatedByPointer = _ref.wasActivatedByPointer,
+          wasElementMadeActive = _ref.wasElementMadeActive;
+      var BG_FOCUSED = MDCRippleFoundation.cssClasses.BG_FOCUSED;
+
+      if (wasActivatedByPointer || wasElementMadeActive) {
+        // Remove class left over by element being focused
+        this.adapter_.removeClass(BG_FOCUSED);
+        this.runDeactivationUXLogicIfReady_();
+      }
+    }
+  }, {
+    key: 'destroy',
+    value: function destroy() {
+      var _this8 = this;
+
+      if (!this.isSupported_) {
+        return;
+      }
+      this.removeEventListeners_();
+
+      var _MDCRippleFoundation$5 = MDCRippleFoundation.cssClasses,
+          ROOT = _MDCRippleFoundation$5.ROOT,
+          UNBOUNDED = _MDCRippleFoundation$5.UNBOUNDED;
+
+      requestAnimationFrame(function () {
+        _this8.adapter_.removeClass(ROOT);
+        _this8.adapter_.removeClass(UNBOUNDED);
+        _this8.removeCssVars_();
+      });
+    }
+
+    /** @private */
+
+  }, {
+    key: 'removeEventListeners_',
+    value: function removeEventListeners_() {
+      var _this9 = this;
+
+      this.listenerInfos_.forEach(function (info) {
+        Object.keys(info).forEach(function (k) {
+          _this9.adapter_.deregisterInteractionHandler(info[k], _this9.listeners_[k]);
+        });
+      });
+      this.adapter_.deregisterResizeHandler(this.resizeHandler_);
+    }
+
+    /** @private */
+
+  }, {
+    key: 'removeCssVars_',
+    value: function removeCssVars_() {
+      var _this10 = this;
+
+      var strings = MDCRippleFoundation.strings;
+
+      Object.keys(strings).forEach(function (k) {
+        if (k.indexOf('VAR_') === 0) {
+          _this10.adapter_.updateCssVariable(strings[k], null);
+        }
+      });
+    }
+  }, {
+    key: 'layout',
+    value: function layout() {
+      var _this11 = this;
+
+      if (this.layoutFrame_) {
+        cancelAnimationFrame(this.layoutFrame_);
+      }
+      this.layoutFrame_ = requestAnimationFrame(function () {
+        _this11.layoutInternal_();
+        _this11.layoutFrame_ = 0;
+      });
+    }
+
+    /** @private */
+
+  }, {
+    key: 'layoutInternal_',
+    value: function layoutInternal_() {
+      this.frame_ = this.adapter_.computeBoundingRect();
+
+      var maxDim = Math.max(this.frame_.height, this.frame_.width);
+      var surfaceDiameter = Math.sqrt(Math.pow(this.frame_.width, 2) + Math.pow(this.frame_.height, 2));
+
+      // 60% of the largest dimension of the surface
+      this.initialSize_ = maxDim * MDCRippleFoundation.numbers.INITIAL_ORIGIN_SCALE;
+
+      // Diameter of the surface + 10px
+      this.maxRadius_ = surfaceDiameter + MDCRippleFoundation.numbers.PADDING;
+      this.fgScale_ = this.maxRadius_ / this.initialSize_;
+      this.xfDuration_ = 1000 * Math.sqrt(this.maxRadius_ / 1024);
+      this.updateLayoutCssVars_();
+    }
+
+    /** @private */
+
+  }, {
+    key: 'updateLayoutCssVars_',
+    value: function updateLayoutCssVars_() {
+      var _MDCRippleFoundation$6 = MDCRippleFoundation.strings,
+          VAR_SURFACE_WIDTH = _MDCRippleFoundation$6.VAR_SURFACE_WIDTH,
+          VAR_SURFACE_HEIGHT = _MDCRippleFoundation$6.VAR_SURFACE_HEIGHT,
+          VAR_FG_SIZE = _MDCRippleFoundation$6.VAR_FG_SIZE,
+          VAR_LEFT = _MDCRippleFoundation$6.VAR_LEFT,
+          VAR_TOP = _MDCRippleFoundation$6.VAR_TOP,
+          VAR_FG_SCALE = _MDCRippleFoundation$6.VAR_FG_SCALE;
+
+
+      this.adapter_.updateCssVariable(VAR_SURFACE_WIDTH, this.frame_.width + 'px');
+      this.adapter_.updateCssVariable(VAR_SURFACE_HEIGHT, this.frame_.height + 'px');
+      this.adapter_.updateCssVariable(VAR_FG_SIZE, this.initialSize_ + 'px');
+      this.adapter_.updateCssVariable(VAR_FG_SCALE, this.fgScale_);
+
+      if (this.adapter_.isUnbounded()) {
+        this.unboundedCoords_ = {
+          left: Math.round(this.frame_.width / 2 - this.initialSize_ / 2),
+          top: Math.round(this.frame_.height / 2 - this.initialSize_ / 2)
+        };
+
+        this.adapter_.updateCssVariable(VAR_LEFT, this.unboundedCoords_.left + 'px');
+        this.adapter_.updateCssVariable(VAR_TOP, this.unboundedCoords_.top + 'px');
+      }
+    }
+  }]);
+
+  return MDCRippleFoundation;
+}(__WEBPACK_IMPORTED_MODULE_0__material_base_foundation__["a" /* default */]);
+
+/* harmony default export */ __webpack_exports__["a"] = (MDCRippleFoundation);
+
+/***/ }),
+
+/***/ 98:
+/***/ (function(module, exports, __webpack_require__) {
+
+module.exports = __webpack_require__(36);
+
+
+/***/ })
+
+/******/ });
+});

+ 259 - 0
support/client/lib/vwf/view/lib/mdc/dist/mdc.theme.css

@@ -0,0 +1,259 @@
+/*!
+ Material Components for the web
+ Copyright (c) 2017 Google Inc.
+ License: Apache-2.0
+*/
+/*
+  Precomputed linear color channel values, for use in contrast calculations.
+  See https://www.w3.org/TR/WCAG20-TECHS/G17.html#G17-tests
+
+  Algorithm, for c in 0 to 255:
+  f(c) {
+    c = c / 255;
+    return c < 0.03928 ? c / 12.92 : Math.pow((c + 0.055) / 1.055, 2.4);
+  }
+
+  This lookup table is needed since there is no `pow` in SASS.
+*/
+/**
+ * Calculate the luminance for a color.
+ * See https://www.w3.org/TR/WCAG20-TECHS/G17.html#G17-tests
+ */
+/**
+ * Calculate the contrast ratio between two colors.
+ * See https://www.w3.org/TR/WCAG20-TECHS/G17.html#G17-tests
+ */
+/**
+ * Determine whether to use dark or light text on top of given color.
+ * Returns "dark" for dark text and "light" for light text.
+ */
+/*
+  Main theme colors.
+  If you're a user customizing your color scheme in SASS, these are probably the only variables you need to change.
+*/
+/* Indigo 500 */
+/* Pink A200 */
+/* White */
+/* Which set of text colors to use for each main theme color (light or dark) */
+/* Text colors according to light vs dark and text type */
+/* Primary text colors for each of the theme colors */
+/**
+ * Applies the correct theme color style to the specified property.
+ * $property is typically color or background-color, but can be any CSS property that accepts color values.
+ * $style should be one of the map keys in $mdc-theme-property-values (_variables.scss).
+ */
+/**
+ * Creates a rule to be used in MDC-Web components for dark theming, and applies the provided contents.
+ * Should provide the $root-selector option if applied to anything other than the root selector.
+ * When used with a modifier class, provide a second argument of `true` for the $compound parameter
+ * to specify that this should be attached as a compound class.
+ *
+ * Usage example:
+ *
+ * ```scss
+ * .mdc-foo {
+ *   color: black;
+ *
+ *   @include mdc-theme-dark {
+ *     color: white;
+ *   }
+ *
+ *   &__bar {
+ *     background: black;
+ *
+ *     @include mdc-theme-dark(".mdc-foo") {
+ *       background: white;
+ *     }
+ *   }
+ * }
+ *
+ * .mdc-foo--disabled {
+ *   opacity: .38;
+ *
+ *   @include mdc-theme-dark(".mdc-foo", true) {
+ *     opacity: .5;
+ *   }
+ * }
+ * ```
+ */
+:root {
+  --mdc-theme-primary: #3f51b5;
+  --mdc-theme-accent: #ff4081;
+  --mdc-theme-background: #fff;
+  --mdc-theme-text-primary-on-primary: white;
+  --mdc-theme-text-secondary-on-primary: rgba(255, 255, 255, 0.7);
+  --mdc-theme-text-hint-on-primary: rgba(255, 255, 255, 0.5);
+  --mdc-theme-text-disabled-on-primary: rgba(255, 255, 255, 0.5);
+  --mdc-theme-text-icon-on-primary: rgba(255, 255, 255, 0.5);
+  --mdc-theme-text-primary-on-accent: white;
+  --mdc-theme-text-secondary-on-accent: rgba(255, 255, 255, 0.7);
+  --mdc-theme-text-hint-on-accent: rgba(255, 255, 255, 0.5);
+  --mdc-theme-text-disabled-on-accent: rgba(255, 255, 255, 0.5);
+  --mdc-theme-text-icon-on-accent: rgba(255, 255, 255, 0.5);
+  --mdc-theme-text-primary-on-background: rgba(0, 0, 0, 0.87);
+  --mdc-theme-text-secondary-on-background: rgba(0, 0, 0, 0.54);
+  --mdc-theme-text-hint-on-background: rgba(0, 0, 0, 0.38);
+  --mdc-theme-text-disabled-on-background: rgba(0, 0, 0, 0.38);
+  --mdc-theme-text-icon-on-background: rgba(0, 0, 0, 0.38);
+  --mdc-theme-text-primary-on-light: rgba(0, 0, 0, 0.87);
+  --mdc-theme-text-secondary-on-light: rgba(0, 0, 0, 0.54);
+  --mdc-theme-text-hint-on-light: rgba(0, 0, 0, 0.38);
+  --mdc-theme-text-disabled-on-light: rgba(0, 0, 0, 0.38);
+  --mdc-theme-text-icon-on-light: rgba(0, 0, 0, 0.38);
+  --mdc-theme-text-primary-on-dark: white;
+  --mdc-theme-text-secondary-on-dark: rgba(255, 255, 255, 0.7);
+  --mdc-theme-text-hint-on-dark: rgba(255, 255, 255, 0.5);
+  --mdc-theme-text-disabled-on-dark: rgba(255, 255, 255, 0.5);
+  --mdc-theme-text-icon-on-dark: rgba(255, 255, 255, 0.5); }
+
+/* Special case, so that .mdc-theme--background changes background color, not text color. */
+.mdc-theme--background {
+  /* @alternate */
+  background-color: #fff;
+  background-color: var(--mdc-theme-background, #fff); }
+
+.mdc-theme--primary {
+  /* @alternate */
+  color: #3f51b5 !important;
+  color: var(--mdc-theme-primary, #3f51b5) !important; }
+
+.mdc-theme--accent {
+  /* @alternate */
+  color: #ff4081 !important;
+  color: var(--mdc-theme-accent, #ff4081) !important; }
+
+.mdc-theme--text-primary-on-primary {
+  /* @alternate */
+  color: white !important;
+  color: var(--mdc-theme-text-primary-on-primary, white) !important; }
+
+.mdc-theme--text-secondary-on-primary {
+  /* @alternate */
+  color: rgba(255, 255, 255, 0.7) !important;
+  color: var(--mdc-theme-text-secondary-on-primary, rgba(255, 255, 255, 0.7)) !important; }
+
+.mdc-theme--text-hint-on-primary {
+  /* @alternate */
+  color: rgba(255, 255, 255, 0.5) !important;
+  color: var(--mdc-theme-text-hint-on-primary, rgba(255, 255, 255, 0.5)) !important; }
+
+.mdc-theme--text-disabled-on-primary {
+  /* @alternate */
+  color: rgba(255, 255, 255, 0.5) !important;
+  color: var(--mdc-theme-text-disabled-on-primary, rgba(255, 255, 255, 0.5)) !important; }
+
+.mdc-theme--text-icon-on-primary {
+  /* @alternate */
+  color: rgba(255, 255, 255, 0.5) !important;
+  color: var(--mdc-theme-text-icon-on-primary, rgba(255, 255, 255, 0.5)) !important; }
+
+.mdc-theme--text-primary-on-accent {
+  /* @alternate */
+  color: white !important;
+  color: var(--mdc-theme-text-primary-on-accent, white) !important; }
+
+.mdc-theme--text-secondary-on-accent {
+  /* @alternate */
+  color: rgba(255, 255, 255, 0.7) !important;
+  color: var(--mdc-theme-text-secondary-on-accent, rgba(255, 255, 255, 0.7)) !important; }
+
+.mdc-theme--text-hint-on-accent {
+  /* @alternate */
+  color: rgba(255, 255, 255, 0.5) !important;
+  color: var(--mdc-theme-text-hint-on-accent, rgba(255, 255, 255, 0.5)) !important; }
+
+.mdc-theme--text-disabled-on-accent {
+  /* @alternate */
+  color: rgba(255, 255, 255, 0.5) !important;
+  color: var(--mdc-theme-text-disabled-on-accent, rgba(255, 255, 255, 0.5)) !important; }
+
+.mdc-theme--text-icon-on-accent {
+  /* @alternate */
+  color: rgba(255, 255, 255, 0.5) !important;
+  color: var(--mdc-theme-text-icon-on-accent, rgba(255, 255, 255, 0.5)) !important; }
+
+.mdc-theme--text-primary-on-background {
+  /* @alternate */
+  color: rgba(0, 0, 0, 0.87) !important;
+  color: var(--mdc-theme-text-primary-on-background, rgba(0, 0, 0, 0.87)) !important; }
+
+.mdc-theme--text-secondary-on-background {
+  /* @alternate */
+  color: rgba(0, 0, 0, 0.54) !important;
+  color: var(--mdc-theme-text-secondary-on-background, rgba(0, 0, 0, 0.54)) !important; }
+
+.mdc-theme--text-hint-on-background {
+  /* @alternate */
+  color: rgba(0, 0, 0, 0.38) !important;
+  color: var(--mdc-theme-text-hint-on-background, rgba(0, 0, 0, 0.38)) !important; }
+
+.mdc-theme--text-disabled-on-background {
+  /* @alternate */
+  color: rgba(0, 0, 0, 0.38) !important;
+  color: var(--mdc-theme-text-disabled-on-background, rgba(0, 0, 0, 0.38)) !important; }
+
+.mdc-theme--text-icon-on-background {
+  /* @alternate */
+  color: rgba(0, 0, 0, 0.38) !important;
+  color: var(--mdc-theme-text-icon-on-background, rgba(0, 0, 0, 0.38)) !important; }
+
+.mdc-theme--text-primary-on-light {
+  /* @alternate */
+  color: rgba(0, 0, 0, 0.87) !important;
+  color: var(--mdc-theme-text-primary-on-light, rgba(0, 0, 0, 0.87)) !important; }
+
+.mdc-theme--text-secondary-on-light {
+  /* @alternate */
+  color: rgba(0, 0, 0, 0.54) !important;
+  color: var(--mdc-theme-text-secondary-on-light, rgba(0, 0, 0, 0.54)) !important; }
+
+.mdc-theme--text-hint-on-light {
+  /* @alternate */
+  color: rgba(0, 0, 0, 0.38) !important;
+  color: var(--mdc-theme-text-hint-on-light, rgba(0, 0, 0, 0.38)) !important; }
+
+.mdc-theme--text-disabled-on-light {
+  /* @alternate */
+  color: rgba(0, 0, 0, 0.38) !important;
+  color: var(--mdc-theme-text-disabled-on-light, rgba(0, 0, 0, 0.38)) !important; }
+
+.mdc-theme--text-icon-on-light {
+  /* @alternate */
+  color: rgba(0, 0, 0, 0.38) !important;
+  color: var(--mdc-theme-text-icon-on-light, rgba(0, 0, 0, 0.38)) !important; }
+
+.mdc-theme--text-primary-on-dark {
+  /* @alternate */
+  color: white !important;
+  color: var(--mdc-theme-text-primary-on-dark, white) !important; }
+
+.mdc-theme--text-secondary-on-dark {
+  /* @alternate */
+  color: rgba(255, 255, 255, 0.7) !important;
+  color: var(--mdc-theme-text-secondary-on-dark, rgba(255, 255, 255, 0.7)) !important; }
+
+.mdc-theme--text-hint-on-dark {
+  /* @alternate */
+  color: rgba(255, 255, 255, 0.5) !important;
+  color: var(--mdc-theme-text-hint-on-dark, rgba(255, 255, 255, 0.5)) !important; }
+
+.mdc-theme--text-disabled-on-dark {
+  /* @alternate */
+  color: rgba(255, 255, 255, 0.5) !important;
+  color: var(--mdc-theme-text-disabled-on-dark, rgba(255, 255, 255, 0.5)) !important; }
+
+.mdc-theme--text-icon-on-dark {
+  /* @alternate */
+  color: rgba(255, 255, 255, 0.5) !important;
+  color: var(--mdc-theme-text-icon-on-dark, rgba(255, 255, 255, 0.5)) !important; }
+
+/* CSS rules for using primary and accent as background colors. */
+.mdc-theme--primary-bg {
+  /* @alternate */
+  background-color: #3f51b5 !important;
+  background-color: var(--mdc-theme-primary, #3f51b5) !important; }
+
+.mdc-theme--accent-bg {
+  /* @alternate */
+  background-color: #ff4081 !important;
+  background-color: var(--mdc-theme-accent, #ff4081) !important; }

+ 83 - 0
support/client/lib/vwf/view/lib/mdc/dist/mdc.theme.css-entry

@@ -0,0 +1,83 @@
+/*!
+ Material Components for the web
+ Copyright (c) 2017 Google Inc.
+ License: Apache-2.0
+*/
+/******/ (function(modules) { // webpackBootstrap
+/******/ 	// The module cache
+/******/ 	var installedModules = {};
+/******/
+/******/ 	// The require function
+/******/ 	function __webpack_require__(moduleId) {
+/******/
+/******/ 		// Check if module is in cache
+/******/ 		if(installedModules[moduleId]) {
+/******/ 			return installedModules[moduleId].exports;
+/******/ 		}
+/******/ 		// Create a new module (and put it into the cache)
+/******/ 		var module = installedModules[moduleId] = {
+/******/ 			i: moduleId,
+/******/ 			l: false,
+/******/ 			exports: {}
+/******/ 		};
+/******/
+/******/ 		// Execute the module function
+/******/ 		modules[moduleId].call(module.exports, module, module.exports, __webpack_require__);
+/******/
+/******/ 		// Flag the module as loaded
+/******/ 		module.l = true;
+/******/
+/******/ 		// Return the exports of the module
+/******/ 		return module.exports;
+/******/ 	}
+/******/
+/******/
+/******/ 	// expose the modules object (__webpack_modules__)
+/******/ 	__webpack_require__.m = modules;
+/******/
+/******/ 	// expose the module cache
+/******/ 	__webpack_require__.c = installedModules;
+/******/
+/******/ 	// identity function for calling harmony imports with the correct context
+/******/ 	__webpack_require__.i = function(value) { return value; };
+/******/
+/******/ 	// define getter function for harmony exports
+/******/ 	__webpack_require__.d = function(exports, name, getter) {
+/******/ 		if(!__webpack_require__.o(exports, name)) {
+/******/ 			Object.defineProperty(exports, name, {
+/******/ 				configurable: false,
+/******/ 				enumerable: true,
+/******/ 				get: getter
+/******/ 			});
+/******/ 		}
+/******/ 	};
+/******/
+/******/ 	// getDefaultExport function for compatibility with non-harmony modules
+/******/ 	__webpack_require__.n = function(module) {
+/******/ 		var getter = module && module.__esModule ?
+/******/ 			function getDefault() { return module['default']; } :
+/******/ 			function getModuleExports() { return module; };
+/******/ 		__webpack_require__.d(getter, 'a', getter);
+/******/ 		return getter;
+/******/ 	};
+/******/
+/******/ 	// Object.prototype.hasOwnProperty.call
+/******/ 	__webpack_require__.o = function(object, property) { return Object.prototype.hasOwnProperty.call(object, property); };
+/******/
+/******/ 	// __webpack_public_path__
+/******/ 	__webpack_require__.p = "/assets/";
+/******/
+/******/ 	// Load entry module and return exports
+/******/ 	return __webpack_require__(__webpack_require__.s = 24);
+/******/ })
+/************************************************************************/
+/******/ ({
+
+/***/ 24:
+/***/ (function(module, exports) {
+
+// removed by extract-text-webpack-plugin
+
+/***/ })
+
+/******/ });

+ 488 - 0
support/client/lib/vwf/view/lib/mdc/dist/mdc.toolbar.css

@@ -0,0 +1,488 @@
+/*!
+ Material Components for the web
+ Copyright (c) 2017 Google Inc.
+ License: Apache-2.0
+*/
+/**
+ * The css property used for elevation. In most cases this should not be changed. It is exposed
+ * as a variable for abstraction / easy use when needing to reference the property directly, for
+ * example in a `will-change` rule.
+ */
+/**
+ * The default duration value for elevation transitions.
+ */
+/**
+ * The default easing value for elevation transitions.
+ */
+/**
+ * Applies the correct css rules to an element to give it the elevation specified by $z-value.
+ * The $z-value must be between 0 and 24.
+ */
+/**
+ * Returns a string that can be used as the value for a `transition` property for elevation.
+ * Calling this function directly is useful in situations where a component needs to transition
+ * more than one property.
+ *
+ * ```scss
+ * .foo {
+ *   transition: mdc-elevation-transition-rule(), opacity 100ms ease;
+ *   will-change: $mdc-elevation-property, opacity;
+ * }
+ * ```
+ */
+/**
+ * Applies the correct css rules needed to have an element transition between elevations.
+ * This mixin should be applied to elements whose elevation values will change depending on their
+ * context (e.g. when active or disabled).
+ */
+/**
+ * Creates a rule that will be applied when an MDC-Web component is within the context of an RTL layout.
+ *
+ * Usage Example:
+ * ```scss
+ * .mdc-foo {
+ *   position: absolute;
+ *   left: 0;
+ *
+ *   @include mdc-rtl {
+ *     left: auto;
+ *     right: 0;
+ *   }
+ *
+ *   &__bar {
+ *     margin-left: 4px;
+ *     @include mdc-rtl(".mdc-foo") {
+ *       margin-left: auto;
+ *       margin-right: 4px;
+ *     }
+ *   }
+ * }
+ *
+ * .mdc-foo--mod {
+ *   padding-left: 4px;
+ *
+ *   @include mdc-rtl {
+ *     padding-left: auto;
+ *     padding-right: 4px;
+ *   }
+ * }
+ * ```
+ *
+ * Note that this works by checking for [dir="rtl"] on an ancestor element. While this will work
+ * in most cases, it will in some cases lead to false negatives, e.g.
+ *
+ * ```html
+ * <html dir="rtl">
+ *   <!-- ... -->
+ *   <div dir="ltr">
+ *     <div class="mdc-foo">Styled incorrectly as RTL!</div>
+ *   </div>
+ * </html>
+ * ```
+ *
+ * In the future, selectors such as :dir (http://mdn.io/:dir) will help us mitigate this.
+ */
+/**
+ * Takes a base box-model property - e.g. margin / border / padding - along with a default
+ * direction and value, and emits rules which apply the value to the
+ * "<base-property>-<default-direction>" property by default, but flips the direction
+ * when within an RTL context.
+ *
+ * For example:
+ *
+ * ```scss
+ * .mdc-foo {
+ *   @include mdc-rtl-reflexive-box(margin, left, 8px);
+ * }
+ * ```
+ * is equivalent to:
+ *
+ * ```scss
+ * .mdc-foo {
+ *   margin-left: 8px;
+ *
+ *   @include mdc-rtl {
+ *     margin-right: 8px;
+ *     margin-left: 0;
+ *   }
+ * }
+ * ```
+ * whereas:
+ *
+ * ```scss
+ * .mdc-foo {
+ *   @include mdc-rtl-reflexive-box(margin, right, 8px);
+ * }
+ * ```
+ * is equivalent to:
+ *
+ * ```scss
+ * .mdc-foo {
+ *   margin-right: 8px;
+ *
+ *   @include mdc-rtl {
+ *     margin-right: 0;
+ *     margin-left: 8px;
+ *   }
+ * }
+ * ```
+ *
+ * You can also pass a 4th optional $root-selector argument which will be forwarded to `mdc-rtl`,
+ * e.g. `@include mdc-rtl-reflexive-box(margin, left, 8px, ".mdc-component")`.
+ *
+ * Note that this function will always zero out the original value in an RTL context. If you're
+ * trying to flip the values, use mdc-rtl-reflexive-property().
+ */
+/**
+ * Takes a base property and emits rules that assign <base-property>-left to <left-value> and
+ * <base-property>-right to <right-value> in a LTR context, and vice versa in a RTL context.
+ * For example:
+ *
+ * ```scss
+ * .mdc-foo {
+ *   @include mdc-rtl-reflexive-property(margin, auto, 12px);
+ * }
+ * ```
+ * is equivalent to:
+ *
+ * ```scss
+ * .mdc-foo {
+ *   margin-left: auto;
+ *   margin-right: 12px;
+ *
+ *   @include mdc-rtl {
+ *     margin-left: 12px;
+ *     margin-right: auto;
+ *   }
+ * }
+ * ```
+ *
+ * A 4th optional $root-selector argument can be given, which will be passed to `mdc-rtl`.
+ */
+/**
+ * Takes an argument specifying a horizontal position property (either "left" or "right") as well
+ * as a value, and applies that value to the specified position in a LTR context, and flips it in a
+ * RTL context. For example:
+ *
+ * ```scss
+ * .mdc-foo {
+ *   @include mdc-rtl-reflexive-position(left, 0);
+ *   position: absolute;
+ * }
+ * ```
+ * is equivalent to:
+ *
+ * ```scss
+ *  .mdc-foo {
+ *    position: absolute;
+ *    left: 0;
+ *    right: initial;
+ *
+ *    @include mdc-rtl {
+ *      right: 0;
+ *      left: initial;
+ *    }
+ *  }
+ * ```
+ * An optional third $root-selector argument may also be given, which is passed to `mdc-rtl`.
+ */
+/*
+  Precomputed linear color channel values, for use in contrast calculations.
+  See https://www.w3.org/TR/WCAG20-TECHS/G17.html#G17-tests
+
+  Algorithm, for c in 0 to 255:
+  f(c) {
+    c = c / 255;
+    return c < 0.03928 ? c / 12.92 : Math.pow((c + 0.055) / 1.055, 2.4);
+  }
+
+  This lookup table is needed since there is no `pow` in SASS.
+*/
+/**
+ * Calculate the luminance for a color.
+ * See https://www.w3.org/TR/WCAG20-TECHS/G17.html#G17-tests
+ */
+/**
+ * Calculate the contrast ratio between two colors.
+ * See https://www.w3.org/TR/WCAG20-TECHS/G17.html#G17-tests
+ */
+/**
+ * Determine whether to use dark or light text on top of given color.
+ * Returns "dark" for dark text and "light" for light text.
+ */
+/*
+  Main theme colors.
+  If you're a user customizing your color scheme in SASS, these are probably the only variables you need to change.
+*/
+/* Indigo 500 */
+/* Pink A200 */
+/* White */
+/* Which set of text colors to use for each main theme color (light or dark) */
+/* Text colors according to light vs dark and text type */
+/* Primary text colors for each of the theme colors */
+/**
+ * Applies the correct theme color style to the specified property.
+ * $property is typically color or background-color, but can be any CSS property that accepts color values.
+ * $style should be one of the map keys in $mdc-theme-property-values (_variables.scss).
+ */
+/**
+ * Creates a rule to be used in MDC-Web components for dark theming, and applies the provided contents.
+ * Should provide the $root-selector option if applied to anything other than the root selector.
+ * When used with a modifier class, provide a second argument of `true` for the $compound parameter
+ * to specify that this should be attached as a compound class.
+ *
+ * Usage example:
+ *
+ * ```scss
+ * .mdc-foo {
+ *   color: black;
+ *
+ *   @include mdc-theme-dark {
+ *     color: white;
+ *   }
+ *
+ *   &__bar {
+ *     background: black;
+ *
+ *     @include mdc-theme-dark(".mdc-foo") {
+ *       background: white;
+ *     }
+ *   }
+ * }
+ *
+ * .mdc-foo--disabled {
+ *   opacity: .38;
+ *
+ *   @include mdc-theme-dark(".mdc-foo", true) {
+ *     opacity: .5;
+ *   }
+ * }
+ * ```
+ */
+/* TODO(sgomes): Figure out what to do about desktop font sizes. */
+/* TODO(sgomes): Figure out what to do about i18n and i18n font sizes. */
+/**
+ * Applies styles to the different types of icons that can exist in toolbars.
+ * Both .mdc-toolbar__icon and .mdc-toolbar__icon--menu share all styles except for
+ * horizontal padding.
+ */
+.mdc-toolbar {
+  display: -webkit-box;
+  display: -ms-flexbox;
+  display: flex;
+  position: relative;
+  -webkit-box-orient: vertical;
+  -webkit-box-direction: normal;
+      -ms-flex-direction: column;
+          flex-direction: column;
+  -webkit-box-pack: justify;
+      -ms-flex-pack: justify;
+          justify-content: space-between;
+  width: 100%;
+  -webkit-box-sizing: border-box;
+          box-sizing: border-box;
+  /* @alternate */
+  background-color: #3f51b5;
+  background-color: var(--mdc-theme-primary, #3f51b5);
+  /* @alternate */
+  color: white;
+  color: var(--mdc-theme-text-primary-on-primary, white); }
+  .mdc-toolbar__row {
+    display: -webkit-box;
+    display: -ms-flexbox;
+    display: flex;
+    position: relative;
+    -webkit-box-align: center;
+        -ms-flex-align: center;
+            align-items: center;
+    width: 100%;
+    height: auto;
+    min-height: 64px;
+    -webkit-box-sizing: border-box;
+            box-sizing: border-box; }
+    @media (max-width: 959px) and (orientation: landscape) {
+      .mdc-toolbar__row {
+        min-height: 48px; } }
+    @media (max-width: 599px) {
+      .mdc-toolbar__row {
+        min-height: 56px; } }
+  .mdc-toolbar__section {
+    display: -webkit-inline-box;
+    display: -ms-inline-flexbox;
+    display: inline-flex;
+    -webkit-box-flex: 1;
+        -ms-flex: 1;
+            flex: 1;
+    -webkit-box-align: start;
+        -ms-flex-align: start;
+            align-items: flex-start;
+    -webkit-box-pack: center;
+        -ms-flex-pack: center;
+            justify-content: center;
+    min-width: 0;
+    height: 100%;
+    z-index: 1; }
+    .mdc-toolbar__section--align-start {
+      -webkit-box-pack: start;
+          -ms-flex-pack: start;
+              justify-content: flex-start;
+      -webkit-box-ordinal-group: 0;
+          -ms-flex-order: -1;
+              order: -1; }
+    .mdc-toolbar__section--align-end {
+      -webkit-box-pack: end;
+          -ms-flex-pack: end;
+              justify-content: flex-end;
+      -webkit-box-ordinal-group: 2;
+          -ms-flex-order: 1;
+              order: 1; }
+  .mdc-toolbar__title {
+    font-family: Roboto, sans-serif;
+    -moz-osx-font-smoothing: grayscale;
+    -webkit-font-smoothing: antialiased;
+    font-size: 1.25rem;
+    font-weight: 500;
+    letter-spacing: 0.02em;
+    line-height: 2rem;
+    text-decoration: inherit;
+    text-transform: inherit;
+    text-overflow: ellipsis;
+    white-space: nowrap;
+    overflow: hidden;
+    -ms-flex-item-align: center;
+        align-self: center;
+    margin: 0;
+    margin-left: 24px;
+    padding: 16px 0;
+    line-height: 1.5rem;
+    z-index: 1; }
+  .mdc-toolbar__icon {
+    display: -webkit-box;
+    display: -ms-flexbox;
+    display: flex;
+    -webkit-box-align: center;
+        -ms-flex-align: center;
+            align-items: center;
+    -webkit-box-pack: center;
+        -ms-flex-pack: center;
+            justify-content: center;
+    padding: 16px 8px;
+    border: none;
+    background-color: inherit;
+    color: inherit;
+    text-decoration: none;
+    /* @alternate */
+    color: white;
+    color: var(--mdc-theme-text-primary-on-primary, white);
+    cursor: pointer; }
+  .mdc-toolbar__icon:last-child {
+    padding-right: 16px; }
+  .mdc-toolbar__icon--menu {
+    display: -webkit-box;
+    display: -ms-flexbox;
+    display: flex;
+    -webkit-box-align: center;
+        -ms-flex-align: center;
+            align-items: center;
+    -webkit-box-pack: center;
+        -ms-flex-pack: center;
+            justify-content: center;
+    padding: 16px;
+    border: none;
+    background-color: inherit;
+    color: inherit;
+    text-decoration: none;
+    /* @alternate */
+    color: white;
+    color: var(--mdc-theme-text-primary-on-primary, white);
+    padding: 16px 24px;
+    cursor: pointer; }
+
+.mdc-toolbar__icon--menu + .mdc-toolbar__title {
+  margin-left: 8px; }
+
+@media (max-width: 599px) {
+  .mdc-toolbar__icon--menu {
+    padding: 16px; }
+  .mdc-toolbar__icon:last-child {
+    padding: 16px 8px; }
+  .mdc-toolbar__title {
+    margin-left: 16px !important; } }
+
+.mdc-toolbar--fixed {
+  position: fixed;
+  top: 0;
+  left: 0;
+  z-index: 4;
+  -webkit-box-shadow: 0px 2px 4px -1px rgba(0, 0, 0, 0.2), 0px 4px 5px 0px rgba(0, 0, 0, 0.14), 0px 1px 10px 0px rgba(0, 0, 0, 0.12);
+          box-shadow: 0px 2px 4px -1px rgba(0, 0, 0, 0.2), 0px 4px 5px 0px rgba(0, 0, 0, 0.14), 0px 1px 10px 0px rgba(0, 0, 0, 0.12); }
+
+.mdc-toolbar--flexible {
+  --mdc-toolbar-ratio-to-extend-flexible: 4; }
+  .mdc-toolbar--flexible .mdc-toolbar__row:first-child {
+    height: 256px;
+    height: calc(64px * var(--mdc-toolbar-ratio-to-extend-flexible, 4)); }
+    @media (max-width: 599px) {
+      .mdc-toolbar--flexible .mdc-toolbar__row:first-child {
+        height: 224px;
+        height: calc(56px * var(--mdc-toolbar-ratio-to-extend-flexible, 4)); } }
+    .mdc-toolbar--flexible .mdc-toolbar__row:first-child::after {
+      position: absolute;
+      content: ""; }
+  .mdc-toolbar--flexible-default-behavior .mdc-toolbar__title {
+    font-family: Roboto, sans-serif;
+    -moz-osx-font-smoothing: grayscale;
+    -webkit-font-smoothing: antialiased;
+    font-size: 2.125rem;
+    font-weight: 400;
+    letter-spacing: normal;
+    line-height: 2.5rem;
+    text-decoration: inherit;
+    text-transform: inherit;
+    -ms-flex-item-align: end;
+        align-self: flex-end;
+    line-height: 1.5rem; }
+  .mdc-toolbar--flexible-default-behavior .mdc-toolbar__row:first-child::after {
+    top: 0;
+    left: 0;
+    width: 100%;
+    height: 100%;
+    -webkit-transition: opacity .2s ease;
+    transition: opacity .2s ease;
+    opacity: 1; }
+  .mdc-toolbar--flexible-default-behavior.mdc-toolbar--flexible-space-minimized .mdc-toolbar__row:first-child::after {
+    opacity: 0; }
+  .mdc-toolbar--flexible-default-behavior.mdc-toolbar--flexible-space-minimized .mdc-toolbar__title {
+    font-weight: 500; }
+
+.mdc-toolbar--waterfall.mdc-toolbar--fixed {
+  -webkit-box-shadow: 0px 0px 0px 0px rgba(0, 0, 0, 0.2), 0px 0px 0px 0px rgba(0, 0, 0, 0.14), 0px 0px 0px 0px rgba(0, 0, 0, 0.12);
+          box-shadow: 0px 0px 0px 0px rgba(0, 0, 0, 0.2), 0px 0px 0px 0px rgba(0, 0, 0, 0.14), 0px 0px 0px 0px rgba(0, 0, 0, 0.12);
+  -webkit-transition: -webkit-box-shadow 280ms cubic-bezier(0.4, 0, 0.2, 1);
+  transition: -webkit-box-shadow 280ms cubic-bezier(0.4, 0, 0.2, 1);
+  transition: box-shadow 280ms cubic-bezier(0.4, 0, 0.2, 1);
+  transition: box-shadow 280ms cubic-bezier(0.4, 0, 0.2, 1), -webkit-box-shadow 280ms cubic-bezier(0.4, 0, 0.2, 1);
+  will-change: box-shadow; }
+  .mdc-toolbar--waterfall.mdc-toolbar--fixed.mdc-toolbar--flexible-space-minimized {
+    -webkit-box-shadow: 0px 2px 4px -1px rgba(0, 0, 0, 0.2), 0px 4px 5px 0px rgba(0, 0, 0, 0.14), 0px 1px 10px 0px rgba(0, 0, 0, 0.12);
+            box-shadow: 0px 2px 4px -1px rgba(0, 0, 0, 0.2), 0px 4px 5px 0px rgba(0, 0, 0, 0.14), 0px 1px 10px 0px rgba(0, 0, 0, 0.12); }
+  .mdc-toolbar--waterfall.mdc-toolbar--fixed.mdc-toolbar--fixed-lastrow-only.mdc-toolbar--flexible-space-minimized {
+    -webkit-box-shadow: 0px 0px 0px 0px rgba(0, 0, 0, 0.2), 0px 0px 0px 0px rgba(0, 0, 0, 0.14), 0px 0px 0px 0px rgba(0, 0, 0, 0.12);
+            box-shadow: 0px 0px 0px 0px rgba(0, 0, 0, 0.2), 0px 0px 0px 0px rgba(0, 0, 0, 0.14), 0px 0px 0px 0px rgba(0, 0, 0, 0.12); }
+  .mdc-toolbar--waterfall.mdc-toolbar--fixed.mdc-toolbar--fixed-lastrow-only.mdc-toolbar--fixed-at-last-row {
+    -webkit-box-shadow: 0px 2px 4px -1px rgba(0, 0, 0, 0.2), 0px 4px 5px 0px rgba(0, 0, 0, 0.14), 0px 1px 10px 0px rgba(0, 0, 0, 0.12);
+            box-shadow: 0px 2px 4px -1px rgba(0, 0, 0, 0.2), 0px 4px 5px 0px rgba(0, 0, 0, 0.14), 0px 1px 10px 0px rgba(0, 0, 0, 0.12); }
+
+.mdc-toolbar-fixed-adjust {
+  margin-top: 64px; }
+  @media (max-width: 959px) and (orientation: landscape) {
+    .mdc-toolbar-fixed-adjust {
+      margin-top: 48px; } }
+  @media (max-width: 599px) {
+    .mdc-toolbar-fixed-adjust {
+      margin-top: 56px; } }
+
+.mdc-toolbar__section--shrink-to-fit {
+  -webkit-box-flex: 0;
+      -ms-flex: none;
+          flex: none; }

+ 83 - 0
support/client/lib/vwf/view/lib/mdc/dist/mdc.toolbar.css-entry

@@ -0,0 +1,83 @@
+/*!
+ Material Components for the web
+ Copyright (c) 2017 Google Inc.
+ License: Apache-2.0
+*/
+/******/ (function(modules) { // webpackBootstrap
+/******/ 	// The module cache
+/******/ 	var installedModules = {};
+/******/
+/******/ 	// The require function
+/******/ 	function __webpack_require__(moduleId) {
+/******/
+/******/ 		// Check if module is in cache
+/******/ 		if(installedModules[moduleId]) {
+/******/ 			return installedModules[moduleId].exports;
+/******/ 		}
+/******/ 		// Create a new module (and put it into the cache)
+/******/ 		var module = installedModules[moduleId] = {
+/******/ 			i: moduleId,
+/******/ 			l: false,
+/******/ 			exports: {}
+/******/ 		};
+/******/
+/******/ 		// Execute the module function
+/******/ 		modules[moduleId].call(module.exports, module, module.exports, __webpack_require__);
+/******/
+/******/ 		// Flag the module as loaded
+/******/ 		module.l = true;
+/******/
+/******/ 		// Return the exports of the module
+/******/ 		return module.exports;
+/******/ 	}
+/******/
+/******/
+/******/ 	// expose the modules object (__webpack_modules__)
+/******/ 	__webpack_require__.m = modules;
+/******/
+/******/ 	// expose the module cache
+/******/ 	__webpack_require__.c = installedModules;
+/******/
+/******/ 	// identity function for calling harmony imports with the correct context
+/******/ 	__webpack_require__.i = function(value) { return value; };
+/******/
+/******/ 	// define getter function for harmony exports
+/******/ 	__webpack_require__.d = function(exports, name, getter) {
+/******/ 		if(!__webpack_require__.o(exports, name)) {
+/******/ 			Object.defineProperty(exports, name, {
+/******/ 				configurable: false,
+/******/ 				enumerable: true,
+/******/ 				get: getter
+/******/ 			});
+/******/ 		}
+/******/ 	};
+/******/
+/******/ 	// getDefaultExport function for compatibility with non-harmony modules
+/******/ 	__webpack_require__.n = function(module) {
+/******/ 		var getter = module && module.__esModule ?
+/******/ 			function getDefault() { return module['default']; } :
+/******/ 			function getModuleExports() { return module; };
+/******/ 		__webpack_require__.d(getter, 'a', getter);
+/******/ 		return getter;
+/******/ 	};
+/******/
+/******/ 	// Object.prototype.hasOwnProperty.call
+/******/ 	__webpack_require__.o = function(object, property) { return Object.prototype.hasOwnProperty.call(object, property); };
+/******/
+/******/ 	// __webpack_public_path__
+/******/ 	__webpack_require__.p = "/assets/";
+/******/
+/******/ 	// Load entry module and return exports
+/******/ 	return __webpack_require__(__webpack_require__.s = 25);
+/******/ })
+/************************************************************************/
+/******/ ({
+
+/***/ 25:
+/***/ (function(module, exports) {
+
+// removed by extract-text-webpack-plugin
+
+/***/ })
+
+/******/ });

+ 963 - 0
support/client/lib/vwf/view/lib/mdc/dist/mdc.toolbar.js

@@ -0,0 +1,963 @@
+/*!
+ Material Components for the web
+ Copyright (c) 2017 Google Inc.
+ License: Apache-2.0
+*/
+(function webpackUniversalModuleDefinition(root, factory) {
+	if(typeof exports === 'object' && typeof module === 'object')
+		module.exports = factory();
+	else if(typeof define === 'function' && define.amd)
+		define([], factory);
+	else if(typeof exports === 'object')
+		exports["toolbar"] = factory();
+	else
+		root["mdc"] = root["mdc"] || {}, root["mdc"]["toolbar"] = factory();
+})(this, function() {
+return /******/ (function(modules) { // webpackBootstrap
+/******/ 	// The module cache
+/******/ 	var installedModules = {};
+/******/
+/******/ 	// The require function
+/******/ 	function __webpack_require__(moduleId) {
+/******/
+/******/ 		// Check if module is in cache
+/******/ 		if(installedModules[moduleId]) {
+/******/ 			return installedModules[moduleId].exports;
+/******/ 		}
+/******/ 		// Create a new module (and put it into the cache)
+/******/ 		var module = installedModules[moduleId] = {
+/******/ 			i: moduleId,
+/******/ 			l: false,
+/******/ 			exports: {}
+/******/ 		};
+/******/
+/******/ 		// Execute the module function
+/******/ 		modules[moduleId].call(module.exports, module, module.exports, __webpack_require__);
+/******/
+/******/ 		// Flag the module as loaded
+/******/ 		module.l = true;
+/******/
+/******/ 		// Return the exports of the module
+/******/ 		return module.exports;
+/******/ 	}
+/******/
+/******/
+/******/ 	// expose the modules object (__webpack_modules__)
+/******/ 	__webpack_require__.m = modules;
+/******/
+/******/ 	// expose the module cache
+/******/ 	__webpack_require__.c = installedModules;
+/******/
+/******/ 	// identity function for calling harmony imports with the correct context
+/******/ 	__webpack_require__.i = function(value) { return value; };
+/******/
+/******/ 	// define getter function for harmony exports
+/******/ 	__webpack_require__.d = function(exports, name, getter) {
+/******/ 		if(!__webpack_require__.o(exports, name)) {
+/******/ 			Object.defineProperty(exports, name, {
+/******/ 				configurable: false,
+/******/ 				enumerable: true,
+/******/ 				get: getter
+/******/ 			});
+/******/ 		}
+/******/ 	};
+/******/
+/******/ 	// getDefaultExport function for compatibility with non-harmony modules
+/******/ 	__webpack_require__.n = function(module) {
+/******/ 		var getter = module && module.__esModule ?
+/******/ 			function getDefault() { return module['default']; } :
+/******/ 			function getModuleExports() { return module; };
+/******/ 		__webpack_require__.d(getter, 'a', getter);
+/******/ 		return getter;
+/******/ 	};
+/******/
+/******/ 	// Object.prototype.hasOwnProperty.call
+/******/ 	__webpack_require__.o = function(object, property) { return Object.prototype.hasOwnProperty.call(object, property); };
+/******/
+/******/ 	// __webpack_public_path__
+/******/ 	__webpack_require__.p = "/assets/";
+/******/
+/******/ 	// Load entry module and return exports
+/******/ 	return __webpack_require__(__webpack_require__.s = 99);
+/******/ })
+/************************************************************************/
+/******/ ({
+
+/***/ 0:
+/***/ (function(module, __webpack_exports__, __webpack_require__) {
+
+"use strict";
+var _createClass = function () { function defineProperties(target, props) { for (var i = 0; i < props.length; i++) { var descriptor = props[i]; descriptor.enumerable = descriptor.enumerable || false; descriptor.configurable = true; if ("value" in descriptor) descriptor.writable = true; Object.defineProperty(target, descriptor.key, descriptor); } } return function (Constructor, protoProps, staticProps) { if (protoProps) defineProperties(Constructor.prototype, protoProps); if (staticProps) defineProperties(Constructor, staticProps); return Constructor; }; }();
+
+function _classCallCheck(instance, Constructor) { if (!(instance instanceof Constructor)) { throw new TypeError("Cannot call a class as a function"); } }
+
+/**
+ * Copyright 2016 Google Inc.
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *   http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+
+/**
+ * @template A
+ */
+var MDCFoundation = function () {
+  _createClass(MDCFoundation, null, [{
+    key: "cssClasses",
+
+    /** @return enum{cssClasses} */
+    get: function get() {
+      // Classes extending MDCFoundation should implement this method to return an object which exports every
+      // CSS class the foundation class needs as a property. e.g. {ACTIVE: 'mdc-component--active'}
+      return {};
+    }
+
+    /** @return enum{strings} */
+
+  }, {
+    key: "strings",
+    get: function get() {
+      // Classes extending MDCFoundation should implement this method to return an object which exports all
+      // semantic strings as constants. e.g. {ARIA_ROLE: 'tablist'}
+      return {};
+    }
+
+    /** @return enum{numbers} */
+
+  }, {
+    key: "numbers",
+    get: function get() {
+      // Classes extending MDCFoundation should implement this method to return an object which exports all
+      // of its semantic numbers as constants. e.g. {ANIMATION_DELAY_MS: 350}
+      return {};
+    }
+
+    /** @return {!Object} */
+
+  }, {
+    key: "defaultAdapter",
+    get: function get() {
+      // Classes extending MDCFoundation may choose to implement this getter in order to provide a convenient
+      // way of viewing the necessary methods of an adapter. In the future, this could also be used for adapter
+      // validation.
+      return {};
+    }
+
+    /**
+     * @param {A=} adapter
+     */
+
+  }]);
+
+  function MDCFoundation() {
+    var adapter = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : {};
+
+    _classCallCheck(this, MDCFoundation);
+
+    /** @protected {!A} */
+    this.adapter_ = adapter;
+  }
+
+  _createClass(MDCFoundation, [{
+    key: "init",
+    value: function init() {
+      // Subclasses should override this method to perform initialization routines (registering events, etc.)
+    }
+  }, {
+    key: "destroy",
+    value: function destroy() {
+      // Subclasses should override this method to perform de-initialization routines (de-registering events, etc.)
+    }
+  }]);
+
+  return MDCFoundation;
+}();
+
+/* harmony default export */ __webpack_exports__["a"] = (MDCFoundation);
+
+/***/ }),
+
+/***/ 1:
+/***/ (function(module, __webpack_exports__, __webpack_require__) {
+
+"use strict";
+/* harmony import */ var __WEBPACK_IMPORTED_MODULE_0__foundation__ = __webpack_require__(0);
+var _createClass = function () { function defineProperties(target, props) { for (var i = 0; i < props.length; i++) { var descriptor = props[i]; descriptor.enumerable = descriptor.enumerable || false; descriptor.configurable = true; if ("value" in descriptor) descriptor.writable = true; Object.defineProperty(target, descriptor.key, descriptor); } } return function (Constructor, protoProps, staticProps) { if (protoProps) defineProperties(Constructor.prototype, protoProps); if (staticProps) defineProperties(Constructor, staticProps); return Constructor; }; }();
+
+function _classCallCheck(instance, Constructor) { if (!(instance instanceof Constructor)) { throw new TypeError("Cannot call a class as a function"); } }
+
+/**
+ * Copyright 2016 Google Inc.
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *   http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+
+
+
+/**
+ * @template F
+ */
+
+var MDCComponent = function () {
+  _createClass(MDCComponent, null, [{
+    key: 'attachTo',
+
+    /**
+     * @param {!Element} root
+     * @return {!MDCComponent}
+     */
+    value: function attachTo(root) {
+      // Subclasses which extend MDCBase should provide an attachTo() method that takes a root element and
+      // returns an instantiated component with its root set to that element. Also note that in the cases of
+      // subclasses, an explicit foundation class will not have to be passed in; it will simply be initialized
+      // from getDefaultFoundation().
+      return new MDCComponent(root, new __WEBPACK_IMPORTED_MODULE_0__foundation__["a" /* default */]());
+    }
+
+    /**
+     * @param {!Element} root
+     * @param {F=} foundation
+     * @param {...?} args
+     */
+
+  }]);
+
+  function MDCComponent(root) {
+    var foundation = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : undefined;
+
+    _classCallCheck(this, MDCComponent);
+
+    /** @protected {!Element} */
+    this.root_ = root;
+
+    for (var _len = arguments.length, args = Array(_len > 2 ? _len - 2 : 0), _key = 2; _key < _len; _key++) {
+      args[_key - 2] = arguments[_key];
+    }
+
+    this.initialize.apply(this, args);
+    // Note that we initialize foundation here and not within the constructor's default param so that
+    // this.root_ is defined and can be used within the foundation class.
+    /** @protected {!F} */
+    this.foundation_ = foundation === undefined ? this.getDefaultFoundation() : foundation;
+    this.foundation_.init();
+    this.initialSyncWithDOM();
+  }
+
+  _createClass(MDCComponent, [{
+    key: 'initialize',
+    value: function initialize() /* ...args */{}
+    // Subclasses can override this to do any additional setup work that would be considered part of a
+    // "constructor". Essentially, it is a hook into the parent constructor before the foundation is
+    // initialized. Any additional arguments besides root and foundation will be passed in here.
+
+
+    /**
+     * @return {!F} foundation
+     */
+
+  }, {
+    key: 'getDefaultFoundation',
+    value: function getDefaultFoundation() {
+      // Subclasses must override this method to return a properly configured foundation class for the
+      // component.
+      throw new Error('Subclasses must override getDefaultFoundation to return a properly configured ' + 'foundation class');
+    }
+  }, {
+    key: 'initialSyncWithDOM',
+    value: function initialSyncWithDOM() {
+      // Subclasses should override this method if they need to perform work to synchronize with a host DOM
+      // object. An example of this would be a form control wrapper that needs to synchronize its internal state
+      // to some property or attribute of the host DOM. Please note: this is *not* the place to perform DOM
+      // reads/writes that would cause layout / paint, as this is called synchronously from within the constructor.
+    }
+  }, {
+    key: 'destroy',
+    value: function destroy() {
+      // Subclasses may implement this method to release any resources / deregister any listeners they have
+      // attached. An example of this might be deregistering a resize event from the window object.
+      this.foundation_.destroy();
+    }
+
+    /**
+     * Wrapper method to add an event listener to the component's root element. This is most useful when
+     * listening for custom events.
+     * @param {string} evtType
+     * @param {!Function} handler
+     */
+
+  }, {
+    key: 'listen',
+    value: function listen(evtType, handler) {
+      this.root_.addEventListener(evtType, handler);
+    }
+
+    /**
+     * Wrapper method to remove an event listener to the component's root element. This is most useful when
+     * unlistening for custom events.
+     * @param {string} evtType
+     * @param {!Function} handler
+     */
+
+  }, {
+    key: 'unlisten',
+    value: function unlisten(evtType, handler) {
+      this.root_.removeEventListener(evtType, handler);
+    }
+
+    /**
+     * Fires a cross-browser-compatible custom event from the component root of the given type,
+     * with the given data.
+     * @param {string} evtType
+     * @param {!Object} evtData
+     * @param {boolean=} shouldBubble
+     */
+
+  }, {
+    key: 'emit',
+    value: function emit(evtType, evtData) {
+      var shouldBubble = arguments.length > 2 && arguments[2] !== undefined ? arguments[2] : false;
+
+      var evt = void 0;
+      if (typeof CustomEvent === 'function') {
+        evt = new CustomEvent(evtType, {
+          detail: evtData,
+          bubbles: shouldBubble
+        });
+      } else {
+        evt = document.createEvent('CustomEvent');
+        evt.initCustomEvent(evtType, shouldBubble, false, evtData);
+      }
+
+      this.root_.dispatchEvent(evt);
+    }
+  }]);
+
+  return MDCComponent;
+}();
+
+/* harmony default export */ __webpack_exports__["a"] = (MDCComponent);
+
+/***/ }),
+
+/***/ 2:
+/***/ (function(module, __webpack_exports__, __webpack_require__) {
+
+"use strict";
+Object.defineProperty(__webpack_exports__, "__esModule", { value: true });
+/* harmony import */ var __WEBPACK_IMPORTED_MODULE_0__foundation__ = __webpack_require__(0);
+/* harmony import */ var __WEBPACK_IMPORTED_MODULE_1__component__ = __webpack_require__(1);
+/* harmony import */ var __WEBPACK_IMPORTED_MODULE_2__selection_control__ = __webpack_require__(3);
+/* harmony reexport (binding) */ __webpack_require__.d(__webpack_exports__, "MDCFoundation", function() { return __WEBPACK_IMPORTED_MODULE_0__foundation__["a"]; });
+/* harmony reexport (binding) */ __webpack_require__.d(__webpack_exports__, "MDCComponent", function() { return __WEBPACK_IMPORTED_MODULE_1__component__["a"]; });
+/* harmony reexport (binding) */ __webpack_require__.d(__webpack_exports__, "SelectionControlState", function() { return __WEBPACK_IMPORTED_MODULE_2__selection_control__["a"]; });
+/**
+ * Copyright 2016 Google Inc.
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *   http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+
+
+
+
+
+
+
+/***/ }),
+
+/***/ 3:
+/***/ (function(module, __webpack_exports__, __webpack_require__) {
+
+"use strict";
+/* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, "a", function() { return SelectionControlState; });
+/**
+ * Copyright 2017 Google Inc. All Rights Reserved.
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *      http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+
+/**
+ * @typedef {!{
+ *   checked: boolean,
+ *   indeterminate: boolean,
+ *   disabled: boolean,
+ *   value: ?string
+ * }}
+ */
+var SelectionControlState = void 0;
+
+/***/ }),
+
+/***/ 37:
+/***/ (function(module, __webpack_exports__, __webpack_require__) {
+
+"use strict";
+Object.defineProperty(__webpack_exports__, "__esModule", { value: true });
+/* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, "MDCToolbar", function() { return MDCToolbar; });
+/* harmony import */ var __WEBPACK_IMPORTED_MODULE_0__material_base__ = __webpack_require__(2);
+/* harmony import */ var __WEBPACK_IMPORTED_MODULE_1__foundation__ = __webpack_require__(77);
+/* harmony import */ var __WEBPACK_IMPORTED_MODULE_2__util__ = __webpack_require__(78);
+/* harmony reexport (binding) */ __webpack_require__.d(__webpack_exports__, "MDCToolbarFoundation", function() { return __WEBPACK_IMPORTED_MODULE_1__foundation__["a"]; });
+/* harmony reexport (module object) */ __webpack_require__.d(__webpack_exports__, "util", function() { return __WEBPACK_IMPORTED_MODULE_2__util__; });
+var _createClass = function () { function defineProperties(target, props) { for (var i = 0; i < props.length; i++) { var descriptor = props[i]; descriptor.enumerable = descriptor.enumerable || false; descriptor.configurable = true; if ("value" in descriptor) descriptor.writable = true; Object.defineProperty(target, descriptor.key, descriptor); } } return function (Constructor, protoProps, staticProps) { if (protoProps) defineProperties(Constructor.prototype, protoProps); if (staticProps) defineProperties(Constructor, staticProps); return Constructor; }; }();
+
+function _classCallCheck(instance, Constructor) { if (!(instance instanceof Constructor)) { throw new TypeError("Cannot call a class as a function"); } }
+
+function _possibleConstructorReturn(self, call) { if (!self) { throw new ReferenceError("this hasn't been initialised - super() hasn't been called"); } return call && (typeof call === "object" || typeof call === "function") ? call : self; }
+
+function _inherits(subClass, superClass) { if (typeof superClass !== "function" && superClass !== null) { throw new TypeError("Super expression must either be null or a function, not " + typeof superClass); } subClass.prototype = Object.create(superClass && superClass.prototype, { constructor: { value: subClass, enumerable: false, writable: true, configurable: true } }); if (superClass) Object.setPrototypeOf ? Object.setPrototypeOf(subClass, superClass) : subClass.__proto__ = superClass; }
+
+/**
+ * Copyright 2017 Google Inc. All Rights Reserved.
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *      http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+
+
+
+
+
+
+
+
+
+var MDCToolbar = function (_MDCComponent) {
+  _inherits(MDCToolbar, _MDCComponent);
+
+  function MDCToolbar() {
+    _classCallCheck(this, MDCToolbar);
+
+    return _possibleConstructorReturn(this, (MDCToolbar.__proto__ || Object.getPrototypeOf(MDCToolbar)).apply(this, arguments));
+  }
+
+  _createClass(MDCToolbar, [{
+    key: 'getDefaultFoundation',
+    value: function getDefaultFoundation() {
+      var _this2 = this;
+
+      return new __WEBPACK_IMPORTED_MODULE_1__foundation__["a" /* default */]({
+        hasClass: function hasClass(className) {
+          return _this2.root_.classList.contains(className);
+        },
+        addClass: function addClass(className) {
+          return _this2.root_.classList.add(className);
+        },
+        removeClass: function removeClass(className) {
+          return _this2.root_.classList.remove(className);
+        },
+        registerScrollHandler: function registerScrollHandler(handler) {
+          return window.addEventListener('scroll', handler, __WEBPACK_IMPORTED_MODULE_2__util__["applyPassive"]());
+        },
+        deregisterScrollHandler: function deregisterScrollHandler(handler) {
+          return window.removeEventListener('scroll', handler, __WEBPACK_IMPORTED_MODULE_2__util__["applyPassive"]());
+        },
+        registerResizeHandler: function registerResizeHandler(handler) {
+          return window.addEventListener('resize', handler);
+        },
+        deregisterResizeHandler: function deregisterResizeHandler(handler) {
+          return window.removeEventListener('resize', handler);
+        },
+        getViewportWidth: function getViewportWidth() {
+          return window.innerWidth;
+        },
+        getViewportScrollY: function getViewportScrollY() {
+          return window.pageYOffset;
+        },
+        getOffsetHeight: function getOffsetHeight() {
+          return _this2.root_.offsetHeight;
+        },
+        getFirstRowElementOffsetHeight: function getFirstRowElementOffsetHeight() {
+          return _this2.firstRowElement_.offsetHeight;
+        },
+        notifyChange: function notifyChange(evtData) {
+          return _this2.emit(__WEBPACK_IMPORTED_MODULE_1__foundation__["a" /* default */].strings.CHANGE_EVENT, evtData);
+        },
+        setStyle: function setStyle(property, value) {
+          return _this2.root_.style.setProperty(property, value);
+        },
+        setStyleForTitleElement: function setStyleForTitleElement(property, value) {
+          return _this2.titleElement_.style.setProperty(property, value);
+        },
+        setStyleForFlexibleRowElement: function setStyleForFlexibleRowElement(property, value) {
+          return _this2.firstRowElement_.style.setProperty(property, value);
+        },
+        setStyleForFixedAdjustElement: function setStyleForFixedAdjustElement(property, value) {
+          if (_this2.fixedAdjustElement) {
+            _this2.fixedAdjustElement.style.setProperty(property, value);
+          }
+        }
+      });
+    }
+  }, {
+    key: 'firstRowElement_',
+    get: function get() {
+      return this.root_.querySelector(__WEBPACK_IMPORTED_MODULE_1__foundation__["a" /* default */].strings.FIRST_ROW_SELECTOR);
+    }
+  }, {
+    key: 'titleElement_',
+    get: function get() {
+      return this.root_.querySelector(__WEBPACK_IMPORTED_MODULE_1__foundation__["a" /* default */].strings.TITLE_SELECTOR);
+    }
+  }, {
+    key: 'fixedAdjustElement',
+    set: function set(fixedAdjustElement) {
+      this.fixedAdjustElement_ = fixedAdjustElement;
+      this.foundation_.updateAdjustElementStyles();
+    },
+    get: function get() {
+      return this.fixedAdjustElement_;
+    }
+  }], [{
+    key: 'attachTo',
+    value: function attachTo(root) {
+      return new MDCToolbar(root);
+    }
+  }]);
+
+  return MDCToolbar;
+}(__WEBPACK_IMPORTED_MODULE_0__material_base__["MDCComponent"]);
+
+/***/ }),
+
+/***/ 76:
+/***/ (function(module, __webpack_exports__, __webpack_require__) {
+
+"use strict";
+/* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, "a", function() { return cssClasses; });
+/* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, "b", function() { return strings; });
+/* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, "c", function() { return numbers; });
+/**
+ * Copyright 2017 Google Inc. All Rights Reserved.
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *      http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+
+var cssClasses = {
+  FIXED: 'mdc-toolbar--fixed',
+  FIXED_LASTROW: 'mdc-toolbar--fixed-lastrow-only',
+  FIXED_AT_LAST_ROW: 'mdc-toolbar--fixed-at-last-row',
+  TOOLBAR_ROW_FLEXIBLE: 'mdc-toolbar--flexible',
+  FLEXIBLE_DEFAULT_BEHAVIOR: 'mdc-toolbar--flexible-default-behavior',
+  FLEXIBLE_MAX: 'mdc-toolbar--flexible-space-maximized',
+  FLEXIBLE_MIN: 'mdc-toolbar--flexible-space-minimized'
+};
+
+var strings = {
+  TITLE_SELECTOR: '.mdc-toolbar__title',
+  FIRST_ROW_SELECTOR: '.mdc-toolbar__row:first-child',
+  CHANGE_EVENT: 'MDCToolbar:change'
+};
+
+var numbers = {
+  MAX_TITLE_SIZE: 2.125,
+  MIN_TITLE_SIZE: 1.25,
+  TOOLBAR_ROW_HEIGHT: 64,
+  TOOLBAR_ROW_MOBILE_HEIGHT: 56,
+  TOOLBAR_MOBILE_BREAKPOINT: 600
+};
+
+/***/ }),
+
+/***/ 77:
+/***/ (function(module, __webpack_exports__, __webpack_require__) {
+
+"use strict";
+/* harmony import */ var __WEBPACK_IMPORTED_MODULE_0__material_base_foundation__ = __webpack_require__(0);
+/* harmony import */ var __WEBPACK_IMPORTED_MODULE_1__constants__ = __webpack_require__(76);
+var _extends = Object.assign || function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; };
+
+var _createClass = function () { function defineProperties(target, props) { for (var i = 0; i < props.length; i++) { var descriptor = props[i]; descriptor.enumerable = descriptor.enumerable || false; descriptor.configurable = true; if ("value" in descriptor) descriptor.writable = true; Object.defineProperty(target, descriptor.key, descriptor); } } return function (Constructor, protoProps, staticProps) { if (protoProps) defineProperties(Constructor.prototype, protoProps); if (staticProps) defineProperties(Constructor, staticProps); return Constructor; }; }();
+
+function _classCallCheck(instance, Constructor) { if (!(instance instanceof Constructor)) { throw new TypeError("Cannot call a class as a function"); } }
+
+function _possibleConstructorReturn(self, call) { if (!self) { throw new ReferenceError("this hasn't been initialised - super() hasn't been called"); } return call && (typeof call === "object" || typeof call === "function") ? call : self; }
+
+function _inherits(subClass, superClass) { if (typeof superClass !== "function" && superClass !== null) { throw new TypeError("Super expression must either be null or a function, not " + typeof superClass); } subClass.prototype = Object.create(superClass && superClass.prototype, { constructor: { value: subClass, enumerable: false, writable: true, configurable: true } }); if (superClass) Object.setPrototypeOf ? Object.setPrototypeOf(subClass, superClass) : subClass.__proto__ = superClass; }
+
+/**
+ * Copyright 2017 Google Inc. All Rights Reserved.
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *      http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+
+
+
+var MDCToolbarFoundation = function (_MDCFoundation) {
+  _inherits(MDCToolbarFoundation, _MDCFoundation);
+
+  _createClass(MDCToolbarFoundation, null, [{
+    key: 'cssClasses',
+    get: function get() {
+      return __WEBPACK_IMPORTED_MODULE_1__constants__["a" /* cssClasses */];
+    }
+  }, {
+    key: 'strings',
+    get: function get() {
+      return __WEBPACK_IMPORTED_MODULE_1__constants__["b" /* strings */];
+    }
+  }, {
+    key: 'numbers',
+    get: function get() {
+      return __WEBPACK_IMPORTED_MODULE_1__constants__["c" /* numbers */];
+    }
+  }, {
+    key: 'defaultAdapter',
+    get: function get() {
+      return {
+        hasClass: function hasClass() {
+          return (/* className: string */ /* boolean */false
+          );
+        },
+        addClass: function addClass() /* className: string */{},
+        removeClass: function removeClass() /* className: string */{},
+        registerScrollHandler: function registerScrollHandler() /* handler: EventListener */{},
+        deregisterScrollHandler: function deregisterScrollHandler() /* handler: EventListener */{},
+        registerResizeHandler: function registerResizeHandler() /* handler: EventListener */{},
+        deregisterResizeHandler: function deregisterResizeHandler() /* handler: EventListener */{},
+        getViewportWidth: function getViewportWidth() {
+          return (/* number */0
+          );
+        },
+        getViewportScrollY: function getViewportScrollY() {
+          return (/* number */0
+          );
+        },
+        getOffsetHeight: function getOffsetHeight() {
+          return (/* number */0
+          );
+        },
+        getFirstRowElementOffsetHeight: function getFirstRowElementOffsetHeight() {
+          return (/* number */0
+          );
+        },
+        notifyChange: function notifyChange() /* evtData: {flexibleExpansionRatio: number} */{},
+        setStyle: function setStyle() /* property: string, value: string */{},
+        setStyleForTitleElement: function setStyleForTitleElement() /* property: string, value: string */{},
+        setStyleForFlexibleRowElement: function setStyleForFlexibleRowElement() /* property: string, value: string */{},
+        setStyleForFixedAdjustElement: function setStyleForFixedAdjustElement() /* property: string, value: string */{}
+      };
+    }
+  }]);
+
+  function MDCToolbarFoundation(adapter) {
+    _classCallCheck(this, MDCToolbarFoundation);
+
+    var _this = _possibleConstructorReturn(this, (MDCToolbarFoundation.__proto__ || Object.getPrototypeOf(MDCToolbarFoundation)).call(this, _extends(MDCToolbarFoundation.defaultAdapter, adapter)));
+
+    _this.resizeHandler_ = function () {
+      return _this.checkRowHeight_();
+    };
+    _this.scrollHandler_ = function () {
+      return _this.updateToolbarStyles_();
+    };
+    _this.checkRowHeightFrame_ = 0;
+    _this.scrollFrame_ = 0;
+    _this.executedLastChange_ = false;
+
+    _this.calculations_ = {
+      toolbarRowHeight: 0,
+      // Calculated Height ratio. We use ratio to calculate corresponding heights in resize event.
+      toolbarRatio: 0, // The ratio of toolbar height to row height
+      flexibleExpansionRatio: 0, // The ratio of flexible space height to row height
+      maxTranslateYRatio: 0, // The ratio of max toolbar move up distance to row height
+      scrollThresholdRatio: 0, // The ratio of max scrollTop that we should listen to to row height
+      // Derived Heights based on the above key ratios.
+      toolbarHeight: 0,
+      flexibleExpansionHeight: 0, // Flexible row minus toolbar height (derived)
+      maxTranslateYDistance: 0, // When toolbar only fix last row (derived)
+      scrollThreshold: 0
+    };
+    // Toolbar fixed behavior
+    // If toolbar is fixed
+    _this.fixed_ = false;
+    // If fixed is targeted only at the last row
+    _this.fixedLastrow_ = false;
+    // Toolbar flexible behavior
+    // If the first row is flexible
+    _this.hasFlexibleRow_ = false;
+    // If use the default behavior
+    _this.useFlexDefaultBehavior_ = false;
+    return _this;
+  }
+
+  _createClass(MDCToolbarFoundation, [{
+    key: 'init',
+    value: function init() {
+      this.fixed_ = this.adapter_.hasClass(MDCToolbarFoundation.cssClasses.FIXED);
+      this.fixedLastrow_ = this.adapter_.hasClass(MDCToolbarFoundation.cssClasses.FIXED_LASTROW) & this.fixed_;
+      this.hasFlexibleRow_ = this.adapter_.hasClass(MDCToolbarFoundation.cssClasses.TOOLBAR_ROW_FLEXIBLE);
+      if (this.hasFlexibleRow_) {
+        this.useFlexDefaultBehavior_ = this.adapter_.hasClass(MDCToolbarFoundation.cssClasses.FLEXIBLE_DEFAULT_BEHAVIOR);
+      }
+      this.initKeyRatio_();
+      this.setKeyHeights_();
+      this.adapter_.registerResizeHandler(this.resizeHandler_);
+      this.adapter_.registerScrollHandler(this.scrollHandler_);
+    }
+  }, {
+    key: 'destroy',
+    value: function destroy() {
+      this.adapter_.deregisterResizeHandler(this.resizeHandler_);
+      this.adapter_.deregisterScrollHandler(this.scrollHandler_);
+    }
+  }, {
+    key: 'updateAdjustElementStyles',
+    value: function updateAdjustElementStyles() {
+      if (this.fixed_) {
+        this.adapter_.setStyleForFixedAdjustElement('margin-top', this.calculations_.toolbarHeight + 'px');
+      }
+    }
+  }, {
+    key: 'getFlexibleExpansionRatio_',
+    value: function getFlexibleExpansionRatio_(scrollTop) {
+      // To prevent division by zero when there is no flexibleExpansionHeight
+      var delta = 0.0001;
+      return Math.max(0, 1 - scrollTop / (this.calculations_.flexibleExpansionHeight + delta));
+    }
+  }, {
+    key: 'checkRowHeight_',
+    value: function checkRowHeight_() {
+      var _this2 = this;
+
+      cancelAnimationFrame(this.checkRowHeightFrame_);
+      this.checkRowHeightFrame_ = requestAnimationFrame(function () {
+        return _this2.setKeyHeights_();
+      });
+    }
+  }, {
+    key: 'setKeyHeights_',
+    value: function setKeyHeights_() {
+      var newToolbarRowHeight = this.getRowHeight_();
+      if (newToolbarRowHeight !== this.calculations_.toolbarRowHeight) {
+        this.calculations_.toolbarRowHeight = newToolbarRowHeight;
+        this.calculations_.toolbarHeight = this.calculations_.toolbarRatio * this.calculations_.toolbarRowHeight;
+        this.calculations_.flexibleExpansionHeight = this.calculations_.flexibleExpansionRatio * this.calculations_.toolbarRowHeight;
+        this.calculations_.maxTranslateYDistance = this.calculations_.maxTranslateYRatio * this.calculations_.toolbarRowHeight;
+        this.calculations_.scrollThreshold = this.calculations_.scrollThresholdRatio * this.calculations_.toolbarRowHeight;
+        this.updateAdjustElementStyles();
+        this.updateToolbarStyles_();
+      }
+    }
+  }, {
+    key: 'updateToolbarStyles_',
+    value: function updateToolbarStyles_() {
+      var _this3 = this;
+
+      cancelAnimationFrame(this.scrollFrame_);
+      this.scrollFrame_ = requestAnimationFrame(function () {
+        var scrollTop = _this3.adapter_.getViewportScrollY();
+        var hasScrolledOutOfThreshold = _this3.scrolledOutOfThreshold_(scrollTop);
+
+        if (hasScrolledOutOfThreshold && _this3.executedLastChange_) {
+          return;
+        }
+
+        var flexibleExpansionRatio = _this3.getFlexibleExpansionRatio_(scrollTop);
+
+        _this3.updateToolbarFlexibleState_(flexibleExpansionRatio);
+        if (_this3.fixedLastrow_) {
+          _this3.updateToolbarFixedState_(scrollTop);
+        }
+        if (_this3.hasFlexibleRow_) {
+          _this3.updateFlexibleRowElementStyles_(flexibleExpansionRatio);
+        }
+        _this3.executedLastChange_ = hasScrolledOutOfThreshold;
+        _this3.adapter_.notifyChange({ flexibleExpansionRatio: flexibleExpansionRatio });
+      });
+    }
+  }, {
+    key: 'scrolledOutOfThreshold_',
+    value: function scrolledOutOfThreshold_(scrollTop) {
+      return scrollTop > this.calculations_.scrollThreshold;
+    }
+  }, {
+    key: 'initKeyRatio_',
+    value: function initKeyRatio_() {
+      var toolbarRowHeight = this.getRowHeight_();
+      var firstRowMaxRatio = this.adapter_.getFirstRowElementOffsetHeight() / toolbarRowHeight;
+      this.calculations_.toolbarRatio = this.adapter_.getOffsetHeight() / toolbarRowHeight;
+      this.calculations_.flexibleExpansionRatio = firstRowMaxRatio - 1;
+      this.calculations_.maxTranslateYRatio = this.fixedLastrow_ ? this.calculations_.toolbarRatio - firstRowMaxRatio : 0;
+      this.calculations_.scrollThresholdRatio = (this.fixedLastrow_ ? this.calculations_.toolbarRatio : firstRowMaxRatio) - 1;
+    }
+  }, {
+    key: 'getRowHeight_',
+    value: function getRowHeight_() {
+      var breakpoint = MDCToolbarFoundation.numbers.TOOLBAR_MOBILE_BREAKPOINT;
+      return this.adapter_.getViewportWidth() < breakpoint ? MDCToolbarFoundation.numbers.TOOLBAR_ROW_MOBILE_HEIGHT : MDCToolbarFoundation.numbers.TOOLBAR_ROW_HEIGHT;
+    }
+  }, {
+    key: 'updateToolbarFlexibleState_',
+    value: function updateToolbarFlexibleState_(flexibleExpansionRatio) {
+      this.adapter_.removeClass(MDCToolbarFoundation.cssClasses.FLEXIBLE_MAX);
+      this.adapter_.removeClass(MDCToolbarFoundation.cssClasses.FLEXIBLE_MIN);
+      if (flexibleExpansionRatio === 1) {
+        this.adapter_.addClass(MDCToolbarFoundation.cssClasses.FLEXIBLE_MAX);
+      } else if (flexibleExpansionRatio === 0) {
+        this.adapter_.addClass(MDCToolbarFoundation.cssClasses.FLEXIBLE_MIN);
+      }
+    }
+  }, {
+    key: 'updateToolbarFixedState_',
+    value: function updateToolbarFixedState_(scrollTop) {
+      var translateDistance = Math.max(0, Math.min(scrollTop - this.calculations_.flexibleExpansionHeight, this.calculations_.maxTranslateYDistance));
+      this.adapter_.setStyle('transform', 'translateY(' + -translateDistance + 'px)');
+
+      if (translateDistance === this.calculations_.maxTranslateYDistance) {
+        this.adapter_.addClass(MDCToolbarFoundation.cssClasses.FIXED_AT_LAST_ROW);
+      } else {
+        this.adapter_.removeClass(MDCToolbarFoundation.cssClasses.FIXED_AT_LAST_ROW);
+      }
+    }
+  }, {
+    key: 'updateFlexibleRowElementStyles_',
+    value: function updateFlexibleRowElementStyles_(flexibleExpansionRatio) {
+      if (this.fixed_) {
+        var height = this.calculations_.flexibleExpansionHeight * flexibleExpansionRatio;
+        this.adapter_.setStyleForFlexibleRowElement('height', height + this.calculations_.toolbarRowHeight + 'px');
+      }
+      if (this.useFlexDefaultBehavior_) {
+        this.updateElementStylesDefaultBehavior_(flexibleExpansionRatio);
+      }
+    }
+  }, {
+    key: 'updateElementStylesDefaultBehavior_',
+    value: function updateElementStylesDefaultBehavior_(flexibleExpansionRatio) {
+      var maxTitleSize = MDCToolbarFoundation.numbers.MAX_TITLE_SIZE;
+      var minTitleSize = MDCToolbarFoundation.numbers.MIN_TITLE_SIZE;
+      var currentTitleSize = (maxTitleSize - minTitleSize) * flexibleExpansionRatio + minTitleSize;
+
+      this.adapter_.setStyleForTitleElement('font-size', currentTitleSize + 'rem');
+    }
+  }]);
+
+  return MDCToolbarFoundation;
+}(__WEBPACK_IMPORTED_MODULE_0__material_base_foundation__["a" /* default */]);
+
+/* harmony default export */ __webpack_exports__["a"] = (MDCToolbarFoundation);
+
+/***/ }),
+
+/***/ 78:
+/***/ (function(module, __webpack_exports__, __webpack_require__) {
+
+"use strict";
+Object.defineProperty(__webpack_exports__, "__esModule", { value: true });
+/* harmony export (immutable) */ __webpack_exports__["applyPassive"] = applyPassive;
+/**
+ * Copyright 2016 Google Inc. All Rights Reserved.
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *      http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+
+var supportsPassive_ = void 0;
+
+// Determine whether the current browser supports passive event listeners, and if so, use them.
+function applyPassive() {
+  var globalObj = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : window;
+  var forceRefresh = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : false;
+
+  if (supportsPassive_ === undefined || forceRefresh) {
+    var isSupported = false;
+    try {
+      globalObj.document.addEventListener('test', null, { get passive() {
+          isSupported = true;
+        } });
+    } catch (e) {}
+
+    supportsPassive_ = isSupported;
+  }
+
+  return supportsPassive_ ? { passive: true } : false;
+}
+
+/***/ }),
+
+/***/ 99:
+/***/ (function(module, exports, __webpack_require__) {
+
+module.exports = __webpack_require__(37);
+
+
+/***/ })
+
+/******/ });
+});

+ 181 - 0
support/client/lib/vwf/view/lib/mdc/dist/mdc.typography.css

@@ -0,0 +1,181 @@
+/*!
+ Material Components for the web
+ Copyright (c) 2017 Google Inc.
+ License: Apache-2.0
+*/
+/* TODO(sgomes): Figure out what to do about desktop font sizes. */
+/* TODO(sgomes): Figure out what to do about i18n and i18n font sizes. */
+/* TODO(sgomes): Figure out what to do about desktop font sizes. */
+/* TODO(sgomes): Figure out what to do about i18n and i18n font sizes. */
+.mdc-typography {
+  font-family: Roboto, sans-serif;
+  -moz-osx-font-smoothing: grayscale;
+  -webkit-font-smoothing: antialiased; }
+
+.mdc-typography--display4 {
+  font-family: Roboto, sans-serif;
+  -moz-osx-font-smoothing: grayscale;
+  -webkit-font-smoothing: antialiased;
+  font-size: 7rem;
+  font-weight: 300;
+  letter-spacing: -0.04em;
+  line-height: 7rem;
+  text-decoration: inherit;
+  text-transform: inherit; }
+
+.mdc-typography--adjust-margin.mdc-typography--display4 {
+  margin: -1rem 0 3.5rem -0.085em; }
+
+.mdc-typography--display3 {
+  font-family: Roboto, sans-serif;
+  -moz-osx-font-smoothing: grayscale;
+  -webkit-font-smoothing: antialiased;
+  font-size: 3.5rem;
+  font-weight: 400;
+  letter-spacing: -0.02em;
+  line-height: 3.5rem;
+  text-decoration: inherit;
+  text-transform: inherit; }
+
+.mdc-typography--adjust-margin.mdc-typography--display3 {
+  margin: -8px 0 64px -0.07em; }
+
+.mdc-typography--display2 {
+  font-family: Roboto, sans-serif;
+  -moz-osx-font-smoothing: grayscale;
+  -webkit-font-smoothing: antialiased;
+  font-size: 2.813rem;
+  font-weight: 400;
+  letter-spacing: normal;
+  line-height: 3rem;
+  text-decoration: inherit;
+  text-transform: inherit; }
+
+.mdc-typography--adjust-margin.mdc-typography--display2 {
+  margin: -0.5rem 0 4rem -0.07em; }
+
+.mdc-typography--display1 {
+  font-family: Roboto, sans-serif;
+  -moz-osx-font-smoothing: grayscale;
+  -webkit-font-smoothing: antialiased;
+  font-size: 2.125rem;
+  font-weight: 400;
+  letter-spacing: normal;
+  line-height: 2.5rem;
+  text-decoration: inherit;
+  text-transform: inherit; }
+
+.mdc-typography--adjust-margin.mdc-typography--display1 {
+  margin: -0.5rem 0 4rem -0.07em; }
+
+.mdc-typography--headline {
+  font-family: Roboto, sans-serif;
+  -moz-osx-font-smoothing: grayscale;
+  -webkit-font-smoothing: antialiased;
+  font-size: 1.5rem;
+  font-weight: 400;
+  letter-spacing: normal;
+  line-height: 2rem;
+  text-decoration: inherit;
+  text-transform: inherit; }
+
+.mdc-typography--adjust-margin.mdc-typography--headline {
+  margin: -0.5rem 0 1rem -0.06em; }
+
+.mdc-typography--title {
+  font-family: Roboto, sans-serif;
+  -moz-osx-font-smoothing: grayscale;
+  -webkit-font-smoothing: antialiased;
+  font-size: 1.25rem;
+  font-weight: 500;
+  letter-spacing: 0.02em;
+  line-height: 2rem;
+  text-decoration: inherit;
+  text-transform: inherit; }
+
+.mdc-typography--adjust-margin.mdc-typography--title {
+  margin: -0.5rem 0 1rem -0.05em; }
+
+.mdc-typography--subheading2 {
+  font-family: Roboto, sans-serif;
+  -moz-osx-font-smoothing: grayscale;
+  -webkit-font-smoothing: antialiased;
+  font-size: 1rem;
+  font-weight: 400;
+  letter-spacing: 0.04em;
+  line-height: 1.75rem;
+  text-decoration: inherit;
+  text-transform: inherit; }
+
+.mdc-typography--adjust-margin.mdc-typography--subheading2 {
+  margin: -0.5rem 0 1rem -0.06em; }
+
+.mdc-typography--subheading1 {
+  font-family: Roboto, sans-serif;
+  -moz-osx-font-smoothing: grayscale;
+  -webkit-font-smoothing: antialiased;
+  font-size: 0.938rem;
+  font-weight: 400;
+  letter-spacing: 0.04em;
+  line-height: 1.5rem;
+  text-decoration: inherit;
+  text-transform: inherit; }
+
+.mdc-typography--adjust-margin.mdc-typography--subheading1 {
+  margin: -0.313rem 0 0.813rem -0.06em; }
+
+.mdc-typography--body2 {
+  font-family: Roboto, sans-serif;
+  -moz-osx-font-smoothing: grayscale;
+  -webkit-font-smoothing: antialiased;
+  font-size: 0.875rem;
+  font-weight: 500;
+  letter-spacing: 0.04em;
+  line-height: 1.5rem;
+  text-decoration: inherit;
+  text-transform: inherit; }
+
+.mdc-typography--adjust-margin.mdc-typography--body2 {
+  margin: -0.25rem 0 0.75rem 0; }
+
+.mdc-typography--body1 {
+  font-family: Roboto, sans-serif;
+  -moz-osx-font-smoothing: grayscale;
+  -webkit-font-smoothing: antialiased;
+  font-size: 0.875rem;
+  font-weight: 400;
+  letter-spacing: 0.04em;
+  line-height: 1.25rem;
+  text-decoration: inherit;
+  text-transform: inherit; }
+
+.mdc-typography--adjust-margin.mdc-typography--body1 {
+  margin: -0.25rem 0 0.75rem 0; }
+
+.mdc-typography--caption {
+  font-family: Roboto, sans-serif;
+  -moz-osx-font-smoothing: grayscale;
+  -webkit-font-smoothing: antialiased;
+  font-size: 0.75rem;
+  font-weight: 400;
+  letter-spacing: 0.08em;
+  line-height: 1.25rem;
+  text-decoration: inherit;
+  text-transform: inherit; }
+
+.mdc-typography--adjust-margin.mdc-typography--caption {
+  margin: -0.5rem 0 1rem -0.04em; }
+
+.mdc-typography--button {
+  font-family: Roboto, sans-serif;
+  -moz-osx-font-smoothing: grayscale;
+  -webkit-font-smoothing: antialiased;
+  font-size: 0.875rem;
+  font-weight: 500;
+  letter-spacing: 0.04em;
+  line-height: 2.25rem;
+  text-decoration: none;
+  text-transform: uppercase; }
+
+.mdc-typography--adjust-margin.mdc-typography--button {
+  margin: inherit; }

+ 83 - 0
support/client/lib/vwf/view/lib/mdc/dist/mdc.typography.css-entry

@@ -0,0 +1,83 @@
+/*!
+ Material Components for the web
+ Copyright (c) 2017 Google Inc.
+ License: Apache-2.0
+*/
+/******/ (function(modules) { // webpackBootstrap
+/******/ 	// The module cache
+/******/ 	var installedModules = {};
+/******/
+/******/ 	// The require function
+/******/ 	function __webpack_require__(moduleId) {
+/******/
+/******/ 		// Check if module is in cache
+/******/ 		if(installedModules[moduleId]) {
+/******/ 			return installedModules[moduleId].exports;
+/******/ 		}
+/******/ 		// Create a new module (and put it into the cache)
+/******/ 		var module = installedModules[moduleId] = {
+/******/ 			i: moduleId,
+/******/ 			l: false,
+/******/ 			exports: {}
+/******/ 		};
+/******/
+/******/ 		// Execute the module function
+/******/ 		modules[moduleId].call(module.exports, module, module.exports, __webpack_require__);
+/******/
+/******/ 		// Flag the module as loaded
+/******/ 		module.l = true;
+/******/
+/******/ 		// Return the exports of the module
+/******/ 		return module.exports;
+/******/ 	}
+/******/
+/******/
+/******/ 	// expose the modules object (__webpack_modules__)
+/******/ 	__webpack_require__.m = modules;
+/******/
+/******/ 	// expose the module cache
+/******/ 	__webpack_require__.c = installedModules;
+/******/
+/******/ 	// identity function for calling harmony imports with the correct context
+/******/ 	__webpack_require__.i = function(value) { return value; };
+/******/
+/******/ 	// define getter function for harmony exports
+/******/ 	__webpack_require__.d = function(exports, name, getter) {
+/******/ 		if(!__webpack_require__.o(exports, name)) {
+/******/ 			Object.defineProperty(exports, name, {
+/******/ 				configurable: false,
+/******/ 				enumerable: true,
+/******/ 				get: getter
+/******/ 			});
+/******/ 		}
+/******/ 	};
+/******/
+/******/ 	// getDefaultExport function for compatibility with non-harmony modules
+/******/ 	__webpack_require__.n = function(module) {
+/******/ 		var getter = module && module.__esModule ?
+/******/ 			function getDefault() { return module['default']; } :
+/******/ 			function getModuleExports() { return module; };
+/******/ 		__webpack_require__.d(getter, 'a', getter);
+/******/ 		return getter;
+/******/ 	};
+/******/
+/******/ 	// Object.prototype.hasOwnProperty.call
+/******/ 	__webpack_require__.o = function(object, property) { return Object.prototype.hasOwnProperty.call(object, property); };
+/******/
+/******/ 	// __webpack_public_path__
+/******/ 	__webpack_require__.p = "/assets/";
+/******/
+/******/ 	// Load entry module and return exports
+/******/ 	return __webpack_require__(__webpack_require__.s = 26);
+/******/ })
+/************************************************************************/
+/******/ ({
+
+/***/ 26:
+/***/ (function(module, exports) {
+
+// removed by extract-text-webpack-plugin
+
+/***/ })
+
+/******/ });

BIN
support/client/lib/vwf/view/lib/mdc/iconfont/MaterialIcons-Regular.eot


Filskillnaden har hållts tillbaka eftersom den är för stor
+ 0 - 0
support/client/lib/vwf/view/lib/mdc/iconfont/MaterialIcons-Regular.ijmap


+ 2373 - 0
support/client/lib/vwf/view/lib/mdc/iconfont/MaterialIcons-Regular.svg

@@ -0,0 +1,2373 @@
+<?xml version="1.0" standalone="no"?>
+<!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN" "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd" >
+<!--
+2016-2-8: Created with FontForge (http://fontforge.org)
+-->
+<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" version="1.1">
+<metadata>
+Created by FontForge 20151118 at Mon Feb  8 11:58:02 2016
+ By shyndman
+Copyright 2015 Google, Inc. All Rights Reserved.
+</metadata>
+<defs>
+<font id="MaterialIcons-Regular" horiz-adv-x="512" >
+  <font-face 
+    font-family="Material Icons"
+    font-weight="400"
+    font-stretch="normal"
+    units-per-em="512"
+    panose-1="2 0 5 3 0 0 0 0 0 0"
+    ascent="512"
+    descent="0"
+    bbox="0 0 512 512"
+    underline-thickness="50"
+    underline-position="-100"
+    unicode-range="U+0030-10FFFD"
+  />
+    <missing-glyph />
+    <glyph glyph-name="3d_rotation" unicode="&#x33;d_rotation" 
+d="M256 512c134 0 244 -103 255 -234h-32c-7 80 -57 147 -127 180l-29 -28l-81 81zM353 260c0 34.9356 -13.6691 57 -47 57h-20v-123h19c25.6434 0 40.2719 13.9518 46 34c2 7 2 15 2 24v8zM306 341c38.1819 0 60.9327 -19.3318 72 -47c4 -10 5 -22 5 -34v-8
+c0 -26.4057 -7.57104 -45.571 -21 -59c-13.4122 -13.4122 -30.5519 -22 -57 -22h-49v170h50zM207 258c15.3033 -6.12131 28 -18.2465 28 -39c0 -8 -2 -14 -5 -20s-6 -12 -11 -16c-9.37815 -7.50252 -23.5479 -12 -40 -12c-31.0959 0 -54 15.7441 -54 47h27
+c0 -15.4518 11.6022 -25 27 -25c17.8699 0 28 8.53939 28 27c0 18.8434 -12.3951 27 -31 27h-16v22h16c17.3039 0 29 8.03066 29 25c0 16.5246 -8.84017 25 -26 25c-14.4441 0 -25 -8.58131 -25 -23h-28c0 14.8936 7.55163 24.5516 15 32c9.92709 7.94167 20.8987 13 38 13
+c25.6475 0 40.3859 -9.7718 49 -27c3 -6 4 -12 4 -20c0 -18.1878 -12.3353 -29.6677 -25 -36zM160 54l29 28l81 -81l-14 -1c-134 0 -244 104 -255 235h32c8 -80 57 -148 127 -181z" />
+    <glyph glyph-name="ac_unit" unicode="ac_unit" 
+d="M469 277v-42h-89l69 -69l-30 -31l-99 100h-43v-43l100 -99l-31 -30l-69 69v-89h-42v89l-69 -69l-31 30l100 99v43h-43l-99 -100l-30 31l69 69h-89v42h89l-69 69l30 31l99 -100h43v43l-100 99l31 30l69 -69v89h42v-89l69 69l31 -30l-100 -99v-43h43l99 100l30 -31l-69 -69
+h89z" />
+    <glyph glyph-name="access_alarm" unicode="access_alarm" 
+d="M256 85c83 0 149 67 149 150s-66 149 -149 149s-149 -66 -149 -149s66 -150 149 -150zM256 427c106 0 192 -86 192 -192s-86 -192 -192 -192s-192 86 -192 192s86 192 192 192zM267 341v-112l85 -50l-16 -26l-101 60v128h32zM168 440l-98 -82l-27 32l98 82zM469 390
+l-27 -33l-98 83l27 32z" />
+    <glyph glyph-name="access_alarms" unicode="access_alarms" 
+d="M256 85c83 0 149 67 149 150s-66 149 -149 149s-149 -66 -149 -149s66 -150 149 -150zM256 427c107 0 192 -85 192 -192s-85 -192 -192 -192s-192 85 -192 192s85 192 192 192zM267 341v-113l85 -51l-17 -26l-100 62v128h32zM169 439l-99 -81l-27 32l98 81zM469 390
+l-27 -32l-99 84l28 32z" />
+    <glyph glyph-name="access_time" unicode="access_time" 
+d="M267 363v-112l96 -57l-16 -27l-112 68v128h32zM256 85c94 0 171 77 171 171s-77 171 -171 171s-171 -77 -171 -171s77 -171 171 -171zM256 469c118 0 213 -95 213 -213s-95 -213 -213 -213s-213 95 -213 213s95 213 213 213z" />
+    <glyph glyph-name="accessibility" unicode="accessibility" 
+d="M448 320h-128v-277h-43v128h-42v-128h-43v277h-128v43h384v-43zM256 469c23 0 43 -19 43 -42s-20 -43 -43 -43s-43 20 -43 43s20 42 43 42z" />
+    <glyph glyph-name="accessible" unicode="accessible" 
+d="M274 128h44c-10 -49 -53 -85 -105 -85c-59 0 -106 47 -106 106c0 52 36 95 85 105v-44c-25 -9 -43 -33 -43 -61c0 -35 29 -64 64 -64c28 0 52 18 61 43zM213 318c0 29.9891 33.3578 56.5098 64 39h1v-1c5 -2 9 -5 13 -9l28 -31c21 -23 53 -39 86 -39v-42
+c-37 0 -78 18 -106 41v-73h64c23 0 42 -20 42 -43v-117h-42v106h-107c-23 0 -43 20 -43 43v126zM213 427c0 24 19 42 43 42s43 -18 43 -42s-19 -43 -43 -43s-43 19 -43 43z" />
+    <glyph glyph-name="account_balance" unicode="account_balance" 
+d="M245 491l203 -107v-43h-405v43zM341 299h64v-150h-64v150zM43 43v64h405v-64h-405zM213 299h64v-150h-64v150zM85 299h64v-150h-64v150z" />
+    <glyph glyph-name="account_balance_wallet" unicode="account_balance_wallet" 
+d="M341 224c18 0 32 14 32 32s-14 32 -32 32s-32 -14 -32 -32s14 -32 32 -32zM256 171v170h213v-170h-213zM448 128v-21c0 -23 -20 -43 -43 -43h-298c-24 0 -43 20 -43 43v298c0 23 19 43 43 43h298c23 0 43 -20 43 -43v-21h-192c-24 0 -43 -20 -43 -43v-170
+c0 -23 19 -43 43 -43h192z" />
+    <glyph glyph-name="account_box" unicode="account_box" 
+d="M128 149v-21h256v21c0 43 -85 66 -128 66s-128 -23 -128 -66zM320 320c0 35 -29 64 -64 64s-64 -29 -64 -64s29 -64 64 -64s64 29 64 64zM64 405c0 23 19 43 43 43h298c23 0 43 -20 43 -43v-298c0 -23 -20 -43 -43 -43h-298c-24 0 -43 20 -43 43v298z" />
+    <glyph glyph-name="account_circle" unicode="account_circle" 
+d="M256 102c53 0 100 28 128 69c-1 42 -86 66 -128 66c-43 0 -127 -24 -128 -66c28 -41 75 -69 128 -69zM256 405c-35 0 -64 -29 -64 -64s29 -64 64 -64s64 29 64 64s-29 64 -64 64zM256 469c118 0 213 -95 213 -213s-95 -213 -213 -213s-213 95 -213 213s95 213 213 213z
+" />
+    <glyph glyph-name="adb" unicode="adb" 
+d="M320 320c12 0 21 9 21 21s-9 22 -21 22s-21 -10 -21 -22s9 -21 21 -21zM192 320c12 0 21 9 21 21s-9 22 -21 22s-21 -10 -21 -22s9 -21 21 -21zM344 419c37 -27 61 -71 61 -120v-22h-298v22c0 49 24 93 61 120l-45 45l18 17l49 -49c20 10 42 16 66 16s46 -6 66 -16l49 49
+l18 -17zM107 171v85h298v-85c0 -83 -66 -150 -149 -150s-149 67 -149 150z" />
+    <glyph glyph-name="add" unicode="add" 
+d="M405 235h-128v-128h-42v128h-128v42h128v128h42v-128h128v-42z" />
+    <glyph glyph-name="add_a_photo" unicode="add_a_photo" 
+d="M209 213c0 38 30 69 68 69s69 -31 69 -69s-31 -68 -69 -68s-68 30 -68 68zM277 107c59 0 107 47 107 106s-48 107 -107 107s-106 -48 -106 -107s47 -106 106 -106zM128 299v64h64v64h149l39 -43h68c23 0 43 -20 43 -43v-256c0 -23 -20 -42 -43 -42h-341
+c-23 0 -43 19 -43 42v214h64zM64 427v64h43v-64h64v-43h-64v-64h-43v64h-64v43h64z" />
+    <glyph glyph-name="add_alarm" unicode="add_alarm" 
+d="M277 320v-64h64v-43h-64v-64h-42v64h-64v43h64v64h42zM256 85c83 0 149 67 149 150s-66 149 -149 149s-149 -66 -149 -149s66 -150 149 -150zM256 427c106 0 192 -86 192 -192s-86 -192 -192 -192s-192 86 -192 192s86 192 192 192zM469 390l-27 -33l-98 83l27 32z
+M168 440l-98 -82l-27 32l98 82z" />
+    <glyph glyph-name="add_alert" unicode="add_alert" 
+d="M341 234v43h-64v64h-42v-64h-64v-43h64v-64h42v64h64zM403 153l45 -45v-23h-384v23l45 45v124c0 69 48 128 113 143v15c0 19 15 34 34 34s34 -15 34 -34v-15c65 -15 113 -74 113 -143v-124zM214 64h84c0 -23 -19 -43 -42 -43s-42 20 -42 43z" />
+    <glyph glyph-name="add_box" unicode="add_box" 
+d="M363 235v42h-86v86h-42v-86h-86v-42h86v-86h42v86h86zM405 448c23 0 43 -20 43 -43v-298c0 -23 -20 -43 -43 -43h-298c-24 0 -43 20 -43 43v298c0 23 19 43 43 43h298z" />
+    <glyph glyph-name="add_circle" unicode="add_circle" 
+d="M363 235v42h-86v86h-42v-86h-86v-42h86v-86h42v86h86zM256 469c118 0 213 -95 213 -213s-95 -213 -213 -213s-213 95 -213 213s95 213 213 213z" />
+    <glyph glyph-name="add_circle_outline" unicode="add_circle_outline" 
+d="M256 85c94 0 171 77 171 171s-77 171 -171 171s-171 -77 -171 -171s77 -171 171 -171zM256 469c118 0 213 -95 213 -213s-95 -213 -213 -213s-213 95 -213 213s95 213 213 213zM277 363v-86h86v-42h-86v-86h-42v86h-86v42h86v86h42z" />
+    <glyph glyph-name="add_location" unicode="add_location" 
+d="M341 299v42h-64v64h-42v-64h-64v-42h64v-64h42v64h64zM256 469c82 0 149 -67 149 -149c0 -112 -149 -277 -149 -277s-149 165 -149 277c0 82 67 149 149 149z" />
+    <glyph glyph-name="add_shopping_cart" unicode="add_shopping_cart" 
+d="M153 197c0 -3 2 -5 5 -5h247v-43h-256c-23 0 -42 20 -42 43c0 7 2 14 5 20l29 53l-77 162h-43v42h70c13.5017 -28.165 26.8327 -56.5006 40 -85c17.0313 -35.6353 33.8016 -71.5317 51 -107h150c27.393 49.9404 55.2665 99.4002 82 150l37 -21l-82 -149
+c-7 -13 -21 -22 -37 -22h-159l-19 -35zM363 128c23 0 42 -20 42 -43s-19 -42 -42 -42s-43 19 -43 42s20 43 43 43zM149 128c23 0 43 -20 43 -43s-20 -42 -43 -42s-42 19 -42 42s19 43 42 43zM235 320v64h-64v43h64v64h42v-64h64v-43h-64v-64h-42z" />
+    <glyph glyph-name="add_to_photos" unicode="add_to_photos" 
+d="M405 277v43h-85v85h-43v-85h-85v-43h85v-85h43v85h85zM427 469c23 0 42 -19 42 -42v-256c0 -23 -19 -43 -42 -43h-256c-23 0 -43 20 -43 43v256c0 23 20 42 43 42h256zM85 384v-299h299v-42h-299c-23 0 -42 19 -42 42v299h42z" />
+    <glyph glyph-name="add_to_queue" unicode="add_to_queue" 
+d="M341 299v-43h-64v-64h-42v64h-64v43h64v64h42v-64h64zM448 149v256h-384v-256h384zM448 448c23 0 43 -19 43 -43l-1 -256c0 -23 -19 -42 -42 -42h-107v-43h-170v43h-107c-24 0 -43 19 -43 42v256c0 24 19 43 43 43h384z" />
+    <glyph glyph-name="adjust" unicode="adjust" 
+d="M320 256c0 -35 -29 -64 -64 -64s-64 29 -64 64s29 64 64 64s64 -29 64 -64zM256 85c94 0 171 77 171 171s-77 171 -171 171s-171 -77 -171 -171s77 -171 171 -171zM256 469c118 0 213 -95 213 -213s-95 -213 -213 -213s-213 95 -213 213s95 213 213 213z" />
+    <glyph glyph-name="airline_seat_flat" unicode="airline_seat_flat" 
+d="M152 254c-25 -25 -65 -26 -90 -1s-26 65 -1 90s65 26 90 1s26 -65 1 -90zM43 213h426v-42h-128v-43h-170v43h-128v42zM469 277v-42h-277v128h192c47 0 85 -39 85 -86z" />
+    <glyph glyph-name="airline_seat_flat_angled" unicode="airline_seat_flat_angled" 
+d="M156 294c-32 -15 -71 -2 -86 30s-2 71 30 86s71 2 86 -30s2 -71 -30 -86zM32 253l15 40l405 -146l-14 -40l-97 34v-34h-170v96zM475 207l-15 -40l-264 95l45 121l182 -66c45 -16 68 -65 52 -110z" />
+    <glyph glyph-name="airline_seat_individual_suite" unicode="airline_seat_individual_suite" 
+d="M405 363c47 0 86 -39 86 -86v-128h-470v214h43v-150h171v150h170zM149 235c-35 0 -64 29 -64 64s29 64 64 64s64 -29 64 -64s-29 -64 -64 -64z" />
+    <glyph glyph-name="airline_seat_legroom_extra" unicode="airline_seat_legroom_extra" 
+d="M487 144c9 -16 1 -36 -15 -44l-79 -36l-73 149h-149c-35 0 -64 29 -64 64v171h128v-128h75c16 0 31 -9 38 -24l72 -149l24 11c16 7 35 1 43 -14zM85 256c0 -35 29 -64 64 -64h128v-43h-128c-59 0 -106 48 -106 107v192h42v-192z" />
+    <glyph glyph-name="airline_seat_legroom_normal" unicode="airline_seat_legroom_normal" 
+d="M437 128c18 0 32 -14 32 -32s-14 -32 -32 -32h-96v149h-149c-35 0 -64 29 -64 64v171h128v-128h107c23 0 42 -20 42 -43v-149h32zM107 256c0 -35 29 -64 64 -64h128v-43h-128c-59 0 -107 48 -107 107v192h43v-192z" />
+    <glyph glyph-name="airline_seat_legroom_reduced" unicode="airline_seat_legroom_reduced" 
+d="M107 256c0 -35 29 -64 64 -64h85v-43h-85c-59 0 -107 48 -107 107v192h43v-192zM426 102c4 -20 -11 -38 -31 -38h-96v64l21 85h-128c-35 0 -64 29 -64 64v171h128v-128h107c23 0 42 -20 42 -43l-42 -149h30c16 0 30 -11 33 -26z" />
+    <glyph glyph-name="airline_seat_recline_extra" unicode="airline_seat_recline_extra" 
+d="M346 192l123 -96l-32 -32l-81 64h-146c-31 0 -57 22 -63 52l-29 126c-4 26 13 51 39 56h1c15.1794 2.16848 28.3139 -2.05108 37 -9l35 -27c27 -21 65 -34 100 -27v-46c-40 -7 -76 7 -110 26l22 -87h104zM341 107v-43h-150c-53 0 -98 38 -106 90l-42 209h42l42 -202
+c5 -31 32 -54 64 -54h150zM114 392c-19 14 -23 40 -10 59s40 24 59 11c19 -14 24 -41 11 -60c-14 -19 -41 -23 -60 -10z" />
+    <glyph glyph-name="airline_seat_recline_normal" unicode="airline_seat_recline_normal" 
+d="M427 84l-31 -31l-75 75h-108c-35 0 -64 29 -64 64v123c0 26 22 48 48 48h1c14.8367 0 27.399 -8.39902 35 -16l30 -33c23 -25 65 -43 100 -43v-47c-41 0 -88 22 -118 47v-79h74zM128 171c0 -35 29 -64 64 -64h128v-43h-128c-59 0 -107 48 -107 107v192h43v-192zM162 397
+c-17 17 -17 43 0 60s43 17 60 0s17 -43 0 -60s-43 -17 -60 0z" />
+    <glyph glyph-name="airplanemode_active" unicode="airplanemode_active" 
+d="M217 320zM448 171l-171 53v-117l43 -32v-32l-75 21l-74 -21v32l42 32v117l-170 -53v42l170 107v117c0 18 14 32 32 32s32 -14 32 -32v-117l171 -107v-42z" />
+    <glyph glyph-name="airplanemode_inactive" unicode="airplanemode_inactive" 
+d="M64 400l27 27l336 -336l-27 -27l-123 122v-79l43 -32v-32l-75 21l-74 -21v32l42 32v117l-170 -53v42l127 80zM277 320l171 -107v-42l-68 21l-167 167v78c0 18 14 32 32 32s32 -14 32 -32v-117z" />
+    <glyph glyph-name="airplay" unicode="airplay" 
+d="M448 448c23 0 43 -20 43 -43v-256c0 -23 -20 -42 -43 -42h-85v42h85v256h-384v-256h85v-42h-85c-23 0 -43 19 -43 42v256c0 23 20 43 43 43h384zM128 43l128 128l128 -128h-256z" />
+    <glyph glyph-name="airport_shuttle" unicode="airport_shuttle" 
+d="M320 277h107l-86 86h-21v-86zM373 139c18 0 32 14 32 32s-14 32 -32 32s-32 -14 -32 -32s14 -32 32 -32zM277 277v86h-85v-86h85zM128 139c18 0 32 14 32 32s-14 32 -32 32s-32 -14 -32 -32s14 -32 32 -32zM64 277h85v86h-85v-86zM363 405l128 -128v-106h-54
+c0 -35 -29 -64 -64 -64s-64 29 -64 64h-117c0 -35 -29 -64 -64 -64s-64 29 -64 64h-43v192c0 24 20 42 43 42h299z" />
+    <glyph glyph-name="alarm" unicode="alarm" 
+d="M256 85c83 0 149 67 149 150s-66 149 -149 149s-149 -66 -149 -149s66 -150 149 -150zM256 427c106 0 192 -86 192 -192s-86 -192 -192 -192s-192 86 -192 192s86 192 192 192zM267 341v-112l85 -50l-16 -26l-101 60v128h32zM168 440l-98 -82l-27 32l98 82zM469 390
+l-27 -33l-98 83l27 32z" />
+    <glyph glyph-name="alarm_add" unicode="alarm_add" 
+d="M277 320v-64h64v-43h-64v-64h-42v64h-64v43h64v64h42zM256 85c83 0 149 67 149 150s-66 149 -149 149s-149 -66 -149 -149s66 -150 149 -150zM256 427c106 0 192 -86 192 -192s-86 -192 -192 -192s-192 86 -192 192s86 192 192 192zM469 390l-27 -33l-98 83l27 32z
+M168 440l-98 -82l-27 32l98 82z" />
+    <glyph glyph-name="alarm_off" unicode="alarm_off" 
+d="M171 442l-18 -15l-31 30l19 15zM351 120l-210 210c-21 -26 -34 -59 -34 -95c0 -83 66 -150 149 -150c36 0 69 14 95 35zM62 463c131.276 -131.057 262.677 -261.99 394 -393l-27 -27l-47 47c-34 -29 -78 -47 -126 -47c-106 0 -192 86 -192 192c0 48 18 91 47 125l-17 17
+l-24 -20l-30 31l24 19l-29 29zM469 390l-27 -33l-98 83l27 32zM256 384c-18 0 -35 -3 -51 -9l-33 32c25 12 54 20 84 20c106 0 192 -86 192 -192c0 -30 -7 -59 -19 -84l-33 32c6 16 9 34 9 52c0 83 -66 149 -149 149z" />
+    <glyph glyph-name="alarm_on" unicode="alarm_on" 
+d="M225 202l105 106l23 -23l-128 -128l-68 68l22 22zM256 85c83 0 149 67 149 150s-66 149 -149 149s-149 -66 -149 -149s66 -150 149 -150zM256 427c106 0 192 -86 192 -192s-86 -192 -192 -192s-192 86 -192 192s86 192 192 192zM168 440l-98 -82l-27 32l98 82zM469 390
+l-27 -33l-98 83l27 32z" />
+    <glyph glyph-name="album" unicode="album" 
+d="M256 277c12 0 21 -9 21 -21s-9 -21 -21 -21s-21 9 -21 21s9 21 21 21zM256 160c53 0 96 43 96 96s-43 96 -96 96s-96 -43 -96 -96s43 -96 96 -96zM256 469c118 0 213 -95 213 -213s-95 -213 -213 -213s-213 95 -213 213s95 213 213 213z" />
+    <glyph glyph-name="all_inclusive" unicode="all_inclusive" 
+d="M397 371c64 0 115 -52 115 -115s-51 -115 -115 -115c-31 0 -60 12 -82 34l-27 24l32 28l25 -21c15 -15 33 -22 52 -22c40 0 72 32 72 72s-32 72 -72 72c-19 0 -37 -7 -51 -21c-30.1331 -26.5336 -60.4726 -52.8608 -90 -80l-60 -53c-21 -21 -50 -33 -81 -33
+c-64 0 -115 52 -115 115s51 115 115 115c31 0 60 -12 82 -34l27 -24l-33 -28l-24 21c-15 15 -33 22 -52 22c-40 0 -72 -32 -72 -72s32 -72 72 -72c19 0 37 7 51 21c30.1331 26.5336 60.4726 52.8608 90 80l60 53c21 21 50 33 81 33z" />
+    <glyph glyph-name="all_out" unicode="all_out" 
+d="M343 170c45 45 45 120 0 165s-120 45 -165 0s-45 -120 0 -165s120 -45 165 0zM366 358c58 -58 58 -153 0 -211s-153 -58 -211 0s-58 153 0 211s153 58 211 0zM90 338v85h85zM175 82h-85v85zM431 167v-85h-85zM346 423h85v-85z" />
+    <glyph glyph-name="android" unicode="android" 
+d="M320 405v22h-21v-22h21zM213 405v22h-21v-22h21zM331 466c32 -23 53 -61 53 -103h-256c0 42 20 80 52 103l-28 28c-4 4 -4 11 0 15s11 4 15 0l32 -32c17 9 37 14 57 14s39 -5 56 -14l32 32c4 4 11 4 15 0s4 -11 0 -15zM437 341c18 0 32 -14 32 -32v-149
+c0 -18 -14 -32 -32 -32s-32 14 -32 32v149c0 18 14 32 32 32zM75 341c18 0 32 -14 32 -32v-149c0 -18 -14 -32 -32 -32s-32 14 -32 32v149c0 18 14 32 32 32zM128 128v213h256v-213c0 -12 -9 -21 -21 -21h-22v-75c0 -18 -14 -32 -32 -32s-32 14 -32 32v75h-42v-75
+c0 -18 -14 -32 -32 -32s-32 14 -32 32v75h-22c-12 0 -21 9 -21 21z" />
+    <glyph glyph-name="announcement" unicode="announcement" 
+d="M277 192v43h-42v-43h42zM277 277v128h-42v-128h42zM427 469c23 0 42 -19 42 -42v-256c0 -23 -19 -43 -42 -43h-299l-85 -85v384c0 23 19 42 42 42h342z" />
+    <glyph glyph-name="apps" unicode="apps" 
+d="M341 85v86h86v-86h-86zM341 213v86h86v-86h-86zM213 341v86h86v-86h-86zM341 427h86v-86h-86v86zM213 213v86h86v-86h-86zM85 213v86h86v-86h-86zM85 85v86h86v-86h-86zM213 85v86h86v-86h-86zM85 341v86h86v-86h-86z" />
+    <glyph glyph-name="archive" unicode="archive" 
+d="M109 405h294l-20 22h-256zM256 139l117 117h-74v43h-86v-43h-74zM438 400c6 -7 10 -17 10 -27v-266c0 -23 -20 -43 -43 -43h-298c-23 0 -43 20 -43 43v266c0 10 4 20 10 27l29 36c6 7 15 12 25 12h256c10 0 19 -5 25 -12z" />
+    <glyph glyph-name="arrow_back" unicode="arrow_back" 
+d="M427 277v-42h-260l119 -120l-30 -30l-171 171l171 171l30 -30l-119 -120h260z" />
+    <glyph glyph-name="arrow_downward" unicode="arrow_downward" 
+d="M427 256l-171 -171l-171 171l31 30l119 -119v260h42v-260l120 119z" />
+    <glyph glyph-name="arrow_drop_down" unicode="arrow_drop_down" 
+d="M149 299h214l-107 -107z" />
+    <glyph glyph-name="arrow_drop_down_circle" unicode="arrow_drop_down_circle" 
+d="M256 213l85 86h-170zM256 469c118 0 213 -95 213 -213s-95 -213 -213 -213s-213 95 -213 213s95 213 213 213z" />
+    <glyph glyph-name="arrow_drop_up" unicode="arrow_drop_up" 
+d="M149 213l107 107l107 -107h-214z" />
+    <glyph glyph-name="arrow_forward" unicode="arrow_forward" 
+d="M256 427l171 -171l-171 -171l-30 30l119 120h-260v42h260l-119 120z" />
+    <glyph glyph-name="arrow_upward" unicode="arrow_upward" 
+d="M85 256l171 171l171 -171l-31 -30l-119 119v-260h-42v260l-120 -119z" />
+    <glyph glyph-name="art_track" unicode="art_track" 
+d="M224 192l-48 64l-37 -48l-27 32l-37 -48h149zM256 320v-128c0 -23 -20 -43 -43 -43h-128c-23 0 -42 20 -42 43v128c0 23 19 43 42 43h128c23 0 43 -20 43 -43zM299 149v43h170v-43h-170zM469 363v-43h-170v43h170zM469 235h-170v42h170v-42z" />
+    <glyph glyph-name="aspect_ratio" unicode="aspect_ratio" 
+d="M448 106v300h-384v-300h384zM448 448c23 0 43 -20 43 -43v-298c0 -23 -20 -43 -43 -43h-384c-23 0 -43 20 -43 43v298c0 23 20 43 43 43h384zM149 320v-64h-42v107h106v-43h-64zM405 256v-107h-106v43h64v64h42z" />
+    <glyph glyph-name="assessment" unicode="assessment" 
+d="M363 149v86h-43v-86h43zM277 149v214h-42v-214h42zM192 149v150h-43v-150h43zM405 448c23 0 43 -20 43 -43v-298c0 -23 -20 -43 -43 -43h-298c-23 0 -43 20 -43 43v298c0 23 20 43 43 43h298z" />
+    <glyph glyph-name="assignment" unicode="assignment" 
+d="M363 320v43h-214v-43h214zM363 235v42h-214v-42h214zM299 149v43h-150v-43h150zM256 448c-12 0 -21 -9 -21 -21s9 -22 21 -22s21 10 21 22s-9 21 -21 21zM405 448c23 0 43 -20 43 -43v-298c0 -23 -20 -43 -43 -43h-298c-23 0 -43 20 -43 43v298c0 23 20 43 43 43h89
+c9 25 32 43 60 43s51 -18 60 -43h89z" />
+    <glyph glyph-name="assignment_ind" unicode="assignment_ind" 
+d="M384 107v30c0 43 -85 66 -128 66s-128 -23 -128 -66v-30h256zM256 363c-35 0 -64 -29 -64 -64s29 -64 64 -64s64 29 64 64s-29 64 -64 64zM256 448c-12 0 -21 -9 -21 -21s9 -22 21 -22s21 10 21 22s-9 21 -21 21zM405 448c23 0 43 -20 43 -43v-298c0 -23 -20 -43 -43 -43
+h-298c-23 0 -43 20 -43 43v298c0 23 20 43 43 43h89c9 25 32 43 60 43s51 -18 60 -43h89z" />
+    <glyph glyph-name="assignment_late" unicode="assignment_late" 
+d="M256 405c12 0 21 10 21 22s-9 21 -21 21s-21 -9 -21 -21s9 -22 21 -22zM277 213v128h-42v-128h42zM277 128v43h-42v-43h42zM405 448c23 0 43 -20 43 -43v-298c0 -23 -20 -43 -43 -43h-298c-23 0 -43 20 -43 43v298c0 23 20 43 43 43h89c9 25 32 43 60 43s51 -18 60 -43
+h89z" />
+    <glyph glyph-name="assignment_return" unicode="assignment_return" 
+d="M341 192v85h-85v64l-107 -106l107 -107v64h85zM256 448c-12 0 -21 -9 -21 -21s9 -22 21 -22s21 10 21 22s-9 21 -21 21zM405 448c23 0 43 -20 43 -43v-298c0 -23 -20 -43 -43 -43h-298c-23 0 -43 20 -43 43v298c0 23 20 43 43 43h89c9 25 32 43 60 43s51 -18 60 -43h89z
+" />
+    <glyph glyph-name="assignment_returned" unicode="assignment_returned" 
+d="M256 128l107 107h-64v85h-86v-85h-64zM256 448c-12 0 -21 -9 -21 -21s9 -22 21 -22s21 10 21 22s-9 21 -21 21zM405 448c23 0 43 -20 43 -43v-298c0 -23 -20 -43 -43 -43h-298c-23 0 -43 20 -43 43v298c0 23 20 43 43 43h89c9 25 32 43 60 43s51 -18 60 -43h89z" />
+    <glyph glyph-name="assignment_turned_in" unicode="assignment_turned_in" 
+d="M213 149l171 171l-30 30l-141 -140l-55 55l-30 -30zM256 448c-12 0 -21 -9 -21 -21s9 -22 21 -22s21 10 21 22s-9 21 -21 21zM405 448c23 0 43 -20 43 -43v-298c0 -23 -20 -43 -43 -43h-298c-23 0 -43 20 -43 43v298c0 23 20 43 43 43h89c9 25 32 43 60 43s51 -18 60 -43
+h89z" />
+    <glyph glyph-name="assistant" unicode="assistant" 
+d="M296 237l88 40l-88 40l-40 88l-40 -88l-88 -40l88 -40l40 -88zM405 469c23 0 43 -19 43 -42v-299c0 -23 -20 -43 -43 -43h-85l-64 -64l-64 64h-85c-23 0 -43 20 -43 43v299c0 23 20 42 43 42h298z" />
+    <glyph glyph-name="assistant_photo" unicode="assistant_photo" 
+d="M307 384h120v-213h-150l-8 42h-120v-149h-42v363h192z" />
+    <glyph glyph-name="attach_file" unicode="attach_file" 
+d="M352 384h32v-245c0 -65 -52 -118 -117 -118s-118 53 -118 118v266c0 47 39 86 86 86s85 -39 85 -86v-224c0 -29 -24 -53 -53 -53s-54 24 -54 53v203h32v-203c0 -12 10 -21 22 -21s21 9 21 21v224c0 29 -24 54 -53 54s-54 -25 -54 -54v-266c0 -47 39 -86 86 -86
+s85 39 85 86v245z" />
+    <glyph glyph-name="attach_money" unicode="attach_money" 
+d="M252 279c48 -13 100 -32 100 -93c0 -44 -33 -68 -75 -76v-46h-64v46c-41 9 -75 35 -78 82h47c2 -25 19 -45 63 -45c47 0 58 23 58 38c0 20 -11 39 -64 52c-60 14 -100 39 -100 88c0 41 33 68 74 77v46h64v-47c45 -11 68 -44 69 -81h-47c-1 27 -16 45 -54 45
+c-36 0 -57 -17 -57 -40c0 -20 16 -33 64 -46z" />
+    <glyph glyph-name="attachment" unicode="attachment" 
+d="M43 245c0 65 52 118 117 118h224c47 0 85 -39 85 -86s-38 -85 -85 -85h-181c-29 0 -54 24 -54 53s25 54 54 54h160v-43h-162c-12 0 -12 -21 0 -21h183c23 0 43 19 43 42s-20 43 -43 43h-224c-41 0 -75 -34 -75 -75s34 -74 75 -74h203v-43h-203c-65 0 -117 52 -117 117z
+" />
+    <glyph glyph-name="audiotrack" unicode="audiotrack" 
+d="M256 448h149v-64h-85v-235h-1c-5 -48 -46 -85 -95 -85c-53 0 -96 43 -96 96s43 96 96 96c11 0 22 -2 32 -6v198z" />
+    <glyph glyph-name="autorenew" unicode="autorenew" 
+d="M400 347c17 -26 27 -58 27 -91c0 -94 -77 -171 -171 -171v-64l-85 86l85 85v-64c71 0 128 57 128 128c0 22 -6 42 -15 60zM256 384c-71 0 -128 -57 -128 -128c0 -22 5 -42 15 -60l-31 -31c-17 26 -27 58 -27 91c0 94 77 171 171 171v64l85 -86l-85 -85v64z" />
+    <glyph glyph-name="av_timer" unicode="av_timer" 
+d="M128 256c0 12 9 21 21 21s22 -9 22 -21s-10 -21 -22 -21s-21 9 -21 21zM384 256c0 -12 -9 -21 -21 -21s-22 9 -22 21s10 21 22 21s21 -9 21 -21zM235 448h21c106 0 192 -86 192 -192s-86 -192 -192 -192s-192 86 -192 192c0 63 30 118 77 153v1l145 -145l-30 -30
+l-116 115c-21 -26 -33 -58 -33 -94c0 -83 66 -149 149 -149s149 66 149 149c0 75 -56 138 -128 148v-41h-42v85zM235 149c0 12 9 22 21 22s21 -10 21 -22s-9 -21 -21 -21s-21 9 -21 21z" />
+    <glyph glyph-name="backspace" unicode="backspace" 
+d="M405 179l-76 77l76 77l-30 30l-76 -77l-77 77l-30 -30l77 -77l-77 -77l30 -30l77 77l76 -77zM469 448c23 0 43 -20 43 -43v-298c0 -23 -20 -43 -43 -43h-320c-15 0 -26 8 -34 19l-115 173l115 173c8 11 19 19 34 19h320z" />
+    <glyph glyph-name="backup" unicode="backup" 
+d="M299 235h64l-107 106l-107 -106h64v-86h86v86zM413 298c55 -4 99 -50 99 -106c0 -59 -48 -107 -107 -107h-277c-71 0 -128 57 -128 128c0 66 50 120 114 127c27 51 80 87 142 87c78 0 142 -55 157 -129z" />
+    <glyph glyph-name="battery_alert" unicode="battery_alert" 
+d="M277 213v107h-42v-107h42zM277 128v43h-42v-43h42zM334 427c16 0 29 -13 29 -29v-327c0 -16 -13 -28 -29 -28h-156c-16 0 -29 12 -29 28v327c0 16 13 29 29 29h35v42h86v-42h35z" />
+    <glyph glyph-name="battery_charging_full" unicode="battery_charging_full" 
+d="M235 85l85 160h-43v118l-85 -160h43v-118zM334 427c16 0 29 -13 29 -29v-327c0 -16 -13 -28 -29 -28h-156c-16 0 -29 12 -29 28v327c0 16 13 29 29 29h35v42h86v-42h35z" />
+    <glyph glyph-name="battery_full" unicode="battery_full" 
+d="M334 427c16 0 29 -13 29 -29v-327c0 -16 -13 -28 -29 -28h-156c-16 0 -29 12 -29 28v327c0 16 13 29 29 29h35v42h86v-42h35z" />
+    <glyph glyph-name="battery_std" unicode="battery_std" 
+d="M334 427c16 0 29 -13 29 -29v-327c0 -16 -13 -28 -29 -28h-156c-16 0 -29 12 -29 28v327c0 16 13 29 29 29h35v42h86v-42h35z" />
+    <glyph glyph-name="battery_unknown" unicode="battery_unknown" 
+d="M305 241c9 9 15 22 15 36c0 35 -29 64 -64 64s-64 -29 -64 -64h32c0 18 14 32 32 32s32 -14 32 -32c0 -9 -3 -16 -9 -22l-20 -20c-10 -10 -20 -25 -20 -43h34c0 10 8 24 18 34c6 6 14 15 14 15zM276 129v41h-40v-41h40zM334 427c16 0 29 -13 29 -29v-327
+c0 -16 -13 -28 -29 -28h-156c-16 0 -29 12 -29 28v327c0 16 13 29 29 29h35v42h86v-42h35z" />
+    <glyph glyph-name="beach_access" unicode="beach_access" 
+d="M372 324c-66.8504 66.8504 -159.585 88.9016 -243.437 61.1868c63.7841 7.27512 145.981 -25.7308 212.437 -92.1868l-122 -122c-66.456 66.456 -99.4619 148.653 -92.1868 212.437c-27.7148 -83.8524 -5.66368 -176.587 61.1868 -243.437l-61 -61
+c-83.9541 83.9541 -84 220.85 -0.137673 304.862c0.129398 1.10582 0.166618 1.14572 1.27547 1.27547c84.012 83.8623 220.908 83.8164 304.862 -0.137673zM280 201l31 31l137 -138l-31 -30z" />
+    <glyph glyph-name="beenhere" unicode="beenhere" 
+d="M213 171l192 192l-30 30l-162 -162l-76 76l-30 -30zM405 491c23 0 43 -20 43 -43v-276c0 -15 -8 -27 -19 -35l-173 -116l-173 116c-11 8 -19 20 -19 35v276c0 23 20 43 43 43h298z" />
+    <glyph glyph-name="block" unicode="block" 
+d="M256 85c94 0 171 77 171 171c0 39 -13 76 -36 105l-240 -240c29 -23 66 -36 105 -36zM85 256c0 -39 13 -76 36 -105l240 240c-29 23 -66 36 -105 36c-94 0 -171 -77 -171 -171zM256 469c118 0 213 -95 213 -213s-95 -213 -213 -213s-213 95 -213 213s95 213 213 213z" />
+    <glyph glyph-name="bluetooth" unicode="bluetooth" 
+d="M317 164l-40 41v-81zM277 388v-81l40 41zM378 348l-92 -92l92 -92l-122 -121h-21v162l-98 -98l-30 30l119 119l-119 119l30 30l98 -98v162h21z" />
+    <glyph glyph-name="bluetooth_audio" unicode="bluetooth_audio" 
+d="M275 164l-40 41v-81zM235 388v-81l40 41zM335 348l-92 -92l92 -92l-122 -121h-21v162l-98 -98l-30 30l119 119l-119 119l30 30l98 -98v162h21zM417 369c20 -32 31 -71 31 -111c0 -42 -12 -80 -33 -113l-25 25c13 26 21 55 21 86s-8 60 -21 86zM304 256l49 49
+c6 -15 10 -32 10 -49s-4 -35 -10 -50z" />
+    <glyph glyph-name="bluetooth_connected" unicode="bluetooth_connected" 
+d="M405 299l43 -43l-43 -43l-42 43zM317 164l-40 41v-81zM277 388v-81l40 41zM378 348l-92 -92l92 -92l-122 -121h-21v162l-98 -98l-30 30l119 119l-119 119l30 30l98 -98v162h21zM149 256l-42 -43l-43 43l43 43z" />
+    <glyph glyph-name="bluetooth_disabled" unicode="bluetooth_disabled" 
+d="M277 124l40 40l-40 41v-81zM115 427l312 -312l-30 -30l-49 49l-92 -91h-21v162l-98 -98l-30 30l119 119l-141 141zM277 388v-69l-42 43v107h21l122 -121l-65 -65l-30 30l34 35z" />
+    <glyph glyph-name="bluetooth_searching" unicode="bluetooth_searching" 
+d="M275 164l-40 41v-81zM235 388v-81l40 41zM335 348l-92 -92l92 -92l-122 -121h-21v162l-98 -98l-30 30l119 119l-119 119l30 30l98 -98v162h21zM417 369c20 -32 31 -71 31 -111c0 -42 -12 -80 -33 -113l-25 25c13 26 21 55 21 86s-8 60 -21 86zM304 256l49 49
+c6 -15 10 -32 10 -49s-4 -35 -10 -50z" />
+    <glyph glyph-name="blur_circular" unicode="blur_circular" 
+d="M299 235c12 0 21 -10 21 -22s-9 -21 -21 -21s-22 9 -22 21s10 22 22 22zM299 160c6 0 10 -5 10 -11s-4 -10 -10 -10s-11 4 -11 10s5 11 11 11zM256 85c94 0 171 77 171 171s-77 171 -171 171s-171 -77 -171 -171s77 -171 171 -171zM256 469c118 0 213 -95 213 -213
+s-95 -213 -213 -213s-213 95 -213 213s95 213 213 213zM363 309c6 0 10 -4 10 -10s-4 -11 -10 -11s-11 5 -11 11s5 10 11 10zM363 224c6 0 10 -5 10 -11s-4 -10 -10 -10s-11 4 -11 10s5 11 11 11zM299 352c-6 0 -11 5 -11 11s5 10 11 10s10 -4 10 -10s-4 -11 -10 -11z
+M299 320c12 0 21 -9 21 -21s-9 -22 -21 -22s-22 10 -22 22s10 21 22 21zM213 352c-6 0 -10 5 -10 11s4 10 10 10s11 -4 11 -10s-5 -11 -11 -11zM149 224c6 0 11 -5 11 -11s-5 -10 -11 -10s-10 4 -10 10s4 11 10 11zM213 160c6 0 11 -5 11 -11s-5 -10 -11 -10s-10 4 -10 10
+s4 11 10 11zM149 309c6 0 11 -4 11 -10s-5 -11 -11 -11s-10 5 -10 11s4 10 10 10zM213 235c12 0 22 -10 22 -22s-10 -21 -22 -21s-21 9 -21 21s9 22 21 22zM213 320c12 0 22 -9 22 -21s-10 -22 -22 -22s-21 10 -21 22s9 21 21 21z" />
+    <glyph glyph-name="blur_linear" unicode="blur_linear" 
+d="M277 149c-12 0 -21 10 -21 22s9 21 21 21s22 -9 22 -21s-10 -22 -22 -22zM277 235c-12 0 -21 9 -21 21s9 21 21 21s22 -9 22 -21s-10 -21 -22 -21zM277 320c-12 0 -21 9 -21 21s9 22 21 22s22 -10 22 -22s-10 -21 -22 -21zM363 245c-6 0 -11 5 -11 11s5 11 11 11
+s10 -5 10 -11s-4 -11 -10 -11zM363 331c-6 0 -11 4 -11 10s5 11 11 11s10 -5 10 -11s-4 -10 -10 -10zM64 448h384v-43h-384v43zM363 160c-6 0 -11 5 -11 11s5 10 11 10s10 -4 10 -10s-4 -11 -10 -11zM192 149c-12 0 -21 10 -21 22s9 21 21 21s21 -9 21 -21s-9 -22 -21 -22z
+M107 224c-18 0 -32 14 -32 32s14 32 32 32s32 -14 32 -32s-14 -32 -32 -32zM107 309c-18 0 -32 14 -32 32s14 32 32 32s32 -14 32 -32s-14 -32 -32 -32zM64 64v43h384v-43h-384zM192 320c-12 0 -21 9 -21 21s9 22 21 22s21 -10 21 -22s-9 -21 -21 -21zM192 235
+c-12 0 -21 9 -21 21s9 21 21 21s21 -9 21 -21s-9 -21 -21 -21zM107 139c-18 0 -32 14 -32 32s14 32 32 32s32 -14 32 -32s-14 -32 -32 -32z" />
+    <glyph glyph-name="blur_off" unicode="blur_off" 
+d="M64 224c6 0 11 -5 11 -11s-5 -10 -11 -10s-11 4 -11 10s5 11 11 11zM128 149c12 0 21 -9 21 -21s-9 -21 -21 -21s-21 9 -21 21s9 21 21 21zM213 75c6 0 11 -5 11 -11s-5 -11 -11 -11s-10 5 -10 11s4 11 10 11zM64 309c6 0 11 -4 11 -10s-5 -11 -11 -11s-11 5 -11 11
+s5 10 11 10zM128 235c12 0 21 -10 21 -22s-9 -21 -21 -21s-21 9 -21 21s9 22 21 22zM448 224c6 0 11 -5 11 -11s-5 -10 -11 -10s-11 4 -11 10s5 11 11 11zM213 149c12 0 22 -9 22 -21s-10 -21 -22 -21s-21 9 -21 21s9 21 21 21zM53 400l27 27l347 -347l-28 -27l-80 81
+c1 -2 1 -4 1 -6c0 -12 -9 -21 -21 -21s-22 9 -22 21s10 21 22 21c2 0 4 0 6 -1l-60 60c-2 -15 -16 -27 -32 -27c-18 0 -32 14 -32 32c0 16 12 30 27 32l-60 60c1 -2 1 -4 1 -6c0 -12 -9 -22 -21 -22s-21 10 -21 22s9 21 21 21l6 -1zM299 75c6 0 10 -5 10 -11s-4 -11 -10 -11
+s-11 5 -11 11s5 11 11 11zM384 363c-12 0 -21 9 -21 21s9 21 21 21s21 -9 21 -21s-9 -21 -21 -21zM384 277c-12 0 -21 10 -21 22s9 21 21 21s21 -9 21 -21s-9 -22 -21 -22zM384 192c-12 0 -21 9 -21 21s9 22 21 22s21 -10 21 -22s-9 -21 -21 -21zM213 363
+c-12 0 -21 9 -21 21s9 21 21 21s22 -9 22 -21s-10 -21 -22 -21zM448 288c-6 0 -11 5 -11 11s5 10 11 10s11 -4 11 -10s-5 -11 -11 -11zM213 437c-6 0 -10 5 -10 11s4 11 10 11s11 -5 11 -11s-5 -11 -11 -11zM299 437c-6 0 -11 5 -11 11s5 11 11 11s10 -5 10 -11
+s-4 -11 -10 -11zM294 267c-14 2 -25 13 -27 27v5c0 18 14 32 32 32s32 -14 32 -32s-14 -32 -32 -32h-5zM299 363c-12 0 -22 9 -22 21s10 21 22 21s21 -9 21 -21s-9 -21 -21 -21z" />
+    <glyph glyph-name="blur_on" unicode="blur_on" 
+d="M299 331c18 0 32 -14 32 -32s-14 -32 -32 -32s-32 14 -32 32s14 32 32 32zM299 245c18 0 32 -14 32 -32s-14 -32 -32 -32s-32 14 -32 32s14 32 32 32zM213 149c12 0 22 -9 22 -21s-10 -21 -22 -21s-21 9 -21 21s9 21 21 21zM213 331c18 0 32 -14 32 -32s-14 -32 -32 -32
+s-32 14 -32 32s14 32 32 32zM299 75c6 0 10 -5 10 -11s-4 -11 -10 -11s-11 5 -11 11s5 11 11 11zM299 149c12 0 21 -9 21 -21s-9 -21 -21 -21s-22 9 -22 21s10 21 22 21zM448 224c6 0 11 -5 11 -11s-5 -10 -11 -10s-11 4 -11 10s5 11 11 11zM384 405c12 0 21 -9 21 -21
+s-9 -21 -21 -21s-21 9 -21 21s9 21 21 21zM384 320c12 0 21 -9 21 -21s-9 -22 -21 -22s-21 10 -21 22s9 21 21 21zM384 149c12 0 21 -9 21 -21s-9 -21 -21 -21s-21 9 -21 21s9 21 21 21zM384 235c12 0 21 -10 21 -22s-9 -21 -21 -21s-21 9 -21 21s9 22 21 22zM213 245
+c18 0 32 -14 32 -32s-14 -32 -32 -32s-32 14 -32 32s14 32 32 32zM213 363c-12 0 -21 9 -21 21s9 21 21 21s22 -9 22 -21s-10 -21 -22 -21zM213 437c-6 0 -10 5 -10 11s4 11 10 11s11 -5 11 -11s-5 -11 -11 -11zM213 75c6 0 11 -5 11 -11s-5 -11 -11 -11s-10 5 -10 11
+s4 11 10 11zM64 224c6 0 11 -5 11 -11s-5 -10 -11 -10s-11 4 -11 10s5 11 11 11zM299 437c-6 0 -11 5 -11 11s5 11 11 11s10 -5 10 -11s-4 -11 -10 -11zM299 363c-12 0 -22 9 -22 21s10 21 22 21s21 -9 21 -21s-9 -21 -21 -21zM448 288c-6 0 -11 5 -11 11s5 10 11 10
+s11 -4 11 -10s-5 -11 -11 -11zM128 405c12 0 21 -9 21 -21s-9 -21 -21 -21s-21 9 -21 21s9 21 21 21zM64 309c6 0 11 -4 11 -10s-5 -11 -11 -11s-11 5 -11 11s5 10 11 10zM128 320c12 0 21 -9 21 -21s-9 -22 -21 -22s-21 10 -21 22s9 21 21 21zM128 149c12 0 21 -9 21 -21
+s-9 -21 -21 -21s-21 9 -21 21s9 21 21 21zM128 235c12 0 21 -10 21 -22s-9 -21 -21 -21s-21 9 -21 21s9 22 21 22z" />
+    <glyph glyph-name="book" unicode="book" 
+d="M128 427v-171l53 32l54 -32v171h-107zM384 469c23 0 43 -19 43 -42v-342c0 -23 -20 -42 -43 -42h-256c-23 0 -43 19 -43 42v342c0 23 20 42 43 42h256z" />
+    <glyph glyph-name="bookmark" unicode="bookmark" 
+d="M363 448c23 0 42 -20 42 -43v-341l-149 64l-149 -64v341c0 23 19 43 42 43h214z" />
+    <glyph glyph-name="bookmark_border" unicode="bookmark_border" 
+d="M363 128v277h-214v-277l107 47zM363 448c23 0 42 -20 42 -43v-341l-149 64l-149 -64v341c0 23 19 43 42 43h214z" />
+    <glyph glyph-name="border_all" unicode="border_all" 
+d="M405 277v128h-128v-128h128zM405 107v128h-128v-128h128zM235 277v128h-128v-128h128zM235 107v128h-128v-128h128zM64 448h384v-384h-384v384z" />
+    <glyph glyph-name="border_bottom" unicode="border_bottom" 
+d="M107 192v-43h-43v43h43zM64 64v43h384v-43h-384zM107 277v-42h-43v42h43zM405 320v43h43v-43h-43zM405 448h43v-43h-43v43zM107 363v-43h-43v43h43zM405 149v43h43v-43h-43zM405 235v42h43v-42h-43zM363 448v-43h-43v43h43zM277 448v-43h-42v43h42zM363 277v-42h-43v42
+h43zM277 363v-43h-42v43h42zM107 448v-43h-43v43h43zM277 277v-42h-42v42h42zM192 448v-43h-43v43h43zM277 192v-43h-42v43h42zM192 277v-42h-43v42h43z" />
+    <glyph glyph-name="border_clear" unicode="border_clear" 
+d="M320 405v43h43v-43h-43zM320 235v42h43v-42h-43zM320 64v43h43v-43h-43zM235 405v43h42v-43h-42zM405 448h43v-43h-43v43zM235 320v43h42v-43h-42zM405 320v43h43v-43h-43zM405 64v43h43v-43h-43zM405 235v42h43v-42h-43zM405 149v43h43v-43h-43zM235 235v42h42v-42h-42z
+M64 405v43h43v-43h-43zM64 320v43h43v-43h-43zM64 235v42h43v-42h-43zM64 149v43h43v-43h-43zM64 64v43h43v-43h-43zM235 64v43h42v-43h-42zM235 149v43h42v-43h-42zM149 64v43h43v-43h-43zM149 235v42h43v-42h-43zM149 405v43h43v-43h-43z" />
+    <glyph glyph-name="border_color" unicode="border_color" 
+d="M0 85h512v-85h-512v85zM442 426l-42 -42l-80 80l42 42c8 8 22 8 30 0l50 -50c8 -8 8 -22 0 -30zM379 363l-214 -214h-80v80l214 214z" />
+    <glyph glyph-name="border_horizontal" unicode="border_horizontal" 
+d="M405 64v43h43v-43h-43zM320 64v43h43v-43h-43zM235 149v43h42v-43h-42zM405 320v43h43v-43h-43zM405 448h43v-43h-43v43zM64 235v42h384v-42h-384zM235 64v43h42v-43h-42zM405 149v43h43v-43h-43zM277 448v-43h-42v43h42zM277 363v-43h-42v43h42zM363 448v-43h-43v43h43z
+M192 448v-43h-43v43h43zM107 448v-43h-43v43h43zM149 64v43h43v-43h-43zM64 149v43h43v-43h-43zM107 363v-43h-43v43h43zM64 64v43h43v-43h-43z" />
+    <glyph glyph-name="border_inner" unicode="border_inner" 
+d="M405 149v43h43v-43h-43zM405 64v43h43v-43h-43zM277 448v-171h171v-42h-171v-171h-42v171h-171v42h171v171h42zM320 64v43h43v-43h-43zM405 448h43v-43h-43v43zM405 320v43h43v-43h-43zM363 448v-43h-43v43h43zM107 448v-43h-43v43h43zM192 448v-43h-43v43h43zM64 149v43
+h43v-43h-43zM107 363v-43h-43v43h43zM149 64v43h43v-43h-43zM64 64v43h43v-43h-43z" />
+    <glyph glyph-name="border_left" unicode="border_left" 
+d="M320 405v43h43v-43h-43zM320 235v42h43v-42h-43zM405 64v43h43v-43h-43zM405 235v42h43v-42h-43zM405 448h43v-43h-43v43zM405 149v43h43v-43h-43zM320 64v43h43v-43h-43zM405 320v43h43v-43h-43zM64 64v384h43v-384h-43zM149 235v42h43v-42h-43zM149 405v43h43v-43h-43z
+M149 64v43h43v-43h-43zM235 235v42h42v-42h-42zM235 320v43h42v-43h-42zM235 405v43h42v-43h-42zM235 149v43h42v-43h-42zM235 64v43h42v-43h-42z" />
+    <glyph glyph-name="border_outer" unicode="border_outer" 
+d="M192 277v-42h-43v42h43zM277 192v-43h-42v43h42zM405 107v298h-298v-298h298zM64 448h384v-384h-384v384zM363 277v-42h-43v42h43zM277 277v-42h-42v42h42zM277 363v-43h-42v43h42z" />
+    <glyph glyph-name="border_right" unicode="border_right" 
+d="M235 320v43h42v-43h-42zM235 405v43h42v-43h-42zM235 235v42h42v-42h-42zM320 405v43h43v-43h-43zM320 64v43h43v-43h-43zM405 448h43v-384h-43v384zM320 235v42h43v-42h-43zM235 149v43h42v-43h-42zM64 320v43h43v-43h-43zM64 149v43h43v-43h-43zM64 235v42h43v-42h-43z
+M235 64v43h42v-43h-42zM64 64v43h43v-43h-43zM149 235v42h43v-42h-43zM149 405v43h43v-43h-43zM64 405v43h43v-43h-43zM149 64v43h43v-43h-43z" />
+    <glyph glyph-name="border_style" unicode="border_style" 
+d="M405 320v43h43v-43h-43zM64 448h384v-43h-341v-341h-43v384zM405 235v42h43v-42h-43zM405 149v43h43v-43h-43zM235 64v43h42v-43h-42zM149 64v43h43v-43h-43zM405 64v43h43v-43h-43zM320 64v43h43v-43h-43z" />
+    <glyph glyph-name="border_top" unicode="border_top" 
+d="M320 235v42h43v-42h-43zM405 64v43h43v-43h-43zM235 320v43h42v-43h-42zM320 64v43h43v-43h-43zM405 149v43h43v-43h-43zM64 448h384v-43h-384v43zM405 235v42h43v-42h-43zM405 320v43h43v-43h-43zM235 149v43h42v-43h-42zM64 320v43h43v-43h-43zM64 235v42h43v-42h-43z
+M64 64v43h43v-43h-43zM64 149v43h43v-43h-43zM235 64v43h42v-43h-42zM235 235v42h42v-42h-42zM149 235v42h43v-42h-43zM149 64v43h43v-43h-43z" />
+    <glyph glyph-name="border_vertical" unicode="border_vertical" 
+d="M320 235v42h43v-42h-43zM320 64v43h43v-43h-43zM320 405v43h43v-43h-43zM405 320v43h43v-43h-43zM405 448h43v-43h-43v43zM405 235v42h43v-42h-43zM405 64v43h43v-43h-43zM235 64v384h42v-384h-42zM405 149v43h43v-43h-43zM149 405v43h43v-43h-43zM64 149v43h43v-43h-43z
+M64 64v43h43v-43h-43zM64 235v42h43v-42h-43zM149 235v42h43v-42h-43zM149 64v43h43v-43h-43zM64 405v43h43v-43h-43zM64 320v43h43v-43h-43z" />
+    <glyph glyph-name="branding_watermark" unicode="branding_watermark" 
+d="M448 107v128h-192v-128h192zM448 448c23 0 43 -20 43 -43v-298c0 -23 -20 -43 -43 -43h-384c-23 0 -43 20 -43 43v298c0 23 20 43 43 43h384z" />
+    <glyph glyph-name="brightness_1" unicode="brightness_&#x31;" 
+d="M43 256c0 118 95 213 213 213s213 -95 213 -213s-95 -213 -213 -213s-213 95 -213 213z" />
+    <glyph glyph-name="brightness_2" unicode="brightness_&#x32;" 
+d="M213 469c118 0 214 -95 214 -213s-96 -213 -214 -213c-39 0 -75 10 -106 28c64 37 106 106 106 185s-42 148 -106 185c31 18 67 28 106 28z" />
+    <glyph glyph-name="brightness_3" unicode="brightness_&#x33;" 
+d="M192 469c118 0 213 -95 213 -213s-95 -213 -213 -213c-22 0 -44 3 -64 9c87 27 149 108 149 204s-62 177 -149 204c20 6 42 9 64 9z" />
+    <glyph glyph-name="brightness_4" unicode="brightness_&#x34;" 
+d="M256 128c71 0 128 57 128 128s-57 128 -128 128c-19 0 -37 -5 -53 -12c44 -20 74 -64 74 -116s-30 -96 -74 -116c16 -7 34 -12 53 -12zM427 327l70 -71l-70 -71v-100h-100l-71 -70l-71 70h-100v100l-70 71l70 71v100h100l71 70l71 -70h100v-100z" />
+    <glyph glyph-name="brightness_5" unicode="brightness_&#x35;" 
+d="M256 128c71 0 128 57 128 128s-57 128 -128 128s-128 -57 -128 -128s57 -128 128 -128zM427 185v-100h-100l-71 -70l-71 70h-100v100l-70 71l70 71v100h100l71 70l71 -70h100v-100l70 -71z" />
+    <glyph glyph-name="brightness_6" unicode="brightness_&#x36;" 
+d="M256 128c71 0 128 57 128 128s-57 128 -128 128v-256zM427 185v-100h-100l-71 -70l-71 70h-100v100l-70 71l70 71v100h100l71 70l71 -70h100v-100l70 -71z" />
+    <glyph glyph-name="brightness_7" unicode="brightness_&#x37;" 
+d="M256 341c47 0 85 -38 85 -85s-38 -85 -85 -85s-85 38 -85 85s38 85 85 85zM256 128c71 0 128 57 128 128s-57 128 -128 128s-128 -57 -128 -128s57 -128 128 -128zM427 327l70 -71l-70 -71v-100h-100l-71 -70l-71 70h-100v100l-70 71l70 71v100h100l71 70l71 -70h100
+v-100z" />
+    <glyph glyph-name="brightness_auto" unicode="brightness_auto" 
+d="M305 171h41l-69 192h-42l-69 -192h41l15 42h68zM427 327l70 -71l-70 -71v-100h-100l-71 -70l-71 70h-100v100l-70 71l70 71v100h100l71 70l71 -70h100v-100zM231 242l25 78l25 -78h-50z" />
+    <glyph glyph-name="brightness_high" unicode="brightness_high" 
+d="M256 341c47 0 85 -38 85 -85s-38 -85 -85 -85s-85 38 -85 85s38 85 85 85zM256 128c71 0 128 57 128 128s-57 128 -128 128s-128 -57 -128 -128s57 -128 128 -128zM427 327l70 -71l-70 -71v-100h-100l-71 -70l-71 70h-100v100l-70 71l70 71v100h100l71 70l71 -70h100
+v-100z" />
+    <glyph glyph-name="brightness_low" unicode="brightness_low" 
+d="M256 128c71 0 128 57 128 128s-57 128 -128 128s-128 -57 -128 -128s57 -128 128 -128zM427 185v-100h-100l-71 -70l-71 70h-100v100l-70 71l70 71v100h100l71 70l71 -70h100v-100l70 -71z" />
+    <glyph glyph-name="brightness_medium" unicode="brightness_medium" 
+d="M256 128c71 0 128 57 128 128s-57 128 -128 128v-256zM427 185v-100h-100l-71 -70l-71 70h-100v100l-70 71l70 71v100h100l71 70l71 -70h100v-100l70 -71z" />
+    <glyph glyph-name="broken_image" unicode="broken_image" 
+d="M384 268l64 -64v-97c0 -23 -20 -43 -43 -43h-298c-23 0 -43 20 -43 43v140l64 -64l85 86l86 -86zM448 405v-140l-64 64l-85 -86l-86 86l-85 -86l-64 65v97c0 23 20 43 43 43h298c23 0 43 -20 43 -43z" />
+    <glyph glyph-name="brush" unicode="brush" 
+d="M442 413c8 -8 8 -22 0 -30l-191 -191l-59 59l191 191c8 8 22 8 30 0zM149 213c35 0 64 -29 64 -64c0 -47 -38 -85 -85 -85c-32 0 -65 17 -85 43c18 0 42 14 42 42c0 35 29 64 64 64z" />
+    <glyph glyph-name="bubble_chart" unicode="bubble_chart" 
+d="M222 324c0 57 45 103 102 103s103 -46 103 -103s-46 -102 -103 -102s-102 45 -102 102zM273 128c0 24 19 43 43 43s42 -19 42 -43s-18 -43 -42 -43s-43 19 -43 43zM85 205c0 38 31 68 69 68s68 -30 68 -68s-30 -68 -68 -68s-69 30 -69 68z" />
+    <glyph glyph-name="bug_report" unicode="bug_report" 
+d="M299 256v43h-86v-43h86zM299 171v42h-86v-42h86zM427 341v-42h-45c1 -7 2 -15 2 -22v-21h43v-43h-43v-21c0 -7 -1 -14 -2 -21h45v-43h-60c-22 -38 -64 -64 -111 -64s-89 26 -111 64h-60v43h45c-1 7 -2 14 -2 21v21h-43v43h43v21c0 7 1 15 2 22h-45v42h60
+c10 17 23 31 39 42l-35 35l30 30l47 -46c10 2 20 3 30 3s20 -1 30 -3l47 46l30 -30l-35 -35c16 -11 29 -25 39 -42h60z" />
+    <glyph glyph-name="build" unicode="build" 
+d="M484 107c9 -6 9 -21 -2 -30l-49 -49c-9 -9 -21 -9 -30 0l-194 194c-49 -19 -106 -9 -147 32c-43 43 -54 107 -28 158l94 -92l64 64l-92 92c51 23 115 15 158 -28c41 -41 51 -98 32 -147z" />
+    <glyph glyph-name="burst_mode" unicode="burst_mode" 
+d="M235 149h213l-68 90l-54 -68l-38 46zM469 405c12 0 22 -9 22 -21v-256c0 -12 -10 -21 -22 -21h-256c-12 0 -21 9 -21 21v256c0 12 9 21 21 21h256zM107 405h42v-298h-42v298zM21 405h43v-298h-43v298z" />
+    <glyph glyph-name="business" unicode="business" 
+d="M384 192v-43h-43v43h43zM384 277v-42h-43v42h43zM427 107v213h-171v-43h43v-42h-43v-43h43v-43h-43v-42h171zM213 363v42h-42v-42h42zM213 277v43h-42v-43h42zM213 192v43h-42v-43h42zM213 107v42h-42v-42h42zM128 363v42h-43v-42h43zM128 277v43h-43v-43h43zM128 192v43
+h-43v-43h43zM128 107v42h-43v-42h43zM256 363h213v-299h-426v384h213v-85z" />
+    <glyph glyph-name="business_center" unicode="business_center" 
+d="M299 363v42h-86v-42h86zM427 363c23 0 42 -20 42 -43v-64c0 -23 -19 -43 -42 -43h-128v43h-86v-43h-128c-24 0 -42 19 -42 43v64c0 23 19 43 42 43h85v42l43 43h85l43 -43v-42h86zM213 171h86v21h149v-85c0 -24 -19 -43 -43 -43h-298c-24 0 -43 19 -43 43v85h149v-21z
+" />
+    <glyph glyph-name="cached" unicode="cached" 
+d="M128 256h64l-85 -85l-86 85h64c0 94 77 171 171 171c33 0 65 -10 91 -27l-31 -31c-18 10 -38 15 -60 15c-71 0 -128 -57 -128 -128zM405 341l86 -85h-64c0 -94 -77 -171 -171 -171c-33 0 -65 10 -91 27l31 31c18 -10 38 -15 60 -15c71 0 128 57 128 128h-64z" />
+    <glyph glyph-name="cake" unicode="cake" 
+d="M384 320c35 0 64 -29 64 -64v-33c0 -23 -19 -42 -42 -42c-11 0 -21 4 -29 12l-46 46l-46 -46c-16 -16 -43 -16 -59 0l-45 46l-46 -46c-8 -8 -18 -12 -29 -12c-23 0 -42 19 -42 42v33c0 35 29 64 64 64h107v43h42v-43h107zM354 171c14 -14 32 -22 52 -22c16 0 30 5 42 13
+v-98c0 -12 -9 -21 -21 -21h-342c-12 0 -21 9 -21 21v98c12 -8 26 -13 42 -13c20 0 38 8 52 22l23 23l23 -23c28 -28 76 -28 104 0l23 23zM256 384c-23 0 -43 20 -43 43c0 8 3 16 7 22l36 63l36 -63c4 -6 7 -14 7 -22c0 -23 -19 -43 -43 -43z" />
+    <glyph glyph-name="call" unicode="call" 
+d="M141 282c31 -60 81 -110 141 -141l47 47c6 6 15 8 22 5c24 -8 50 -12 76 -12c12 0 21 -9 21 -21v-75c0 -12 -9 -21 -21 -21c-200 0 -363 163 -363 363c0 12 9 21 21 21h75c12 0 21 -9 21 -21c0 -27 4 -52 12 -76c2 -7 1 -16 -5 -22z" />
+    <glyph glyph-name="call_end" unicode="call_end" 
+d="M256 320c-34 0 -67 -5 -98 -15v-66c0 -8 -5 -17 -12 -20c-21 -10 -40 -23 -57 -39c-4 -4 -9 -6 -15 -6s-11 2 -15 6l-53 53c-4 4 -6 9 -6 15s2 11 6 15c65 62 153 100 250 100s185 -38 250 -100c4 -4 6 -9 6 -15s-2 -11 -6 -15l-53 -53c-4 -4 -9 -6 -15 -6s-11 2 -15 6
+c-17 16 -36 29 -57 39c-7 3 -12 10 -12 19v66c-31 10 -64 16 -98 16z" />
+    <glyph glyph-name="call_made" unicode="call_made" 
+d="M192 405h213v-213h-42v141l-248 -248l-30 30l248 248h-141v42z" />
+    <glyph glyph-name="call_merge" unicode="call_merge" 
+d="M160 341l96 96l96 -96h-75v-136l-128 -128l-30 30l116 115v119h-75zM363 77l-73 72l30 30l73 -72z" />
+    <glyph glyph-name="call_missed" unicode="call_missed" 
+d="M418 363l30 -30l-192 -192l-149 149v-98h-43v171h171v-43h-98l119 -119z" />
+    <glyph glyph-name="call_missed_outgoing" unicode="call_missed_outgoing" 
+d="M64 333l30 30l162 -162l119 119h-98v43h171v-171h-43v98l-149 -149z" />
+    <glyph glyph-name="call_received" unicode="call_received" 
+d="M427 397l-248 -248h141v-42h-213v213h42v-141l248 248z" />
+    <glyph glyph-name="call_split" unicode="call_split" 
+d="M213 427l-49 -49l113 -113v-180h-42v162l-101 101l-49 -49v128h128zM299 427h128v-128l-49 49l-62 -62l-30 30l62 62z" />
+    <glyph glyph-name="call_to_action" unicode="call_to_action" 
+d="M448 107v64h-384v-64h384zM448 448c23 0 43 -20 43 -43v-298c0 -23 -20 -43 -43 -43h-384c-23 0 -43 20 -43 43v298c0 23 20 43 43 43h384z" />
+    <glyph glyph-name="camera" unicode="camera" 
+d="M210 48c34.3543 59.3123 68.2469 119.086 103 178l78 -135c-37 -30 -84 -48 -135 -48c-16 0 -31 2 -46 5zM52 192h207l-79 -135c-61 23 -108 73 -128 135zM99 400c35.9996 -62.3337 71.7933 -124.873 108 -187h-160c-3 14 -4 28 -4 43c0 56 21 106 56 144zM465 299
+c3 -14 4 -28 4 -43c0 -56 -21 -106 -56 -144l-102 176l-6 11h160zM460 320h-207l79 135c61 -23 108 -73 128 -135zM201 288l-2 -2l-78 135c37 30 84 48 135 48c16 0 31 -2 46 -5z" />
+    <glyph glyph-name="camera_alt" unicode="camera_alt" 
+d="M256 149c59 0 107 48 107 107s-48 107 -107 107s-107 -48 -107 -107s48 -107 107 -107zM192 469h128l39 -42h68c23 0 42 -20 42 -43v-256c0 -23 -19 -43 -42 -43h-342c-23 0 -42 20 -42 43v256c0 23 19 43 42 43h68zM188 256c0 38 30 68 68 68s68 -30 68 -68
+s-30 -68 -68 -68s-68 30 -68 68z" />
+    <glyph glyph-name="camera_enhance" unicode="camera_enhance" 
+d="M256 149l-27 59l-58 27l58 26l27 59l27 -59l58 -26l-58 -27zM256 128c59 0 107 48 107 107s-48 106 -107 106s-107 -47 -107 -106s48 -107 107 -107zM192 448h128l39 -43h68c23 0 42 -19 42 -42v-256c0 -23 -19 -43 -42 -43h-342c-23 0 -42 20 -42 43v256
+c0 23 19 42 42 42h68z" />
+    <glyph glyph-name="camera_front" unicode="camera_front" 
+d="M149 469v-224c0 36 71 54 107 54s107 -18 107 -54v224h-214zM363 512c23 0 42 -20 42 -43v-298c0 -23 -19 -43 -42 -43h-150l64 -64l-64 -64v43h-106v42h106v43h-64c-23 0 -42 20 -42 43v298c0 23 19 43 42 43h214zM256 341c-23 0 -42 20 -42 43s19 43 42 43
+s43 -20 43 -43s-20 -43 -43 -43zM299 85h106v-42h-106v42z" />
+    <glyph glyph-name="camera_rear" unicode="camera_rear" 
+d="M256 384c23 0 42 20 42 43s-19 42 -42 42s-43 -19 -43 -42s19 -43 43 -43zM363 512c23 0 42 -20 42 -43v-298c0 -23 -19 -43 -42 -43h-150l64 -64l-64 -64v43h-106v42h106v43h-64c-23 0 -42 20 -42 43v298c0 23 19 43 42 43h214zM299 85h106v-42h-106v42z" />
+    <glyph glyph-name="camera_roll" unicode="camera_roll" 
+d="M427 320v43h-43v-43h43zM427 128v43h-43v-43h43zM341 320v43h-42v-43h42zM341 128v43h-42v-43h42zM256 320v43h-43v-43h43zM256 128v43h-43v-43h43zM299 405h170v-320h-170c0 -23 -20 -42 -43 -42h-171c-23 0 -42 19 -42 42v320c0 23 19 43 42 43h22v21c0 12 9 22 21 22
+h85c12 0 22 -10 22 -22v-21h21c23 0 43 -20 43 -43z" />
+    <glyph glyph-name="cancel" unicode="cancel" 
+d="M363 179l-77 77l77 77l-30 30l-77 -77l-77 77l-30 -30l77 -77l-77 -77l30 -30l77 77l77 -77zM256 469c118 0 213 -95 213 -213s-95 -213 -213 -213s-213 95 -213 213s95 213 213 213z" />
+    <glyph glyph-name="card_giftcard" unicode="card_giftcard" 
+d="M427 213v128h-109l45 -60l-35 -25c-24.0378 32.6288 -48.3187 65.0147 -72 98c-23.6829 -32.9837 -47.9614 -65.3719 -72 -98l-35 25l45 60h-109v-128h342zM427 107v42h-342v-42h342zM192 427c-12 0 -21 -10 -21 -22s9 -21 21 -21s21 9 21 21s-9 22 -21 22zM320 427
+c-12 0 -21 -10 -21 -22s9 -21 21 -21s21 9 21 21s-9 22 -21 22zM427 384c24 0 42 -19 42 -43v-234c0 -24 -18 -43 -42 -43h-342c-24 0 -42 19 -42 43v234c0 24 18 43 42 43h47c-2 7 -4 14 -4 21c0 35 29 64 64 64c22 0 41 -11 53 -28l11 -15l11 15c12 17 31 28 53 28
+c35 0 64 -29 64 -64c0 -7 -2 -14 -4 -21h47z" />
+    <glyph glyph-name="card_membership" unicode="card_membership" 
+d="M427 299v128h-342v-128h342zM427 192v43h-342v-43h342zM427 469c24 0 42 -18 42 -42v-235c0 -24 -18 -43 -42 -43h-86v-106l-85 42l-85 -42v106h-86c-24 0 -42 19 -42 43v235c0 24 18 42 42 42h342z" />
+    <glyph glyph-name="card_travel" unicode="card_travel" 
+d="M427 213v128h-64v-42h-43v42h-128v-42h-43v42h-64v-128h342zM427 107v42h-342v-42h342zM192 427v-43h128v43h-128zM427 384c24 0 42 -19 42 -43v-234c0 -24 -18 -43 -42 -43h-342c-24 0 -42 19 -42 43v234c0 24 18 43 42 43h64v43c0 24 19 42 43 42h128
+c24 0 43 -18 43 -42v-43h64z" />
+    <glyph glyph-name="casino" unicode="casino" 
+d="M352 320c18 0 32 14 32 32s-14 32 -32 32s-32 -14 -32 -32s14 -32 32 -32zM352 128c18 0 32 14 32 32s-14 32 -32 32s-32 -14 -32 -32s14 -32 32 -32zM256 224c18 0 32 14 32 32s-14 32 -32 32s-32 -14 -32 -32s14 -32 32 -32zM160 320c18 0 32 14 32 32s-14 32 -32 32
+s-32 -14 -32 -32s14 -32 32 -32zM160 128c18 0 32 14 32 32s-14 32 -32 32s-32 -14 -32 -32s14 -32 32 -32zM405 448c23 0 43 -20 43 -43v-298c0 -23 -20 -43 -43 -43h-298c-23 0 -43 20 -43 43v298c0 23 20 43 43 43h298z" />
+    <glyph glyph-name="cast" unicode="cast" 
+d="M21 299c129 0 235 -105 235 -235h-43c0 106 -86 192 -192 192v43zM21 213c83 0 150 -66 150 -149h-43c0 59 -48 107 -107 107v42zM21 128c35 0 64 -29 64 -64h-64v64zM448 448c23 0 43 -20 43 -43v-298c0 -23 -20 -43 -43 -43h-149v43h149v298h-384v-64h-43v64
+c0 23 20 43 43 43h384z" />
+    <glyph glyph-name="cast_connected" unicode="cast_connected" 
+d="M448 448c23 0 43 -20 43 -43v-298c0 -23 -20 -43 -43 -43h-149v43h149v298h-384v-64h-43v64c0 23 20 43 43 43h384zM21 299c129 0 235 -105 235 -235h-43c0 106 -86 192 -192 192v43zM405 363v-214h-120c-27 84 -94 152 -178 179v35h298zM21 213c83 0 150 -66 150 -149
+h-43c0 59 -48 107 -107 107v42zM21 128c35 0 64 -29 64 -64h-64v64z" />
+    <glyph glyph-name="center_focus_strong" unicode="center_focus_strong" 
+d="M405 107v85h43v-85c0 -23 -20 -43 -43 -43h-85v43h85zM405 448c23 0 43 -20 43 -43v-85h-43v85h-85v43h85zM107 405v-85h-43v85c0 23 20 43 43 43h85v-43h-85zM107 192v-85h85v-43h-85c-23 0 -43 20 -43 43v85h43zM256 341c47 0 85 -38 85 -85s-38 -85 -85 -85
+s-85 38 -85 85s38 85 85 85z" />
+    <glyph glyph-name="center_focus_weak" unicode="center_focus_weak" 
+d="M256 213c23 0 43 20 43 43s-20 43 -43 43s-43 -20 -43 -43s20 -43 43 -43zM256 341c47 0 85 -38 85 -85s-38 -85 -85 -85s-85 38 -85 85s38 85 85 85zM405 107v85h43v-85c0 -23 -20 -43 -43 -43h-85v43h85zM405 448c23 0 43 -20 43 -43v-85h-43v85h-85v43h85zM107 405
+v-85h-43v85c0 23 20 43 43 43h85v-43h-85zM107 192v-85h85v-43h-85c-23 0 -43 20 -43 43v85h43z" />
+    <glyph glyph-name="change_history" unicode="change_history" 
+d="M256 427l213 -342h-426zM256 346l-136 -218h272z" />
+    <glyph glyph-name="chat" unicode="chat" 
+d="M384 341v43h-256v-43h256zM299 213v43h-171v-43h171zM128 320v-43h256v43h-256zM427 469c23 0 42 -19 42 -42v-256c0 -23 -19 -43 -42 -43h-299l-85 -85v384c0 23 19 42 42 42h342z" />
+    <glyph glyph-name="chat_bubble" unicode="chat_bubble" 
+d="M427 469c23 0 42 -19 42 -42v-256c0 -23 -19 -43 -42 -43h-299l-85 -85v384c0 23 19 42 42 42h342z" />
+    <glyph glyph-name="chat_bubble_outline" unicode="chat_bubble_outline" 
+d="M427 171v256h-342v-299l43 43h299zM427 469c23 0 42 -19 42 -42v-256c0 -23 -19 -43 -42 -43h-299l-85 -85v384c0 23 19 42 42 42h342z" />
+    <glyph glyph-name="check" unicode="check" 
+d="M192 167l226 226l30 -30l-256 -256l-119 119l30 30z" />
+    <glyph glyph-name="check_box" unicode="check_box" 
+d="M213 149l192 192l-30 31l-162 -162l-76 76l-30 -30zM405 448c24 0 43 -20 43 -43v-298c0 -23 -19 -43 -43 -43h-298c-24 0 -43 20 -43 43v298c0 23 19 43 43 43h298z" />
+    <glyph glyph-name="check_box_outline_blank" unicode="check_box_outline_blank" 
+d="M405 448c23 0 43 -20 43 -43v-298c0 -23 -20 -43 -43 -43h-298c-23 0 -43 20 -43 43v298c0 23 20 43 43 43h298zM405 405h-298v-298h298v298z" />
+    <glyph glyph-name="check_circle" unicode="check_circle" 
+d="M213 149l192 192l-30 31l-162 -162l-76 76l-30 -30zM256 469c118 0 213 -95 213 -213s-95 -213 -213 -213s-213 95 -213 213s95 213 213 213z" />
+    <glyph glyph-name="chevron_left" unicode="chevron_left" 
+d="M329 354l-98 -98l98 -98l-30 -30l-128 128l128 128z" />
+    <glyph glyph-name="chevron_right" unicode="chevron_right" 
+d="M213 384l128 -128l-128 -128l-30 30l98 98l-98 98z" />
+    <glyph glyph-name="child_care" unicode="child_care" 
+d="M160 213h192c-16 -38 -53 -64 -96 -64s-80 26 -96 64zM256 107c68.0018 0 125.232 44.8128 143 107c2 0 4 -1 6 -1c23 0 43 20 43 43s-20 43 -43 43c-2 0 -4 -1 -6 -1c-17.7643 62.1749 -74.9972 107 -143 107c-68.0018 0 -125.232 -44.8128 -143 -107c-2 0 -4 1 -6 1
+c-23 0 -43 -20 -43 -43s20 -43 43 -43c2 0 4 1 6 1c17.7643 -62.1749 74.9972 -107 143 -107zM489 242c-5 -32 -28 -59 -59 -68c-28.2678 -59.1055 -94.8338 -110 -174 -110c-78.8834 0 -145.522 50.0487 -173 110c-31 9 -55 36 -60 68c-1 4 -2 9 -2 14s1 10 2 14
+c5 32 29 59 60 68c11 24 26 45 46 62c34 30 78 48 127 48c80.292 0 145.109 -49.147 173 -110c31 -9 55 -36 60 -68c1 -4 2 -9 2 -14s-1 -10 -2 -14zM176 288c0 15 12 27 27 27s26 -12 26 -27s-11 -27 -26 -27s-27 12 -27 27zM283 288c0 15 11 27 26 27s27 -12 27 -27
+s-12 -27 -27 -27s-26 12 -26 27z" />
+    <glyph glyph-name="child_friendly" unicode="child_friendly" 
+d="M363 85c18 0 32 14 32 32s-14 32 -32 32s-32 -14 -32 -32s14 -32 32 -32zM171 85c18 0 32 14 32 32s-14 32 -32 32s-32 -14 -32 -32s14 -32 32 -32zM412 173c15 -14 25 -34 25 -56c0 -41 -33 -74 -74 -74c-38 0 -69 28 -74 64h-45c-5 -36 -35 -64 -73 -64
+c-41 0 -75 33 -75 74c0 28 16 53 39 66c-5 7 -45 94 -45 94h-47v43h74l20 -43h311c0 -39 -14 -75 -36 -104zM277 469c94 0 171 -76 171 -170h-171v170z" />
+    <glyph glyph-name="chrome_reader_mode" unicode="chrome_reader_mode" 
+d="M448 107v277h-192v-277h192zM448 427c23 0 43 -20 43 -43v-277c0 -23 -20 -43 -43 -43h-384c-23 0 -43 20 -43 43v277c0 23 20 43 43 43h384zM277 203h150v-32h-150v32zM277 309h150v-32h-150v32zM277 256h150v-32h-150v32z" />
+    <glyph glyph-name="class" unicode="class" 
+d="M128 427v-171l53 32l54 -32v171h-107zM384 469c23 0 43 -19 43 -42v-342c0 -23 -20 -42 -43 -42h-256c-23 0 -43 19 -43 42v342c0 23 20 42 43 42h256z" />
+    <glyph glyph-name="clear" unicode="clear" 
+d="M405 375l-119 -119l119 -119l-30 -30l-119 119l-119 -119l-30 30l119 119l-119 119l30 30l119 -119l119 119z" />
+    <glyph glyph-name="clear_all" unicode="clear_all" 
+d="M149 363h299v-43h-299v43zM64 149v43h299v-43h-299zM107 235v42h298v-42h-298z" />
+    <glyph glyph-name="close" unicode="close" 
+d="M405 375l-119 -119l119 -119l-30 -30l-119 119l-119 -119l-30 30l119 119l-119 119l30 30l119 -119l119 119z" />
+    <glyph glyph-name="closed_caption" unicode="closed_caption" 
+d="M384 277v22c0 12 -9 21 -21 21h-64c-12 0 -22 -9 -22 -21v-86c0 -12 10 -21 22 -21h64c12 0 21 9 21 21v22h-32v-11h-43v64h43v-11h32zM235 277v22c0 12 -10 21 -22 21h-64c-12 0 -21 -9 -21 -21v-86c0 -12 9 -21 21 -21h64c12 0 22 9 22 21v22h-32v-11h-43v64h43v-11h32
+zM405 427c23 0 43 -20 43 -43v-256c0 -23 -20 -43 -43 -43h-298c-24 0 -43 20 -43 43v256c0 23 19 43 43 43h298z" />
+    <glyph glyph-name="cloud" unicode="cloud" 
+d="M413 298c55 -4 99 -50 99 -106c0 -59 -48 -107 -107 -107h-277c-71 0 -128 57 -128 128c0 66 50 120 114 127c27 51 80 87 142 87c78 0 142 -55 157 -129z" />
+    <glyph glyph-name="cloud_circle" unicode="cloud_circle" 
+d="M352 171c29 0 53 24 53 53s-24 53 -53 53h-11c0 47 -38 86 -85 86c-40 0 -73 -28 -82 -65l-3 1c-35 0 -64 -29 -64 -64s29 -64 64 -64h181zM256 469c118 0 213 -95 213 -213s-95 -213 -213 -213s-213 95 -213 213s95 213 213 213z" />
+    <glyph glyph-name="cloud_done" unicode="cloud_done" 
+d="M213 149l141 141l-30 30l-111 -110l-44 44l-30 -30zM413 298c55 -4 99 -50 99 -106c0 -59 -48 -107 -107 -107h-277c-71 0 -128 57 -128 128c0 66 50 120 114 127c27 51 80 87 142 87c78 0 142 -55 157 -129z" />
+    <glyph glyph-name="cloud_download" unicode="cloud_download" 
+d="M363 235h-64v85h-86v-85h-64l107 -107zM413 298c55 -4 99 -50 99 -106c0 -59 -48 -107 -107 -107h-277c-71 0 -128 57 -128 128c0 66 50 120 114 127c27 51 80 87 142 87c78 0 142 -55 157 -129z" />
+    <glyph glyph-name="cloud_off" unicode="cloud_off" 
+d="M165 299h-37c-47 0 -85 -39 -85 -86s38 -85 85 -85h208zM64 400l27 27l357 -357l-27 -27l-43 42h-250c-71 0 -128 57 -128 128c0 69 55 125 123 128zM413 298c55 -4 99 -50 99 -106c0 -36 -18 -68 -45 -87l-31 31c20 11 33 32 33 56c0 35 -29 64 -64 64h-32v11
+c0 65 -52 117 -117 117c-20 0 -38 -4 -54 -13l-32 31c25 16 54 25 86 25c78 0 142 -55 157 -129z" />
+    <glyph glyph-name="cloud_queue" unicode="cloud_queue" 
+d="M405 128c35 0 64 29 64 64s-29 64 -64 64h-32v11c0 65 -52 117 -117 117c-54 0 -99 -36 -113 -85h-15c-47 0 -85 -39 -85 -86s38 -85 85 -85h277zM413 298c55 -4 99 -50 99 -106c0 -59 -48 -107 -107 -107h-277c-71 0 -128 57 -128 128c0 66 50 120 114 127
+c27 51 80 87 142 87c78 0 142 -55 157 -129z" />
+    <glyph glyph-name="cloud_upload" unicode="cloud_upload" 
+d="M299 235h64l-107 106l-107 -106h64v-86h86v86zM413 298c55 -4 99 -50 99 -106c0 -59 -48 -107 -107 -107h-277c-71 0 -128 57 -128 128c0 66 50 120 114 127c27 51 80 87 142 87c78 0 142 -55 157 -129z" />
+    <glyph glyph-name="code" unicode="code" 
+d="M311 158l99 98l-99 98l30 30l128 -128l-128 -128zM201 158l-30 -30l-128 128l128 128l30 -30l-99 -98z" />
+    <glyph glyph-name="collections" unicode="collections" 
+d="M43 384h42v-299h299v-42h-299c-23 0 -42 19 -42 42v299zM235 256l-64 -85h256l-86 106l-63 -79zM469 171c0 -23 -19 -43 -42 -43h-256c-23 0 -43 20 -43 43v256c0 23 20 42 43 42h256c23 0 42 -19 42 -42v-256z" />
+    <glyph glyph-name="collections_bookmark" unicode="collections_bookmark" 
+d="M427 256v171h-107v-171l53 32zM427 469c23 0 42 -19 42 -42v-256c0 -23 -19 -43 -42 -43h-256c-23 0 -43 20 -43 43v256c0 23 20 42 43 42h256zM85 384v-299h299v-42h-299c-23 0 -42 19 -42 42v299h42z" />
+    <glyph glyph-name="color_lens" unicode="color_lens" 
+d="M373 256c18 0 32 14 32 32s-14 32 -32 32s-32 -14 -32 -32s14 -32 32 -32zM309 341c18 0 32 14 32 32s-14 32 -32 32s-32 -14 -32 -32s14 -32 32 -32zM203 341c18 0 32 14 32 32s-14 32 -32 32s-32 -14 -32 -32s14 -32 32 -32zM139 256c18 0 32 14 32 32s-14 32 -32 32
+s-32 -14 -32 -32s14 -32 32 -32zM256 448c106 0 192 -77 192 -171c0 -59 -48 -106 -107 -106h-37c-18 0 -32 -14 -32 -32c0 -8 3 -15 8 -21s8 -14 8 -22c0 -18 -14 -32 -32 -32c-106 0 -192 86 -192 192s86 192 192 192z" />
+    <glyph glyph-name="colorize" unicode="colorize" 
+d="M148 107l172 172l-41 41l-172 -172zM442 392c8 -8 9 -21 0 -30l-67 -67l41 -41l-30 -30l-30 30l-191 -190h-101v101l190 191l-30 30l30 30l41 -41l67 67c8 8 22 8 30 0z" />
+    <glyph glyph-name="comment" unicode="comment" 
+d="M384 341v43h-256v-43h256zM384 277v43h-256v-43h256zM384 213v43h-256v-43h256zM469 427v-384l-85 85h-299c-23 0 -42 20 -42 43v256c0 23 19 42 42 42h342c23 0 42 -19 42 -42z" />
+    <glyph glyph-name="compare" unicode="compare" 
+d="M405 448c23 0 43 -20 43 -43v-298c0 -23 -20 -43 -43 -43h-106v192l106 -128v277h-106v43h106zM213 128v128l-106 -128h106zM213 448v43h43v-470h-43v43h-106c-23 0 -43 20 -43 43v298c0 23 20 43 43 43h106z" />
+    <glyph glyph-name="compare_arrows" unicode="compare_arrows" 
+d="M320 235l-85 85l85 85v-64h149v-42h-149v-64zM192 213v64l85 -85l-85 -85v64h-149v42h149z" />
+    <glyph glyph-name="computer" unicode="computer" 
+d="M85 384v-213h342v213h-342zM427 128h85v-43h-512v43h85c-23 0 -42 20 -42 43v213c0 23 19 43 42 43h342c23 0 42 -20 42 -43v-213c0 -23 -19 -43 -42 -43z" />
+    <glyph glyph-name="confirmation_number" unicode="confirmation_number" 
+d="M277 331v42h-42v-42h42zM277 235v42h-42v-42h42zM277 139v42h-42v-42h42zM469 299c-23 0 -42 -20 -42 -43s19 -43 42 -43v-85c0 -23 -19 -43 -42 -43h-342c-23 0 -42 20 -42 43v85c24 0 42 20 42 43s-19 43 -42 43v85c0 24 19 43 42 43h342c23 0 42 -19 42 -43v-85z" />
+    <glyph glyph-name="contact_mail" unicode="contact_mail" 
+d="M469 256v128h-170v-128h170zM299 128v21c0 43 -85 66 -128 66s-128 -23 -128 -66v-21h256zM171 384c-35 0 -64 -29 -64 -64s29 -64 64 -64s64 29 64 64s-29 64 -64 64zM469 448c23 0 43 -20 43 -43v-298c0 -23 -20 -43 -43 -43h-426c-23 0 -43 20 -43 43v298
+c0 23 20 43 43 43h426zM448 341l-64 -42l-64 42v22l64 -43l64 43v-22z" />
+    <glyph glyph-name="contact_phone" unicode="contact_phone" 
+d="M381 213c-5 13 -8 28 -8 43s3 30 8 43h35l32 42l-42 43c-28 -21 -49 -50 -59 -85c-4 -14 -6 -28 -6 -43s2 -29 6 -43c10 -34 31 -64 59 -85l42 43l-32 42h-35zM299 128v21c0 43 -85 66 -128 66s-128 -23 -128 -66v-21h256zM171 384c-35 0 -64 -29 -64 -64s29 -64 64 -64
+s64 29 64 64s-29 64 -64 64zM469 448c23 0 43 -20 43 -43v-298c0 -23 -20 -43 -43 -43h-426c-23 0 -43 20 -43 43v298c0 23 20 43 43 43h426z" />
+    <glyph glyph-name="contacts" unicode="contacts" 
+d="M363 149v32c0 36 -71 54 -107 54s-107 -18 -107 -54v-32h214zM256 368c-26 0 -48 -22 -48 -48s22 -48 48 -48s48 22 48 48s-22 48 -48 48zM427 427c23 0 42 -20 42 -43v-256c0 -23 -19 -43 -42 -43h-342c-23 0 -42 20 -42 43v256c0 23 19 43 42 43h342zM85 0v43h342v-43
+h-342zM427 512v-43h-342v43h342z" />
+    <glyph glyph-name="content_copy" unicode="content_copy" 
+d="M405 64v299h-234v-299h234zM405 405c23 0 43 -19 43 -42v-299c0 -23 -20 -43 -43 -43h-234c-23 0 -43 20 -43 43v299c0 23 20 42 43 42h234zM341 491v-43h-256v-299h-42v299c0 23 19 43 42 43h256z" />
+    <glyph glyph-name="content_cut" unicode="content_cut" 
+d="M405 448h64v-21l-149 -150l-43 43zM256 245c6 0 11 5 11 11s-5 11 -11 11s-11 -5 -11 -11s5 -11 11 -11zM128 85c23 0 43 19 43 43s-20 43 -43 43s-43 -19 -43 -43s20 -43 43 -43zM128 341c23 0 43 19 43 43s-20 43 -43 43s-43 -19 -43 -43s20 -43 43 -43zM206 349
+l263 -264v-21h-64l-149 149l-50 -50c5 -11 7 -22 7 -35c0 -47 -38 -85 -85 -85s-85 38 -85 85s38 85 85 85c13 0 24 -2 35 -7l50 50l-50 50c-11 -5 -22 -7 -35 -7c-47 0 -85 38 -85 85s38 85 85 85s85 -38 85 -85c0 -13 -2 -24 -7 -35z" />
+    <glyph glyph-name="content_paste" unicode="content_paste" 
+d="M405 85v342h-42v-64h-214v64h-42v-342h298zM256 469c-12 0 -21 -9 -21 -21s9 -21 21 -21s21 9 21 21s-9 21 -21 21zM405 469c23 0 43 -19 43 -42v-342c0 -23 -20 -42 -43 -42h-298c-23 0 -43 19 -43 42v342c0 23 20 42 43 42h89c9 25 32 43 60 43s51 -18 60 -43h89z" />
+    <glyph glyph-name="control_point" unicode="control_point" 
+d="M256 85c94 0 171 77 171 171s-77 171 -171 171s-171 -77 -171 -171s77 -171 171 -171zM256 469c118 0 213 -95 213 -213s-95 -213 -213 -213s-213 95 -213 213s95 213 213 213zM277 363v-86h86v-42h-86v-86h-42v86h-86v42h86v86h42z" />
+    <glyph glyph-name="control_point_duplicate" unicode="control_point_duplicate" 
+d="M320 107c82 0 149 67 149 149s-67 149 -149 149s-149 -67 -149 -149s67 -149 149 -149zM320 448c106 0 192 -86 192 -192s-86 -192 -192 -192s-192 86 -192 192s86 192 192 192zM43 256c0 -60 34 -111 85 -135v-46c-74 26 -128 98 -128 181s54 155 128 181v-46
+c-51 -24 -85 -75 -85 -135zM341 341v-64h64v-42h-64v-64h-42v64h-64v42h64v64h42z" />
+    <glyph glyph-name="copyright" unicode="copyright" 
+d="M256 85c94 0 171 77 171 171s-77 171 -171 171s-171 -77 -171 -171s77 -171 171 -171zM256 469c118 0 213 -95 213 -213s-95 -213 -213 -213s-213 95 -213 213s95 213 213 213zM253 317c-30.7612 0 -40 -27.2286 -40 -58v-6c0 -30.7691 9.25381 -58 40 -58
+c18.7788 0 35 11.4624 35 30h38c0 -19.5209 -10.5691 -34.2021 -22 -44c-12.8931 -11.0512 -27.9049 -18 -51 -18c-54.5845 0 -82 36.0734 -82 90v6c0 25.8562 7.26023 49.4403 20 64c13.1991 15.0847 34.3422 27 62 27c22.1368 0 40.6281 -7.62806 52 -19
+c11.0024 -11.0024 21 -27.9871 21 -49h-38c0 5 -1 9 -3 13s-4 9 -7 12c-5.41728 5.41728 -14.6761 10 -25 10z" />
+    <glyph glyph-name="create" unicode="create" 
+d="M442 362l-39 -39l-80 80l39 39c8 8 22 8 30 0l50 -50c8 -8 8 -22 0 -30zM64 144l236 236l80 -80l-236 -236h-80v80z" />
+    <glyph glyph-name="create_new_folder" unicode="create_new_folder" 
+d="M405 213v43h-64v64h-42v-64h-64v-43h64v-64h42v64h64zM427 384c24 0 42 -19 42 -43v-213c0 -24 -18 -43 -42 -43h-342c-24 0 -42 19 -42 43v256c0 24 18 43 42 43h128l43 -43h171z" />
+    <glyph glyph-name="credit_card" unicode="credit_card" 
+d="M427 341v43h-342v-43h342zM427 128v128h-342v-128h342zM427 427c24 0 42 -19 42 -43v-256c0 -24 -18 -43 -42 -43h-342c-24 0 -42 19 -42 43v256c0 24 18 43 42 43h342z" />
+    <glyph glyph-name="crop" unicode="crop" 
+d="M149 149h342v-42h-86v-86h-42v86h-214c-23 0 -42 19 -42 42v214h-86v42h86v86h42v-342zM363 192v171h-171v42h171c23 0 42 -19 42 -42v-171h-42z" />
+    <glyph glyph-name="crop_16_9" unicode="crop_&#x31;&#x36;_&#x39;" 
+d="M405 171v170h-298v-170h298zM405 384c23 0 43 -20 43 -43v-170c0 -23 -20 -43 -43 -43h-298c-23 0 -43 20 -43 43v170c0 23 20 43 43 43h298z" />
+    <glyph glyph-name="crop_3_2" unicode="crop_&#x33;_&#x32;" 
+d="M405 128v256h-298v-256h298zM405 427c23 0 43 -20 43 -43v-256c0 -23 -20 -43 -43 -43h-298c-23 0 -43 20 -43 43v256c0 23 20 43 43 43h298z" />
+    <glyph glyph-name="crop_5_4" unicode="crop_&#x35;_&#x34;" 
+d="M405 149v214h-298v-214h298zM405 405c23 0 43 -19 43 -42v-214c0 -23 -20 -42 -43 -42h-298c-23 0 -43 19 -43 42v214c0 23 20 42 43 42h298z" />
+    <glyph glyph-name="crop_7_5" unicode="crop_&#x37;_&#x35;" 
+d="M405 192v128h-298v-128h298zM405 363c23 0 43 -20 43 -43v-128c0 -23 -20 -43 -43 -43h-298c-23 0 -43 20 -43 43v128c0 23 20 43 43 43h298z" />
+    <glyph glyph-name="crop_din" unicode="crop_din" 
+d="M405 107v298h-298v-298h298zM405 448c23 0 43 -20 43 -43v-298c0 -23 -20 -43 -43 -43h-298c-23 0 -43 20 -43 43v298c0 23 20 43 43 43h298z" />
+    <glyph glyph-name="crop_free" unicode="crop_free" 
+d="M405 448c23 0 43 -20 43 -43v-85h-43v85h-85v43h85zM405 107v85h43v-85c0 -23 -20 -43 -43 -43h-85v43h85zM107 192v-85h85v-43h-85c-23 0 -43 20 -43 43v85h43zM64 405c0 23 20 43 43 43h85v-43h-85v-85h-43v85z" />
+    <glyph glyph-name="crop_landscape" unicode="crop_landscape" 
+d="M405 149v214h-298v-214h298zM405 405c23 0 43 -19 43 -42v-214c0 -23 -20 -42 -43 -42h-298c-23 0 -43 19 -43 42v214c0 23 20 42 43 42h298z" />
+    <glyph glyph-name="crop_original" unicode="crop_original" 
+d="M298 250l75 -101h-234l58 76l42 -51zM405 107v298h-298v-298h298zM405 448c23 0 43 -20 43 -43v-298c0 -23 -20 -43 -43 -43h-298c-23 0 -43 20 -43 43v298c0 23 20 43 43 43h298z" />
+    <glyph glyph-name="crop_portrait" unicode="crop_portrait" 
+d="M363 107v298h-214v-298h214zM363 448c23 0 42 -20 42 -43v-298c0 -23 -19 -43 -42 -43h-214c-23 0 -42 20 -42 43v298c0 23 19 43 42 43h214z" />
+    <glyph glyph-name="crop_rotate" unicode="crop_rotate" 
+d="M171 171h256v-43h-43v-43h-43v43h-170c-24 0 -43 20 -43 43v170h-43v43h43v43h43v-256zM341 213v128h-128v43h128c23 0 43 -19 43 -43v-128h-43zM257 512c134 0 244 -104 255 -235h-32c-8 80 -57 148 -127 181l-29 -28l-81 81c5 0 9 1 14 1zM159 54l29 28l81 -81
+c-5 0 -9 -1 -14 -1c-134 0 -244 104 -255 235h32c8 -80 57 -148 127 -181z" />
+    <glyph glyph-name="crop_square" unicode="crop_square" 
+d="M384 128v256h-256v-256h256zM384 427c23 0 43 -20 43 -43v-256c0 -23 -20 -43 -43 -43h-256c-23 0 -43 20 -43 43v256c0 23 20 43 43 43h256z" />
+    <glyph glyph-name="dashboard" unicode="dashboard" 
+d="M277 448h171v-128h-171v128zM277 64v213h171v-213h-171zM64 64v128h171v-128h-171zM64 235v213h171v-213h-171z" />
+    <glyph glyph-name="data_usage" unicode="data_usage" 
+d="M256 107c47 0 89 22 116 56l56 -33c-39 -53 -101 -87 -172 -87c-118 0 -213 95 -213 213c0 111 84 201 192 212v-64c-72 -10 -128 -73 -128 -148c0 -83 66 -149 149 -149zM277 468c108 -11 192 -101 192 -212c0 -31 -6 -61 -18 -87l-56 33c6 17 10 35 10 54
+c0 75 -56 138 -128 148v64z" />
+    <glyph glyph-name="date_range" unicode="date_range" 
+d="M405 85v235h-298v-235h298zM405 427c23 0 43 -20 43 -43v-299c0 -23 -20 -42 -43 -42h-298c-24 0 -43 19 -43 42v299c0 23 19 43 43 43h21v42h43v-42h170v42h43v-42h21zM363 277v-42h-43v42h43zM277 277v-42h-42v42h42zM192 277v-42h-43v42h43z" />
+    <glyph glyph-name="dehaze" unicode="dehaze" 
+d="M43 395h426v-43h-426v43zM43 288h426v-43h-426v43zM43 181h426v-42h-426v42z" />
+    <glyph glyph-name="delete" unicode="delete" 
+d="M405 427v-43h-298v43h74l22 21h106l22 -21h74zM128 107v256h256v-256c0 -23 -20 -43 -43 -43h-170c-23 0 -43 20 -43 43z" />
+    <glyph glyph-name="delete_forever" unicode="delete_forever" 
+d="M331 427h74v-43h-298v43h74l22 21h106zM180 259l46 -46l-45 -45l30 -30l45 45l45 -45l30 30l-45 45l45 46l-30 30l-45 -46l-45 46zM128 107v256h256v-256c0 -23 -20 -43 -43 -43h-170c-23 0 -43 20 -43 43z" />
+    <glyph glyph-name="delete_sweep" unicode="delete_sweep" 
+d="M299 405v-42h-256v42h64l21 22h85l22 -22h64zM64 128v213h213v-213c0 -23 -19 -43 -42 -43h-128c-23 0 -43 20 -43 43zM320 256h128v-43h-128v43zM320 341h149v-42h-149v42zM320 171h85v-43h-85v43z" />
+    <glyph glyph-name="description" unicode="description" 
+d="M277 320h118l-118 117v-117zM341 213v43h-170v-43h170zM341 128v43h-170v-43h170zM299 469l128 -128v-256c0 -23 -20 -42 -43 -42h-256c-23 0 -43 19 -43 42l1 342c0 23 19 42 42 42h171z" />
+    <glyph glyph-name="desktop_mac" unicode="desktop_mac" 
+d="M448 213v214h-384v-214h384zM448 469c23 0 43 -19 43 -42v-256c0 -23 -20 -43 -43 -43h-149l42 -64v-21h-170v21l42 64h-149c-23 0 -43 20 -43 43v256c0 23 20 42 43 42h384z" />
+    <glyph glyph-name="desktop_windows" unicode="desktop_windows" 
+d="M448 171v256h-384v-256h384zM448 469c23 0 43 -19 43 -42v-256c0 -23 -20 -43 -43 -43h-149v-43h42v-42h-170v42h42v43h-149c-23 0 -43 20 -43 43v256c0 23 20 42 43 42h384z" />
+    <glyph glyph-name="details" unicode="details" 
+d="M136 384l120 -213l120 213h-240zM64 427h384l-192 -342z" />
+    <glyph glyph-name="developer_board" unicode="developer_board" 
+d="M256 277h85v-128h-85v128zM128 363h107v-107h-107v107zM256 363h85v-64h-85v64zM128 235h107v-86h-107v86zM384 107v298h-299v-298h299zM469 320h-42v-43h42v-42h-42v-43h42v-43h-42v-42c0 -23 -20 -43 -43 -43h-299c-23 0 -42 20 -42 43v298c0 23 19 43 42 43h299
+c23 0 43 -20 43 -43v-42h42v-43z" />
+    <glyph glyph-name="developer_mode" unicode="developer_mode" 
+d="M363 107v42h42v-85c0 -23 -19 -43 -42 -43h-214c-23 0 -42 20 -42 43v85h42v-42h214zM213 188l-30 -30l-98 98l98 98l30 -30l-67 -68zM329 158l-30 30l67 68l-67 68l30 30l98 -98zM149 405v-42h-42v85c0 23 19 43 42 43l214 -1c23 0 42 -19 42 -42v-85h-42v42h-214z" />
+    <glyph glyph-name="device_hub" unicode="device_hub" 
+d="M363 171h85v-107h-107v65l-85 90l-85 -90v-65h-107v107h85l86 85v68c-25 9 -43 32 -43 60c0 35 29 64 64 64s64 -29 64 -64c0 -28 -18 -51 -43 -60v-68z" />
+    <glyph glyph-name="devices" unicode="devices" 
+d="M469 149v150h-85v-150h85zM491 341c12 0 21 -9 21 -21v-213c0 -12 -9 -22 -21 -22h-128c-12 0 -22 10 -22 22v213c0 12 10 21 22 21h128zM85 384v-235h214v-64h-299v64h43v235c0 23 19 43 42 43h384v-43h-384z" />
+    <glyph glyph-name="devices_other" unicode="devices_other" 
+d="M448 128v171h-85v-171h85zM469 341c11 0 22 -10 22 -21v-213c0 -11 -11 -22 -22 -22h-128c-11 0 -21 11 -21 22v213c0 11 10 21 21 21h128zM235 139c18 0 32 14 32 32s-14 32 -32 32s-32 -14 -32 -32s14 -32 32 -32zM277 256v-38c13 -12 22 -28 22 -47s-9 -36 -22 -48
+v-38h-85v38c-13 12 -21 29 -21 48s8 35 21 47v38h85zM64 384v-256h85v-43h-85c-23 0 -43 20 -43 43v256c0 23 20 43 43 43h384v-43h-384z" />
+    <glyph glyph-name="dialer_sip" unicode="dialer_sip" 
+d="M427 181c12 0 21 -9 21 -21v-75c0 -12 -9 -21 -21 -21c-200 0 -363 163 -363 363c0 12 9 21 21 21h75c12 0 21 -9 21 -21c0 -27 4 -52 12 -76c2 -7 1 -16 -5 -22l-47 -47c31 -61 81 -110 141 -141l47 47c6 6 15 7 22 5c24 -8 49 -12 76 -12zM427 405v22h-22v-22h22z
+M384 448h64v-64h-43v-43h-21v107zM320 405v-64h-64v22h43v21h-43v64h64v-21h-43v-22h43zM363 448v-107h-22v107h22z" />
+    <glyph glyph-name="dialpad" unicode="dialpad" 
+d="M256 491c23 0 43 -20 43 -43s-20 -43 -43 -43s-43 20 -43 43s20 43 43 43zM256 363c23 0 43 -20 43 -43s-20 -43 -43 -43s-43 20 -43 43s20 43 43 43zM384 363c23 0 43 -20 43 -43s-20 -43 -43 -43s-43 20 -43 43s20 43 43 43zM384 235c23 0 43 -20 43 -43
+s-20 -43 -43 -43s-43 20 -43 43s20 43 43 43zM256 235c23 0 43 -20 43 -43s-20 -43 -43 -43s-43 20 -43 43s20 43 43 43zM384 405c-23 0 -43 20 -43 43s20 43 43 43s43 -20 43 -43s-20 -43 -43 -43zM128 235c23 0 43 -20 43 -43s-20 -43 -43 -43s-43 20 -43 43s20 43 43 43z
+M128 363c23 0 43 -20 43 -43s-20 -43 -43 -43s-43 20 -43 43s20 43 43 43zM128 491c23 0 43 -20 43 -43s-20 -43 -43 -43s-43 20 -43 43s20 43 43 43zM256 107c23 0 43 -20 43 -43s-20 -43 -43 -43s-43 20 -43 43s20 43 43 43z" />
+    <glyph glyph-name="directions" unicode="directions" 
+d="M299 203l74 74l-74 75v-53h-107c-12 0 -21 -10 -21 -22v-85h42v64h86v-53zM463 271c8 -9 8 -22 0 -30l-192 -192c-8 -8 -22 -8 -30 0l-192 192c-8 8 -8 22 0 30l192 192c8 8 22 8 30 0z" />
+    <glyph glyph-name="directions_bike" unicode="directions_bike" 
+d="M405 75c41 0 75 33 75 74s-34 75 -75 75s-74 -34 -74 -75s33 -74 74 -74zM405 256c60 0 107 -47 107 -107s-47 -106 -107 -106s-106 46 -106 106s46 107 106 107zM230 288l47 -49v-132h-42v106l-69 60c-9 6 -12 17 -12 30c0 11 3 21 12 30l60 60c6 9 17 12 30 12
+s23 -3 34 -12l41 -41c19 -19 44 -32 76 -32v-43c-45 0 -80 17 -108 45l-17 17zM107 75c41 0 74 33 74 74s-33 75 -74 75s-75 -34 -75 -75s34 -74 75 -74zM107 256c60 0 106 -47 106 -107s-46 -106 -106 -106s-107 46 -107 106s47 107 107 107zM331 395c-23 0 -43 19 -43 42
+s20 43 43 43s42 -20 42 -43s-19 -42 -42 -42z" />
+    <glyph glyph-name="directions_boat" unicode="directions_boat" 
+d="M128 384v-85l128 42l128 -42v85h-256zM84 107l-40 142c-4.78212 14.3464 3.99001 23.6633 14 27l27 9v99c0 23 20 43 43 43h64v64h128v-64h64c23 0 43 -20 43 -43v-99l27 -9c10.0202 -3.34008 18.7871 -12.6386 14 -27l-40 -142h-1c-34 0 -65 18 -86 42
+c-21 -24 -51 -42 -85 -42s-64 18 -85 42c-21 -24 -52 -42 -86 -42h-1zM427 64h42v-43h-42c-29 0 -59 7 -86 21c-54 -28 -116 -28 -170 0c-27 -14 -57 -21 -86 -21h-42v43h42c30 0 60 10 86 28c52 -36 118 -36 170 0c26 -18 56 -28 86 -28z" />
+    <glyph glyph-name="directions_bus" unicode="directions_bus" 
+d="M384 277v107h-256v-107h256zM352 149c18 0 32 14 32 32s-14 32 -32 32s-32 -14 -32 -32s14 -32 32 -32zM160 149c18 0 32 14 32 32s-14 32 -32 32s-32 -14 -32 -32s14 -32 32 -32zM85 171v213c0 75 77 85 171 85s171 -10 171 -85v-213c0 -19 -9 -36 -22 -48v-38
+c0 -12 -9 -21 -21 -21h-21c-12 0 -22 9 -22 21v22h-170v-22c0 -12 -10 -21 -22 -21h-21c-12 0 -21 9 -21 21v38c-13 12 -22 29 -22 48z" />
+    <glyph glyph-name="directions_car" unicode="directions_car" 
+d="M107 277h298l-32 96h-234zM373 171c18 0 32 14 32 32s-14 32 -32 32s-32 -14 -32 -32s14 -32 32 -32zM139 171c18 0 32 14 32 32s-14 32 -32 32s-32 -14 -32 -32s14 -32 32 -32zM404 384l44 -128v-171c0 -12 -9 -21 -21 -21h-22c-12 0 -21 9 -21 21v22h-256v-22
+c0 -12 -9 -21 -21 -21h-22c-12 0 -21 9 -21 21v171l44 128c4 13 17 21 31 21h234c14 0 27 -8 31 -21z" />
+    <glyph glyph-name="directions_railway" unicode="directions_railway" 
+d="M384 299v106h-256v-106h256zM256 149c23 0 43 20 43 43s-20 43 -43 43s-43 -20 -43 -43s20 -43 43 -43zM85 181v224c0 75 77 86 171 86s171 -11 171 -86v-224c0 -41 -34 -74 -75 -74l32 -32v-11h-256v11l32 32c-41 0 -75 33 -75 74z" />
+    <glyph glyph-name="directions_run" unicode="directions_run" 
+d="M211 99l-149 29l8 43l105 -21l34 173l-39 -15v-73h-42v100l111 47c6 0 11 2 17 2c15 0 27 -8 36 -21l21 -34c17 -30 51 -51 92 -51v-43c-47 0 -89 21 -117 53l-13 -64l45 -42v-160h-43v128l-45 42zM288 395c-23 0 -43 20 -43 43s20 42 43 42s42 -19 42 -42
+s-19 -43 -42 -43z" />
+    <glyph glyph-name="directions_subway" unicode="directions_subway" 
+d="M384 277v107h-107v-107h107zM352 149c18 0 32 14 32 32s-14 32 -32 32s-32 -14 -32 -32s14 -32 32 -32zM235 277v107h-107v-107h107zM160 149c18 0 32 14 32 32s-14 32 -32 32s-32 -14 -32 -32s14 -32 32 -32zM256 469c94 0 171 -10 171 -85v-203c0 -41 -34 -74 -75 -74
+l32 -32v-11h-256v11l32 32c-41 0 -75 33 -75 74v203c0 75 77 85 171 85z" />
+    <glyph glyph-name="directions_transit" unicode="directions_transit" 
+d="M384 277v107h-107v-107h107zM352 149c18 0 32 14 32 32s-14 32 -32 32s-32 -14 -32 -32s14 -32 32 -32zM235 277v107h-107v-107h107zM160 149c18 0 32 14 32 32s-14 32 -32 32s-32 -14 -32 -32s14 -32 32 -32zM256 469c94 0 171 -10 171 -85v-203c0 -41 -34 -74 -75 -74
+l32 -32v-11h-256v11l32 32c-41 0 -75 33 -75 74v203c0 75 77 85 171 85z" />
+    <glyph glyph-name="directions_walk" unicode="directions_walk" 
+d="M209 322l-60 -301h45l39 171l44 -43v-128h43v160l-45 43l13 64c28 -32 70 -53 117 -53v42c-41 0 -74 22 -91 52l-22 34c-9 13 -21 21 -36 21c-6 0 -11 -2 -17 -2l-111 -47v-100h43v72l38 15zM288 395c-23 0 -43 19 -43 42s20 43 43 43s43 -20 43 -43s-20 -42 -43 -42z
+" />
+    <glyph glyph-name="disc_full" unicode="disc_full" 
+d="M213 213c23 0 43 20 43 43s-20 43 -43 43s-42 -20 -42 -43s19 -43 42 -43zM213 427c94 0 171 -77 171 -171s-77 -171 -171 -171s-170 77 -170 171s76 171 170 171zM427 363h42v-107h-42v107zM427 171v42h42v-42h-42z" />
+    <glyph glyph-name="dns" unicode="dns" 
+d="M149 320c23 0 43 20 43 43s-20 42 -43 42s-42 -19 -42 -42s19 -43 42 -43zM427 448c12 0 21 -9 21 -21v-128c0 -12 -9 -22 -21 -22h-342c-12 0 -21 10 -21 22v128c0 12 9 21 21 21h342zM149 107c23 0 43 19 43 42s-20 43 -43 43s-42 -20 -42 -43s19 -42 42 -42zM427 235
+c12 0 21 -10 21 -22v-128c0 -12 -9 -21 -21 -21h-342c-12 0 -21 9 -21 21v128c0 12 9 22 21 22h342z" />
+    <glyph glyph-name="do_not_disturb" unicode="do_not_disturb" 
+d="M391 151c23 29 36 66 36 105c0 94 -77 171 -171 171c-39 0 -76 -13 -105 -36zM256 85c39 0 76 13 105 36l-240 240c-23 -29 -36 -66 -36 -105c0 -94 77 -171 171 -171zM256 469c118 0 213 -95 213 -213s-95 -213 -213 -213s-213 95 -213 213s95 213 213 213z" />
+    <glyph glyph-name="do_not_disturb_alt" unicode="do_not_disturb_alt" 
+d="M256 85c94 0 171 77 171 171c0 38 -14 75 -37 105l-239 -239c30 -23 67 -37 105 -37zM85 256c0 -38 14 -75 37 -105l239 239c-30 23 -67 37 -105 37c-94 0 -171 -77 -171 -171zM256 469c117 0 213 -96 213 -213s-96 -213 -213 -213s-213 96 -213 213s96 213 213 213z" />
+    <glyph glyph-name="do_not_disturb_off" unicode="do_not_disturb_off" 
+d="M149 235h74l-43 42h-31v-42zM48 464l416 -416l-28 -27l-59 60c-34 -24 -76 -38 -121 -38c-118 0 -213 95 -213 213c0 45 14 87 38 121l-60 59zM363 277h-74l-154 154c34 24 76 38 121 38c118 0 213 -95 213 -213c0 -45 -14 -87 -38 -121l-99 100h31v42z" />
+    <glyph glyph-name="do_not_disturb_on" unicode="do_not_disturb_on" 
+d="M363 235v42h-214v-42h214zM256 469c118 0 213 -95 213 -213s-95 -213 -213 -213s-213 95 -213 213s95 213 213 213z" />
+    <glyph glyph-name="dock" unicode="dock" 
+d="M341 192v213h-170v-213h170zM341 490c23 0 43 -19 43 -42v-299c0 -23 -20 -42 -43 -42h-170c-23 0 -43 19 -43 42v299c0 23 20 43 43 43zM171 21v43h170v-43h-170z" />
+    <glyph glyph-name="domain" unicode="domain" 
+d="M384 192v-43h-43v43h43zM384 277v-42h-43v42h43zM427 107v213h-171v-43h43v-42h-43v-43h43v-43h-43v-42h171zM213 363v42h-42v-42h42zM213 277v43h-42v-43h42zM213 192v43h-42v-43h42zM213 107v42h-42v-42h42zM128 363v42h-43v-42h43zM128 277v43h-43v-43h43zM128 192v43
+h-43v-43h43zM128 107v42h-43v-42h43zM256 363h213v-299h-426v384h213v-85z" />
+    <glyph glyph-name="done" unicode="done" 
+d="M192 166l226 227l30 -30l-256 -256l-119 119l29 30z" />
+    <glyph glyph-name="done_all" unicode="done_all" 
+d="M9 226l30 30l119 -119l-30 -30zM474 393l31 -30l-256 -256l-120 119l31 30l89 -89zM384 363l-135 -136l-30 30l135 136z" />
+    <glyph glyph-name="donut_large" unicode="donut_large" 
+d="M277 108c64 9 119 63 128 127h64c-10 -107 -85 -182 -192 -192v65zM405 277c-9 64 -64 118 -128 127v65c107 -10 182 -85 192 -192h-64zM235 404c-64 -10 -128 -73 -128 -148s64 -138 128 -148v-65c-107 11 -192 102 -192 213s85 202 192 213v-65z" />
+    <glyph glyph-name="donut_small" unicode="donut_small" 
+d="M277 195c21 6 33 22 40 40h152c-10 -101 -85 -182 -192 -192v152zM317 277c-7 18 -19 34 -40 40v152c107 -10 182 -91 192 -192h-152zM235 317c-21 -9 -43 -33 -43 -61s22 -52 43 -61v-152c-107 11 -192 102 -192 213s85 202 192 213v-152z" />
+    <glyph glyph-name="drafts" unicode="drafts" 
+d="M256 235l176 110l-176 103l-176 -103zM469 341v-213c0 -23 -19 -43 -42 -43h-342c-23 0 -42 20 -42 43v213c0 15 8 30 20 37l193 113l193 -113c12 -7 20 -22 20 -37z" />
+    <glyph glyph-name="drag_handle" unicode="drag_handle" 
+d="M85 192v43h342v-43h-342zM427 320v-43h-342v43h342z" />
+    <glyph glyph-name="drive_eta" unicode="drive_eta" 
+d="M107 299h298l-32 96h-234zM373 192c18 0 32 14 32 32s-14 32 -32 32s-32 -14 -32 -32s14 -32 32 -32zM139 192c18 0 32 14 32 32s-14 32 -32 32s-32 -14 -32 -32s14 -32 32 -32zM404 405l44 -128v-170c0 -12 -9 -22 -21 -22h-22c-12 0 -21 10 -21 22v21h-256v-21
+c0 -12 -9 -22 -21 -22h-22c-12 0 -21 10 -21 22v170l44 128c4 13 17 22 31 22h234c14 0 27 -9 31 -22z" />
+    <glyph glyph-name="dvr" unicode="dvr" 
+d="M149 256v-43h-42v43h42zM149 341v-42h-42v42h42zM405 256v-43h-234v43h234zM405 341v-42h-234v42h234zM448 149v256h-384v-256h384zM448 448c23 0 43 -20 43 -43l-1 -256c0 -23 -19 -42 -42 -42h-107v-43h-170v43h-107c-23 0 -43 19 -43 42v256c0 23 20 43 43 43h384z
+" />
+    <glyph glyph-name="edit" unicode="edit" 
+d="M442 362l-39 -39l-80 80l39 39c8 8 22 8 30 0l50 -50c8 -8 8 -22 0 -30zM64 144l236 236l80 -80l-236 -236h-80v80z" />
+    <glyph glyph-name="edit_location" unicode="edit_location" 
+d="M318 351c3 3 3 8 0 11l-20 20c-3 3 -8 3 -11 0l-15 -15l31 -31zM223 256l71 71l-31 31l-71 -71v-31h31zM256 469c82 0 149 -67 149 -149c0 -112 -149 -277 -149 -277s-149 165 -149 277c0 82 67 149 149 149z" />
+    <glyph glyph-name="eject" unicode="eject" 
+d="M256 405l142 -213h-284zM107 149h298v-42h-298v42z" />
+    <glyph glyph-name="email" unicode="email" 
+d="M427 341v43l-171 -107l-171 107v-43l171 -106zM427 427c23 0 42 -20 42 -43v-256c0 -23 -19 -43 -42 -43h-342c-23 0 -42 20 -42 43v256c0 23 19 43 42 43h342z" />
+    <glyph glyph-name="enhanced_encryption" unicode="enhanced_encryption" 
+d="M341 171v42h-64v64h-42v-64h-64v-42h64v-64h42v64h64zM190 384v-43h132v43c0 36 -30 66 -66 66s-66 -30 -66 -66zM384 341c23 0 43 -19 43 -42v-214c0 -23 -20 -42 -43 -42h-256c-23 0 -43 19 -43 42v214c0 23 20 42 43 42h21v43c0 59 48 107 107 107s107 -48 107 -107
+v-43h21z" />
+    <glyph glyph-name="equalizer" unicode="equalizer" 
+d="M341 320h86v-235h-86v235zM85 85v171h86v-171h-86zM213 85v342h86v-342h-86z" />
+    <glyph glyph-name="error" unicode="error" 
+d="M277 235v128h-42v-128h42zM277 149v43h-42v-43h42zM256 469c118 0 213 -95 213 -213s-95 -213 -213 -213s-213 95 -213 213s95 213 213 213z" />
+    <glyph glyph-name="error_outline" unicode="error_outline" 
+d="M256 85c94 0 171 77 171 171s-77 171 -171 171s-171 -77 -171 -171s77 -171 171 -171zM256 469c118 0 213 -95 213 -213s-95 -213 -213 -213s-213 95 -213 213s95 213 213 213zM235 363h42v-128h-42v128zM235 192h42v-43h-42v43z" />
+    <glyph glyph-name="euro_symbol" unicode="euro_symbol" 
+d="M320 117c35 0 66 13 90 34l38 -38c-34 -31 -79 -49 -128 -49c-84 0 -155 54 -181 128h-75v43h65c-1 7 -1 14 -1 21s0 14 1 21h-65v43h75c26 74 97 128 181 128c49 0 94 -18 128 -49l-38 -38c-24 21 -56 34 -90 34c-53 0 -100 -31 -123 -75h123v-43h-137
+c-1 -7 -2 -14 -2 -21s1 -14 2 -21h137v-43h-123c23 -44 69 -75 123 -75z" />
+    <glyph glyph-name="ev_station" unicode="ev_station" 
+d="M171 128l85 149h-43v107l-85 -160h43v-96zM384 299c12 0 21 9 21 21s-9 21 -21 21s-21 -9 -21 -21s9 -21 21 -21zM422 358c10 -10 15 -23 15 -38v-203c0 -29 -24 -53 -53 -53s-53 24 -53 53v107h-32v-160h-214v341c0 23 20 43 43 43h128c23 0 43 -20 43 -43v-149h21
+c23 0 43 -20 43 -43v-96c0 -12 9 -21 21 -21s21 9 21 21v154c-7 -3 -13 -4 -21 -4c-29 0 -53 24 -53 53c0 23 14 42 34 50l-45 45l23 22z" />
+    <glyph glyph-name="event" unicode="event" 
+d="M405 107v234h-298v-234h298zM341 491h43v-43h21c23 0 43 -20 43 -43v-298c0 -23 -20 -43 -43 -43h-298c-24 0 -43 20 -43 43v298c0 23 19 43 43 43h21v43h43v-43h170v43zM363 256v-107h-107v107h107z" />
+    <glyph glyph-name="event_available" unicode="event_available" 
+d="M405 107v234h-298v-234h298zM405 448c23 0 43 -20 43 -43v-298c0 -23 -20 -43 -43 -43h-298c-24 0 -43 20 -43 43v298c0 23 19 43 43 43h21v43h43v-43h170v43h43v-43h21zM353 276l-127 -127l-68 68l23 23l45 -45l104 104z" />
+    <glyph glyph-name="event_busy" unicode="event_busy" 
+d="M405 107v234h-298v-234h298zM405 448c23 0 43 -20 43 -43v-298c0 -23 -20 -43 -43 -43h-298c-24 0 -43 20 -43 43v298c0 23 19 43 43 43h21v43h43v-43h170v43h43v-43h21zM199 149l-23 23l52 52l-52 52l23 23l52 -52l52 52l22 -23l-52 -52l52 -52l-22 -23l-52 52z" />
+    <glyph glyph-name="event_note" unicode="event_note" 
+d="M299 213v-42h-150v42h150zM405 107v234h-298v-234h298zM405 448c23 0 43 -20 43 -43v-298c0 -23 -20 -43 -43 -43h-298c-24 0 -43 20 -43 43v298c0 23 19 43 43 43h21v43h43v-43h170v43h43v-43h21zM363 299v-43h-214v43h214z" />
+    <glyph glyph-name="event_seat" unicode="event_seat" 
+d="M363 235h-214v170c0 23 20 43 43 43h128c23 0 43 -20 43 -43v-170zM43 299h64v-64h-64v64zM405 299h64v-64h-64v64zM85 64v128h342v-128h-64v64h-214v-64h-64z" />
+    <glyph glyph-name="exit_to_app" unicode="exit_to_app" 
+d="M405 448c23 0 43 -20 43 -43v-298c0 -23 -20 -43 -43 -43h-298c-24 0 -43 20 -43 43v85h43v-85h298v298h-298v-85h-43v85c0 23 19 43 43 43h298zM215 179l55 56h-206v42h206l-55 56l30 30l107 -107l-107 -107z" />
+    <glyph glyph-name="expand_less" unicode="expand_less" 
+d="M256 341l128 -128l-30 -30l-98 98l-98 -98l-30 30z" />
+    <glyph glyph-name="expand_more" unicode="expand_more" 
+d="M354 329l30 -30l-128 -128l-128 128l30 30l98 -98z" />
+    <glyph glyph-name="explicit" unicode="explicit" 
+d="M320 320v43h-128v-214h128v43h-85v43h85v42h-85v43h85zM405 448c23 0 43 -20 43 -43v-298c0 -23 -20 -43 -43 -43h-298c-23 0 -43 20 -43 43v298c0 23 20 43 43 43h298z" />
+    <glyph glyph-name="explore" unicode="explore" 
+d="M303 209l81 175l-175 -81l-81 -175zM256 469c118 0 213 -95 213 -213s-95 -213 -213 -213s-213 95 -213 213s95 213 213 213zM256 279c13 0 23 -10 23 -23s-10 -23 -23 -23s-23 10 -23 23s10 23 23 23z" />
+    <glyph glyph-name="exposure" unicode="exposure" 
+d="M427 85v342l-342 -342h342zM107 405v-42h128v42h-128zM427 469c23 0 42 -19 42 -42v-342c0 -23 -19 -42 -42 -42h-342c-23 0 -42 19 -42 42v342c0 23 19 42 42 42h342zM320 149h-43v43h43v43h43v-43h42v-43h-42v-42h-43v42z" />
+    <glyph glyph-name="exposure_neg_1" unicode="exposure_neg_&#x31;" 
+d="M405 128h-42v227l-64 -22v36l100 36h6v-277zM85 277h171v-42h-171v42z" />
+    <glyph glyph-name="exposure_neg_2" unicode="exposure_neg_&#x32;" 
+d="M43 277h170v-42h-170v42zM351 405c51.6805 0 86 -23.4377 86 -75c0 -8 -1 -17 -4 -25s-6 -17 -11 -25c-10.9564 -17.5303 -25.11 -35.11 -40 -50l-61 -66h127v-36h-184v32l89 97c13.5256 13.5256 22.2329 25.3882 31 40c5.07755 8.46258 7 15.5272 7 28c0 6 0 13 -2 18
+c-5.9589 14.8973 -17.1504 26 -38 26c-30.4379 0 -46 -18.4676 -46 -49h-46c0 25.6678 10.3448 46.3448 24 60c15.6925 15.6925 36.8462 25 68 25z" />
+    <glyph glyph-name="exposure_plus_1" unicode="exposure_plus_&#x31;" 
+d="M427 128h-43v227l-64 -22v36l100 36h7v-277zM213 363v-86h86v-42h-86v-86h-42v86h-86v42h86v86h42z" />
+    <glyph glyph-name="exposure_plus_2" unicode="exposure_plus_&#x32;" 
+d="M171 363v-86h85v-42h-85v-86h-43v86h-85v42h85v86h43zM342 164h127v-36h-184v32l89 97c13.5256 13.5256 22.2329 25.3882 31 40c4.82857 8.04762 8 16.6883 8 28c0 13.988 -4.98597 22.9813 -11 31c-6.38798 8.51731 -15.0381 13 -30 13
+c-15.4008 0 -27.3364 -6.33642 -35 -14c-6.99604 -6.99604 -11 -21.7099 -11 -35h-46c0 25.6678 10.3448 46.3448 24 60c8 8 17 15 29 19s25 6 40 6c14 0 25 -2 36 -5c10 -4 20 -8 27 -15c13.4025 -11.4878 23 -30.9925 23 -55c0 -20.2222 -7.3586 -36.1738 -16 -50
+c-5 -8 -10 -17 -17 -25s-15 -17 -23 -25z" />
+    <glyph glyph-name="exposure_zero" unicode="exposure_zero" 
+d="M299 296c0 25.8021 -1.44348 42.6652 -11 57c-4 6 -9 9 -14 12s-11 4 -18 4s-13 -1 -18 -4s-10 -6 -14 -12c-9.53524 -14.3029 -11 -31.2267 -11 -57v-57c0 -34.3202 4.66098 -58.7966 25 -71c5 -3 11 -4 18 -4c16.7682 0 24.8052 6.20777 32 17
+c8.87006 13.3051 12 34.4084 12 58v57h-1zM168 289c0 68.5293 21.3782 116 88 116c46.5088 0 71.845 -23.9186 82 -62c4 -15 7 -32 7 -54v-44h-1c0 -39.7402 -7.68654 -69.0255 -24 -90c-8 -9 -17 -17 -28 -21s-23 -6 -36 -6s-25 2 -36 6s-20 12 -28 21
+c-17.4464 19.6272 -24 51.2554 -24 90v44z" />
+    <glyph glyph-name="extension" unicode="extension" 
+d="M437 277c29 0 54 -24 54 -53s-25 -53 -54 -53h-32v-86c0 -23 -19 -42 -42 -42h-81v32c0 32 -26 57 -58 57s-58 -25 -58 -57v-32h-81c-23 0 -42 19 -42 42v81h32c32 0 57 26 57 58s-25 58 -57 58h-32v81c0 23 19 42 42 42h86v32c0 29 24 54 53 54s53 -25 53 -54v-32h86
+c23 0 42 -19 42 -42v-86h32z" />
+    <glyph glyph-name="face" unicode="face" 
+d="M256 85c94 0 171 77 171 171c0 17 -3 33 -7 48c-15 -4 -31 -5 -48 -5c-72 0 -135 35 -174 90c-21 -51 -62 -93 -112 -115c-1 -6 -1 -12 -1 -18c0 -94 77 -171 171 -171zM256 469c118 0 213 -95 213 -213s-95 -213 -213 -213s-213 95 -213 213s95 213 213 213zM320 261
+c15 0 27 -11 27 -26s-12 -27 -27 -27s-27 12 -27 27s12 26 27 26zM192 261c15 0 27 -11 27 -26s-12 -27 -27 -27s-27 12 -27 27s12 26 27 26z" />
+    <glyph glyph-name="fast_forward" unicode="fast_forward" 
+d="M277 384l182 -128l-182 -128v256zM85 128v256l182 -128z" />
+    <glyph glyph-name="fast_rewind" unicode="fast_rewind" 
+d="M245 256l182 128v-256zM235 128l-182 128l182 128v-256z" />
+    <glyph glyph-name="favorite" unicode="favorite" 
+d="M256 57l-31 28c-110 100 -182 165 -182 246c0 66 51 117 117 117c37 0 73 -18 96 -45c23 27 59 45 96 45c66 0 117 -51 117 -117c0 -81 -72 -147 -182 -247z" />
+    <glyph glyph-name="favorite_border" unicode="favorite_border" 
+d="M258 116c102 92 169 153 169 215c0 43 -32 74 -75 74c-33 0 -65 -21 -76 -50h-40c-11 29 -43 50 -76 50c-43 0 -75 -31 -75 -74c0 -62 67 -123 169 -215l2 -2zM352 448c66 0 117 -51 117 -117c0 -81 -72 -146 -182 -246l-31 -28l-31 27c-110 100 -182 166 -182 247
+c0 66 51 117 117 117c37 0 73 -18 96 -45c23 27 59 45 96 45z" />
+    <glyph glyph-name="featured_play_list" unicode="featured_play_list" 
+d="M256 363v42h-192v-42h192zM256 277v43h-192v-43h192zM448 448c23 0 43 -20 43 -43v-298c0 -23 -20 -43 -43 -43h-384c-23 0 -43 20 -43 43v298c0 23 20 43 43 43h384z" />
+    <glyph glyph-name="featured_video" unicode="featured_video" 
+d="M256 256v149h-192v-149h192zM448 448c23 0 43 -20 43 -43v-298c0 -23 -20 -43 -43 -43h-384c-23 0 -43 20 -43 43v298c0 23 20 43 43 43h384z" />
+    <glyph glyph-name="feedback" unicode="feedback" 
+d="M277 299v85h-42v-85h42zM277 213v43h-42v-43h42zM427 469c23 0 42 -19 42 -42v-256c0 -23 -19 -43 -42 -43h-299l-85 -85v384c0 23 19 42 42 42h342z" />
+    <glyph glyph-name="fiber_dvr" unicode="fiber_dvr" 
+d="M448 267v21c0 18 -14 32 -32 32h-75v-128h32v43h25l18 -43h32l-19 45c11 5 19 17 19 30zM269 192l38 128h-32l-22 -73l-21 73h-32l37 -128h32zM171 224v64c0 18 -14 32 -32 32h-75v-128h75c18 0 32 14 32 32zM448 448c24 0 43 -19 43 -43v-298c0 -23 -19 -43 -43 -43
+h-384c-24 0 -43 20 -43 43v298c0 24 19 43 43 43h384zM96 288h43v-64h-43v64zM373 288h43v-21h-43v21z" />
+    <glyph glyph-name="fiber_manual_record" unicode="fiber_manual_record" 
+d="M85 256c0 94 77 171 171 171s171 -77 171 -171s-77 -171 -171 -171s-171 77 -171 171z" />
+    <glyph glyph-name="fiber_new" unicode="fiber_new" 
+d="M437 213v107h-26v-96h-24v75h-27v-75h-24v96h-27v-107c0 -12 10 -21 22 -21h85c12 0 21 9 21 21zM288 293v27h-85v-128h85v27h-53v23h53v27h-53v24h53zM181 192v128h-26v-75l-54 75h-26v-128h26v75l55 -75h25zM427 427c24 0 42 -19 42 -43v-256c0 -24 -18 -43 -42 -43
+h-342c-24 0 -42 19 -42 43v256c0 24 18 43 42 43h342z" />
+    <glyph glyph-name="fiber_pin" unicode="fiber_pin" 
+d="M427 192v128h-27v-75l-53 75h-27v-128h27v75l54 -75h26zM267 192v128h-32v-128h32zM192 267v21c0 18 -14 32 -32 32h-75v-128h32v43h43c18 0 32 14 32 32zM427 427c24 0 42 -19 42 -43v-256c0 -24 -18 -43 -42 -43h-342c-24 0 -42 19 -42 43v256c0 24 18 43 42 43h342z
+M117 288h43v-21h-43v21z" />
+    <glyph glyph-name="fiber_smart_record" unicode="fiber_smart_record" 
+d="M363 421c74 -19 128 -85 128 -165s-54 -146 -128 -165v44c50 17 85 65 85 121s-35 104 -85 121v44zM21 256c0 94 77 171 171 171s171 -77 171 -171s-77 -171 -171 -171s-171 77 -171 171z" />
+    <glyph glyph-name="file_download" unicode="file_download" 
+d="M107 128h298v-43h-298v43zM405 320l-149 -149l-149 149h85v128h128v-128h85z" />
+    <glyph glyph-name="file_upload" unicode="file_upload" 
+d="M107 128h298v-43h-298v43zM192 171v128h-85l149 149l149 -149h-85v-128h-128z" />
+    <glyph glyph-name="filter" unicode="filter" 
+d="M448 149v299h-299v-299h299zM448 491c23 0 43 -20 43 -43v-299c0 -23 -20 -42 -43 -42h-299c-23 0 -42 19 -42 42v299c0 23 19 43 42 43h299zM64 405v-341h341v-43h-341c-23 0 -43 20 -43 43v341h43zM340 292l76 -100h-235l59 75l42 -50z" />
+    <glyph glyph-name="filter_1" unicode="filter_&#x31;" 
+d="M448 149v299h-299v-299h299zM448 491c23 0 43 -20 43 -43v-299c0 -23 -20 -42 -43 -42h-299c-23 0 -42 19 -42 42v299c0 23 19 43 42 43h299zM299 192v171h-43v42h85v-213h-42zM64 405v-341h341v-43h-341c-23 0 -43 20 -43 43v341h43z" />
+    <glyph glyph-name="filter_2" unicode="filter_&#x32;" 
+d="M363 235v-43h-128v85c0 24 19 43 42 43h43v43h-85v42h85c23 0 43 -18 43 -42v-43c0 -24 -20 -43 -43 -43h-43v-42h86zM448 149v299h-299v-299h299zM448 491c23 0 43 -20 43 -43v-299c0 -23 -20 -42 -43 -42h-299c-23 0 -42 19 -42 42v299c0 23 19 43 42 43h299zM64 405
+v-341h341v-43h-341c-23 0 -43 20 -43 43v341h43z" />
+    <glyph glyph-name="filter_3" unicode="filter_&#x33;" 
+d="M363 235c0 -24 -20 -43 -43 -43h-85v43h85v42h-43v43h43v43h-85v42h85c23 0 43 -18 43 -42v-32c0 -18 -14 -32 -32 -32c18 0 32 -14 32 -32v-32zM64 405v-341h341v-43h-341c-23 0 -43 20 -43 43v341h43zM448 149v299h-299v-299h299zM448 491c23 0 43 -20 43 -43v-299
+c0 -23 -20 -42 -43 -42h-299c-23 0 -42 19 -42 42v299c0 23 19 43 42 43h299z" />
+    <glyph glyph-name="filter_4" unicode="filter_&#x34;" 
+d="M448 149v299h-299v-299h299zM448 491c23 0 43 -20 43 -43v-299c0 -23 -20 -42 -43 -42h-299c-23 0 -42 19 -42 42v299c0 23 19 43 42 43h299zM320 192v85h-85v128h42v-85h43v85h43v-213h-43zM64 405v-341h341v-43h-341c-23 0 -43 20 -43 43v341h43z" />
+    <glyph glyph-name="filter_5" unicode="filter_&#x35;" 
+d="M363 235c0 -24 -20 -43 -43 -43h-85v43h85v42h-85v128h128v-42h-86v-43h43c23 0 43 -19 43 -43v-42zM64 405v-341h341v-43h-341c-23 0 -43 20 -43 43v341h43zM448 149v299h-299v-299h299zM448 491c23 0 43 -20 43 -43v-299c0 -23 -20 -42 -43 -42h-299
+c-23 0 -42 19 -42 42v299c0 23 19 43 42 43h299z" />
+    <glyph glyph-name="filter_6" unicode="filter_&#x36;" 
+d="M277 277v-42h43v42h-43zM277 192c-23 0 -42 19 -42 43v128c0 24 19 42 42 42h86v-42h-86v-43h43c23 0 43 -19 43 -43v-42c0 -24 -20 -43 -43 -43h-43zM448 149v299h-299v-299h299zM448 491c23 0 43 -20 43 -43v-299c0 -23 -20 -42 -43 -42h-299c-23 0 -42 19 -42 42v299
+c0 23 19 43 42 43h299zM64 405v-341h341v-43h-341c-23 0 -43 20 -43 43v341h43z" />
+    <glyph glyph-name="filter_7" unicode="filter_&#x37;" 
+d="M277 192h-42l85 171h-85v42h128v-42zM448 149v299h-299v-299h299zM448 491c23 0 43 -20 43 -43v-299c0 -23 -20 -42 -43 -42h-299c-23 0 -42 19 -42 42v299c0 23 19 43 42 43h299zM64 405v-341h341v-43h-341c-23 0 -43 20 -43 43v341h43z" />
+    <glyph glyph-name="filter_8" unicode="filter_&#x38;" 
+d="M277 277v-42h43v42h-43zM277 363v-43h43v43h-43zM277 192c-23 0 -42 19 -42 43v32c0 18 14 32 32 32c-18 0 -32 14 -32 32v32c0 24 19 42 42 42h43c23 0 43 -18 43 -42v-32c0 -18 -14 -32 -32 -32c18 0 32 -14 32 -32v-32c0 -24 -20 -43 -43 -43h-43zM448 149v299h-299
+v-299h299zM448 491c23 0 43 -20 43 -43v-299c0 -23 -20 -42 -43 -42h-299c-23 0 -42 19 -42 42v299c0 23 19 43 42 43h299zM64 405v-341h341v-43h-341c-23 0 -43 20 -43 43v341h43z" />
+    <glyph glyph-name="filter_9" unicode="filter_&#x39;" 
+d="M320 320v43h-43v-43h43zM320 405c23 0 43 -18 43 -42v-128c0 -24 -20 -43 -43 -43h-85v43h85v42h-43c-23 0 -42 19 -42 43v43c0 24 19 42 42 42h43zM448 149v299h-299v-299h299zM448 491c23 0 43 -20 43 -43v-299c0 -23 -20 -42 -43 -42h-299c-23 0 -42 19 -42 42v299
+c0 23 19 43 42 43h299zM64 405v-341h341v-43h-341c-23 0 -43 20 -43 43v341h43z" />
+    <glyph glyph-name="filter_9_plus" unicode="filter_&#x39;_plus" 
+d="M448 320v128h-299v-299h299v128h-43v-42h-42v42h-43v43h43v43h42v-43h43zM448 491c23 0 43 -20 43 -43v-299c0 -23 -20 -42 -43 -42h-299c-23 0 -42 19 -42 42v299c0 23 19 43 42 43h299zM235 320h21v21h-21v-21zM299 256c0 -24 -20 -43 -43 -43h-64v43h64v21h-21
+c-23 0 -43 19 -43 43v21c0 24 20 43 43 43h21c23 0 43 -19 43 -43v-85zM64 405v-341h341v-43h-341c-23 0 -43 20 -43 43v341h43z" />
+    <glyph glyph-name="filter_b_and_w" unicode="filter_b_and_w" 
+d="M405 107v298h-149v-128zM405 448c23 0 43 -20 43 -43v-298c0 -23 -20 -43 -43 -43h-298c-23 0 -43 20 -43 43v298c0 23 20 43 43 43h298zM256 277l-149 -170h149v170z" />
+    <glyph glyph-name="filter_center_focus" unicode="filter_center_focus" 
+d="M256 320c35 0 64 -29 64 -64s-29 -64 -64 -64s-64 29 -64 64s29 64 64 64zM405 107v85h43v-85c0 -23 -20 -43 -43 -43h-85v43h85zM405 448c23 0 43 -20 43 -43v-85h-43v85h-85v43h85zM107 405v-85h-43v85c0 23 20 43 43 43h85v-43h-85zM107 192v-85h85v-43h-85
+c-23 0 -43 20 -43 43v85h43z" />
+    <glyph glyph-name="filter_drama" unicode="filter_drama" 
+d="M405 128c35 0 64 29 64 64s-29 64 -64 64h-32v11c0 65 -52 117 -117 117c-38 0 -72 -18 -94 -47c54 -15 94 -65 94 -124h-43c0 47 -38 86 -85 86s-85 -39 -85 -86s38 -85 85 -85h277zM413 298c55 -4 99 -50 99 -106c0 -59 -48 -107 -107 -107h-277
+c-71 0 -128 57 -128 128c0 66 50 120 114 127c27 51 80 87 142 87c78 0 142 -55 157 -129z" />
+    <glyph glyph-name="filter_frames" unicode="filter_frames" 
+d="M384 341h-256v-213h256zM427 85v299h-96l-74 75l-75 -75h-97v-299h342zM427 427c23 0 42 -20 42 -43v-299c0 -23 -19 -42 -42 -42h-342c-23 0 -42 19 -42 42v299c0 23 19 43 42 43h86l85 85l85 -85h86z" />
+    <glyph glyph-name="filter_hdr" unicode="filter_hdr" 
+d="M299 384l192 -256h-470l128 171l96 -128l34 25l-60 81z" />
+    <glyph glyph-name="filter_list" unicode="filter_list" 
+d="M128 235v42h256v-42h-256zM64 384h384v-43h-384v43zM213 128v43h86v-43h-86z" />
+    <glyph glyph-name="filter_none" unicode="filter_none" 
+d="M448 149v299h-299v-299h299zM448 491c23 0 43 -20 43 -43v-299c0 -23 -20 -42 -43 -42h-299c-23 0 -42 19 -42 42v299c0 23 19 43 42 43h299zM64 405v-341h341v-43h-341c-23 0 -43 20 -43 43v341h43z" />
+    <glyph glyph-name="filter_tilt_shift" unicode="filter_tilt_shift" 
+d="M121 91l30 30c24 -18 53 -30 84 -34v-43c-43 4 -82 21 -114 47zM277 87c31 4 60 16 83 34l31 -30c-32 -26 -71 -43 -114 -47v43zM391 151c18 24 30 52 34 83h43c-4 -43 -21 -81 -47 -113zM320 256c0 -35 -29 -64 -64 -64s-64 29 -64 64s29 64 64 64s64 -29 64 -64z
+M87 235c4 -31 16 -60 34 -83l-30 -31c-26 32 -43 71 -47 114h43zM121 361c-18 -24 -30 -53 -34 -84h-43c4 43 21 82 47 114zM425 277c-4 31 -16 60 -34 84l30 30c26 -32 43 -71 47 -114h-43zM391 421l-30 -30c-24 18 -53 30 -84 34v43c43 -4 82 -21 114 -47zM235 425
+c-31 -4 -60 -16 -84 -34l-30 30c32 26 71 43 114 47v-43z" />
+    <glyph glyph-name="filter_vintage" unicode="filter_vintage" 
+d="M256 171c47 0 85 38 85 85s-38 85 -85 85s-85 -38 -85 -85s38 -85 85 -85zM49 137c0 49.2164 31.3621 102.121 82 119c-6 2 -12 6 -18 9c-41 24 -64 66 -64 110c38 22 87 24 128 0c6 -3 12 -7 17 -11c-1 7 -2 13 -2 20c0 47 26 89 64 111c38 -22 64 -64 64 -111
+c0 -7 -1 -13 -2 -20c5 4 11 8 17 11c41 24 90 22 128 0c0 -44 -23 -86 -64 -110c-6 -3 -12 -7 -18 -9c6 -2 12 -6 18 -9c41 -24 64 -66 64 -110c-38 -22 -87 -24 -128 0c-6 3 -12 7 -17 11c1 -7 2 -13 2 -20c0 -47 -26 -89 -64 -111c-38 22 -64 64 -64 111c0 7 1 13 2 20
+c-5 -4 -11 -8 -17 -11c-41 -24 -90 -22 -128 0z" />
+    <glyph glyph-name="find_in_page" unicode="find_in_page" 
+d="M192 235c0 35 29 64 64 64s64 -29 64 -64s-29 -64 -64 -64s-64 29 -64 64zM427 94l-82 82c11 17 18 37 18 59c0 59 -48 106 -107 106s-107 -47 -107 -106s48 -107 107 -107c22 0 42 7 59 18l94 -95c-7 -5 -15 -8 -25 -8h-256c-23 0 -43 19 -43 42l1 342c0 23 19 42 42 42
+h171l128 -128v-247z" />
+    <glyph glyph-name="find_replace" unicode="find_replace" 
+d="M355 189l103 -104l-31 -31l-104 103c-25 -18 -55 -29 -88 -29c-41 0 -79 17 -106 44l-44 -44v128h128l-54 -54c19 -19 47 -31 76 -31c52 0 94 36 104 85h43c-3 -25 -13 -48 -27 -67zM235 384c-52 0 -95 -36 -105 -85h-43c10 72 73 128 148 128c41 0 78 -17 105 -44l44 44
+v-128h-128l54 54c-19 19 -46 31 -75 31z" />
+    <glyph glyph-name="fingerprint" unicode="fingerprint" 
+d="M318 43h-3c-34 9 -56 22 -79 45c-30 30 -46 69 -46 111c0 35 29 63 65 63s66 -28 66 -63c0 -23 19 -41 44 -41s45 18 45 41c0 80 -70 146 -155 146c-61 0 -116 -34 -141 -86c-8 -17 -12 -38 -12 -60c0 -17 1 -43 14 -77c4.57857 -13.7357 -15.4693 -18.3268 -20 -7
+c-10 28 -16 55 -16 84c0 26 5 49 15 69c28 60 91 99 160 99c97 0 176 -76 176 -168c0 -35 -30 -62 -66 -62s-65 27 -65 62c0 23 -20 42 -45 42s-44 -19 -44 -42c0 -36 14 -70 40 -96c20 -20 40 -31 70 -39c6 -1 8 -7 7 -13c-1 -5 -6 -8 -10 -8zM265 199
+c0 -48.7573 40.2888 -91 96 -91c9.9641 0 32.7732 7.36098 35 -6c1 -6 -3 -12 -9 -13c-12 -2 -23 -2 -26 -2c-25 0 -48 6 -66 19c-32 22 -51 56 -51 93c0 6 5 11 11 11s10 -5 10 -11zM208 47c-3 0 -5 1 -7 3c-19 19 -29 31 -43 57c-15 26 -23 58 -23 92c0 63 54 115 121 115
+s121 -52 121 -115c0 -6 -5 -10 -11 -10s-11 4 -11 10c0 52 -44 94 -99 94s-99 -42 -99 -94c0 -31 6 -59 19 -82c14 -25 24 -35 40 -52c4 -4 4 -11 0 -15c-2 -2 -5 -3 -8 -3zM75 305c-8.81177 0 -13.8926 7.8456 -9 16c21 30 48 54 80 70c67 35 153 35 220 0
+c32 -16 59 -39 80 -69c3 -5 2 -12 -3 -15s-12 -2 -15 3c-19 27 -43 47 -72 62c-61 31 -139 32 -200 0c-29 -15 -54 -36 -73 -63c-2 -3 -5 -4 -8 -4zM380 417c-2 0 -4 0 -5 1c-41 21 -77 30 -119 30s-83 -10 -119 -30c-11.6907 -7.0144 -21.6392 12.0165 -10 19
+c40 22 83 32 129 32c45 0 85 -10 129 -32c9.10556 -5.46333 5.20303 -20 -5 -20z" />
+    <glyph glyph-name="first_page" unicode="first_page" 
+d="M128 384h43v-256h-43v256zM393 158l-30 -30l-128 128l128 128l30 -30l-98 -98z" />
+    <glyph glyph-name="fitness_center" unicode="fitness_center" 
+d="M439 195l30 -31l-45 -45l30 -31l-30 -30l-31 30l-45 -45l-31 30l-30 -30l-31 30l76 76l-183 183l-76 -76l-30 31l30 30l-30 31l45 45l-30 31l30 30l31 -30l45 45l31 -30l30 30l31 -30l-76 -76l183 -183l76 76l30 -31z" />
+    <glyph glyph-name="flag" unicode="flag" 
+d="M307 384h120v-213h-150l-8 42h-120v-149h-42v363h192z" />
+    <glyph glyph-name="flare" unicode="flare" 
+d="M235 21v128h42v-128h-42zM120 150l46 46l30 -30l-46 -46zM316 166l30 30l46 -46l-30 -30zM256 320c35 0 64 -29 64 -64s-29 -64 -64 -64s-64 29 -64 64s29 64 64 64zM363 277h128v-42h-128v42zM392 362l-46 -46l-30 30l46 46zM277 491v-128h-42v128h42zM196 346l-30 -30
+l-46 46l30 30zM149 277v-42h-128v42h128z" />
+    <glyph glyph-name="flash_auto" unicode="flash_auto" 
+d="M359 349h50l-25 78zM405 469l69 -192h-41l-15 43h-68l-15 -43h-41l69 192h42zM64 469h213l-85 -192h85l-149 -256v192h-64v256z" />
+    <glyph glyph-name="flash_off" unicode="flash_off" 
+d="M363 299l-33 -57l-181 181v46h214l-86 -170h86zM70 448l335 -336l-27 -27l-88 89l-77 -131v192h-64v79l-106 107z" />
+    <glyph glyph-name="flash_on" unicode="flash_on" 
+d="M149 469h214l-86 -170h86l-150 -256v192h-64v234z" />
+    <glyph glyph-name="flight" unicode="flight" 
+d="M217 320zM448 171l-171 53v-117l43 -32v-32l-75 21l-74 -21v32l42 32v117l-170 -53v42l170 107v117c0 18 14 32 32 32s32 -14 32 -32v-117l171 -107v-42z" />
+    <glyph glyph-name="flight_land" unicode="flight_land" 
+d="M299 204c-68.2362 18.7638 -137.045 36.9549 -206 55l-34 10v110l31 -8l20 -50l106 -28v176l41 -11l59 -192l113 -30c17 -5 27 -23 23 -40c-5 -17 -22 -26 -39 -22zM53 107h406v-43h-406v43z" />
+    <glyph glyph-name="flight_takeoff" unicode="flight_takeoff" 
+d="M471 306c4 -17 -6 -34 -23 -39c-68.7788 -18.2212 -137.501 -36.499 -206 -55l-113 -30l-34 -10c-18.76 31.9067 -37.3464 63.9869 -56 96l31 8l42 -32l106 28l-88 153l41 11l147 -137l114 30c17 5 35 -6 39 -23zM53 107h406v-43h-406v43z" />
+    <glyph glyph-name="flip" unicode="flip" 
+d="M405 64v43h43c0 -23 -20 -43 -43 -43zM405 235v42h43v-42h-43zM320 405v43h43v-43h-43zM405 149v43h43v-43h-43zM235 21v470h42v-470h-42zM405 448c23 0 43 -20 43 -43h-43v43zM64 405c0 23 20 43 43 43h85v-43h-85v-298h85v-43h-85c-23 0 -43 20 -43 43v298zM405 320v43
+h43v-43h-43zM320 64v43h43v-43h-43z" />
+    <glyph glyph-name="flip_to_back" unicode="flip_to_back" 
+d="M320 149v43h43v-43h-43zM320 405v43h43v-43h-43zM107 363v-256h256v-43h-256c-24 0 -43 20 -43 43v256h43zM405 149v43h43c0 -23 -20 -43 -43 -43zM405 320v43h43v-43h-43zM405 235v42h43v-42h-43zM192 149c-24 0 -43 20 -43 43h43v-43zM277 448v-43h-42v43h42zM405 448
+c23 0 43 -20 43 -43h-43v43zM277 192v-43h-42v43h42zM192 448v-43h-43c0 23 19 43 43 43zM192 277v-42h-43v42h43zM192 363v-43h-43v43h43z" />
+    <glyph glyph-name="flip_to_front" unicode="flip_to_front" 
+d="M149 64v43h43v-43h-43zM235 64v43h42v-43h-42zM405 192v213h-213v-213h213zM405 448c23 0 43 -20 43 -43v-213c0 -23 -20 -43 -43 -43h-213c-24 0 -43 20 -43 43v213c0 23 19 43 43 43h213zM320 64v43h43v-43h-43zM64 320v43h43v-43h-43zM107 64c-24 0 -43 20 -43 43h43
+v-43zM64 149v43h43v-43h-43zM64 235v42h43v-42h-43z" />
+    <glyph glyph-name="folder" unicode="folder" 
+d="M213 427l43 -43h171c23 0 42 -20 42 -43v-213c0 -23 -19 -43 -42 -43h-342c-23 0 -42 20 -42 43v256c0 23 19 43 42 43h128z" />
+    <glyph glyph-name="folder_open" unicode="folder_open" 
+d="M427 128v213h-342v-213h342zM427 384c23 0 42 -20 42 -43v-213c0 -23 -19 -43 -42 -43h-342c-23 0 -42 20 -42 43v256c0 23 19 43 42 43h128l43 -43h171z" />
+    <glyph glyph-name="folder_shared" unicode="folder_shared" 
+d="M405 149v22c0 28 -57 42 -85 42s-85 -14 -85 -42v-22h170zM320 320c-23 0 -43 -20 -43 -43s20 -42 43 -42s43 19 43 42s-20 43 -43 43zM427 384c23 0 42 -20 42 -43v-213c0 -23 -19 -43 -42 -43h-342c-23 0 -42 20 -42 43v256c0 23 19 43 42 43h128l43 -43h171z" />
+    <glyph glyph-name="folder_special" unicode="folder_special" 
+d="M383 149l-17 71l55 48l-72 6l-29 67l-29 -67l-72 -6l55 -48l-17 -71l63 37zM427 384c23 0 42 -20 42 -43v-213c0 -23 -19 -43 -42 -43h-342c-23 0 -42 20 -42 43v256c0 23 19 43 42 43h128l43 -43h171z" />
+    <glyph glyph-name="font_download" unicode="font_download" 
+d="M340 117h45l-109 278h-40l-109 -278h45l24 64h120zM427 469c23 0 42 -19 42 -42v-342c0 -23 -19 -42 -42 -42h-342c-23 0 -42 19 -42 42v342c0 23 19 42 42 42h342zM212 224l44 118l44 -118h-88z" />
+    <glyph glyph-name="format_align_center" unicode="format_align_center" 
+d="M64 448h384v-43h-384v43zM149 363h214v-43h-214v43zM64 235v42h384v-42h-384zM64 64v43h384v-43h-384zM149 192h214v-43h-214v43z" />
+    <glyph glyph-name="format_align_justify" unicode="format_align_justify" 
+d="M64 448h384v-43h-384v43zM64 320v43h384v-43h-384zM64 235v42h384v-42h-384zM64 149v43h384v-43h-384zM64 64v43h384v-43h-384z" />
+    <glyph glyph-name="format_align_left" unicode="format_align_left" 
+d="M64 448h384v-43h-384v43zM64 64v43h384v-43h-384zM64 235v42h384v-42h-384zM320 363v-43h-256v43h256zM320 192v-43h-256v43h256z" />
+    <glyph glyph-name="format_align_right" unicode="format_align_right" 
+d="M64 448h384v-43h-384v43zM192 320v43h256v-43h-256zM64 235v42h384v-42h-384zM192 149v43h256v-43h-256zM64 64v43h384v-43h-384z" />
+    <glyph glyph-name="format_bold" unicode="format_bold" 
+d="M288 181c18 0 32 14 32 32s-14 32 -32 32h-75v-64h75zM213 373v-64h64c18 0 32 14 32 32s-14 32 -32 32h-64zM333 282c28 -13 46 -41 46 -73c0 -45 -34 -81 -79 -81h-151v299h134c48 0 85 -38 85 -86c0 -22 -14 -45 -35 -59z" />
+    <glyph glyph-name="format_clear" unicode="format_clear" 
+d="M128 405h299v-64h-124l-34 -80l-45 44l15 36h-51l-60 60v4zM70 405l6 -5l308 -309l-27 -27l-121 121l-33 -78h-64l52 123l-148 148z" />
+    <glyph glyph-name="format_color_fill" unicode="format_color_fill" 
+d="M0 85h512v-85h-512v85zM405 267c0 0 43 -47 43 -75c0 -23 -20 -43 -43 -43s-42 20 -42 43c0 28 42 75 42 75zM111 299h205l-103 102zM353 321c13 -13 13 -33 0 -45l-117 -117c-6 -6 -15 -10 -23 -10s-16 4 -22 10l-118 117c-13 12 -13 32 0 45l110 110l-51 51l31 30z" />
+    <glyph glyph-name="format_color_reset" unicode="format_color_reset" 
+d="M112 400l312 -312l-27 -27l-57 56c-23 -20 -52 -32 -84 -32c-71 0 -128 57 -128 128c0 26 12 57 28 88l-71 71zM384 213c0 -10 -1 -19 -3 -28l-183 184c30 43 58 75 58 75s128 -146 128 -231z" />
+    <glyph glyph-name="format_color_text" unicode="format_color_text" 
+d="M205 256h102l-51 135zM235 448h42l117 -299h-48l-23 64h-134l-24 -64h-48zM0 85h512v-85h-512v85z" />
+    <glyph glyph-name="format_indent_decrease" unicode="format_indent_decrease" 
+d="M235 235v42h213v-42h-213zM235 320v43h213v-43h-213zM64 448h384v-43h-384v43zM64 64v43h384v-43h-384zM64 256l85 85v-170zM235 149v43h213v-43h-213z" />
+    <glyph glyph-name="format_indent_increase" unicode="format_indent_increase" 
+d="M235 235v42h213v-42h-213zM235 320v43h213v-43h-213zM64 448h384v-43h-384v43zM235 149v43h213v-43h-213zM64 341l85 -85l-85 -85v170zM64 64v43h384v-43h-384z" />
+    <glyph glyph-name="format_italic" unicode="format_italic" 
+d="M213 427h171v-64h-60l-72 -171h47v-64h-171v64h60l72 171h-47v64z" />
+    <glyph glyph-name="format_line_spacing" unicode="format_line_spacing" 
+d="M213 235v42h256v-42h-256zM213 107v42h256v-42h-256zM213 405h256v-42h-256v42zM128 363v-214h53l-74 -74l-75 74h53v214h-53l75 74l74 -74h-53z" />
+    <glyph glyph-name="format_list_bulleted" unicode="format_list_bulleted" 
+d="M149 405h299v-42h-299v42zM149 235v42h299v-42h-299zM149 107v42h299v-42h-299zM85 160c18 0 32 -15 32 -32s-15 -32 -32 -32s-32 15 -32 32s14 32 32 32zM85 416c18 0 32 -14 32 -32s-14 -32 -32 -32s-32 14 -32 32s14 32 32 32zM85 288c18 0 32 -14 32 -32
+s-14 -32 -32 -32s-32 14 -32 32s14 32 32 32z" />
+    <glyph glyph-name="format_list_numbered" unicode="format_list_numbered" 
+d="M149 235v42h299v-42h-299zM149 107v42h299v-42h-299zM149 405h299v-42h-299v42zM43 277v22h64v-20l-39 -44h39v-22h-64v20l38 44h-38zM64 341v64h-21v22h42v-86h-21zM43 149v22h64v-86h-64v22h42v10h-21v22h21v10h-42z" />
+    <glyph glyph-name="format_paint" unicode="format_paint" 
+d="M384 427h64v-171h-171v-192c0 -12 -9 -21 -21 -21h-43c-12 0 -21 9 -21 21v235h213v85h-21v-21c0 -12 -9 -22 -21 -22h-256c-12 0 -22 10 -22 22v85c0 12 10 21 22 21h256c12 0 21 -9 21 -21v-21z" />
+    <glyph glyph-name="format_quote" unicode="format_quote" 
+d="M299 149l42 86h-64v128h128v-128l-42 -86h-64zM128 149l43 86h-64v128h128v-128l-43 -86h-64z" />
+    <glyph glyph-name="format_shapes" unicode="format_shapes" 
+d="M228 240h56l-28 82zM293 213h-75l-15 -42h-35l73 192h30l72 -192h-34zM405 405h43v43h-43v-43zM448 64v43h-43v-43h43zM363 107v42h42v214h-42v42h-214v-42h-42v-214h42v-42h214zM107 64v43h-43v-43h43zM64 448v-43h43v43h-43zM491 363h-43v-214h43v-128h-128v43h-214
+v-43h-128v128h43v214h-43v128h128v-43h214v43h128v-128z" />
+    <glyph glyph-name="format_size" unicode="format_size" 
+d="M64 256v64h192v-64h-64v-149h-64v149h-64zM192 427h277v-64h-106v-256h-64v256h-107v64z" />
+    <glyph glyph-name="format_strikethrough" unicode="format_strikethrough" 
+d="M64 213v43h384v-43h-384zM107 427h298v-64h-106v-64h-86v64h-106v64zM213 107v64h86v-64h-86z" />
+    <glyph glyph-name="format_textdirection_l_to_r" unicode="format_textdirection_l_to_r" 
+d="M448 128l-85 -85v64h-256v42h256v64zM192 299c-47 0 -85 38 -85 85s38 85 85 85h171v-42h-43v-235h-43v235h-42v-235h-43v107z" />
+    <glyph glyph-name="format_textdirection_r_to_l" unicode="format_textdirection_r_to_l" 
+d="M171 149h256v-42h-256v-64l-86 85l86 85v-64zM213 299c-47 0 -85 38 -85 85s38 85 85 85h171v-42h-43v-235h-42v235h-43v-235h-43v107z" />
+    <glyph glyph-name="format_underlined" unicode="format_underlined" 
+d="M107 107h298v-43h-298v43zM256 149c-71 0 -128 57 -128 128v171h53v-171c0 -41 34 -74 75 -74s75 33 75 74v171h53v-171c0 -71 -57 -128 -128 -128z" />
+    <glyph glyph-name="forum" unicode="forum" 
+d="M363 256c0 -12 -10 -21 -22 -21h-213l-85 -86v299c0 12 9 21 21 21h277c12 0 22 -9 22 -21v-192zM448 384c12 0 21 -9 21 -21v-320l-85 85h-235c-12 0 -21 9 -21 21v43h277v192h43z" />
+    <glyph glyph-name="forward" unicode="forward" 
+d="M256 341v86l171 -171l-171 -171v86h-171v170h171z" />
+    <glyph glyph-name="forward_10" unicode="forward_&#x31;&#x30;" 
+d="M282 188c0 -3.2653 6.32517 -7 10 -7c2 0 5 0 7 2l4 5s2 4 2 6v43c0 0 -2 4 -2 6c0 2.75261 -8.21183 7 -11 7c-2 0 -4 -1 -6 -3l-4 -4s-3 -4 -3 -6v-43s3 -4 3 -6zM322 209c0 -6 0 -13 -2 -17l-6 -13s-7 -6 -11 -6s-9 -2 -13 -2s-9 0 -13 2s-6 4 -10 6
+c-6.74403 3.37202 -9 19.7461 -9 30v15c0 6 0 13 2 17l7 13s6 6 10 6s9 2 13 2s9 0 13 -2s7 -4 11 -6s4 -7 6 -13s2 -11 2 -17v-15zM233 171h-20v70l-21 -6v15l38 12h3v-91zM85 235c0 94 77 170 171 170v86l107 -107l-107 -107v86c-70 0 -128 -58 -128 -128
+s58 -128 128 -128s128 58 128 128h43c0 -94 -77 -171 -171 -171s-171 77 -171 171z" />
+    <glyph glyph-name="forward_30" unicode="forward_&#x33;&#x30;" 
+d="M85 235c0 94 77 170 171 170v86l107 -107l-107 -107v86c-70 0 -128 -58 -128 -128s58 -128 128 -128s128 58 128 128h43c0 -94 -77 -171 -171 -171s-171 77 -171 171zM284 188c0 -3.2653 6.32517 -7 10 -7c2 0 5 0 7 2l4 5s2 4 2 6v43c0 0 -2 4 -2 6
+c0 2.75261 -8.21183 7 -11 7c-2 0 -4 -1 -6 -3l-4 -4s-2 -4 -2 -6v-43s2 -4 2 -6zM326 209c0 -6 0 -13 -2 -17l-6 -13s-7 -6 -11 -6s-9 -2 -13 -2c-10.126 0 -16.1493 4.57466 -23 8c-4 2 -4 7 -6 13s-3 11 -3 17v15c0 6 1 13 3 17l6 13s7 6 11 6s8 2 12 2s9 0 13 -2
+s7 -4 11 -6s4 -7 6 -13s2 -11 2 -17v-15zM213 224c8.11936 0 15 4.95913 15 13v4s-2 2 -2 4s-2 2 -4 2h-11s-2 -2 -4 -2s-2 -2 -2 -4v-4h-22c0 9.89385 8.81974 23 18 23c2 0 8 2 10 2c8.67272 0 17.6319 -2.81597 24 -6c5.06488 -2.53244 8 -12.109 8 -19v-7s-2 -4 -2 -6
+s-2 -4 -4 -4s-5 -3 -7 -5c4 -2 9 -4 11 -8s4 -9 4 -13s0 -9 -2 -11s-4 -6 -6 -8s-7 -4 -11 -4s-9 -2 -13 -2s-8 0 -10 2s-7 2 -11 4c-5.58093 2.79046 -9 13.5084 -9 21h18v-4s2 -2 2 -4s2 -2 4 -2h11s2 2 4 2s2 2 2 4v11s-2 2 -2 4s-2 2 -4 2h-13v15h8z" />
+    <glyph glyph-name="forward_5" unicode="forward_&#x35;" 
+d="M250 222c-1.79204 -0.716817 -7 -2.40231 -7 -4c0 -2 -2 -3 -2 -3h-13l5 47h51v-15h-37l-2 -19s2 0 2 2s3 1 3 3s2 0 4 0h4c4 0 9 -1 11 -3s6 -4 8 -6c4.43641 -4.43641 9 -13.6284 9 -23c0 -4 0 -9 -2 -11s-3 -7 -7 -11c-5.62284 -5.62284 -13.295 -8 -23 -8
+c-4 0 -9 0 -11 2s-6 2 -10 4c-5.5956 2.7978 -9 11.277 -9 19h17c0 -7.40446 5.29508 -10 13 -10c2 0 4 0 6 2l5 4s2 4 2 6v13l-2 4l-5 5s-4 2 -6 2h-4zM85 235c0 94 77 170 171 170v86l107 -107l-107 -107v86c-70 0 -128 -58 -128 -128s58 -128 128 -128s128 58 128 128h43
+c0 -94 -77 -171 -171 -171s-171 77 -171 171z" />
+    <glyph glyph-name="free_breakfast" unicode="free_breakfast" 
+d="M85 107h342v-43h-342v43zM427 341v64h-43v-64h43zM427 448c24 0 42 -19 42 -43v-64c0 -23 -18 -42 -42 -42h-43v-64c0 -47 -38 -86 -85 -86h-128c-47 0 -86 39 -86 86v213h342z" />
+    <glyph glyph-name="fullscreen" unicode="fullscreen" 
+d="M299 405h106v-106h-42v64h-64v42zM363 149v64h42v-106h-106v42h64zM107 299v106h106v-42h-64v-64h-42zM149 213v-64h64v-42h-106v106h42z" />
+    <glyph glyph-name="fullscreen_exit" unicode="fullscreen_exit" 
+d="M341 341h64v-42h-106v106h42v-64zM299 107v106h106v-42h-64v-64h-42zM171 341v64h42v-106h-106v42h64zM107 171v42h106v-106h-42v64h-64z" />
+    <glyph glyph-name="functions" unicode="functions" 
+d="M384 427v-64h-149l106 -107l-106 -107h149v-64h-256v43l139 128l-139 128v43h256z" />
+    <glyph glyph-name="g_translate" unicode="g_translate" 
+d="M448 85v278c0 12 -9 21 -21 21h-188l25 -86h41v22h23v-22h77v-22h-27c-7 -27 -22 -53 -41 -75l58 -57l-15 -16l-58 57l-19 -19l17 -59l-43 -43h150c12 0 21 9 21 21zM298 253c5 -10 13 -23 24 -36c26 31 33 59 33 59h-85l7 -23h21zM282 237l13 -47l12 11
+c-10 11 -18 23 -25 36zM237 286c0 4.92043 -0.140331 11.2807 -2 15h-84v-33h47c-3 -13 -16 -32 -45 -32c-28 0 -51 24 -51 52s23 52 51 52c16 0 26 -7 32 -13l2 -1l26 25l-2 1c-16 15 -36 23 -58 23c-48 0 -87 -39 -87 -87s39 -87 87 -87c49 0 84 35 84 85zM427 405
+c23 0 42 -19 42 -42v-278c0 -23 -19 -42 -42 -42h-171l-21 64h-150c-23 0 -42 19 -42 42v278c0 23 19 42 42 42h128l19 -64h195z" />
+    <glyph glyph-name="gamepad" unicode="gamepad" 
+d="M352 320h117v-128h-117l-64 64zM192 160l64 64l64 -64v-117h-128v117zM160 320l64 -64l-64 -64h-117v128h117zM320 352l-64 -64l-64 64v117h128v-117z" />
+    <glyph glyph-name="games" unicode="games" 
+d="M352 320h117v-128h-117l-64 64zM192 160l64 64l64 -64v-117h-128v117zM160 320l64 -64l-64 -64h-117v128h117zM320 352l-64 -64l-64 64v117h128v-117z" />
+    <glyph glyph-name="gavel" unicode="gavel" 
+d="M82 310l120 -121l-60 -60l-121 120zM263 491l120 -121l-60 -60l-121 120zM112 340l60 60l302 -302l-60 -60zM21 64h256v-43h-256v43z" />
+    <glyph glyph-name="gesture" unicode="gesture" 
+d="M296 116c15 0 40 18 46 75c-46 -12 -62 -46 -62 -59c0 -10 9 -16 16 -16zM98 365l-37 36c5 6 10 12 18 20c5 5 30 27 58 27c19 0 54 -15 54 -61c0 -29 -11 -46 -28 -70c-10 -14 -32 -52 -39 -75c-8 -23 -3 -41 7 -41c9 0 19 12 24 18c5 5 37 42 49 58c16 20 57 60 105 60
+c63 0 83 -54 86 -89h53v-53h-52c-9 -102 -66 -131 -101 -131c-38 0 -68 30 -68 66s34 101 115 115c-2 17 -3 38 -38 38c-27 0 -61 -41 -87 -73c-24 -29 -42 -52 -65 -59c-49.7758 -15.7187 -85 28.2434 -85 73c0 52 56 126 61 135c6 10 17 28 6 32c-7 3 -21 -11 -36 -26z
+" />
+    <glyph glyph-name="get_app" unicode="get_app" 
+d="M107 128h298v-43h-298v43zM405 320l-149 -149l-149 149h85v128h128v-128h85z" />
+    <glyph glyph-name="gif" unicode="gif" 
+d="M405 288h-64v-21h43v-32h-43v-43h-32v128h96v-32zM192 320c13 0 21 -10 21 -21v-11h-74v-64h42v32h32v-43c0 -11 -8 -21 -21 -21h-64c-13 0 -21 10 -21 21v86c0 11 8 21 21 21h64zM245 320h32v-128h-32v128z" />
+    <glyph glyph-name="goat" unicode="goat" 
+d="M511 318c1 -1 1 -4 0 -5l-25 -32c-1 -1 -3 -2 -4 -2l-15 3l-7 -22c-3 -5 -10 -5 -13 0l-14 30l-23 5l-47 -112l17 -136c0 -3 -2 -4 -4 -4h-20c-2 0 -3 1 -4 3l-20 81l-10 17l-25 -98c0 -2 -2 -3 -4 -3h-21c-2 0 -4 2 -4 4l23 135h-135l-35 -66l8 -68c1 -3 -1 -5 -4 -5
+h-20c-1 0 -3 0 -4 2l-28 102l-34 -39l6 -60c1 -3 -1 -5 -4 -5h-22c-2 0 -4 1 -4 2l-13 56l21 82v144s-23 9 -23 30h274c0 0 48 -1 95 33c0 0 -8 22 6 36c0 0 28 -20 36 -25c10 -6 17 5 14 14c-2 6 -9 28 -45 42c-4.57884 1.52628 -15.2106 2.3682 -13 9c0 2 2 3 4 3
+c44 -6 70 -42 77 -58c1 -2 20 -15 18 -38c0 -3 0 -5 2 -7z" />
+    <glyph glyph-name="golf_course" unicode="golf_course" 
+d="M363 386l-128 -66v-193c61 -3 106 -21 106 -42c0 -23 -57 -42 -128 -42s-128 19 -128 42c0 16 26 30 64 37v-37h43v384zM384 96c0 18 14 32 32 32s32 -14 32 -32s-14 -32 -32 -32s-32 14 -32 32z" />
+    <glyph glyph-name="gps_fixed" unicode="gps_fixed" 
+d="M256 107c83 0 149 66 149 149s-66 149 -149 149s-149 -66 -149 -149s66 -149 149 -149zM447 277h44v-42h-44c-10 -89 -81 -160 -170 -170v-44h-42v44c-89 10 -160 81 -170 170h-44v42h44c10 89 81 160 170 170v44h42v-44c89 -10 160 -81 170 -170zM256 341
+c47 0 85 -38 85 -85s-38 -85 -85 -85s-85 38 -85 85s38 85 85 85z" />
+    <glyph glyph-name="gps_not_fixed" unicode="gps_not_fixed" 
+d="M256 107c83 0 149 66 149 149s-66 149 -149 149s-149 -66 -149 -149s66 -149 149 -149zM447 277h44v-42h-44c-10 -89 -81 -160 -170 -170v-44h-42v44c-89 10 -160 81 -170 170h-44v42h44c10 89 81 160 170 170v44h42v-44c89 -10 160 -81 170 -170z" />
+    <glyph glyph-name="gps_off" unicode="gps_off" 
+d="M347 138l-209 209c-19 -25 -31 -57 -31 -91c0 -83 66 -149 149 -149c34 0 66 12 91 31zM64 421l27 27l357 -357l-27 -27l-44 44c-28 -23 -62 -39 -100 -43v-44h-42v44c-89 10 -160 81 -170 170h-44v42h44c4 38 20 72 43 100zM447 277h44v-42h-44c-3 -24 -10 -48 -21 -68
+l-32 32c7 17 11 37 11 57c0 83 -66 149 -149 149c-20 0 -40 -4 -57 -11l-32 32c21 11 44 18 68 21v44h42v-44c89 -10 160 -81 170 -170z" />
+    <glyph glyph-name="grade" unicode="grade" 
+d="M256 144l-132 -80l35 150l-116 101l153 13l60 141l60 -141l153 -13l-116 -101l35 -150z" />
+    <glyph glyph-name="gradient" unicode="gradient" 
+d="M405 277v128h-298v-128h42v-42h43v-43h43v43h42v-43h43v43h43v42h42zM363 128v43h-43v-43h43zM277 128v43h-42v-43h42zM192 128v43h-43v-43h43zM405 448c23 0 43 -20 43 -43v-298c0 -23 -20 -43 -43 -43h-298c-23 0 -43 20 -43 43v298c0 23 20 43 43 43h298zM149 320h43
+v-43h-43v43zM320 320h43v-43h-43v43zM235 320h42v-43h43v-42h-43v42h-42v-42h-43v42h43v43zM363 235v-43h42v43h-42zM149 235h-42v-43h42v43z" />
+    <glyph glyph-name="grain" unicode="grain" 
+d="M213 427c23 0 43 -20 43 -43s-20 -43 -43 -43s-42 20 -42 43s19 43 42 43zM299 341c23 0 42 -19 42 -42s-19 -43 -42 -43s-43 20 -43 43s20 42 43 42zM384 256c23 0 43 -20 43 -43s-20 -42 -43 -42s-43 19 -43 42s20 43 43 43zM299 171c23 0 42 -20 42 -43
+s-19 -43 -42 -43s-43 20 -43 43s20 43 43 43zM384 341c-23 0 -43 20 -43 43s20 43 43 43s43 -20 43 -43s-20 -43 -43 -43zM128 171c23 0 43 -20 43 -43s-20 -43 -43 -43s-43 20 -43 43s20 43 43 43zM128 341c23 0 43 -19 43 -42s-20 -43 -43 -43s-43 20 -43 43s20 42 43 42z
+M213 256c23 0 43 -20 43 -43s-20 -42 -43 -42s-42 19 -42 42s19 43 42 43z" />
+    <glyph glyph-name="graphic_eq" unicode="graphic_eq" 
+d="M405 299h43v-86h-43v86zM320 128v256h43v-256h-43zM64 213v86h43v-86h-43zM235 43v426h42v-426h-42zM149 128v256h43v-256h-43z" />
+    <glyph glyph-name="grid_off" unicode="grid_off" 
+d="M341 85h31l-31 31v-31zM299 85v74l-12 12h-74v-86h86zM171 213v74l-12 12h-74v-86h86zM171 85v86h-86v-86h86zM85 372v-31h31zM213 244v-31h31zM27 485l458 -458l-27 -27l-43 43h-330c-23 0 -42 19 -42 42v330l-43 43zM341 427v-86h86v86h-86zM171 427h-31l-43 42h330
+c23 0 42 -19 42 -42v-330l-42 43v31h-31l-43 42h74v86h-86v-74l-42 43v31h-31l-43 42h74v86h-86v-74l-42 43v31z" />
+    <glyph glyph-name="grid_on" unicode="grid_on" 
+d="M427 341v86h-86v-86h86zM427 213v86h-86v-86h86zM427 85v86h-86v-86h86zM299 341v86h-86v-86h86zM299 213v86h-86v-86h86zM299 85v86h-86v-86h86zM171 341v86h-86v-86h86zM171 213v86h-86v-86h86zM171 85v86h-86v-86h86zM427 469c23 0 42 -19 42 -42v-342
+c0 -23 -19 -42 -42 -42h-342c-23 0 -42 19 -42 42v342c0 23 19 42 42 42h342z" />
+    <glyph glyph-name="group" unicode="group" 
+d="M341 235c50 0 150 -25 150 -75v-53h-128v53c0 32 -17 56 -42 74c7 1 14 1 20 1zM171 235c50 0 149 -25 149 -75v-53h-299v53c0 50 100 75 150 75zM171 277c-35 0 -64 29 -64 64s29 64 64 64s63 -29 63 -64s-28 -64 -63 -64zM341 277c-35 0 -64 29 -64 64s29 64 64 64
+s64 -29 64 -64s-29 -64 -64 -64z" />
+    <glyph glyph-name="group_add" unicode="group_add" 
+d="M277 235c43 0 128 -21 128 -64v-43h-256v43c0 43 85 64 128 64zM419 231c43 -7 93 -27 93 -60v-43h-64v43c0 25 -11 44 -29 60zM277 277c-35 0 -64 29 -64 64s29 64 64 64s64 -29 64 -64s-29 -64 -64 -64zM384 277c-7 0 -13 1 -19 3c12 17 19 38 19 61s-7 44 -19 61
+c6 2 12 3 19 3c35 0 64 -29 64 -64s-29 -64 -64 -64zM171 299v-43h-64v-64h-43v64h-64v43h64v64h43v-64h64z" />
+    <glyph glyph-name="group_work" unicode="group_work" 
+d="M341 139c29 0 54 24 54 53s-25 53 -54 53s-53 -24 -53 -53s24 -53 53 -53zM203 341c0 -29 24 -53 53 -53s53 24 53 53s-24 54 -53 54s-53 -25 -53 -54zM171 139c29 0 53 24 53 53s-24 53 -53 53s-54 -24 -54 -53s25 -53 54 -53zM256 469c118 0 213 -95 213 -213
+s-95 -213 -213 -213s-213 95 -213 213s95 213 213 213z" />
+    <glyph glyph-name="hd" unicode="hd" 
+d="M309 224v64h43v-64h-43zM277 320v-128h86c12 0 21 9 21 21v86c0 12 -9 21 -21 21h-86zM235 192v128h-32v-53h-43v53h-32v-128h32v43h43v-43h32zM405 448c23 0 43 -20 43 -43v-298c0 -23 -20 -43 -43 -43h-298c-24 0 -43 20 -43 43v298c0 23 19 43 43 43h298z" />
+    <glyph glyph-name="hdr_off" unicode="hdr_off" 
+d="M53 459c135.424 -135.909 271.816 -270.85 408 -406l-24 -23l-162 162h-72v73l-32 32v-105h-32v53h-43v-53h-32v128h32v-43h43v43h8l-117 117zM277 288h-8l-32 32h40c17 0 32 -15 32 -32v-41l-32 32v9zM373 288v-21h43v21h-43zM373 192h-8l-24 23v105h75
+c17 0 32 -15 32 -32v-21c0 -13 -8 -26 -19 -30l19 -45h-32l-19 43h-24v-43z" />
+    <glyph glyph-name="hdr_on" unicode="hdr_on" 
+d="M277 224v64h-42v-64h42zM277 320c17 0 32 -15 32 -32v-64c0 -17 -15 -32 -32 -32h-74v128h74zM139 277v43h32v-128h-32v53h-43v-53h-32v128h32v-43h43zM416 267v21h-43v-21h43zM448 267c0 -13 -8 -24 -19 -30l19 -45h-32l-19 43h-24v-43h-32v128h75c17 0 32 -15 32 -32
+v-21z" />
+    <glyph glyph-name="hdr_strong" unicode="hdr_strong" 
+d="M107 213c23 0 42 20 42 43s-19 43 -42 43s-43 -20 -43 -43s20 -43 43 -43zM107 341c47 0 85 -38 85 -85s-38 -85 -85 -85s-86 38 -86 85s39 85 86 85zM363 384c71 0 128 -57 128 -128s-57 -128 -128 -128s-128 57 -128 128s57 128 128 128z" />
+    <glyph glyph-name="hdr_weak" unicode="hdr_weak" 
+d="M363 171c47 0 85 38 85 85s-38 85 -85 85s-86 -38 -86 -85s39 -85 86 -85zM363 384c71 0 128 -57 128 -128s-57 -128 -128 -128s-128 57 -128 128s57 128 128 128zM107 341c47 0 85 -38 85 -85s-38 -85 -85 -85s-86 38 -86 85s39 85 86 85z" />
+    <glyph glyph-name="headset" unicode="headset" 
+d="M256 491c106 0 192 -86 192 -192v-150c0 -35 -29 -64 -64 -64h-64v171h85v43c0 83 -66 149 -149 149s-149 -66 -149 -149v-43h85v-171h-64c-35 0 -64 29 -64 64v150c0 106 86 192 192 192z" />
+    <glyph glyph-name="headset_mic" unicode="headset_mic" 
+d="M256 491c106 0 192 -86 192 -192v-214c0 -35 -29 -64 -64 -64h-128v43h149v21h-85v171h85v43c0 83 -66 149 -149 149s-149 -66 -149 -149v-43h85v-171h-64c-35 0 -64 29 -64 64v150c0 106 86 192 192 192z" />
+    <glyph glyph-name="healing" unicode="healing" 
+d="M355 78l78 78l-78 77l-77 -78zM299 277c-12 0 -22 -9 -22 -21s10 -21 22 -21s21 9 21 21s-9 21 -21 21zM256 192c12 0 21 9 21 21s-9 22 -21 22s-21 -10 -21 -22s9 -21 21 -21zM213 235c12 0 22 9 22 21s-10 21 -22 21s-21 -9 -21 -21s9 -21 21 -21zM156 278l77 78
+l-77 77l-78 -78zM256 320c-12 0 -21 -9 -21 -21s9 -22 21 -22s21 10 21 22s-9 21 -21 21zM378 256l85 -85c8 -8 8 -22 0 -30l-92 -93c-4 -4 -9 -6 -15 -6s-12 2 -16 6l-84 85l-85 -85c-8 -8 -22 -8 -30 0l-93 93c-8 8 -8 22 0 30l85 85l-85 84c-8 8 -8 23 0 31l93 92
+c4 4 10 6 15 6c6 0 11 -2 15 -6l85 -85l84 85c8 8 23 8 31 0l92 -92c8 -8 8 -23 0 -31z" />
+    <glyph glyph-name="hearing" unicode="hearing" 
+d="M245 320c0 29 25 53 54 53s53 -24 53 -53s-24 -53 -53 -53s-54 24 -54 53zM163 456c-35 -35 -56 -83 -56 -136s21 -101 56 -136l-30 -30c-42 42 -69 101 -69 166s27 124 69 166zM363 85c23 0 42 20 42 43h43c0 -47 -38 -85 -85 -85c-12 0 -24 2 -35 7
+c-29 15 -46 37 -59 76c-7 21 -19 31 -36 44c-19 14 -42 32 -61 67c-15 27 -23 56 -23 83c0 84 66 149 150 149s149 -65 149 -149h-43c0 60 -46 107 -106 107s-107 -47 -107 -107c0 -20 6 -43 17 -63c15 -28 33 -41 50 -54c20 -15 40 -31 51 -64c11 -32 21 -42 36 -50
+c4 -2 11 -4 17 -4z" />
+    <glyph glyph-name="help" unicode="help" 
+d="M321 272c12 12 20 29 20 48c0 47 -38 85 -85 85s-85 -38 -85 -85h42c0 23 20 43 43 43s43 -20 43 -43c0 -12 -5 -22 -13 -30l-26 -27c-15 -16 -25 -37 -25 -60v-11h42c0 32 10 44 25 60zM277 107v42h-42v-42h42zM256 469c118 0 213 -95 213 -213s-95 -213 -213 -213
+s-213 95 -213 213s95 213 213 213z" />
+    <glyph glyph-name="help_outline" unicode="help_outline" 
+d="M256 384c47 0 85 -38 85 -85c0 -53 -64 -59 -64 -107h-42c0 69 64 64 64 107c0 23 -20 42 -43 42s-43 -19 -43 -42h-42c0 47 38 85 85 85zM256 85c94 0 171 77 171 171s-77 171 -171 171s-171 -77 -171 -171s77 -171 171 -171zM256 469c118 0 213 -95 213 -213
+s-95 -213 -213 -213s-213 95 -213 213s95 213 213 213zM235 128v43h42v-43h-42z" />
+    <glyph glyph-name="high_quality" unicode="high_quality" 
+d="M309 224v64h43v-64h-43zM384 213v86c0 12 -9 21 -21 21h-64c-12 0 -22 -9 -22 -21v-86c0 -12 10 -21 22 -21h16v-32h32v32h16c12 0 21 9 21 21zM235 192v128h-32v-53h-43v53h-32v-128h32v43h43v-43h32zM405 427c23 0 43 -20 43 -43v-256c0 -23 -20 -43 -43 -43h-298
+c-24 0 -43 20 -43 43v256c0 23 19 43 43 43h298z" />
+    <glyph glyph-name="highlight" unicode="highlight" 
+d="M362 372l45 45l30 -30l-45 -46zM75 387l30 30l45 -45l-30 -31zM235 469h42v-64h-42v64zM128 213v107h256v-107l-64 -64v-106h-128v106z" />
+    <glyph glyph-name="highlight_off" unicode="highlight_off" 
+d="M256 85c94 0 171 77 171 171s-77 171 -171 171s-171 -77 -171 -171s77 -171 171 -171zM256 469c118 0 213 -95 213 -213s-95 -213 -213 -213s-213 95 -213 213s95 213 213 213zM311 341l30 -30l-55 -55l55 -55l-30 -30l-55 55l-55 -55l-30 30l55 55l-55 55l30 30l55 -55z
+" />
+    <glyph glyph-name="history" unicode="history" 
+d="M256 341h32v-90l75 -45l-16 -26l-91 55v106zM277 448c106 0 192 -86 192 -192s-86 -192 -192 -192c-53 0 -100 21 -135 56l30 31c27 -27 64 -44 105 -44c83 0 150 66 150 149s-67 149 -150 149s-149 -66 -149 -149h64l-86 -86l-2 3l-83 83h64c0 106 86 192 192 192z" />
+    <glyph glyph-name="home" unicode="home" 
+d="M213 85h-106v171h-64l213 192l213 -192h-64v-171h-106v128h-86v-128z" />
+    <glyph glyph-name="hot_tub" unicode="hot_tub" 
+d="M313 387c22 -21 31 -50 27 -79l-1 -9h-41l3 12c3.05626 17.3188 -3.40602 35.406 -16 48c-22 22 -32 51 -28 80l1 9h41l-2 -13c-3 -17 2 -34 14 -47zM398 387c22 -21 32 -50 28 -79l-2 -9h-40l2 12c3 17 -2 34 -14 47l-2 1c-22 22 -32 51 -28 80l2 9h40l-2 -13
+c-3 -17 2 -34 14 -47zM405 85v128h-42v-128h42zM320 85v128h-43v-128h43zM235 85v128h-43v-128h43zM149 85v128h-42v-128h42zM238 256h231v-171c0 -23 -19 -42 -42 -42h-342c-23 0 -42 19 -42 42v171h64v16c0 26 22 48 48 48c15.3845 0 28.1542 -8.15417 36 -16l29 -33
+c5 -6 11 -10 18 -15zM107 384c0 24 18 43 42 43s43 -19 43 -43s-19 -43 -43 -43s-42 19 -42 43z" />
+    <glyph glyph-name="hotel" unicode="hotel" 
+d="M405 363c47 0 86 -39 86 -86v-192h-43v64h-384v-64h-43v320h43v-192h171v150h170zM149 235c-35 0 -64 29 -64 64s29 64 64 64s64 -29 64 -64s-29 -64 -64 -64z" />
+    <glyph glyph-name="hourglass_empty" unicode="hourglass_empty" 
+d="M256 267l85 85v75h-170v-75zM341 160l-85 85l-85 -85v-75h170v75zM128 469h256v-128l-85 -85l85 -85v-128h-256v128l85 85l-85 85v128z" />
+    <glyph glyph-name="hourglass_full" unicode="hourglass_full" 
+d="M128 469h256v-128l-85 -85l85 -85v-128h-256v128l85 85l-85 85v128z" />
+    <glyph glyph-name="http" unicode="http" 
+d="M459 267v21h-43v-21h43zM459 320c17 0 32 -15 32 -32v-21c0 -17 -15 -32 -32 -32h-43v-43h-32v128h75zM267 288v32h96v-32h-32v-96h-32v96h-32zM149 288v32h96v-32h-32v-96h-32v96h-32zM96 277v43h32v-128h-32v53h-43v-53h-32v128h32v-43h43z" />
+    <glyph glyph-name="https" unicode="https" 
+d="M322 341v43c0 36 -30 66 -66 66s-66 -30 -66 -66v-43h132zM256 149c23 0 43 20 43 43s-20 43 -43 43s-43 -20 -43 -43s20 -43 43 -43zM384 341c23 0 43 -19 43 -42v-214c0 -23 -20 -42 -43 -42h-256c-23 0 -43 19 -43 42v214c0 23 20 42 43 42h21v43c0 59 48 107 107 107
+s107 -48 107 -107v-43h21z" />
+    <glyph glyph-name="image" unicode="image" 
+d="M181 224l-74 -96h298l-96 128l-74 -96zM448 107c0 -23 -20 -43 -43 -43h-298c-23 0 -43 20 -43 43v298c0 23 20 43 43 43h298c23 0 43 -20 43 -43v-298z" />
+    <glyph glyph-name="image_aspect_ratio" unicode="image_aspect_ratio" 
+d="M427 128v256h-342v-256h342zM427 427c23 0 42 -20 42 -43v-256c0 -23 -19 -43 -42 -43h-342c-23 0 -42 20 -42 43v256c0 23 19 43 42 43h342zM256 299v-43h-43v43h43zM171 299v-43h-43v43h43zM341 213v-42h-42v42h42zM341 299v-43h-42v43h42z" />
+    <glyph glyph-name="import_contacts" unicode="import_contacts" 
+d="M448 117v246c-23 7 -49 10 -75 10c-36 0 -88 -14 -117 -32v-245c29 18 81 32 117 32c26 0 52 -4 75 -11zM373 416c44.2046 0 90.7488 -11.0375 118 -32v-311c0 -5 -6 -11 -11 -11c-2 0 -3 0 -5 1c-30 16 -67 22 -102 22c-36 0 -88 -14 -117 -32c-31 23 -75 32 -117 32
+c-31 0 -73 -9 -102 -23c-2 0 -3 -1 -5 -1c-5 0 -11 5 -11 10v313c31 23 76 32 118 32s86 -9 117 -32c31 23 75 32 117 32z" />
+    <glyph glyph-name="import_export" unicode="import_export" 
+d="M341 149h64l-85 -85l-85 85h64v150h42v-150zM192 448l85 -85h-64v-150h-42v150h-64z" />
+    <glyph glyph-name="important_devices" unicode="important_devices" 
+d="M255 320h65l-53 -38l20 -62l-52 39l-53 -39l20 62l-53 38h65l21 64zM427 469c23 0 42 -18 42 -42v-107h-42v107h-384v-256h277v-43h-43v-43h43v-42h-171v42h43v43h-149c-24 0 -43 20 -43 43v256c0 24 19 42 43 42h384zM491 85v150h-107v-150h107zM491 277
+c12 0 21 -9 21 -21v-192c0 -12 -9 -21 -21 -21h-107c-12 0 -21 9 -21 21v192c0 12 9 21 21 21h107z" />
+    <glyph glyph-name="inbox" unicode="inbox" 
+d="M405 192v213h-299v-213h86c0 -35 29 -64 64 -64s64 29 64 64h85zM405 448c23 0 43 -19 43 -43v-298c0 -23 -20 -43 -43 -43h-299c-24 0 -42 20 -42 43v298c0 24 18 43 42 43h299z" />
+    <glyph glyph-name="indeterminate_check_box" unicode="indeterminate_check_box" 
+d="M363 235v42h-214v-42h214zM405 448c23 0 43 -20 43 -43v-298c0 -23 -20 -43 -43 -43h-298c-23 0 -43 20 -43 43v298c0 23 20 43 43 43h298z" />
+    <glyph glyph-name="info" unicode="info" 
+d="M277 320v43h-42v-43h42zM277 149v128h-42v-128h42zM256 469c118 0 213 -95 213 -213s-95 -213 -213 -213s-213 95 -213 213s95 213 213 213z" />
+    <glyph glyph-name="info_outline" unicode="info_outline" 
+d="M235 320v43h42v-43h-42zM256 85c94 0 171 77 171 171s-77 171 -171 171s-171 -77 -171 -171s77 -171 171 -171zM256 469c118 0 213 -95 213 -213s-95 -213 -213 -213s-213 95 -213 213s95 213 213 213zM235 149v128h42v-128h-42z" />
+    <glyph glyph-name="input" unicode="input" 
+d="M235 171v64h-214v42h214v64l85 -85zM448 448c23 0 43 -19 43 -43v-299c0 -23 -20 -42 -43 -42h-384c-23 0 -43 19 -43 42v86h43v-86h384v300h-384v-86h-43v85c0 23 20 43 43 43h384z" />
+    <glyph glyph-name="insert_chart" unicode="insert_chart" 
+d="M363 149v86h-43v-86h43zM277 149v214h-42v-214h42zM192 149v150h-43v-150h43zM405 448c23 0 43 -20 43 -43v-298c0 -23 -20 -43 -43 -43h-298c-23 0 -43 20 -43 43v298c0 23 20 43 43 43h298z" />
+    <glyph glyph-name="insert_comment" unicode="insert_comment" 
+d="M384 341v43h-256v-43h256zM384 277v43h-256v-43h256zM384 213v43h-256v-43h256zM427 469c23 0 42 -19 42 -42v-384l-85 85h-299c-23 0 -42 20 -42 43v256c0 23 19 42 42 42h342z" />
+    <glyph glyph-name="insert_drive_file" unicode="insert_drive_file" 
+d="M277 320h118l-118 117v-117zM128 469h171l128 -128v-256c0 -23 -20 -42 -43 -42h-256c-23 0 -43 19 -43 42l1 342c0 23 19 42 42 42z" />
+    <glyph glyph-name="insert_emoticon" unicode="insert_emoticon" 
+d="M256 139c-50 0 -92 30 -109 74h218c-17 -44 -59 -74 -109 -74zM181 277c-18 0 -32 14 -32 32s14 32 32 32s32 -14 32 -32s-14 -32 -32 -32zM331 277c-18 0 -32 14 -32 32s14 32 32 32s32 -14 32 -32s-14 -32 -32 -32zM256 85c94 0 171 77 171 171s-77 171 -171 171
+s-171 -77 -171 -171s77 -171 171 -171zM256 469c118 0 213 -95 213 -213s-95 -213 -213 -213s-213 95 -213 213s95 213 213 213z" />
+    <glyph glyph-name="insert_invitation" unicode="insert_invitation" 
+d="M405 107v234h-298v-234h298zM341 491h43v-43h21c23 0 43 -20 43 -43v-298c0 -23 -20 -43 -43 -43h-298c-24 0 -43 20 -43 43v298c0 23 19 43 43 43h21v43h43v-43h170v43zM363 256v-107h-107v107h107z" />
+    <glyph glyph-name="insert_link" unicode="insert_link" 
+d="M363 363c59 0 106 -48 106 -107s-47 -107 -106 -107h-86v41h86c36 0 66 30 66 66s-30 66 -66 66h-86v41h86zM171 235v42h170v-42h-170zM83 256c0 -36 30 -66 66 -66h86v-41h-86c-59 0 -106 48 -106 107s47 107 106 107h86v-41h-86c-36 0 -66 -30 -66 -66z" />
+    <glyph glyph-name="insert_photo" unicode="insert_photo" 
+d="M181 224l-74 -96h298l-96 128l-74 -96zM448 107c0 -23 -20 -43 -43 -43h-298c-23 0 -43 20 -43 43v298c0 23 20 43 43 43h298c23 0 43 -20 43 -43v-298z" />
+    <glyph glyph-name="invert_colors" unicode="invert_colors" 
+d="M256 94v309l-90 -90c-24 -24 -38 -57 -38 -91c0 -68.7916 59.1998 -128 128 -128zM377 343c67 -67 67 -174 0 -241c-33 -33 -77 -50 -121 -50s-88 17 -121 50c-67 67 -67 174 0 241l121 121z" />
+    <glyph glyph-name="invert_colors_off" unicode="invert_colors_off" 
+d="M256 403l-49 -48l-30 30l79 79l121 -121c52 -52 63 -129 34 -192l-155 154v98zM256 94v103l-102 102c-17 -22 -26 -49 -26 -77c0 -68.7916 59.1998 -128 128 -128zM441 67l7 -8l-27 -27l-58 58c-31 -25 -69 -38 -107 -38c-44 0 -88 17 -121 50c-62 63 -66 161 -12 228
+l-59 59l27 27c116.495 -116.495 232.353 -233.66 350 -349z" />
+    <glyph glyph-name="iso" unicode="iso" 
+d="M363 149h-107v32h107v-32zM405 107v298l-298 -298h298zM117 352v-32h43v-43h32v43h43v32h-43v43h-32v-43h-43zM405 448c23 0 43 -20 43 -43v-298c0 -23 -20 -43 -43 -43h-298c-23 0 -43 20 -43 43v298c0 23 20 43 43 43h298z" />
+    <glyph glyph-name="keyboard" unicode="keyboard" 
+d="M405 299v42h-42v-42h42zM405 235v42h-42v-42h42zM341 299v42h-42v-42h42zM341 235v42h-42v-42h42zM341 149v43h-170v-43h170zM149 299v42h-42v-42h42zM149 235v42h-42v-42h42zM171 277v-42h42v42h-42zM171 341v-42h42v42h-42zM235 277v-42h42v42h-42zM235 341v-42h42v42
+h-42zM427 405c23 0 42 -19 42 -42v-214c0 -23 -19 -42 -42 -42h-342c-23 0 -42 19 -42 42v214c0 23 19 42 42 42h342z" />
+    <glyph glyph-name="keyboard_arrow_down" unicode="keyboard_arrow_down" 
+d="M158 345l98 -98l98 98l30 -30l-128 -128l-128 128z" />
+    <glyph glyph-name="keyboard_arrow_left" unicode="keyboard_arrow_left" 
+d="M329 169l-30 -30l-128 128l128 128l30 -30l-98 -98z" />
+    <glyph glyph-name="keyboard_arrow_right" unicode="keyboard_arrow_right" 
+d="M183 163l98 98l-98 98l30 30l128 -128l-128 -128z" />
+    <glyph glyph-name="keyboard_arrow_up" unicode="keyboard_arrow_up" 
+d="M158 183l-30 30l128 128l128 -128l-30 -30l-98 98z" />
+    <glyph glyph-name="keyboard_backspace" unicode="keyboard_backspace" 
+d="M448 277v-42h-302l76 -77l-30 -30l-128 128l128 128l30 -30l-76 -77h302z" />
+    <glyph glyph-name="keyboard_capslock" unicode="keyboard_capslock" 
+d="M128 128v43h256v-43h-256zM256 333l-98 -98l-30 30l128 128l128 -128l-30 -30z" />
+    <glyph glyph-name="keyboard_hide" unicode="keyboard_hide" 
+d="M256 21l-85 86h170zM405 341v43h-42v-43h42zM405 277v43h-42v-43h42zM341 341v43h-42v-43h42zM341 277v43h-42v-43h42zM341 192v43h-170v-43h170zM149 341v43h-42v-43h42zM149 277v43h-42v-43h42zM171 320v-43h42v43h-42zM171 384v-43h42v43h-42zM235 320v-43h42v43h-42z
+M235 384v-43h42v43h-42zM427 448c23 0 42 -20 42 -43v-213c0 -23 -19 -43 -42 -43h-342c-23 0 -42 20 -42 43v213c0 23 19 43 42 43h342z" />
+    <glyph glyph-name="keyboard_return" unicode="keyboard_return" 
+d="M405 363h43v-128h-324l77 -77l-30 -30l-128 128l128 128l30 -30l-77 -77h281v86z" />
+    <glyph glyph-name="keyboard_tab" unicode="keyboard_tab" 
+d="M427 384h42v-256h-42v256zM247 354l30 30l128 -128l-128 -128l-30 30l77 77h-303v42h303z" />
+    <glyph glyph-name="keyboard_voice" unicode="keyboard_voice" 
+d="M369 256h36c0 -73 -58 -133 -128 -143v-70h-42v70c-70 10 -128 70 -128 143h36c0 -64 54 -109 113 -109s113 45 113 109zM256 192c-35 0 -64 29 -64 64v128c0 35 29 64 64 64s64 -29 64 -64v-128c0 -35 -29 -64 -64 -64z" />
+    <glyph glyph-name="kitchen" unicode="kitchen" 
+d="M171 256h42v-107h-42v107zM171 405h42v-64h-42v64zM384 320v107h-256v-107h256zM384 85v193h-256v-193h256zM384 469c23 0 43 -18 43 -42v-342c0 -23 -20 -42 -43 -42h-256c-23 0 -43 19 -43 42v342c0 24 20 42 43 42h256z" />
+    <glyph glyph-name="label" unicode="label" 
+d="M376 387l93 -131l-93 -131c-8 -11 -21 -18 -35 -18h-234c-23 0 -43 19 -43 42v214c0 23 20 42 43 42h234c14 0 27 -7 35 -18z" />
+    <glyph glyph-name="label_outline" unicode="label_outline" 
+d="M341 149l76 107l-76 107h-234v-214h234zM376 387l93 -131l-93 -131c-8 -11 -21 -18 -35 -18h-234c-23 0 -43 19 -43 42v214c0 23 20 42 43 42h234c14 0 27 -7 35 -18z" />
+    <glyph glyph-name="landscape" unicode="landscape" 
+d="M299 384l192 -256h-470l128 171l96 -128l34 25l-60 81z" />
+    <glyph glyph-name="language" unicode="language" 
+d="M349 213h72c3 14 6 28 6 43s-3 29 -6 43h-72c2 -14 3 -28 3 -43s-1 -29 -3 -43zM311 95c39 13 73 41 93 76h-63c-7 -27 -17 -52 -30 -76zM306 213c2 14 3 28 3 43s-1 29 -3 43h-100c-2 -14 -3 -28 -3 -43s1 -29 3 -43h100zM256 86c18 26 32 54 41 85h-82
+c9 -31 23 -59 41 -85zM171 341c7 27 17 52 30 76c-39 -13 -73 -41 -93 -76h63zM108 171c20 -35 54 -63 93 -76c-13 24 -23 49 -30 76h-63zM91 213h72c-2 14 -3 28 -3 43s1 29 3 43h-72c-3 -14 -6 -28 -6 -43s3 -29 6 -43zM256 426c-18 -26 -32 -54 -41 -85h82
+c-9 31 -23 59 -41 85zM404 341c-20 35 -54 63 -93 76c13 -24 23 -49 30 -76h63zM256 469c118 0 213 -95 213 -213s-95 -213 -213 -213s-213 95 -213 213s95 213 213 213z" />
+    <glyph glyph-name="laptop" unicode="laptop" 
+d="M85 384v-213h342v213h-342zM427 128h85v-43h-512v43h85c-23 0 -42 20 -42 43v213c0 23 19 43 42 43h342c23 0 42 -20 42 -43v-213c0 -23 -19 -43 -42 -43z" />
+    <glyph glyph-name="laptop_chromebook" unicode="laptop_chromebook" 
+d="M427 192v213h-342v-213h342zM299 128v21h-86v-21h86zM469 128h43v-43h-512v43h43v320h426v-320z" />
+    <glyph glyph-name="laptop_mac" unicode="laptop_mac" 
+d="M256 107c12 0 21 9 21 21s-9 21 -21 21s-21 -9 -21 -21s9 -21 21 -21zM85 405v-234h342v234h-342zM427 128h85c0 -23 -20 -43 -43 -43h-426c-23 0 -43 20 -43 43h85c-23 0 -42 20 -42 43v234c0 23 19 43 42 43h342c23 0 42 -20 42 -43v-234c0 -23 -19 -43 -42 -43z" />
+    <glyph glyph-name="laptop_windows" unicode="laptop_windows" 
+d="M85 405v-213h342v213h-342zM427 128h85v-43h-512v43h85v21c-23 0 -42 20 -42 43v213c0 23 19 43 42 43h342c23 0 42 -20 42 -43v-213c0 -23 -19 -43 -42 -43v-21z" />
+    <glyph glyph-name="last_page" unicode="last_page" 
+d="M341 384h43v-256h-43v256zM119 354l30 30l128 -128l-128 -128l-30 30l98 98z" />
+    <glyph glyph-name="launch" unicode="launch" 
+d="M299 448h149v-149h-43v76l-209 -209l-30 30l209 209h-76v43zM405 107v149h43v-149c0 -23 -20 -43 -43 -43h-298c-24 0 -43 20 -43 43v298c0 23 19 43 43 43h149v-43h-149v-298h298z" />
+    <glyph glyph-name="layers" unicode="layers" 
+d="M256 171c-64.012 49.6547 -127.813 99.5201 -192 149l192 149l192 -149c-64.1875 -49.4791 -127.987 -99.3464 -192 -149zM256 116l157 123l35 -27l-192 -149l-192 149l35 27z" />
+    <glyph glyph-name="layers_clear" unicode="layers_clear" 
+d="M70 491l399 -400l-27 -27l-80 81l-106 -82l-192 149l35 27l157 -123l75 59l-30 30l-45 -34c-64.012 49.6547 -127.813 99.5201 -192 149l69 54l-90 90zM448 320c-28.8803 -22.1197 -57.4315 -44.5685 -86 -67l-168 168l62 48zM423 192l-31 31l25 19l31 -30z" />
+    <glyph glyph-name="leak_add" unicode="leak_add" 
+d="M299 64c0 83 66 149 149 149v-42c-59 0 -107 -48 -107 -107h-42zM384 64c0 35 29 64 64 64v-64h-64zM213 64c0 129 106 235 235 235v-43c-106 0 -192 -86 -192 -192h-43zM213 448c0 -83 -66 -149 -149 -149v42c59 0 107 48 107 107h42zM299 448
+c0 -129 -105 -235 -235 -235v43c106 0 192 86 192 192h43zM128 448c0 -35 -29 -64 -64 -64v64h64z" />
+    <glyph glyph-name="leak_remove" unicode="leak_remove" 
+d="M328 265c35 21 76 34 120 34v-43c-32 0 -62 -8 -89 -22zM425 168l-34 34c17 7 37 11 57 11v-42c-8 0 -16 -1 -23 -3zM299 448c0 -44 -13 -85 -34 -120l-31 31c14 27 22 57 22 89h43zM64 421l27 27l357 -357l-27 -27l-61 61c-12 -17 -19 -38 -19 -61h-42c0 34 12 66 31 91
+l-31 30c-27 -33 -43 -75 -43 -121h-43c0 58 21 111 56 152l-53 53c-41 -35 -94 -56 -152 -56v43c46 0 89 16 122 43l-31 31c-25 -19 -57 -31 -91 -31v42c23 0 44 7 61 19zM213 448c0 -20 -4 -40 -11 -57l-34 34c2 7 3 15 3 23h42z" />
+    <glyph glyph-name="lens" unicode="lens" 
+d="M256 469c118 0 213 -95 213 -213s-95 -213 -213 -213s-213 95 -213 213s95 213 213 213z" />
+    <glyph glyph-name="library_add" unicode="library_add" 
+d="M405 277v43h-85v85h-43v-85h-85v-43h85v-85h43v85h85zM427 469c23 0 42 -19 42 -42v-256c0 -23 -19 -43 -42 -43h-256c-23 0 -43 20 -43 43v256c0 23 20 42 43 42h256zM85 384v-299h299v-42h-299c-23 0 -42 19 -42 42v299h42z" />
+    <glyph glyph-name="library_books" unicode="library_books" 
+d="M405 363v42h-213v-42h213zM320 192v43h-128v-43h128zM405 277v43h-213v-43h213zM427 469c23 0 42 -19 42 -42v-256c0 -23 -19 -43 -42 -43h-256c-23 0 -43 20 -43 43v256c0 23 20 42 43 42h256zM85 384v-299h299v-42h-299c-23 0 -42 19 -42 42v299h42z" />
+    <glyph glyph-name="library_music" unicode="library_music" 
+d="M85 384v-299h299v-42h-299c-23 0 -42 19 -42 42v299h42zM384 363v42h-85v-117c-9 7 -20 11 -32 11c-29 0 -54 -25 -54 -54s25 -53 54 -53s53 24 53 53v118h64zM427 469c23 0 42 -19 42 -42v-256c0 -23 -19 -43 -42 -43h-256c-23 0 -43 20 -43 43v256c0 23 20 42 43 42
+h256z" />
+    <glyph glyph-name="lightbulb_outline" unicode="lightbulb_outline" 
+d="M317 233c29 20 46 52 46 87c0 59 -48 107 -107 107s-107 -48 -107 -107c0 -35 17 -67 46 -87l18 -13v-49h86v49zM256 469c82 0 149 -67 149 -149c0 -51 -25 -95 -64 -122v-49c0 -12 -9 -21 -21 -21h-128c-12 0 -21 9 -21 21v49c-39 27 -64 71 -64 122
+c0 82 67 149 149 149zM192 64v21h128v-21c0 -12 -9 -21 -21 -21h-86c-12 0 -21 9 -21 21z" />
+    <glyph glyph-name="line_style" unicode="line_style" 
+d="M64 427h384v-86h-384v86zM277 256v43h171v-43h-171zM64 256v43h171v-43h-171zM405 85v43h43v-43h-43zM320 85v43h43v-43h-43zM235 85v43h42v-43h-42zM149 85v43h43v-43h-43zM64 85v43h43v-43h-43zM341 171v42h107v-42h-107zM203 171v42h106v-42h-106zM64 171v42h107v-42
+h-107z" />
+    <glyph glyph-name="line_weight" unicode="line_weight" 
+d="M64 427h384v-86h-384v86zM64 235v64h384v-64h-384zM64 85v22h384v-22h-384zM64 149v43h384v-43h-384z" />
+    <glyph glyph-name="linear_scale" unicode="linear_scale" 
+d="M416 309c29 0 53 -24 53 -53s-24 -53 -53 -53c-22 0 -41 13 -49 32h-62c-8 -19 -27 -32 -49 -32s-41 13 -49 32h-62c-8 -19 -27 -32 -49 -32c-29 0 -53 24 -53 53s24 53 53 53c22 0 41 -13 49 -32h62c8 19 27 32 49 32s41 -13 49 -32h62c8 19 27 32 49 32z" />
+    <glyph glyph-name="link" unicode="link" 
+d="M363 363c59 0 106 -48 106 -107s-47 -107 -106 -107h-86v41h86c36 0 66 30 66 66s-30 66 -66 66h-86v41h86zM171 235v42h170v-42h-170zM83 256c0 -36 30 -66 66 -66h86v-41h-86c-59 0 -106 48 -106 107s47 107 106 107h86v-41h-86c-36 0 -66 -30 -66 -66z" />
+    <glyph glyph-name="linked_camera" unicode="linked_camera" 
+d="M341 384c24 0 43 -19 43 -43h28c0 39 -32 71 -71 71v-28zM256 107c59 0 107 47 107 106s-48 107 -107 107s-107 -48 -107 -107s48 -106 107 -106zM363 320h106v-235c0 -23 -19 -42 -42 -42h-342c-23 0 -42 19 -42 42v256c0 23 19 43 42 43h68l39 43h128v-64
+c24 0 43 -19 43 -43zM341 441v28c71 0 128 -57 128 -128h-28c0 55 -45 100 -100 100zM188 213c0 38 30 69 68 69s68 -31 68 -69s-30 -68 -68 -68s-68 30 -68 68z" />
+    <glyph glyph-name="list" unicode="list" 
+d="M149 363h299v-43h-299v43zM149 149v43h299v-43h-299zM149 235v42h299v-42h-299zM64 320v43h43v-43h-43zM64 149v43h43v-43h-43zM64 235v42h43v-42h-43z" />
+    <glyph glyph-name="live_help" unicode="live_help" 
+d="M321 293c12 12 20 29 20 48c0 47 -38 86 -85 86s-85 -39 -85 -86h42c0 23 20 43 43 43s43 -20 43 -43c0 -12 -5 -22 -13 -30l-26 -27c-15 -16 -25 -37 -25 -60v-11h42c0 32 10 45 25 61zM277 128v43h-42v-43h42zM405 469c23 0 43 -19 43 -42v-299c0 -23 -20 -43 -43 -43
+h-85l-64 -64l-64 64h-85c-24 0 -43 20 -43 43v299c0 23 19 42 43 42h298z" />
+    <glyph glyph-name="live_tv" unicode="live_tv" 
+d="M192 299l149 -86l-149 -85v171zM448 85v256h-384v-256h384zM448 384c23 0 43 -19 43 -43v-256c0 -23 -20 -42 -43 -42h-384c-23 0 -43 19 -43 42v256c0 24 20 43 43 43h162l-70 70l15 15l85 -85l85 85l15 -15l-70 -70h162z" />
+    <glyph glyph-name="local_activity" unicode="local_activity" 
+d="M332 154l-23 87l70 58l-90 5l-33 84l-33 -84l-91 -5l71 -58l-23 -87l76 49zM427 256c0 -23 19 -43 42 -43v-85c0 -23 -19 -43 -42 -43h-342c-23 0 -42 20 -42 43v85c24 0 42 20 42 43s-19 43 -42 43v85c0 23 19 43 42 43h342c23 0 42 -20 42 -43v-85
+c-23 0 -42 -20 -42 -43z" />
+    <glyph glyph-name="local_airport" unicode="local_airport" 
+d="M448 171l-171 53v-117l43 -32v-32l-75 21l-74 -21v32l42 32v117l-170 -53v42l170 107v117c0 18 14 32 32 32s32 -14 32 -32v-117l171 -107v-42z" />
+    <glyph glyph-name="local_atm" unicode="local_atm" 
+d="M427 128v256h-342v-256h342zM427 427c24 0 42 -19 42 -43v-256c0 -24 -18 -43 -42 -43h-342c-24 0 -42 19 -42 43v256c0 24 18 43 42 43h342zM235 149v22h-43v42h85v22h-64c-12 0 -21 9 -21 21v64c0 12 9 21 21 21h22v22h42v-22h43v-42h-85v-22h64c12 0 21 -9 21 -21v-64
+c0 -12 -9 -21 -21 -21h-22v-22h-42z" />
+    <glyph glyph-name="local_bar" unicode="local_bar" 
+d="M159 363h194l38 42h-270zM448 405l-171 -192v-106h107v-43h-256v43h107v106l-171 192v43h384v-43z" />
+    <glyph glyph-name="local_cafe" unicode="local_cafe" 
+d="M43 64v43h384v-43h-384zM427 341v64h-43v-64h43zM427 448c24 0 42 -19 42 -43v-64c0 -24 -18 -42 -42 -42h-43v-64c0 -47 -38 -86 -85 -86h-128c-47 0 -86 39 -86 86v213h342z" />
+    <glyph glyph-name="local_car_wash" unicode="local_car_wash" 
+d="M107 235h298l-32 96h-234zM373 128c18 0 32 14 32 32s-14 32 -32 32s-32 -14 -32 -32s14 -32 32 -32zM139 128c18 0 32 14 32 32s-14 32 -32 32s-32 -14 -32 -32s14 -32 32 -32zM404 341l44 -128v-170c0 -12 -9 -22 -21 -22h-22c-12 0 -21 10 -21 22v21h-256v-21
+c0 -12 -9 -22 -21 -22h-22c-12 0 -21 10 -21 22v170l44 128c4 13 17 22 31 22h234c14 0 27 -9 31 -22zM149 405c-18 0 -32 14 -32 32c0 21 32 58 32 58s32 -37 32 -58c0 -18 -14 -32 -32 -32zM256 405c-18 0 -32 14 -32 32c0 21 32 58 32 58s32 -37 32 -58
+c0 -18 -14 -32 -32 -32zM363 405c-18 0 -32 14 -32 32c0 21 32 58 32 58s32 -37 32 -58c0 -18 -14 -32 -32 -32z" />
+    <glyph glyph-name="local_convenience_store" unicode="local_convenience_store" 
+d="M341 256v107h-21v-43h-21v43h-22v-64h43v-43h21zM235 299v64h-64v-22h42v-21h-42v-64h64v21h-43v22h43zM405 363h64v-278h-170v86h-86v-86h-170v278h64v64h298v-64z" />
+    <glyph glyph-name="local_dining" unicode="local_dining" 
+d="M317 266l-31 -31l147 -147l-30 -30l-147 147l-147 -147l-30 30l208 208c-15 33 -4 79 30 113c41 41 99 48 130 17s24 -90 -17 -131c-34 -34 -80 -44 -113 -29zM173 227l-90 90c-33 33 -33 87 0 120l150 -149z" />
+    <glyph glyph-name="local_drink" unicode="local_drink" 
+d="M391 341l9 86h-288l9 -86h270zM256 107c35 0 64 29 64 64c0 43 -64 115 -64 115s-64 -72 -64 -115c0 -35 29 -64 64 -64zM64 469h384l-43 -389c-3 -21 -20 -37 -42 -37h-214c-22 0 -39 16 -42 37z" />
+    <glyph glyph-name="local_florist" unicode="local_florist" 
+d="M256 395c-29 0 -53 -25 -53 -54s24 -53 53 -53s53 24 53 53s-24 54 -53 54zM119 293c0 21 13 39 31 48c-18 9 -31 27 -31 48c0 29 25 54 54 54c11 0 21 -4 30 -10v4c0 29 24 54 53 54s53 -25 53 -54v-4c9 6 19 10 30 10c29 0 54 -25 54 -54c0 -21 -13 -39 -31 -48
+c18 -9 31 -27 31 -48c0 -29 -25 -53 -54 -53c-11 0 -21 3 -30 9v-4c0 -29 -24 -53 -53 -53s-53 24 -53 53v4c-9 -6 -19 -9 -30 -9c-29 0 -54 24 -54 53zM256 43c-106 0 -192 86 -192 192c106 0 192 -86 192 -192zM256 43c0 106 86 192 192 192c0 -106 -86 -192 -192 -192z
+" />
+    <glyph glyph-name="local_gas_station" unicode="local_gas_station" 
+d="M384 299c12 0 21 9 21 21s-9 21 -21 21s-21 -9 -21 -21s9 -21 21 -21zM256 299v106h-128v-106h128zM422 358c10 -10 15 -23 15 -38v-203c0 -29 -24 -53 -53 -53s-53 24 -53 53v107h-32v-160h-214v341c0 23 20 43 43 43h128c23 0 43 -20 43 -43v-149h21
+c23 0 43 -20 43 -43v-96c0 -12 9 -21 21 -21s21 9 21 21v154c-7 -3 -13 -4 -21 -4c-29 0 -53 24 -53 53c0 23 14 42 34 50l-45 45l23 22z" />
+    <glyph glyph-name="local_grocery_store" unicode="local_grocery_store" 
+d="M363 128c23 0 42 -20 42 -43s-19 -42 -42 -42s-43 19 -43 42s20 43 43 43zM21 469h70l20 -42h316c12 0 21 -10 21 -22c0 -4 -1 -7 -3 -10l-76 -138c-7 -13 -21 -22 -37 -22h-159l-19 -35l-1 -3c0 -3 2 -5 5 -5h247v-43h-256c-23 0 -42 20 -42 43c0 7 2 14 5 20l29 53
+l-77 162h-43v42zM149 128c23 0 43 -20 43 -43s-20 -42 -43 -42s-42 19 -42 42s19 43 42 43z" />
+    <glyph glyph-name="local_hospital" unicode="local_hospital" 
+d="M384 213v86h-85v85h-86v-85h-85v-86h85v-85h86v85h85zM405 448c23 0 43 -20 43 -43v-298c0 -23 -20 -43 -43 -43h-298c-23 0 -43 20 -43 43v298c0 23 20 43 43 43h298z" />
+    <glyph glyph-name="local_hotel" unicode="local_hotel" 
+d="M405 363c47 0 86 -39 86 -86v-192h-43v64h-384v-64h-43v320h43v-192h171v150h170zM149 235c-35 0 -64 29 -64 64s29 64 64 64s64 -29 64 -64s-29 -64 -64 -64z" />
+    <glyph glyph-name="local_laundry_service" unicode="local_laundry_service" 
+d="M256 85c71 0 128 57 128 128s-57 128 -128 128s-128 -57 -128 -128s57 -128 128 -128zM149 427c-12 0 -21 -10 -21 -22s9 -21 21 -21s22 9 22 21s-10 22 -22 22zM213 427c-12 0 -21 -10 -21 -22s9 -21 21 -21s22 9 22 21s-10 22 -22 22zM384 469c24 0 43 -18 43 -42v-342
+c0 -24 -19 -42 -43 -42h-256c-24 0 -43 18 -43 42v342c0 24 19 42 43 42h256zM196 153l120 121c33 -33 33 -88 0 -121s-87 -33 -120 0z" />
+    <glyph glyph-name="local_library" unicode="local_library" 
+d="M256 341c-35 0 -64 29 -64 64s29 64 64 64s64 -29 64 -64s-29 -64 -64 -64zM256 266c50 47 118 75 192 75v-234c-74 0 -142 -29 -192 -76c-50 47 -118 76 -192 76v234c74 0 142 -28 192 -75z" />
+    <glyph glyph-name="local_mall" unicode="local_mall" 
+d="M256 235c59 0 107 47 107 106h-43c0 -35 -29 -64 -64 -64s-64 29 -64 64h-43c0 -59 48 -106 107 -106zM256 448c-35 0 -64 -29 -64 -64h128c0 35 -29 64 -64 64zM405 384c23 0 43 -20 43 -43v-256c0 -23 -20 -42 -43 -42h-298c-23 0 -43 19 -43 42v256c0 23 20 43 43 43
+h42c0 59 48 107 107 107s107 -48 107 -107h42z" />
+    <glyph glyph-name="local_movies" unicode="local_movies" 
+d="M384 320v43h-43v-43h43zM384 235v42h-43v-42h43zM384 149v43h-43v-43h43zM171 320v43h-43v-43h43zM171 235v42h-43v-42h43zM171 149v43h-43v-43h43zM384 448h43v-384h-43v43h-43v-43h-170v43h-43v-43h-43v384h43v-43h43v43h170v-43h43v43z" />
+    <glyph glyph-name="local_offer" unicode="local_offer" 
+d="M117 363c18 0 32 14 32 32s-14 32 -32 32s-32 -14 -32 -32s14 -32 32 -32zM457 265c8 -8 12 -18 12 -30s-4 -22 -12 -30l-150 -150c-8 -8 -18 -12 -30 -12s-22 4 -30 12l-192 192c-8 8 -12 18 -12 30v150c0 23 19 42 42 42h150c12 0 22 -4 30 -12z" />
+    <glyph glyph-name="local_parking" unicode="local_parking" 
+d="M282 277c23 0 42 20 42 43s-19 43 -42 43h-69v-86h69zM277 448c71 0 128 -57 128 -128s-57 -128 -128 -128h-64v-128h-85v384h149z" />
+    <glyph glyph-name="local_pharmacy" unicode="local_pharmacy" 
+d="M341 213v43h-64v64h-42v-64h-64v-43h64v-64h42v64h64zM448 405v-42l-43 -128l43 -128v-43h-384v43l43 128l-43 128v42h271l31 86l50 -19l-24 -67h56z" />
+    <glyph glyph-name="local_phone" unicode="local_phone" 
+d="M141 282c31 -60 81 -110 141 -141l47 47c6 6 15 8 22 5c24 -8 50 -12 76 -12c12 0 21 -9 21 -21v-75c0 -12 -9 -21 -21 -21c-200 0 -363 163 -363 363c0 12 9 21 21 21h75c12 0 21 -9 21 -21c0 -27 4 -52 12 -76c2 -7 1 -16 -5 -22z" />
+    <glyph glyph-name="local_pizza" unicode="local_pizza" 
+d="M256 192c23 0 43 20 43 43s-20 42 -43 42s-43 -19 -43 -42s20 -43 43 -43zM149 363c0 -23 20 -43 43 -43s43 20 43 43s-20 42 -43 42s-43 -19 -43 -42zM256 469c76 0 145 -33 192 -85l-192 -341l-192 341c47 52 116 85 192 85z" />
+    <glyph glyph-name="local_play" unicode="local_play" 
+d="M332 154l-23 87l70 58l-90 5l-33 84l-33 -84l-91 -5l71 -58l-23 -87l76 49zM427 256c0 -23 19 -43 42 -43v-85c0 -23 -19 -43 -42 -43h-342c-23 0 -42 20 -42 43v85c24 0 42 20 42 43s-19 43 -42 43v85c0 23 19 43 42 43h342c23 0 42 -20 42 -43v-85
+c-23 0 -42 -20 -42 -43z" />
+    <glyph glyph-name="local_post_office" unicode="local_post_office" 
+d="M427 341v43l-171 -107l-171 107v-43l171 -106zM427 427c23 0 42 -20 42 -43v-256c0 -23 -19 -43 -42 -43h-342c-23 0 -42 20 -42 43v256c0 23 19 43 42 43h342z" />
+    <glyph glyph-name="local_printshop" unicode="local_printshop" 
+d="M384 448v-85h-256v85h256zM405 256c12 0 22 9 22 21s-10 22 -22 22s-21 -10 -21 -22s9 -21 21 -21zM341 107v106h-170v-106h170zM405 341c35 0 64 -29 64 -64v-128h-85v-85h-256v85h-85v128c0 35 29 64 64 64h298z" />
+    <glyph glyph-name="local_see" unicode="local_see" 
+d="M256 149c59 0 107 48 107 107s-48 107 -107 107s-107 -48 -107 -107s48 -107 107 -107zM192 469h128l39 -42h68c23 0 42 -20 42 -43v-256c0 -23 -19 -43 -42 -43h-342c-23 0 -42 20 -42 43v256c0 23 19 43 42 43h68zM188 256c0 38 30 68 68 68s68 -30 68 -68
+s-30 -68 -68 -68s-68 30 -68 68z" />
+    <glyph glyph-name="local_shipping" unicode="local_shipping" 
+d="M384 117c18 0 32 14 32 32s-14 32 -32 32s-32 -14 -32 -32s14 -32 32 -32zM416 309h-53v-53h95zM128 117c18 0 32 14 32 32s-14 32 -32 32s-32 -14 -32 -32s14 -32 32 -32zM427 341l64 -85v-107h-43c0 -35 -29 -64 -64 -64s-64 29 -64 64h-128c0 -35 -29 -64 -64 -64
+s-64 29 -64 64h-43v235c0 23 20 43 43 43h299v-86h64z" />
+    <glyph glyph-name="local_taxi" unicode="local_taxi" 
+d="M107 277h298l-32 96h-234zM373 171c18 0 32 14 32 32s-14 32 -32 32s-32 -14 -32 -32s14 -32 32 -32zM139 171c18 0 32 14 32 32s-14 32 -32 32s-32 -14 -32 -32s14 -32 32 -32zM404 384l44 -128v-171c0 -12 -9 -21 -21 -21h-22c-12 0 -21 9 -21 21v22h-256v-22
+c0 -12 -9 -21 -21 -21h-22c-12 0 -21 9 -21 21v171l44 128c4 13 17 21 31 21h53v43h128v-43h53c14 0 27 -8 31 -21z" />
+    <glyph glyph-name="location_city" unicode="location_city" 
+d="M405 192v43h-42v-43h42zM405 107v42h-42v-42h42zM277 363v42h-42v-42h42zM277 277v43h-42v-43h42zM277 192v43h-42v-43h42zM277 107v42h-42v-42h42zM149 277v43h-42v-43h42zM149 192v43h-42v-43h42zM149 107v42h-42v-42h42zM320 277h128v-213h-384v299h128v42l64 64
+l64 -64v-128z" />
+    <glyph glyph-name="location_disabled" unicode="location_disabled" 
+d="M347 138l-209 209c-19 -25 -31 -57 -31 -91c0 -83 66 -149 149 -149c34 0 66 12 91 31zM64 421l27 27l357 -357l-27 -27l-44 44c-28 -23 -62 -39 -100 -43v-44h-42v44c-89 10 -160 81 -170 170h-44v42h44c4 38 20 72 43 100zM447 277h44v-42h-44c-3 -24 -10 -48 -21 -68
+l-32 32c7 17 11 37 11 57c0 83 -66 149 -149 149c-20 0 -40 -4 -57 -11l-32 32c21 11 44 18 68 21v44h42v-44c89 -10 160 -81 170 -170z" />
+    <glyph glyph-name="location_off" unicode="location_off" 
+d="M250 267c59.1765 -58.4901 118.284 -117.049 177 -176l-27 -27l-72 71c-36 -53 -72 -92 -72 -92s-149 165 -149 277c0 11 2 22 4 33l-68 68l27 27l178 -178zM256 373c-16 0 -29 -7 -39 -18l-69 68c27 28 66 46 108 46c83 0 149 -66 149 -149c0 -36 -15 -77 -36 -117
+l-77 78c11 10 17 23 17 39c0 29 -24 53 -53 53z" />
+    <glyph glyph-name="location_on" unicode="location_on" 
+d="M256 267c29 0 53 24 53 53s-24 53 -53 53s-53 -24 -53 -53s24 -53 53 -53zM256 469c83 0 149 -66 149 -149c0 -112 -149 -277 -149 -277s-149 165 -149 277c0 83 66 149 149 149z" />
+    <glyph glyph-name="location_searching" unicode="location_searching" 
+d="M256 107c83 0 149 66 149 149s-66 149 -149 149s-149 -66 -149 -149s66 -149 149 -149zM447 277h44v-42h-44c-10 -89 -81 -160 -170 -170v-44h-42v44c-89 10 -160 81 -170 170h-44v42h44c10 89 81 160 170 170v44h42v-44c89 -10 160 -81 170 -170z" />
+    <glyph glyph-name="lock" unicode="lock" 
+d="M322 341v43c0 36 -30 66 -66 66s-66 -30 -66 -66v-43h132zM256 149c23 0 43 20 43 43s-20 43 -43 43s-43 -20 -43 -43s20 -43 43 -43zM384 341c23 0 43 -19 43 -42v-214c0 -23 -20 -42 -43 -42h-256c-23 0 -43 19 -43 42v214c0 23 20 42 43 42h21v43c0 59 48 107 107 107
+s107 -48 107 -107v-43h21z" />
+    <glyph glyph-name="lock_open" unicode="lock_open" 
+d="M384 85v214h-256v-214h256zM384 341c23 0 43 -19 43 -42v-214c0 -23 -20 -42 -43 -42h-256c-23 0 -43 19 -43 42v214c0 23 20 42 43 42h194v43c0 36 -30 66 -66 66s-66 -30 -66 -66h-41c0 59 48 107 107 107s107 -48 107 -107v-43h21zM256 149c-23 0 -43 20 -43 43
+s20 43 43 43s43 -20 43 -43s-20 -43 -43 -43z" />
+    <glyph glyph-name="lock_outline" unicode="lock_outline" 
+d="M384 85v214h-256v-214h256zM190 384v-43h132v43c0 36 -30 66 -66 66s-66 -30 -66 -66zM384 341c23 0 43 -19 43 -42v-214c0 -23 -20 -42 -43 -42h-256c-23 0 -43 19 -43 42v214c0 23 20 42 43 42h21v43c0 59 48 107 107 107s107 -48 107 -107v-43h21zM256 149
+c-23 0 -43 20 -43 43s20 43 43 43s43 -20 43 -43s-20 -43 -43 -43z" />
+    <glyph glyph-name="looks" unicode="looks" 
+d="M256 384c129 0 235 -106 235 -235h-43c0 106 -86 192 -192 192s-192 -86 -192 -192h-43c0 129 106 235 235 235zM256 299c82 0 149 -68 149 -150h-42c0 59 -48 107 -107 107s-107 -48 -107 -107h-42c0 82 67 150 149 150z" />
+    <glyph glyph-name="looks_3" unicode="looks_&#x33;" 
+d="M320 288v32c0 24 -19 43 -42 43h-86v-43h86v-43h-43v-42h43v-43h-86v-43h86c23 0 42 19 42 43v32c0 18 -14 32 -32 32c18 0 32 14 32 32zM406 448c23 0 42 -20 42 -43v-298c0 -23 -19 -43 -42 -43h-299c-23 0 -43 20 -43 43v298c0 23 20 43 43 43h299z" />
+    <glyph glyph-name="looks_4" unicode="looks_&#x34;" 
+d="M320 149v214h-43v-86h-42v86h-43v-128h85v-86h43zM405 448c23 0 43 -20 43 -43v-298c0 -23 -20 -43 -43 -43h-298c-23 0 -43 20 -43 43v298c0 23 20 43 43 43h298z" />
+    <glyph glyph-name="looks_5" unicode="looks_&#x35;" 
+d="M320 320v43h-128v-128h85v-43h-85v-43h85c23 0 43 19 43 43v43c0 24 -20 42 -43 42h-42v43h85zM405 448c23 0 43 -20 43 -43v-298c0 -23 -20 -43 -43 -43h-298c-23 0 -43 20 -43 43v298c0 23 20 43 43 43h298z" />
+    <glyph glyph-name="looks_6" unicode="looks_&#x36;" 
+d="M320 320v43h-85c-23 0 -43 -19 -43 -43v-128c0 -24 20 -43 43 -43h42c23 0 43 19 43 43v43c0 24 -20 42 -43 42h-42v43h85zM405 448c23 0 43 -20 43 -43v-298c0 -23 -20 -43 -43 -43h-298c-23 0 -43 20 -43 43v298c0 23 20 43 43 43h298zM235 192v43h42v-43h-42z" />
+    <glyph glyph-name="looks_one" unicode="looks_one" 
+d="M299 149v214h-86v-43h43v-171h43zM405 448c23 0 43 -20 43 -43v-298c0 -23 -20 -43 -43 -43h-298c-23 0 -43 20 -43 43v298c0 23 20 43 43 43h298z" />
+    <glyph glyph-name="looks_two" unicode="looks_two" 
+d="M320 277v43c0 24 -20 43 -43 43h-85v-43h85v-43h-42c-23 0 -43 -18 -43 -42v-86h128v43h-85v43h42c23 0 43 18 43 42zM405 448c23 0 43 -20 43 -43v-298c0 -23 -20 -43 -43 -43h-298c-23 0 -43 20 -43 43v298c0 23 20 43 43 43h298z" />
+    <glyph glyph-name="loop" unicode="loop" 
+d="M256 128v64l85 -85l-85 -86v64c-94 0 -171 77 -171 171c0 33 10 65 27 91l31 -31c-10 -18 -15 -38 -15 -60c0 -71 57 -128 128 -128zM256 427c94 0 171 -77 171 -171c0 -33 -10 -65 -27 -91l-31 31c10 18 15 38 15 60c0 71 -57 128 -128 128v-64l-85 85l85 86v-64z" />
+    <glyph glyph-name="loupe" unicode="loupe" 
+d="M256 85c94 0 171 77 171 171s-77 171 -171 171s-171 -77 -171 -171s77 -171 171 -171zM256 469c118 0 213 -95 213 -213v-171c0 -23 -19 -42 -42 -42h-171c-118 0 -213 95 -213 213s95 213 213 213zM277 363v-86h86v-42h-86v-86h-42v86h-86v42h86v86h42z" />
+    <glyph glyph-name="low_priority" unicode="low_priority" 
+d="M43 267c0 76 62 138 138 138h75v-42h-75c-53 0 -96 -43 -96 -96s43 -96 96 -96h11v42l64 -64l-64 -64v43h-11c-76 0 -138 63 -138 139zM299 171h170v-43h-170v43zM299 288h170v-43h-170v43zM299 405h170v-42h-170v42z" />
+    <glyph glyph-name="loyalty" unicode="loyalty" 
+d="M368 186c10 10 16 23 16 38c0 29 -24 53 -53 53c-15 0 -28 -5 -38 -15l-16 -16l-15 16c-10 10 -23 15 -38 15c-29 0 -53 -24 -53 -53c0 -15 5 -28 15 -38l91 -91zM117 363c18 0 32 14 32 32s-14 32 -32 32s-32 -14 -32 -32s14 -32 32 -32zM457 265c8 -8 12 -18 12 -30
+s-4 -22 -12 -30l-150 -150c-8 -8 -18 -12 -30 -12s-22 4 -30 12l-192 192c-8 8 -12 18 -12 30v150c0 23 19 42 42 42h150c12 0 22 -4 30 -12z" />
+    <glyph glyph-name="mail" unicode="mail" 
+d="M427 341v43l-171 -107l-171 107v-43l171 -106zM427 427c23 0 42 -20 42 -43v-256c0 -23 -19 -43 -42 -43h-342c-23 0 -42 20 -42 43v256c0 23 19 43 42 43h342z" />
+    <glyph glyph-name="mail_outline" unicode="mail_outline" 
+d="M256 277l171 107h-342zM427 128v213l-171 -106l-171 106v-213h342zM427 427c23 0 42 -20 42 -43v-256c0 -23 -19 -43 -42 -43h-342c-23 0 -42 20 -42 43v256c0 23 19 43 42 43h342z" />
+    <glyph glyph-name="map" unicode="map" 
+d="M320 107v253l-128 45v-253zM437 448c6 0 11 -5 11 -11v-322c0 -5 -4 -9 -8 -10l-120 -41l-128 45l-114 -44l-3 -1c-6 0 -11 5 -11 11v322c0 5 4 9 8 10l120 41l128 -45l114 44z" />
+    <glyph glyph-name="markunread" unicode="markunread" 
+d="M427 341v43l-171 -107l-171 107v-43l171 -106zM427 427c23 0 42 -20 42 -43v-256c0 -23 -19 -43 -42 -43h-342c-23 0 -42 20 -42 43v256c0 23 19 43 42 43h342z" />
+    <glyph glyph-name="markunread_mailbox" unicode="markunread_mailbox" 
+d="M427 384c23 0 42 -20 42 -43v-256c0 -23 -19 -42 -42 -42h-342c-23 0 -42 19 -42 42v256c0 23 19 43 42 43h43v128h171v-85h-128v-171h42v128h214z" />
+    <glyph glyph-name="memory" unicode="memory" 
+d="M363 149v214h-214v-214h214zM448 277h-43v-42h43v-43h-43v-43c0 -23 -19 -42 -42 -42h-43v-43h-43v43h-42v-43h-43v43h-43c-23 0 -42 19 -42 42v43h-43v43h43v42h-43v43h43v43c0 23 19 42 42 42h43v43h43v-43h42v43h43v-43h43c23 0 42 -19 42 -42v-43h43v-43zM277 235v42
+h-42v-42h42zM320 320v-128h-128v128h128z" />
+    <glyph glyph-name="menu" unicode="menu" 
+d="M64 384h384v-43h-384v43zM64 235v42h384v-42h-384zM64 128v43h384v-43h-384z" />
+    <glyph glyph-name="merge_type" unicode="merge_type" 
+d="M160 341l96 96l96 -96h-75v-136l-128 -128l-30 30l116 115v119h-75zM363 77l-73 72l30 30l73 -72z" />
+    <glyph glyph-name="message" unicode="message" 
+d="M384 341v43h-256v-43h256zM384 277v43h-256v-43h256zM384 213v43h-256v-43h256zM427 469c23 0 42 -19 42 -42v-256c0 -23 -19 -43 -42 -43h-299l-85 -85v384c0 23 19 42 42 42h342z" />
+    <glyph glyph-name="mic" unicode="mic" 
+d="M369 277h36c0 -73 -58 -133 -128 -143v-70h-42v70c-70 10 -128 70 -128 143h36c0 -64 54 -108 113 -108s113 44 113 108zM256 213c-35 0 -64 29 -64 64v128c0 35 29 64 64 64s64 -29 64 -64v-128c0 -35 -29 -64 -64 -64z" />
+    <glyph glyph-name="mic_none" unicode="mic_none" 
+d="M369 277h36c0 -73 -58 -133 -128 -143v-70h-42v70c-70 10 -128 70 -128 143h36c0 -64 54 -108 113 -108s113 44 113 108zM230 407v-132c0 -14 12 -25 26 -25s25 11 25 25l1 132c0 14 -12 26 -26 26s-26 -12 -26 -26zM256 213c-35 0 -64 29 -64 64v128c0 35 29 64 64 64
+s64 -29 64 -64v-128c0 -35 -29 -64 -64 -64z" />
+    <glyph glyph-name="mic_off" unicode="mic_off" 
+d="M91 448l357 -357l-27 -27l-89 89c-16 -10 -36 -16 -55 -19v-70h-42v70c-70 10 -128 70 -128 143h36c0 -64 54 -108 113 -108c17 0 34 4 49 11l-35 35c-4 -1 -9 -2 -14 -2c-35 0 -64 29 -64 64v16l-128 128zM320 274l-128 127v4c0 35 29 64 64 64s64 -29 64 -64v-131z
+M405 277c0 -25 -7 -49 -19 -70l-26 27c6 13 9 27 9 43h36z" />
+    <glyph glyph-name="mms" unicode="mms" 
+d="M107 213h298l-96 128l-74 -96l-54 64zM427 469c23 0 42 -19 42 -42v-256c0 -23 -19 -43 -42 -43h-299l-85 -85v384c0 23 19 42 42 42h342z" />
+    <glyph glyph-name="mode_comment" unicode="mode_comment" 
+d="M469 427v-384l-85 85h-299c-23 0 -42 20 -42 43v256c0 23 19 42 42 42h342c23 0 42 -19 42 -42z" />
+    <glyph glyph-name="mode_edit" unicode="mode_edit" 
+d="M442 362l-39 -39l-80 80l39 39c8 8 22 8 30 0l50 -50c8 -8 8 -22 0 -30zM64 144l236 236l80 -80l-236 -236h-80v80z" />
+    <glyph glyph-name="monetization_on" unicode="monetization_on" 
+d="M286 126c37 7 67 28 67 67c0 54 -47 73 -90 84s-56 23 -56 41c0 20 19 35 51 35c34 0 46 -16 47 -40h42c-1 33 -21 62 -61 72v42h-57v-42c-37 -8 -66 -31 -66 -68c0 -44 36 -65 89 -78c48 -11 57 -28 57 -46c0 -13 -9 -34 -51 -34c-39 0 -55 18 -57 40h-42
+c2 -41 34 -64 70 -72v-42h57v41zM256 469c118 0 213 -95 213 -213s-95 -213 -213 -213s-213 95 -213 213s95 213 213 213z" />
+    <glyph glyph-name="money_off" unicode="money_off" 
+d="M114 425l311 -312l-27 -27l-47 48c-13 -12 -32 -20 -52 -24v-46h-64v46c-41 9 -76 35 -79 82h47c2 -25 20 -45 64 -45c29 0 44 10 51 20l-75 74c-50 15 -83 40 -83 84l-73 73zM267 365c-13 0 -24 -2 -33 -6l-31 31c10 5 21 9 32 12v46h64v-47c45 -11 67 -44 68 -81h-47
+c-1 27 -15 45 -53 45z" />
+    <glyph glyph-name="monochrome_photos" unicode="monochrome_photos" 
+d="M427 107v256h-171v-22c60 0 107 -46 107 -106s-47 -107 -107 -107v38c-38 0 -68 31 -68 69s30 68 68 68v-137c38 0 68 31 68 69s-30 68 -68 68v38c-60 0 -107 -46 -107 -106s47 -107 107 -107v-21h171zM427 405c23 0 42 -19 42 -42v-256c0 -23 -19 -43 -42 -43h-342
+c-23 0 -42 20 -42 43v256c0 23 19 42 42 42h69l38 43h128l38 -43h69z" />
+    <glyph glyph-name="mood" unicode="mood" 
+d="M256 139c-50 0 -92 30 -109 74h218c-17 -44 -59 -74 -109 -74zM181 277c-18 0 -32 14 -32 32s14 32 32 32s32 -14 32 -32s-14 -32 -32 -32zM331 277c-18 0 -32 14 -32 32s14 32 32 32s32 -14 32 -32s-14 -32 -32 -32zM256 85c94 0 171 77 171 171s-77 171 -171 171
+s-171 -77 -171 -171s77 -171 171 -171zM256 469c118 0 213 -95 213 -213s-95 -213 -213 -213s-213 95 -213 213s95 213 213 213z" />
+    <glyph glyph-name="mood_bad" unicode="mood_bad" 
+d="M256 213c50 0 92 -30 109 -74h-218c17 44 59 74 109 74zM181 277c-18 0 -32 14 -32 32s14 32 32 32s32 -14 32 -32s-14 -32 -32 -32zM331 277c-18 0 -32 14 -32 32s14 32 32 32s32 -14 32 -32s-14 -32 -32 -32zM256 85c94 0 171 77 171 171s-77 171 -171 171
+s-171 -77 -171 -171s77 -171 171 -171zM256 469c118 0 213 -95 213 -213s-95 -213 -213 -213s-213 95 -213 213s95 213 213 213z" />
+    <glyph glyph-name="more" unicode="more" 
+d="M405 224c18 0 32 14 32 32s-14 32 -32 32s-32 -14 -32 -32s14 -32 32 -32zM299 224c18 0 32 14 32 32s-14 32 -32 32s-32 -14 -32 -32s14 -32 32 -32zM192 224c18 0 32 14 32 32s-14 32 -32 32s-32 -14 -32 -32s14 -32 32 -32zM469 448c23 0 43 -20 43 -43v-298
+c0 -23 -20 -43 -43 -43h-318c-15 0 -28 8 -36 19l-115 173l115 173c8 11 19 19 34 19h320z" />
+    <glyph glyph-name="more_horiz" unicode="more_horiz" 
+d="M256 299c23 0 43 -20 43 -43s-20 -43 -43 -43s-43 20 -43 43s20 43 43 43zM384 299c23 0 43 -20 43 -43s-20 -43 -43 -43s-43 20 -43 43s20 43 43 43zM128 299c23 0 43 -20 43 -43s-20 -43 -43 -43s-43 20 -43 43s20 43 43 43z" />
+    <glyph glyph-name="more_vert" unicode="more_vert" 
+d="M256 171c23 0 43 -20 43 -43s-20 -43 -43 -43s-43 20 -43 43s20 43 43 43zM256 299c23 0 43 -20 43 -43s-20 -43 -43 -43s-43 20 -43 43s20 43 43 43zM256 341c-23 0 -43 20 -43 43s20 43 43 43s43 -20 43 -43s-20 -43 -43 -43z" />
+    <glyph glyph-name="motorcycle" unicode="motorcycle" 
+d="M405 149c35 0 64 29 64 64s-29 64 -64 64s-64 -29 -64 -64s29 -64 64 -64zM167 192h-60v43h60c-9 25 -33 42 -60 42c-35 0 -64 -29 -64 -64s29 -64 64 -64c27 0 51 18 60 43zM415 319c55 -4 97 -49 97 -106c0 -60 -47 -106 -107 -106s-106 46 -106 106c0 13 2 26 6 38
+l-59 -59h-35c-10 -49 -52 -85 -104 -85c-60 0 -107 46 -107 106s47 107 107 107h247l-43 43h-76v42h94z" />
+    <glyph glyph-name="mouse" unicode="mouse" 
+d="M235 489v-169h-150c0 87 66 159 150 169zM85 192v85h342v-85c0 -94 -77 -171 -171 -171s-171 77 -171 171zM277 489c84 -10 150 -82 150 -169h-150v169z" />
+    <glyph glyph-name="move_to_inbox" unicode="move_to_inbox" 
+d="M341 299l-85 -86l-85 86h42v64h86v-64h42zM405 192v213h-299v-213h86c0 -35 29 -64 64 -64s64 29 64 64h85zM405 448c23 0 43 -20 43 -43v-298c0 -23 -20 -43 -43 -43h-299c-24 0 -42 20 -42 43v298c0 23 18 43 42 43h299z" />
+    <glyph glyph-name="movie" unicode="movie" 
+d="M384 427h85v-299c0 -23 -19 -43 -42 -43h-342c-23 0 -42 20 -42 43v256c0 23 19 43 42 43h22l42 -86h64l-42 86h42l43 -86h64l-43 86h43l43 -86h64z" />
+    <glyph glyph-name="movie_creation" unicode="movie_creation" 
+d="M384 427h85v-299c0 -23 -19 -43 -42 -43h-342c-23 0 -42 20 -42 43v256c0 23 19 43 42 43h22l42 -86h64l-42 86h42l43 -86h64l-43 86h43l43 -86h64z" />
+    <glyph glyph-name="movie_filter" unicode="movie_filter" 
+d="M361 257l44 20l-44 20l-20 44l-20 -44l-44 -20l44 -20l20 -44zM240 187l59 26l-59 27l-27 59l-26 -59l-59 -27l59 -26l26 -59zM384 427h85v-299c0 -23 -19 -43 -42 -43h-342c-23 0 -42 20 -42 43v256c0 23 19 43 42 43h22l42 -64h64l-42 64h42l43 -64h64l-43 64h43
+l43 -64h64z" />
+    <glyph glyph-name="multiline_chart" unicode="multiline_chart" 
+d="M469 364l-65 -73c23 -37 39 -82 44 -131h-43c-4 35 -15 68 -31 97l-86 -97l-85 86l-128 -128l-32 32l160 160l85 -86l61 70c-36 42 -86 69 -144 69c-50 0 -96 -20 -132 -52l-30 30c44 39 100 64 162 64c69 0 129 -30 173 -79l61 68z" />
+    <glyph glyph-name="music_note" unicode="music_note" 
+d="M256 448h128v-85h-85v-214c0 -47 -39 -85 -86 -85s-85 38 -85 85s38 86 85 86c16 0 30 -5 43 -12v225z" />
+    <glyph glyph-name="music_video" unicode="music_video" 
+d="M171 192c0 35 29 64 64 64c7 0 14 -2 21 -4v132h107v-43h-64v-150c0 -35 -29 -63 -64 -63s-64 29 -64 64zM448 107v298h-384v-298h384zM448 448c23 0 43 -20 43 -43v-298c0 -23 -20 -43 -43 -43h-384c-23 0 -43 20 -43 43v298c0 23 20 43 43 43h384z" />
+    <glyph glyph-name="my_location" unicode="my_location" 
+d="M256 107c83 0 149 66 149 149s-66 149 -149 149s-149 -66 -149 -149s66 -149 149 -149zM447 277h44v-42h-44c-10 -89 -81 -160 -170 -170v-44h-42v44c-89 10 -160 81 -170 170h-44v42h44c10 89 81 160 170 170v44h42v-44c89 -10 160 -81 170 -170zM256 341
+c47 0 85 -38 85 -85s-38 -85 -85 -85s-85 38 -85 85s38 85 85 85z" />
+    <glyph glyph-name="nature" unicode="nature" 
+d="M277 168v-83h128v-42h-298v42h128v84c-71 12 -125 73 -125 147c0 83 67 150 150 150s149 -67 149 -150c0 -77 -58 -139 -132 -148z" />
+    <glyph glyph-name="nature_people" unicode="nature_people" 
+d="M96 277c-18 0 -32 14 -32 32s14 32 32 32s32 -14 32 -32s-14 -32 -32 -32zM473 316c0 -77 -58 -139 -132 -148v-83h64v-42h-341v106h-21v86c0 12 9 21 21 21h64c12 0 21 -9 21 -21v-86h-21v-64h171v84c-71 12 -125 73 -125 147c0 83 67 150 150 150s149 -67 149 -150z
+" />
+    <glyph glyph-name="navigate_before" unicode="navigate_before" 
+d="M329 354l-98 -98l98 -98l-30 -30l-128 128l128 128z" />
+    <glyph glyph-name="navigate_next" unicode="navigate_next" 
+d="M213 384l128 -128l-128 -128l-30 30l98 98l-98 98z" />
+    <glyph glyph-name="navigation" unicode="navigation" 
+d="M256 469l160 -390l-15 -15l-145 64l-145 -64l-15 15z" />
+    <glyph glyph-name="near_me" unicode="near_me" 
+d="M448 448l-161 -384h-21l-56 146l-146 56v21z" />
+    <glyph glyph-name="network_cell" unicode="network_cell" 
+d="M469 43h-426l426 426v-426z" />
+    <glyph glyph-name="network_check" unicode="network_check" 
+d="M107 235c43 43 100 63 156 61l-28 -61c-31 -4 -62 -19 -86 -43zM363 192c-8 8 -17 15 -26 21l12 62c20 -10 39 -23 56 -40zM448 277c-26 26 -56 46 -88 59l11 60c44 -16 85 -41 120 -76zM21 320c80 80 190 110 293 92l-25 -57c-80 10 -164 -17 -225 -78zM339 405
+c6 0 11 -4 11 -10l-52 -275v-1c-4 -19 -22 -34 -42 -34c-24 0 -43 19 -43 43c0 7 2 15 5 21l111 248c1.57297 4.7189 4.56186 8 10 8z" />
+    <glyph glyph-name="network_locked" unicode="network_locked" 
+d="M448 171v32c0 18 -14 32 -32 32s-32 -14 -32 -32v-32h64zM469 171c12 0 22 -10 22 -22v-85c0 -12 -10 -21 -22 -21h-106c-12 0 -22 9 -22 21v85c0 12 10 22 22 22v32c0 29 24 53 53 53s53 -24 53 -53v-32zM416 299c-53 0 -96 -43 -96 -96v-6c-13 -12 -21 -29 -21 -48v-64
+h-278l406 406v-193c-4 0 -7 1 -11 1z" />
+    <glyph glyph-name="network_wifi" unicode="network_wifi" 
+d="M436.25 278.586c0.284113 -0.222489 0.53415 -0.418301 0.749753 -0.585993l-181 -224l-181 224c0.215604 0.167692 0.46564 0.363504 0.749753 0.585993l-67.7498 84.414c10 7 105 85 248 85s238 -78 248 -85z" />
+    <glyph glyph-name="new_releases" unicode="new_releases" 
+d="M277 235v128h-42v-128h42zM277 149v43h-42v-43h42zM491 256l-52 -59l7 -79l-77 -17l-40 -68l-73 31l-73 -31l-40 67l-77 18l7 79l-52 59l52 60l-7 78l77 17l40 68l73 -31l73 31l40 -68l77 -17l-7 -79z" />
+    <glyph glyph-name="next_week" unicode="next_week" 
+d="M235 117l85 86l-85 85l-22 -21l64 -64l-64 -64zM213 405v-42h86v42h-86zM299 448c23.3225 0 42 -19.4985 42 -43v-42h86c23 0 42 -20 42 -43v-235c0 -23 -19 -42 -42 -42h-342c-23 0 -42 19 -42 42v235c0 23 19 43 42 43h86v42c0 23 19 43 42 43h86z" />
+    <glyph glyph-name="nfc" unicode="nfc" 
+d="M384 384v-256h-256v256h85v-43h-42v-170h170v170h-64v-48c13 -7 22 -21 22 -37c0 -23 -20 -43 -43 -43s-43 20 -43 43c0 16 9 30 22 37v48c0 23 19 43 42 43h107zM427 85v342h-342v-342h342zM427 469c23 0 42 -19 42 -42v-342c0 -23 -19 -42 -42 -42h-342
+c-23 0 -42 19 -42 42v342c0 23 19 42 42 42h342z" />
+    <glyph glyph-name="no_encryption" unicode="no_encryption" 
+d="M190 384v-26l-39 39c6 53 50 94 105 94c59 0 107 -48 107 -107v-43h21c23 0 43 -19 43 -42v-178l-221 220h116v43c0 36 -30 66 -66 66s-66 -30 -66 -66zM448 47l-26 -26l-24 24c-4 -1 -9 -2 -14 -2h-256c-23 0 -43 19 -43 42v214c0 16 10 30 23 37l-44 43l26 26z" />
+    <glyph glyph-name="no_sim" unicode="no_sim" 
+d="M78 429l373 -372l-28 -28l-40 41c-6 -3 -13 -6 -20 -6h-214c-23 0 -42 20 -42 43v239l-56 56zM405 405v-249l-242 242l50 50h150c23 0 42 -20 42 -43z" />
+    <glyph glyph-name="not_interested" unicode="not_interested" 
+d="M391 151c23 29 36 66 36 105c0 94 -77 171 -171 171c-39 0 -76 -13 -105 -36zM256 85c39 0 76 13 105 36l-240 240c-23 -29 -36 -66 -36 -105c0 -94 77 -171 171 -171zM256 469c118 0 213 -95 213 -213s-95 -213 -213 -213s-213 95 -213 213s95 213 213 213z" />
+    <glyph glyph-name="note" unicode="note" 
+d="M320 395v-118h117zM469 299v-171c0 -23 -19 -42 -42 -42l-342 -1c-23 0 -42 20 -42 43v256c0 23 19 43 42 43h256z" />
+    <glyph glyph-name="note_add" unicode="note_add" 
+d="M277 320h118l-118 117v-117zM341 171v42h-64v64h-42v-64h-64v-42h64v-64h42v64h64zM299 469l128 -128v-256c0 -23 -20 -42 -43 -42h-256c-23 0 -43 19 -43 42l1 342c0 23 19 42 42 42h171z" />
+    <glyph glyph-name="notifications" unicode="notifications" 
+d="M384 171l43 -43v-21h-342v21l43 43v106c0 66 35 120 96 135v15c0 18 14 32 32 32s32 -14 32 -32v-15c61 -15 96 -70 96 -135v-106zM256 43c-24 0 -43 19 -43 42h86c0 -23 -20 -42 -43 -42z" />
+    <glyph glyph-name="notifications_active" unicode="notifications_active" 
+d="M256 43c-24 0 -43 19 -43 42h85c0 -24.8376 -18.6125 -42 -42 -42zM384 277v-106l43 -43v-21h-342v21l43 43v106c0 66 35 120 96 135v15c0 18 14 32 32 32s32 -14 32 -32v-15c61 -15 96 -70 96 -135zM426 288c-3 57 -32 106 -75 137l30 30c51 -39 85 -99 88 -167h-43z
+M162 425c-44 -31 -73 -80 -76 -137h-43c3 68 37 128 88 167z" />
+    <glyph glyph-name="notifications_none" unicode="notifications_none" 
+d="M341 149v128c0 53 -32 96 -85 96s-85 -43 -85 -96v-128h170zM384 171l43 -43v-21h-342v21l43 43v106c0 66 35 120 96 135v15c0 18 14 32 32 32s32 -14 32 -32v-15c61 -15 96 -70 96 -135v-106zM256 43c-23 0 -43 19 -43 42h86c0 -23 -20 -42 -43 -42z" />
+    <glyph glyph-name="notifications_off" unicode="notifications_off" 
+d="M384 199l-191 201c5 2 10 5 15 7h1l6 3c3 1 6 1 9 2v15c0 18 14 32 32 32s32 -14 32 -32v-15c61 -15 96 -69 96 -135v-78zM256 43c-24 0 -43 18 -43 42h86c0 -24 -19 -42 -43 -42zM167 381c93.6174 -96.7159 187.67 -192.997 281 -290l-27 -27l-43 43h-293v21l43 43v107
+c0 27 6 52 17 73l-60 59l27 28z" />
+    <glyph glyph-name="notifications_paused" unicode="notifications_paused" 
+d="M309 303v38h-106v-38h59l-59 -73v-38h106v38h-59zM384 171l43 -43v-21h-342v21l43 43v106c0 65 35 120 96 135v15c0 18 14 32 32 32s32 -14 32 -32v-15c61 -15 96 -70 96 -135v-106zM256 43c-24 0 -43 19 -43 42h86c0 -23 -20 -42 -43 -42z" />
+    <glyph glyph-name="offline_pin" unicode="offline_pin" 
+d="M220 213l143 143l-30 30l-113 -113l-41 41l-30 -30zM363 128v43h-214v-43h214zM256 469c117 0 213 -96 213 -213s-96 -213 -213 -213s-213 96 -213 213s96 213 213 213z" />
+    <glyph glyph-name="ondemand_video" unicode="ondemand_video" 
+d="M341 277l-149 -85v171zM448 149v256h-384v-256h384zM448 448c23 0 43 -19 43 -43l-1 -256c0 -23 -19 -42 -42 -42h-107v-43h-170v43h-107c-24 0 -43 19 -43 42v256c0 24 19 43 43 43h384z" />
+    <glyph glyph-name="opacity" unicode="opacity" 
+d="M128 213h256c0 43 -14 69 -38 93l-90 94l-90 -93c-24 -24 -38 -51 -38 -94zM377 341c33 -33 50 -77 50 -120s-17 -88 -50 -121s-77 -50 -121 -50s-88 17 -121 50s-50 78 -50 121s17 87 50 120l121 121z" />
+    <glyph glyph-name="open_in_browser" unicode="open_in_browser" 
+d="M256 299l85 -86h-64v-128h-42v128h-64zM405 427c24 0 43 -20 43 -43v-256c0 -23 -20 -43 -43 -43h-85v43h85v213h-298v-213h85v-43h-85c-24 0 -43 20 -43 43v256c0 23 19 43 43 43h298z" />
+    <glyph glyph-name="open_in_new" unicode="open_in_new" 
+d="M299 448h149v-149h-43v76l-209 -209l-30 30l209 209h-76v43zM405 107v149h43v-149c0 -23 -20 -43 -43 -43h-298c-24 0 -43 20 -43 43v298c0 23 19 43 43 43h149v-43h-149v-298h298z" />
+    <glyph glyph-name="open_with" unicode="open_with" 
+d="M299 192v-64h64l-107 -107l-107 107h64v64h86zM491 256l-107 -107v64h-64v86h64v64zM192 299v-86h-64v-64l-107 107l107 107v-64h64zM213 320v64h-64l107 107l107 -107h-64v-64h-86z" />
+    <glyph glyph-name="pages" unicode="pages" 
+d="M405 448c23 0 43 -20 43 -43v-128h-107l22 86l-86 -22v107h128zM363 149l-22 86h107v-128c0 -23 -20 -43 -43 -43h-128v107zM171 235l-22 -86l86 22v-107h-128c-23 0 -43 20 -43 43v128h107zM64 405c0 23 20 43 43 43h128v-107l-86 22l22 -86h-107v128z" />
+    <glyph glyph-name="pageview" unicode="pageview" 
+d="M358 124l30 30l-62 62c9 15 15 32 15 51c0 53 -43 96 -96 96s-96 -43 -96 -96s43 -96 96 -96c19 0 36 6 51 15zM427 427c23 0 42 -20 42 -43v-256c0 -23 -19 -43 -42 -43h-342c-23 0 -42 20 -42 43v256c0 23 19 43 42 43h342zM245 320c29 0 54 -24 54 -53
+s-25 -54 -54 -54s-53 25 -53 54s24 53 53 53z" />
+    <glyph glyph-name="palette" unicode="palette" 
+d="M373 256c18 0 32 14 32 32s-14 32 -32 32s-32 -14 -32 -32s14 -32 32 -32zM309 341c18 0 32 14 32 32s-14 32 -32 32s-32 -14 -32 -32s14 -32 32 -32zM203 341c18 0 32 14 32 32s-14 32 -32 32s-32 -14 -32 -32s14 -32 32 -32zM139 256c18 0 32 14 32 32s-14 32 -32 32
+s-32 -14 -32 -32s14 -32 32 -32zM256 448c106 0 192 -77 192 -171c0 -59 -48 -106 -107 -106h-37c-18 0 -32 -14 -32 -32c0 -8 3 -15 8 -21s8 -14 8 -22c0 -18 -14 -32 -32 -32c-106 0 -192 86 -192 192s86 192 192 192z" />
+    <glyph glyph-name="pan_tool" unicode="pan_tool" 
+d="M491 395v-310c0 -47 -39 -85 -86 -85h-155c-23 0 -45 9 -61 25l-168 171s27 26 28 26c5 4 11 6 17 6c5 0 9 -1 13 -3c1 0 92 -52 92 -52v254c0 18 14 32 32 32s32 -14 32 -32v-150h21v203c0 18 14 32 32 32s32 -14 32 -32v-203h21v182c0 18 14 32 32 32s32 -14 32 -32
+v-182h22v118c0 18 14 32 32 32s32 -14 32 -32z" />
+    <glyph glyph-name="panorama" unicode="panorama" 
+d="M181 245l-74 -96h298l-96 128l-74 -96zM491 128c0 -23 -20 -43 -43 -43h-384c-23 0 -43 20 -43 43v256c0 23 20 43 43 43h384c23 0 43 -20 43 -43v-256z" />
+    <glyph glyph-name="panorama_fish_eye" unicode="panorama_fish_eye" 
+d="M256 85c94 0 171 77 171 171s-77 171 -171 171s-171 -77 -171 -171s77 -171 171 -171zM256 469c118 0 213 -95 213 -213s-95 -213 -213 -213s-213 95 -213 213s95 213 213 213z" />
+    <glyph glyph-name="panorama_horizontal" unicode="panorama_horizontal" 
+d="M457 427c7 0 12 -5 12 -14v-314c0 -9 -5 -14 -12 -14c-2 0 -4 1 -6 2c-63 23 -129 35 -195 35s-132 -12 -195 -35c-2 -1 -4 -2 -6 -2c-7 0 -12 6 -12 14v314c0 9 5 14 12 14c2 0 4 -1 6 -2c63 -23 129 -35 195 -35s132 12 195 35c2 1 4 2 6 2zM427 372
+c-55 -17 -113 -24 -171 -24s-116 8 -171 24v-232c55 16 113 24 171 24s116 -8 171 -24v232z" />
+    <glyph glyph-name="panorama_vertical" unicode="panorama_vertical" 
+d="M140 85h232c-16 55 -24 113 -24 171s8 116 24 171h-232c16 -55 24 -113 24 -171s-8 -116 -24 -171zM425 61c1 -2 2 -4 2 -6c0 -7 -6 -12 -14 -12h-314c-9 0 -14 5 -14 12c0 2 1 4 2 6c23 63 35 129 35 195s-12 132 -35 195c-1 2 -2 4 -2 6c0 7 5 12 14 12h314
+c9 0 14 -5 14 -12c0 -2 -1 -4 -2 -6c-23 -63 -35 -129 -35 -195s12 -132 35 -195z" />
+    <glyph glyph-name="panorama_wide_angle" unicode="panorama_wide_angle" 
+d="M256 427c58 0 112 -6 170 -16l19 -3l6 -19c12 -44 18 -89 18 -133s-6 -89 -18 -133l-6 -19l-19 -3c-58 -10 -112 -16 -170 -16s-112 6 -170 16l-19 3l-6 19c-12 44 -18 89 -18 133s6 89 18 133l6 19l19 3c58 10 112 16 170 16zM256 384c-52 0 -101 -5 -156 -14
+c-10 -38 -15 -76 -15 -114s5 -76 15 -114c55 -9 104 -14 156 -14s101 5 156 14c10 38 15 76 15 114s-5 76 -15 114c-55 9 -104 14 -156 14z" />
+    <glyph glyph-name="party_mode" unicode="party_mode" 
+d="M256 149c59 0 107 48 107 107c0 7 -1 14 -2 21h-45c2 -7 4 -14 4 -21c0 -35 -29 -64 -64 -64h-85c20 -26 50 -43 85 -43zM256 363c-59 0 -107 -48 -107 -107c0 -7 1 -14 2 -21h45c-2 7 -4 14 -4 21c0 35 29 64 64 64h85c-20 26 -50 43 -85 43zM427 427
+c23 0 42 -20 42 -43v-256c0 -23 -19 -43 -42 -43h-342c-23 0 -42 20 -42 43v256c0 23 19 43 42 43h68l39 42h128l39 -42h68z" />
+    <glyph glyph-name="pause" unicode="pause" 
+d="M299 405h85v-298h-85v298zM128 107v298h85v-298h-85z" />
+    <glyph glyph-name="pause_circle_filled" unicode="pause_circle_filled" 
+d="M320 171v170h-43v-170h43zM235 171v170h-43v-170h43zM256 469c118 0 213 -95 213 -213s-95 -213 -213 -213s-213 95 -213 213s95 213 213 213z" />
+    <glyph glyph-name="pause_circle_outline" unicode="pause_circle_outline" 
+d="M277 171v170h43v-170h-43zM256 85c94 0 171 77 171 171s-77 171 -171 171s-171 -77 -171 -171s77 -171 171 -171zM256 469c118 0 213 -95 213 -213s-95 -213 -213 -213s-213 95 -213 213s95 213 213 213zM192 171v170h43v-170h-43z" />
+    <glyph glyph-name="payment" unicode="payment" 
+d="M427 341v43h-342v-43h342zM427 128v128h-342v-128h342zM427 427c24 0 42 -19 42 -43v-256c0 -24 -18 -43 -42 -43h-342c-24 0 -42 19 -42 43v256c0 24 18 43 42 43h342z" />
+    <glyph glyph-name="people" unicode="people" 
+d="M341 235c50 0 150 -25 150 -75v-53h-128v53c0 32 -17 56 -42 74c7 1 14 1 20 1zM171 235c50 0 149 -25 149 -75v-53h-299v53c0 50 100 75 150 75zM171 277c-35 0 -64 29 -64 64s29 64 64 64s63 -29 63 -64s-28 -64 -63 -64zM341 277c-35 0 -64 29 -64 64s29 64 64 64
+s64 -29 64 -64s-29 -64 -64 -64z" />
+    <glyph glyph-name="people_outline" unicode="people_outline" 
+d="M352 373c-23 0 -43 -19 -43 -42s20 -43 43 -43s43 20 43 43s-20 42 -43 42zM352 256c-41 0 -75 34 -75 75s34 74 75 74s75 -33 75 -74s-34 -75 -75 -75zM160 373c-23 0 -43 -19 -43 -42s20 -43 43 -43s43 20 43 43s-20 42 -43 42zM160 256c-41 0 -75 34 -75 75
+s34 74 75 74s75 -33 75 -74s-34 -75 -75 -75zM459 139v26c0 12 -55 38 -107 38c-23 0 -45 -6 -64 -12c7 -8 11 -16 11 -26v-26h160zM267 139v26c0 12 -55 38 -107 38s-107 -26 -107 -38v-26h214zM352 235c46 0 139 -24 139 -70v-58h-470v58c0 46 93 70 139 70
+c26 0 65 -8 96 -22c31 14 70 22 96 22z" />
+    <glyph glyph-name="perm_camera_mic" unicode="perm_camera_mic" 
+d="M299 235v85c0 23 -20 43 -43 43s-43 -20 -43 -43v-85c0 -23 20 -43 43 -43s43 20 43 43zM427 405c23 0 42 -19 42 -42v-256c0 -23 -19 -43 -42 -43h-150v45c60 10 107 63 107 126h-43c0 -47 -38 -86 -85 -86s-85 39 -85 86h-43c0 -63 47 -116 107 -126v-45h-150
+c-23 0 -42 20 -42 43v256c0 23 19 42 42 42h68l39 43h128l39 -43h68z" />
+    <glyph glyph-name="perm_contact_calendar" unicode="perm_contact_calendar" 
+d="M384 128v21c0 43 -85 66 -128 66s-128 -23 -128 -66v-21h256zM256 384c-35 0 -64 -29 -64 -64s29 -64 64 -64s64 29 64 64s-29 64 -64 64zM405 448c23 0 43 -20 43 -43v-298c0 -23 -20 -43 -43 -43h-298c-24 0 -43 20 -43 43v298c0 23 19 43 43 43h21v43h43v-43h170v43
+h43v-43h21z" />
+    <glyph glyph-name="perm_data_setting" unicode="perm_data_setting" 
+d="M405 75c18 0 32 14 32 32s-14 32 -32 32s-32 -14 -32 -32s14 -32 32 -32zM484 96l23 -17c2 -2 2 -5 1 -7l-21 -37c-1 -2 -5 -4 -7 -3l-26 11c-5 -4 -12 -7 -18 -10l-4 -29c0 -3 -3 -4 -6 -4h-42c-3 0 -6 1 -6 4l-4 29c-7 3 -12 6 -18 10l-26 -11c-3 -1 -6 1 -7 3l-21 37
+c-1 2 -1 5 1 7l23 17c0 3 -1 7 -1 11s1 7 1 10l-23 18c-2 2 -2 5 -1 7l21 37c1 2 5 3 7 2l26 -11c6 4 12 8 18 11l4 28c0 3 3 4 6 4h42c3 0 6 -1 6 -4l4 -28c7 -3 12 -7 18 -11l26 11c3 1 6 0 7 -2l21 -37c1 -2 1 -5 -1 -7l-23 -18c1 -3 1 -6 1 -10s-1 -8 -1 -11zM405 267
+c-88 0 -160 -72 -160 -160c0 -7 1 -15 2 -22h-247l427 427l-1 -247c-7 1 -14 2 -21 2z" />
+    <glyph glyph-name="perm_device_information" unicode="perm_device_information" 
+d="M363 107v298h-214v-298h214zM363 490c23 0 42 -19 42 -42v-384c0 -23 -19 -43 -42 -43h-214c-23 0 -42 20 -42 43v384c0 23 19 43 42 43zM277 277v-128h-42v128h42zM277 363v-43h-42v43h42z" />
+    <glyph glyph-name="perm_identity" unicode="perm_identity" 
+d="M256 235c57 0 171 -29 171 -86v-64h-342v64c0 57 114 86 171 86zM256 427c47 0 85 -39 85 -86s-38 -85 -85 -85s-85 38 -85 85s38 86 85 86zM256 194c-63 0 -130 -31 -130 -45v-23h260v23c0 14 -67 45 -130 45zM256 386c-25 0 -45 -20 -45 -45s20 -44 45 -44s45 19 45 44
+s-20 45 -45 45z" />
+    <glyph glyph-name="perm_media" unicode="perm_media" 
+d="M149 192h299l-75 96l-53 -64l-75 96zM469 427c23 0 43 -20 43 -43v-213c0 -23 -20 -43 -43 -43h-341c-23 0 -43 20 -43 43l1 256c0 23 19 42 42 42h128l43 -42h170zM43 384v-299h384v-42h-384c-23 0 -43 19 -43 42v299h43z" />
+    <glyph glyph-name="perm_phone_msg" unicode="perm_phone_msg" 
+d="M256 448h192v-149h-128l-64 -64v213zM427 181c12 0 21 -9 21 -21v-75c0 -12 -9 -21 -21 -21c-200 0 -363 163 -363 363c0 12 9 21 21 21h75c12 0 21 -9 21 -21c0 -27 4 -52 12 -76c2 -7 1 -16 -5 -22l-47 -47c31 -60 81 -110 141 -141l47 47c6 6 15 7 22 5
+c24 -8 49 -12 76 -12z" />
+    <glyph glyph-name="perm_scan_wifi" unicode="perm_scan_wifi" 
+d="M235 341h42v43h-42v-43zM277 171v128h-42v-128h42zM256 448c108 0 189 -40 256 -91l-256 -314l-256 315c67 51 148 90 256 90z" />
+    <glyph glyph-name="person" unicode="person" 
+d="M256 213c57 0 171 -28 171 -85v-43h-342v43c0 57 114 85 171 85zM256 256c-47 0 -85 38 -85 85s38 86 85 86s85 -39 85 -86s-38 -85 -85 -85z" />
+    <glyph glyph-name="person_add" unicode="person_add" 
+d="M320 213c57 0 171 -28 171 -85v-43h-342v43c0 57 114 85 171 85zM128 299h64v-43h-64v-64h-43v64h-64v43h64v64h43v-64zM320 256c-47 0 -85 38 -85 85s38 86 85 86s85 -39 85 -86s-38 -85 -85 -85z" />
+    <glyph glyph-name="person_outline" unicode="person_outline" 
+d="M256 235c57 0 171 -29 171 -86v-64h-342v64c0 57 114 86 171 86zM256 427c47 0 85 -39 85 -86s-38 -85 -85 -85s-85 38 -85 85s38 86 85 86zM256 194c-63 0 -130 -31 -130 -45v-23h260v23c0 14 -67 45 -130 45zM256 386c-25 0 -45 -20 -45 -45s20 -44 45 -44s45 19 45 44
+s-20 45 -45 45z" />
+    <glyph glyph-name="person_pin" unicode="person_pin" 
+d="M384 171v19c0 43 -85 66 -128 66s-128 -23 -128 -66v-19h256zM256 399c-32 0 -58 -26 -58 -58s26 -57 58 -57s58 25 58 57s-26 58 -58 58zM405 469c23 0 43 -19 43 -42v-299c0 -23 -20 -43 -43 -43h-85l-64 -64l-64 64h-85c-24 0 -43 20 -43 43v299c0 23 19 42 43 42h298
+z" />
+    <glyph glyph-name="person_pin_circle" unicode="person_pin_circle" 
+d="M256 213c36 0 67 18 85 46c0 28 -57 44 -85 44s-85 -16 -85 -44c18 -28 49 -46 85 -46zM256 427c-23 0 -43 -20 -43 -43c0 -24 20 -43 43 -43s43 19 43 43c0 23 -20 43 -43 43zM256 469c82 0 149 -67 149 -149c0 -112 -149 -277 -149 -277s-149 165 -149 277
+c0 82 67 149 149 149z" />
+    <glyph glyph-name="personal_video" unicode="personal_video" 
+d="M448 149v256h-384v-256h384zM448 448c23 0 43 -19 43 -43l-1 -256c0 -23 -19 -42 -42 -42h-107v-43h-170v43h-107c-24 0 -43 19 -43 42v256c0 24 19 43 43 43h384z" />
+    <glyph glyph-name="pets" unicode="pets" 
+d="M370 195c28 -28 63 -58 56 -102c-6 -22 -22 -44 -50 -50c-16 -3 -65 9 -118 9h-4c-53 0 -102 -12 -118 -9c-28 6 -44 28 -50 50c-6 43 28 74 56 102c19 22 34 40 53 62c10 12 22 23 37 28c2 1 5 2 7 2c6 1 11 1 17 1s12 0 17 -1c2 0 5 -1 7 -2c15 -5 27 -16 37 -28
+c19 -22 34 -40 53 -62zM363 309c0 29 24 54 53 54s53 -25 53 -54s-24 -53 -53 -53s-53 24 -53 53zM267 395c0 29 24 53 53 53s53 -24 53 -53s-24 -54 -53 -54s-53 25 -53 54zM139 395c0 29 24 53 53 53s53 -24 53 -53s-24 -54 -53 -54s-53 25 -53 54zM43 309
+c0 29 24 54 53 54s53 -25 53 -54s-24 -53 -53 -53s-53 24 -53 53z" />
+    <glyph glyph-name="phone" unicode="phone" 
+d="M141 282c31 -60 81 -110 141 -141l47 47c6 6 15 8 22 5c24 -8 50 -12 76 -12c12 0 21 -9 21 -21v-75c0 -12 -9 -21 -21 -21c-200 0 -363 163 -363 363c0 12 9 21 21 21h75c12 0 21 -9 21 -21c0 -27 4 -52 12 -76c2 -7 1 -16 -5 -22z" />
+    <glyph glyph-name="phone_android" unicode="phone_android" 
+d="M368 128v299h-224v-299h224zM299 64v21h-86v-21h86zM341 491c35 0 64 -29 64 -64v-342c0 -35 -29 -64 -64 -64h-170c-35 0 -64 29 -64 64v342c0 35 29 64 64 64h170z" />
+    <glyph glyph-name="phone_bluetooth_speaker" unicode="phone_bluetooth_speaker" 
+d="M427 181c12 0 21 -9 21 -21v-75c0 -12 -9 -21 -21 -21c-200 0 -363 163 -363 363c0 12 9 21 21 21h75c12 0 21 -9 21 -21c0 -27 4 -52 12 -76c2 -7 1 -16 -5 -22l-47 -47c31 -61 81 -110 141 -141l47 47c6 6 15 7 22 5c24 -8 49 -12 76 -12zM384 358v-40l20 20zM384 450
+v-40l20 20zM314 309l-15 15l59 60l-59 60l15 15l49 -49v81h10l61 -61l-46 -46l46 -46l-61 -61h-10v81z" />
+    <glyph glyph-name="phone_forwarded" unicode="phone_forwarded" 
+d="M427 181c12 0 21 -9 21 -21v-75c0 -12 -9 -21 -21 -21c-200 0 -363 163 -363 363c0 12 9 21 21 21h75c12 0 21 -9 21 -21c0 -27 4 -52 12 -76c2 -7 1 -16 -5 -22l-47 -47c31 -61 81 -110 141 -141l47 47c6 6 15 7 22 5c24 -8 49 -12 76 -12zM384 277v64h-85v86h85v64
+l107 -107z" />
+    <glyph glyph-name="phone_in_talk" unicode="phone_in_talk" 
+d="M320 256c0 35 -29 64 -64 64v43c59 0 107 -48 107 -107h-43zM405 256c0 83 -66 149 -149 149v43c106 0 192 -86 192 -192h-43zM427 181c12 0 21 -9 21 -21v-75c0 -12 -9 -21 -21 -21c-200 0 -363 163 -363 363c0 12 9 21 21 21h75c12 0 21 -9 21 -21c0 -27 4 -52 12 -76
+c2 -7 1 -16 -5 -22l-47 -47c31 -61 81 -110 141 -141l47 47c6 6 15 7 22 5c24 -8 49 -12 76 -12z" />
+    <glyph glyph-name="phone_iphone" unicode="phone_iphone" 
+d="M341 128v299h-192v-299h192zM245 43c18 0 32 14 32 32s-14 32 -32 32s-32 -14 -32 -32s14 -32 32 -32zM331 491c29 0 53 -25 53 -54v-362c0 -29 -24 -54 -53 -54h-171c-29 0 -53 25 -53 54v362c0 29 24 54 53 54h171z" />
+    <glyph glyph-name="phone_locked" unicode="phone_locked" 
+d="M410 427v10c0 20 -17 37 -37 37s-36 -17 -36 -37v-10h73zM427 427c12 0 21 -10 21 -22v-85c0 -12 -9 -21 -21 -21h-107c-12 0 -21 9 -21 21v85c0 12 9 22 21 22v10c0 29 24 54 53 54s54 -25 54 -54v-10zM427 181c12 0 21 -9 21 -21v-75c0 -12 -9 -21 -21 -21
+c-200 0 -363 163 -363 363c0 12 9 21 21 21h75c12 0 21 -9 21 -21c0 -27 4 -52 12 -76c2 -7 1 -16 -5 -22l-47 -47c31 -61 81 -110 141 -141l47 47c6 6 15 7 22 5c24 -8 49 -12 76 -12z" />
+    <glyph glyph-name="phone_missed" unicode="phone_missed" 
+d="M506 156c4 -4 6 -9 6 -15s-2 -11 -6 -15l-53 -53c-4 -4 -9 -6 -15 -6s-11 2 -15 6c-17 16 -36 30 -57 40c-7 3 -12 11 -12 19v66c-31 10 -64 15 -98 15s-67 -5 -98 -15v-66c0 -9 -5 -17 -12 -20c-21 -10 -40 -23 -57 -39c-4 -4 -9 -6 -15 -6s-11 2 -15 6l-53 53
+c-4 4 -6 9 -6 15s2 11 6 15c65 62 153 100 250 100s185 -38 250 -100zM139 395v-75h-32v128h128v-32h-75l96 -96l128 128l21 -21l-149 -150z" />
+    <glyph glyph-name="phone_paused" unicode="phone_paused" 
+d="M405 448h43v-149h-43v149zM427 181c12 0 21 -9 21 -21v-75c0 -12 -9 -21 -21 -21c-200 0 -363 163 -363 363c0 12 9 21 21 21h75c12 0 21 -9 21 -21c0 -27 4 -52 12 -76c2 -7 1 -16 -5 -22l-47 -47c31 -61 81 -110 141 -141l47 47c6 6 15 7 22 5c24 -8 49 -12 76 -12z
+M363 448v-149h-43v149h43z" />
+    <glyph glyph-name="phonelink" unicode="phonelink" 
+d="M469 149v150h-85v-150h85zM491 341c12 0 21 -9 21 -21v-213c0 -12 -9 -22 -21 -22h-128c-12 0 -22 10 -22 22v213c0 12 10 21 22 21h128zM85 384v-235h214v-64h-299v64h43v235c0 23 19 43 42 43h384v-43h-384z" />
+    <glyph glyph-name="phonelink_erase" unicode="phonelink_erase" 
+d="M405 491c23 0 43 -20 43 -43v-384c0 -23 -20 -43 -43 -43h-213c-23 0 -43 20 -43 43v64h43v-43h213v342h-213v-43h-43v64c0 23 20 43 43 43h213zM277 337l-85 -85l85 -86l-21 -21l-85 85l-86 -85l-21 21l85 86l-85 85l21 21l86 -85l85 85z" />
+    <glyph glyph-name="phonelink_lock" unicode="phonelink_lock" 
+d="M203 277v32c0 17 -15 28 -32 28s-32 -11 -32 -28v-32h64zM230 277c13 0 26 -12 26 -27v-75c0 -13 -13 -26 -28 -26h-117c-13 0 -26 13 -26 28v75c0 13 13 25 26 25v32c0 30 30 54 60 54s59 -24 59 -54v-32zM405 491c23 0 43 -20 43 -43v-384c0 -23 -20 -43 -43 -43h-213
+c-23 0 -43 20 -43 43v64h43v-43h213v342h-213v-43h-43v64c0 23 20 43 43 43h213z" />
+    <glyph glyph-name="phonelink_off" unicode="phonelink_off" 
+d="M491 341c12 0 21 -9 21 -21v-213c0 -12 -9 -22 -21 -22h-4l-64 64h46v150h-85v-111l-43 43v89c0 12 10 21 22 21h128zM85 378v-229h229zM41 477c138.107 -138.226 275.985 -276.682 414 -415l-27 -27l-50 50h-378v64h43v235c0 10 4 20 10 27l-39 39zM469 384h-281l-43 43
+h324v-43z" />
+    <glyph glyph-name="phonelink_ring" unicode="phonelink_ring" 
+d="M299 85v342h-214v-342h214zM299 491c23 0 42 -20 42 -43v-384c0 -23 -19 -43 -42 -43h-214c-23 0 -42 20 -42 43v384c0 23 19 43 42 43h214zM384 303c26 -28 26 -66 0 -92l-21 22c11 15 11 34 0 49zM429 348c53 -51 53 -133 0 -182l-22 22c38 41 38 100 0 138z" />
+    <glyph glyph-name="phonelink_setup" unicode="phonelink_setup" 
+d="M405 491c23 0 43 -20 43 -43v-384c0 -23 -20 -43 -43 -43h-213c-23 0 -43 20 -43 43v64h43v-43h213v342h-213v-43h-43v64c0 23 20 43 43 43h213zM171 213c23 0 42 20 42 43s-19 43 -42 43s-43 -20 -43 -43s20 -43 43 -43zM252 245l23 -19c2 -2 4 -4 2 -6l-21 -37
+c-2 -2 -4 -2 -6 -2l-28 11c-6 -4 -13 -9 -19 -11l-5 -27c-2 -2 -4 -5 -6 -5h-43c-2 0 -6 3 -4 5l-4 27c-6 2 -13 7 -19 11l-30 -9c-2 -2 -5 1 -7 3l-21 36c0 2 0 4 2 8l24 17v22l-24 17c-2 2 -4 4 -2 6l21 37c2 2 5 2 7 2l27 -11c6 4 14 9 20 11l4 27c2 2 4 5 6 5h43
+c4 0 6 -3 6 -5l5 -27c6 -2 13 -7 19 -11l28 9c2 2 4 -1 6 -3l21 -36c0 -2 0 -4 -2 -6l-23 -17v-22z" />
+    <glyph glyph-name="photo" unicode="photo" 
+d="M181 224l-74 -96h298l-96 128l-74 -96zM448 107c0 -23 -20 -43 -43 -43h-298c-23 0 -43 20 -43 43v298c0 23 20 43 43 43h298c23 0 43 -20 43 -43v-298z" />
+    <glyph glyph-name="photo_album" unicode="photo_album" 
+d="M128 107h256l-82 109l-64 -82l-46 55zM128 427v-171l53 32l54 -32v171h-107zM384 469c23 0 43 -19 43 -42v-342c0 -23 -20 -42 -43 -42h-256c-23 0 -43 19 -43 42v342c0 23 20 42 43 42h256z" />
+    <glyph glyph-name="photo_camera" unicode="photo_camera" 
+d="M256 149c59 0 107 48 107 107s-48 107 -107 107s-107 -48 -107 -107s48 -107 107 -107zM192 469h128l39 -42h68c23 0 42 -20 42 -43v-256c0 -23 -19 -43 -42 -43h-342c-23 0 -42 20 -42 43v256c0 23 19 43 42 43h68zM188 256c0 38 30 68 68 68s68 -30 68 -68
+s-30 -68 -68 -68s-68 30 -68 68z" />
+    <glyph glyph-name="photo_filter" unicode="photo_filter" 
+d="M283 283l58 -27l-58 -27l-27 -58l-27 58l-58 27l58 27l27 58zM363 299l-20 44l-44 20l44 20l20 44l20 -44l44 -20l-44 -20zM406 299h42v-192c0 -23 -19 -43 -42 -43h-299c-23 0 -43 20 -43 43v298c0 23 20 43 43 43h192v-43h-192v-298h299v192z" />
+    <glyph glyph-name="photo_library" unicode="photo_library" 
+d="M43 384h42v-299h299v-42h-299c-23 0 -42 19 -42 42v299zM235 256l-64 -85h256l-86 106l-63 -79zM469 171c0 -23 -19 -43 -42 -43h-256c-23 0 -43 20 -43 43v256c0 23 20 42 43 42h256c23 0 42 -19 42 -42v-256z" />
+    <glyph glyph-name="photo_size_select_actual" unicode="photo_size_select_actual" 
+d="M107 149h298l-96 128l-74 -96l-54 64zM448 448c21 0 43 -22 43 -43v-298c0 -21 -22 -43 -43 -43h-384c-23 0 -43 20 -43 43v298c0 21 22 43 43 43h384z" />
+    <glyph glyph-name="photo_size_select_large" unicode="photo_size_select_large" 
+d="M64 107h213l-68 91l-53 -69l-39 46zM21 277h299v-213h-256c-23 0 -43 20 -43 43v170zM107 448h42v-43h-42v43zM192 448h43v-43h-43v43zM64 448v-43h-43c0 21 22 43 43 43zM363 107h42v-43h-42v43zM363 448h42v-43h-42v43zM21 363h43v-43h-43v43zM448 448
+c21 0 43 -22 43 -43h-43v43zM448 363h43v-43h-43v43zM277 448h43v-43h-43v43zM491 107c0 -21 -22 -43 -43 -43v43h43zM448 277h43v-42h-43v42zM448 192h43v-43h-43v43z" />
+    <glyph glyph-name="photo_size_select_small" unicode="photo_size_select_small" 
+d="M149 448v-43h-42v43h42zM235 448v-43h-43v43h43zM64 277v-42h-43v42h43zM64 448v-43h-43c0 21 22 43 43 43zM405 107v-43h-42v43h42zM405 448v-43h-42v43h42zM320 107v-43h-43v43h43zM64 363v-43h-43v43h43zM64 64c-23 0 -43 20 -43 43v85h214v-128h-171zM448 448
+c21 0 43 -22 43 -43h-43v43zM491 363v-43h-43v43h43zM320 448v-43h-43v43h43zM491 107c0 -21 -22 -43 -43 -43v43h43zM491 277v-42h-43v42h43zM491 192v-43h-43v43h43z" />
+    <glyph glyph-name="picture_as_pdf" unicode="picture_as_pdf" 
+d="M299 267v64h21v-64h-21zM85 384v-299h299v-42h-299c-23 0 -42 19 -42 42v299h42zM192 309v22h21v-22h-21zM437 331v32h-64v-128h32v42h32v32h-32v22h32zM352 267v64c0 18 -14 32 -32 32h-53v-128h53c18 0 32 14 32 32zM245 309v22c0 18 -14 32 -32 32h-53v-128h32v42h21
+c18 0 32 14 32 32zM427 469c23 0 42 -19 42 -42v-256c0 -23 -19 -43 -42 -43h-256c-23 0 -43 20 -43 43v256c0 23 20 42 43 42h256z" />
+    <glyph glyph-name="picture_in_picture" unicode="picture_in_picture" 
+d="M448 106v300h-384v-300h384zM448 448c23 0 43 -20 43 -43v-298c0 -23 -20 -43 -43 -43h-384c-23 0 -43 20 -43 43v298c0 23 20 43 43 43h384zM405 363v-128h-170v128h170z" />
+    <glyph glyph-name="picture_in_picture_alt" unicode="picture_in_picture_alt" 
+d="M448 106v300h-384v-300h384zM491 107c0 -23 -20 -43 -43 -43h-384c-23 0 -43 20 -43 43v299c0 23 20 42 43 42h384c23 0 43 -19 43 -42v-299zM405 277v-128h-170v128h170z" />
+    <glyph glyph-name="pie_chart" unicode="pie_chart" 
+d="M278 234h191c-10 -101 -90 -181 -191 -191v191zM278 469c101 -10 181 -90 191 -191h-191v191zM235 469v-426c-108 11 -192 102 -192 213s84 202 192 213z" />
+    <glyph glyph-name="pie_chart_outlined" unicode="pie_chart_outlined" 
+d="M277 87c77 10 138 71 148 148h-148v-148zM85 256c0 -87 66 -158 150 -169v338c-84 -10 -150 -82 -150 -169zM277 425v-148h148c-10 77 -71 138 -148 148zM256 469c117 0 213 -96 213 -213s-96 -213 -213 -213s-213 96 -213 213s96 213 213 213z" />
+    <glyph glyph-name="pin_drop" unicode="pin_drop" 
+d="M107 85h298v-42h-298v42zM213 341c0 -23 20 -42 43 -42c24 0 43 19 43 42s-20 43 -43 43s-43 -20 -43 -43zM384 341c0 -96 -128 -234 -128 -234s-128 138 -128 234c0 71 57 128 128 128s128 -57 128 -128z" />
+    <glyph glyph-name="place" unicode="place" 
+d="M256 267c29 0 53 24 53 53s-24 53 -53 53s-53 -24 -53 -53s24 -53 53 -53zM256 469c83 0 149 -66 149 -149c0 -112 -149 -277 -149 -277s-149 165 -149 277c0 83 66 149 149 149z" />
+    <glyph glyph-name="play_arrow" unicode="play_arrow" 
+d="M171 405l234 -149l-234 -149v298z" />
+    <glyph glyph-name="play_circle_filled" unicode="play_circle_filled" 
+d="M213 160l128 96l-128 96v-192zM256 469c118 0 213 -95 213 -213s-95 -213 -213 -213s-213 95 -213 213s95 213 213 213z" />
+    <glyph glyph-name="play_circle_outline" unicode="play_circle_outline" 
+d="M256 85c94 0 171 77 171 171s-77 171 -171 171s-171 -77 -171 -171s77 -171 171 -171zM256 469c118 0 213 -95 213 -213s-95 -213 -213 -213s-213 95 -213 213s95 213 213 213zM213 160v192l128 -96z" />
+    <glyph glyph-name="play_for_work" unicode="play_for_work" 
+d="M128 213h43c0 -47 38 -85 85 -85s85 38 85 85h43c0 -71 -57 -128 -128 -128s-128 57 -128 128zM235 405h42v-119h75l-96 -96l-96 96h75v119z" />
+    <glyph glyph-name="playlist_add" unicode="playlist_add" 
+d="M43 171v42h170v-42h-170zM384 213h85v-42h-85v-86h-43v86h-85v42h85v86h43v-86zM299 384v-43h-256v43h256zM299 299v-43h-256v43h256z" />
+    <glyph glyph-name="playlist_add_check" unicode="playlist_add_check" 
+d="M459 267l32 -32l-149 -150l-97 96l32 32l65 -64zM43 171v42h170v-42h-170zM299 384v-43h-256v43h256zM299 299v-43h-256v43h256z" />
+    <glyph glyph-name="playlist_play" unicode="playlist_play" 
+d="M363 235l106 -64l-106 -64v128zM43 192v43h277v-43h-277zM405 405v-42h-362v42h362zM405 320v-43h-362v43h362z" />
+    <glyph glyph-name="plus_one" unicode="plus_one" 
+d="M309 382l96 23v-277h-42v226l-54 -11v39zM213 341v-85h86v-43h-86v-85h-42v85h-86v43h86v85h42z" />
+    <glyph glyph-name="poll" unicode="poll" 
+d="M363 149v86h-43v-86h43zM277 149v214h-42v-214h42zM192 149v150h-43v-150h43zM405 448c23 0 43 -20 43 -43v-298c0 -23 -20 -43 -43 -43h-298c-23 0 -43 20 -43 43v298c0 23 20 43 43 43h298z" />
+    <glyph glyph-name="polymer" unicode="polymer" 
+d="M405 427l96 -171l-96 -171h-85l96 171l-56 99l-168 -270h-85l-96 171l96 171h85l-96 -171l56 -99l168 270h85z" />
+    <glyph glyph-name="pool" unicode="pool" 
+d="M299 395c0 29 24 53 53 53s53 -24 53 -53s-24 -54 -53 -54s-53 25 -53 54zM185 256c-12 0 -17 3 -25 8c-4 3 -9 5 -16 8l69 69l-21 22c-24 24 -46 32 -85 32v53c53 0 84 -10 117 -43l137 -136c-3 -2 -6 -4 -9 -5c-8 -5 -13 -8 -25 -8s-16 3 -24 8c-10 6 -23 13 -47 13
+s-37 -7 -47 -13c-8 -5 -12 -8 -24 -8zM469 160c-24 0 -36 8 -46 14c-8 5 -13 7 -25 7s-16 -2 -24 -7c-10 -6 -23 -14 -47 -14s-36 8 -46 14c-8 5 -13 7 -25 7s-16 -2 -24 -7c-10 -6 -23 -14 -47 -14s-36 8 -46 14c-8 5 -13 7 -25 7s-16 -2 -24 -7c-10 -6 -23 -14 -47 -14v43
+c12 0 16 2 24 7c10 6 23 14 47 14s36 -8 46 -14c8 -5 13 -7 25 -7s16 2 24 7c10 6 23 14 47 14s36 -8 46 -14c8 -5 13 -7 25 -7s16 2 24 7c10 6 23 14 47 14s36 -8 46 -14c8 -5 13 -7 25 -7v-43zM469 64c-24 0 -36 8 -46 14c-8 5 -13 7 -25 7s-16 -2 -24 -7
+c-10 -6 -23 -14 -47 -14s-36 8 -46 14c-8 5 -13 7 -25 7s-16 -2 -24 -7c-10 -6 -23 -14 -47 -14s-37 8 -47 14c-8 5 -12 7 -24 7s-17 -2 -25 -7c-10 -6 -22 -14 -46 -14v43c12 0 16 2 24 7c10 6 23 14 47 14s36 -8 46 -14c8 -5 13 -7 25 -7s16 2 24 7c10 6 23 14 47 14
+s37 -8 47 -14c8 -5 12 -7 24 -7s17 2 25 7c10 6 22 14 46 14s37 -8 47 -14c8 -5 12 -7 24 -7v-43z" />
+    <glyph glyph-name="portable_wifi_off" unicode="portable_wifi_off" 
+d="M70 459l21 -22l357 -357l-27 -27l-160 161h-1l-4 -1c-23 0 -43 20 -43 43l1 4l-34 34c-6 -12 -9 -24 -9 -38c0 -32 17 -59 42 -74l-21 -37c-38 22 -64 64 -64 111c0 26 7 49 20 69l-30 31c-20 -28 -33 -62 -33 -100c0 -63 34 -118 85 -148l-21 -37
+c-64 37 -106 106 -106 185c0 49 16 95 44 131l-44 45zM256 427c-29 0 -56 -7 -80 -20l-31 31c32 20 70 31 111 31c118 0 213 -95 213 -213c0 -41 -11 -79 -31 -111l-32 31c13 24 21 51 21 80c0 94 -77 171 -171 171zM375 208l-35 35c1 4 1 9 1 13c0 47 -38 85 -85 85
+c-4 0 -9 0 -13 -1l-35 35c15 6 31 9 48 9c71 0 128 -57 128 -128c0 -17 -3 -33 -9 -48z" />
+    <glyph glyph-name="portrait" unicode="portrait" 
+d="M405 107v298h-298v-298h298zM405 448c23 0 43 -20 43 -43v-298c0 -23 -20 -43 -43 -43h-298c-23 0 -43 20 -43 43v298c0 23 20 43 43 43h298zM352 165v-16h-192v16c0 32 64 48 96 48s96 -16 96 -48zM256 251c-26 0 -48 22 -48 48s22 48 48 48s48 -22 48 -48
+s-22 -48 -48 -48z" />
+    <glyph glyph-name="power" unicode="power" 
+d="M342 363c21 0 42 -22 42 -43v-117l-75 -75v-64h-106v64l-75 75v117c0 21 21 43 42 43h1v85h42v-85h86v85h42z" />
+    <glyph glyph-name="power_input" unicode="power_input" 
+d="M341 192v43h107v-43h-107zM192 192v43h107v-43h-107zM43 192v43h106v-43h-106zM43 320h405v-43h-405v43z" />
+    <glyph glyph-name="power_settings_new" unicode="power_settings_new" 
+d="M380 402c41 -35 68 -88 68 -146c0 -106 -86 -192 -192 -192s-192 86 -192 192c0 58 27 111 68 146l30 -30c-33 -27 -55 -69 -55 -116c0 -83 66 -149 149 -149s149 66 149 149c0 47 -21 88 -55 115zM277 448v-213h-42v213h42z" />
+    <glyph glyph-name="pregnant_woman" unicode="pregnant_woman" 
+d="M341 235v-86h-64v-106h-64v106h-42v150c0 35 29 64 64 64s64 -29 64 -64c25 -10 42 -35 42 -64zM192 427c0 24 19 42 43 42s42 -18 42 -42s-18 -43 -42 -43s-43 19 -43 43z" />
+    <glyph glyph-name="present_to_all" unicode="present_to_all" 
+d="M213 256h-42l85 85l85 -85h-42v-85h-86v85zM448 106v300h-384v-300h384zM448 448c24 0 43 -19 43 -43v-298c0 -24 -19 -43 -43 -43h-384c-24 0 -43 19 -43 43v298c0 24 19 43 43 43h384z" />
+    <glyph glyph-name="print" unicode="print" 
+d="M384 448v-85h-256v85h256zM405 256c12 0 22 9 22 21s-10 22 -22 22s-21 -10 -21 -22s9 -21 21 -21zM341 107v106h-170v-106h170zM405 341c35 0 64 -29 64 -64v-128h-85v-85h-256v85h-85v128c0 35 29 64 64 64h298z" />
+    <glyph glyph-name="priority_high" unicode="priority_high" 
+d="M213 448h86v-256h-86v256zM213 107c0 24 19 42 43 42s43 -18 43 -42s-19 -43 -43 -43s-43 19 -43 43z" />
+    <glyph glyph-name="public" unicode="public" 
+d="M382 141c28 30 45 71 45 115c0 71 -44 133 -107 158v-9c0 -23 -20 -42 -43 -42h-42v-43c0 -12 -10 -21 -22 -21h-42v-43h128c12 0 21 -9 21 -21v-64h21c19 0 35 -13 41 -30zM235 87v41c-23 0 -43 20 -43 43v21l-102 102c-3 -12 -5 -25 -5 -38c0 -87 66 -159 150 -169z
+M256 469c118 0 213 -95 213 -213s-95 -213 -213 -213s-213 95 -213 213s95 213 213 213z" />
+    <glyph glyph-name="publish" unicode="publish" 
+d="M107 213l149 150l149 -150h-85v-128h-128v128h-85zM107 427h298v-43h-298v43z" />
+    <glyph glyph-name="query_builder" unicode="query_builder" 
+d="M267 363v-112l96 -57l-16 -27l-112 68v128h32zM256 85c94 0 171 77 171 171s-77 171 -171 171s-171 -77 -171 -171s77 -171 171 -171zM256 469c118 0 213 -95 213 -213s-95 -213 -213 -213s-213 95 -213 213s95 213 213 213z" />
+    <glyph glyph-name="question_answer" unicode="question_answer" 
+d="M363 256c0 -12 -10 -21 -22 -21h-213l-85 -86v299c0 12 9 21 21 21h277c12 0 22 -9 22 -21v-192zM448 384c12 0 21 -9 21 -21v-320l-85 85h-235c-12 0 -21 9 -21 21v43h277v192h43z" />
+    <glyph glyph-name="queue" unicode="queue" 
+d="M405 277v43h-85v85h-43v-85h-85v-43h85v-85h43v85h85zM427 469c23 0 42 -19 42 -42v-256c0 -23 -19 -43 -42 -43h-256c-23 0 -43 20 -43 43v256c0 23 20 42 43 42h256zM85 384v-299h299v-42h-299c-23 0 -42 19 -42 42v299h42z" />
+    <glyph glyph-name="queue_music" unicode="queue_music" 
+d="M363 384h106v-43h-64v-192c0 -35 -29 -64 -64 -64s-64 29 -64 64s29 64 64 64c7 0 15 -2 22 -4v175zM64 171v42h171v-42h-171zM320 299v-43h-256v43h256zM320 384v-43h-256v43h256z" />
+    <glyph glyph-name="queue_play_next" unicode="queue_play_next" 
+d="M512 128l-96 -96l-32 32l64 64l-64 64l32 32zM277 299h64v-43h-64v-64h-42v64h-64v43h64v64h42v-64zM448 448c23 0 43 -19 43 -43v-170h-43v170h-384v-256h320v-42h-43v-43h-170v43h-107c-24 0 -43 19 -43 42v256c0 24 19 43 43 43h384z" />
+    <glyph glyph-name="radio" unicode="radio" 
+d="M427 256v85h-342v-85h256v43h43v-43h43zM149 85c35 0 64 29 64 64s-29 64 -64 64s-64 -29 -64 -64s29 -64 64 -64zM69 381l270 110l14 -36l-176 -71h250c24 0 42 -19 42 -43v-256c0 -23 -18 -42 -42 -42h-342c-24 0 -42 19 -42 42v256c0 18 10 34 26 40z" />
+    <glyph glyph-name="radio_button_checked" unicode="radio_button_checked" 
+d="M256 85c94 0 171 77 171 171s-77 171 -171 171s-171 -77 -171 -171s77 -171 171 -171zM256 469c118 0 213 -95 213 -213s-95 -213 -213 -213s-213 95 -213 213s95 213 213 213zM256 363c59 0 107 -48 107 -107s-48 -107 -107 -107s-107 48 -107 107s48 107 107 107z" />
+    <glyph glyph-name="radio_button_unchecked" unicode="radio_button_unchecked" 
+d="M256 85c94 0 171 77 171 171s-77 171 -171 171s-171 -77 -171 -171s77 -171 171 -171zM256 469c118 0 213 -95 213 -213s-95 -213 -213 -213s-213 95 -213 213s95 213 213 213z" />
+    <glyph glyph-name="rate_review" unicode="rate_review" 
+d="M384 213v43h-117l-43 -43h160zM128 213h53l147 147c4 4 4 11 0 15l-38 38c-4 4 -11 4 -15 0l-147 -147v-53zM427 469c23 0 42 -19 42 -42v-256c0 -23 -19 -43 -42 -43h-299l-85 -85v384c0 23 19 42 42 42h342z" />
+    <glyph glyph-name="receipt" unicode="receipt" 
+d="M64 43v426l32 -32l32 32l32 -32l32 32l32 -32l32 32l32 -32l32 32l32 -32l32 32l32 -32l32 32v-426l-32 32l-32 -32l-32 32l-32 -32l-32 32l-32 -32l-32 32l-32 -32l-32 32l-32 -32l-32 32zM384 320v43h-256v-43h256zM384 235v42h-256v-42h256zM384 149v43h-256v-43h256z
+" />
+    <glyph glyph-name="recent_actors" unicode="recent_actors" 
+d="M267 149v16c0 32 -64 48 -96 48s-96 -16 -96 -48v-16h192zM171 347c-26 0 -48 -22 -48 -48s22 -48 48 -48s48 22 48 48s-22 48 -48 48zM299 405c12 0 21 -9 21 -21v-256c0 -12 -9 -21 -21 -21h-256c-12 0 -22 9 -22 21v256c0 12 10 21 22 21h256zM363 107v298h42v-298
+h-42zM448 405h43v-298h-43v298z" />
+    <glyph glyph-name="record_voice_over" unicode="record_voice_over" 
+d="M428 469c83 -86 83 -215 0 -298l-35 34c59 68 59 166 0 230zM358 398c43 -47 43 -112 0 -155l-36 36c18 25 18 58 0 83zM192 192c57 0 171 -28 171 -85v-43h-342v43c0 57 114 85 171 85zM107 320c0 47 38 85 85 85s85 -38 85 -85s-38 -85 -85 -85s-85 38 -85 85z" />
+    <glyph glyph-name="redeem" unicode="redeem" 
+d="M427 213v128h-109l45 -60l-35 -25c-24.0378 32.6288 -48.3187 65.0147 -72 98c-23.6829 -32.9837 -47.9614 -65.3719 -72 -98l-35 25l45 60h-109v-128h342zM427 107v42h-342v-42h342zM192 427c-12 0 -21 -10 -21 -22s9 -21 21 -21s21 9 21 21s-9 22 -21 22zM320 427
+c-12 0 -21 -10 -21 -22s9 -21 21 -21s21 9 21 21s-9 22 -21 22zM427 384c24 0 42 -19 42 -43v-234c0 -24 -18 -43 -42 -43h-342c-24 0 -42 19 -42 43v234c0 24 18 43 42 43h47c-2 7 -4 14 -4 21c0 35 29 64 64 64c22 0 41 -11 53 -28l11 -15l11 15c12 17 31 28 53 28
+c35 0 64 -29 64 -64c0 -7 -2 -14 -4 -21h47z" />
+    <glyph glyph-name="redo" unicode="redo" 
+d="M393 286l76 77v-192h-192l78 77c-30 25 -68 40 -110 40c-76 0 -140 -49 -162 -117l-50 16c29 89 113 154 212 154c57 0 109 -21 148 -55z" />
+    <glyph glyph-name="refresh" unicode="refresh" 
+d="M377 377l50 50v-150h-150l69 69c-23 23 -55 38 -90 38c-71 0 -128 -57 -128 -128s57 -128 128 -128c56 0 104 35 121 85h44c-19 -74 -85 -128 -165 -128c-94 0 -170 77 -170 171s76 171 170 171c47 0 90 -19 121 -50z" />
+    <glyph glyph-name="remove" unicode="remove" 
+d="M405 235h-298v42h298v-42z" />
+    <glyph glyph-name="remove_circle" unicode="remove_circle" 
+d="M363 235v42h-214v-42h214zM256 469c118 0 213 -95 213 -213s-95 -213 -213 -213s-213 95 -213 213s95 213 213 213z" />
+    <glyph glyph-name="remove_circle_outline" unicode="remove_circle_outline" 
+d="M256 85c94 0 171 77 171 171s-77 171 -171 171s-171 -77 -171 -171s77 -171 171 -171zM256 469c118 0 213 -95 213 -213s-95 -213 -213 -213s-213 95 -213 213s95 213 213 213zM149 277h214v-42h-214v42z" />
+    <glyph glyph-name="remove_from_queue" unicode="remove_from_queue" 
+d="M341 299v-43h-170v43h170zM448 149v256h-384v-256h384zM448 448c23 0 43 -19 43 -43l-1 -256c0 -23 -19 -42 -42 -42h-107v-43h-170v43h-107c-24 0 -43 19 -43 42v256c0 24 19 43 43 43h384z" />
+    <glyph glyph-name="remove_red_eye" unicode="remove_red_eye" 
+d="M256 320c35 0 64 -29 64 -64s-29 -64 -64 -64s-64 29 -64 64s29 64 64 64zM256 149c59 0 107 48 107 107s-48 107 -107 107s-107 -48 -107 -107s48 -107 107 -107zM256 416c107 0 198 -66 235 -160c-37 -94 -128 -160 -235 -160s-198 66 -235 160c37 94 128 160 235 160z
+" />
+    <glyph glyph-name="remove_shopping_cart" unicode="remove_shopping_cart" 
+d="M149 128c23 0 43 -20 43 -43s-20 -42 -43 -42s-42 19 -42 42s19 43 42 43zM332 235l-192 192h287c12 0 21 -10 21 -22c0 -4 -1 -7 -3 -10l-76 -138c-7 -13 -21 -22 -37 -22zM158 192h108l-43 43h-50l-19 -35l-1 -3c0 -3 2 -5 5 -5zM485 27l-27 -27l-61 61
+c-8 -11 -20 -18 -34 -18c-23 0 -43 19 -43 42c0 14 7 27 18 35l-30 29h-159c-23 0 -42 20 -42 43c0 7 2 14 5 20l29 53l-47 99l-94 94l27 27z" />
+    <glyph glyph-name="reorder" unicode="reorder" 
+d="M64 405h384v-42h-384v42zM64 277v43h384v-43h-384zM64 107v42h384v-42h-384zM64 192v43h384v-43h-384z" />
+    <glyph glyph-name="repeat" unicode="repeat" 
+d="M363 149v86h42v-128h-256v-64l-85 85l85 85v-64h214zM149 363v-86h-42v128h256v64l85 -85l-85 -85v64h-214z" />
+    <glyph glyph-name="repeat_one" unicode="repeat_one" 
+d="M277 192h-32v85h-32v22l43 21h21v-128zM363 149v86h42v-128h-256v-64l-85 85l85 85v-64h214zM149 363v-86h-42v128h256v64l85 -85l-85 -85v64h-214z" />
+    <glyph glyph-name="replay" unicode="replay" 
+d="M256 405c94 0 171 -76 171 -170s-77 -171 -171 -171s-171 77 -171 171h43c0 -71 57 -128 128 -128s128 57 128 128s-57 128 -128 128v-86l-107 107l107 107v-86z" />
+    <glyph glyph-name="replay_10" unicode="replay_&#x31;&#x30;" 
+d="M282 188c0 -3.2653 6.32517 -7 10 -7c2 0 5 0 7 2l4 5s2 4 2 6v43c0 0 -2 4 -2 6c0 2.75261 -8.21183 7 -11 7c-2 0 -4 -1 -6 -3l-4 -4s-3 -4 -3 -6v-43s3 -4 3 -6zM324 209c0 -6 0 -13 -2 -17l-6 -13s-7 -6 -11 -6s-9 -2 -13 -2s-9 0 -13 2s-6 4 -10 6
+c-6.74403 3.37202 -9 19.7461 -9 30v15c0 6 0 13 2 17l7 13s6 6 10 6s9 2 13 2s9 0 13 -2s7 -4 11 -6s4 -7 6 -13s2 -11 2 -17v-15zM233 171h-20v70l-21 -6v15l38 12h3v-91zM256 405c94 0 171 -76 171 -170s-77 -171 -171 -171s-171 77 -171 171h43c0 -70 58 -128 128 -128
+s128 58 128 128s-58 128 -128 128v-86l-107 107l107 107v-86z" />
+    <glyph glyph-name="replay_30" unicode="replay_&#x33;&#x30;" 
+d="M286 188c0 -3.76553 6.92157 -7 11 -7c2 0 4 0 6 2l4 5s2 4 2 6v43c0 2 -2 4 -2 6c0 2.33563 -7.56075 7 -10 7c-2 0 -5 -1 -7 -3l-4 -4s-2 -4 -2 -6v-43s2 -4 2 -6zM326 209c0 -6 0 -13 -2 -17l-6 -13s-7 -6 -11 -6s-9 -2 -13 -2c-10.126 0 -16.1493 4.57466 -23 8
+c-4 2 -4 7 -6 13s-3 11 -3 17v15c0 6 1 13 3 17l6 13s7 6 11 6s8 2 12 2s9 0 13 -2s7 -4 11 -6s4 -7 6 -13s2 -11 2 -17v-15zM213 224c8.11936 0 15 4.95913 15 13v4s-2 2 -2 4s-2 2 -4 2h-11s-2 -2 -4 -2s-2 -2 -2 -4v-4h-22c0 9.89385 8.81974 23 18 23c2 0 8 2 10 2
+c8.67272 0 17.6319 -2.81597 24 -6c5.06488 -2.53244 8 -12.109 8 -19v-7s-2 -4 -2 -6s-2 -4 -4 -4s-5 -3 -7 -5c4 -2 9 -4 11 -8s4 -9 4 -13s0 -9 -2 -11s-4 -6 -6 -8s-7 -4 -11 -4s-9 -2 -13 -2s-8 0 -10 2s-7 2 -11 4c-5.58093 2.79046 -9 13.5084 -9 21h18v-4s2 -2 2 -4
+s2 -2 4 -2h11s2 2 4 2s2 2 2 4v11s-2 2 -2 4s-2 2 -4 2h-13v15h8zM256 405c94 0 171 -76 171 -170s-77 -171 -171 -171s-171 77 -171 171h43c0 -70 58 -128 128 -128s128 58 128 128s-58 128 -128 128v-86l-107 107l107 107v-86z" />
+    <glyph glyph-name="replay_5" unicode="replay_&#x35;" 
+d="M252 222c-1.79204 -0.716817 -7 -2.40231 -7 -4c0 -2 -2 -3 -2 -3h-15l5 47h51v-15h-37l-2 -19s2 0 2 2s3 1 3 3s2 0 4 0h4c4 0 9 -1 11 -3s6 -4 8 -6c4.43641 -4.43641 9 -13.6284 9 -23c0 -4 0 -9 -2 -11s-3 -7 -7 -11s-6 -4 -8 -6s-9 -2 -13 -2s-9 0 -11 2s-6 2 -10 4
+c-5.5956 2.7978 -9 11.277 -9 19h17c0 -7.40446 5.29508 -10 13 -10c2 0 4 0 6 2l5 4s2 4 2 6v13l-2 4l-5 5s-4 2 -6 2h-4zM256 405c94 0 171 -76 171 -170s-77 -171 -171 -171s-171 77 -171 171h43c0 -70 58 -128 128 -128s128 58 128 128s-58 128 -128 128v-86l-107 107
+l107 107v-86z" />
+    <glyph glyph-name="reply" unicode="reply" 
+d="M213 320c149 -21 214 -128 235 -235c-53 75 -128 109 -235 109v-87l-149 149l149 149v-85z" />
+    <glyph glyph-name="reply_all" unicode="reply_all" 
+d="M277 320c149 -21 214 -128 235 -235c-53 75 -128 109 -235 109v-87l-149 149l149 149v-85zM149 341l-85 -85l85 -85v-64l-149 149l149 149v-64z" />
+    <glyph glyph-name="report" unicode="report" 
+d="M277 235v128h-42v-128h42zM256 143c15 0 28 13 28 28s-13 27 -28 27s-28 -12 -28 -27s13 -28 28 -28zM336 448l112 -112v-160l-112 -112h-160l-112 112v160l112 112h160z" />
+    <glyph glyph-name="report_problem" unicode="report_problem" 
+d="M277 213v86h-42v-86h42zM277 128v43h-42v-43h42zM21 64l235 405l235 -405h-470z" />
+    <glyph glyph-name="restaurant" unicode="restaurant" 
+d="M341 384c0 38 48 85 107 85v-426h-53v170h-54v171zM235 320v149h42v-149c0 -45 -35 -82 -80 -85v-192h-53v192c-45 3 -80 40 -80 85v149h43v-149h42v149h43v-149h43z" />
+    <glyph glyph-name="restaurant_menu" unicode="restaurant_menu" 
+d="M317 266l-31 -31l147 -147l-30 -30l-147 147l-147 -147l-30 30l208 208c-15 33 -4 79 30 113c41 41 99 48 130 17s24 -90 -17 -131c-34 -34 -80 -44 -113 -29zM173 227l-90 90c-33 33 -33 87 0 120l150 -149z" />
+    <glyph glyph-name="restore" unicode="restore" 
+d="M256 341h32v-90l75 -45l-16 -26l-91 55v106zM277 448c106 0 192 -86 192 -192s-86 -192 -192 -192c-53 0 -100 21 -135 56l30 31c27 -27 64 -44 105 -44c83 0 150 66 150 149s-67 149 -150 149s-149 -66 -149 -149h64l-86 -86l-2 3l-83 83h64c0 106 86 192 192 192z" />
+    <glyph glyph-name="restore_page" unicode="restore_page" 
+d="M256 128c59 0 107 48 107 107s-48 106 -107 106c-38 0 -71 -20 -90 -49l-27 28v-85h85l-34 34c12 24 37 40 66 40c41 0 75 -33 75 -74s-34 -75 -75 -75c-25 0 -48 13 -61 32h-37c16 -38 54 -64 98 -64zM299 469l128 -128v-256c0 -23 -20 -42 -43 -42h-256
+c-23 0 -43 19 -43 42l1 342c0 23 19 42 42 42h171z" />
+    <glyph glyph-name="ring_volume" unicode="ring_volume" 
+d="M137 303c0 0 -74 74 -76 75l30 31l76 -76zM277 469v-106h-42v106h42zM451 378c-2 -1 -76 -75 -76 -75l-30 30l76 76zM506 156c4 -4 6 -9 6 -15s-2 -11 -6 -15l-53 -53c-4 -4 -9 -6 -15 -6s-11 2 -15 6c-17 16 -36 30 -57 40c-7 3 -12 11 -12 19v66c-31 10 -64 15 -98 15
+s-67 -5 -98 -15v-66c0 -9 -5 -17 -12 -20c-21 -10 -40 -23 -57 -39c-4 -4 -9 -6 -15 -6s-11 2 -15 6l-53 53c-4 4 -6 9 -6 15s2 11 6 15c65 62 153 100 250 100s185 -38 250 -100z" />
+    <glyph glyph-name="room" unicode="room" 
+d="M256 267c29 0 53 24 53 53s-24 53 -53 53s-53 -24 -53 -53s24 -53 53 -53zM256 469c83 0 149 -66 149 -149c0 -112 -149 -277 -149 -277s-149 165 -149 277c0 83 66 149 149 149z" />
+    <glyph glyph-name="room_service" unicode="room_service" 
+d="M295 346c83 -17 147 -88 153 -175h-384c6 87 70 158 153 175c-2 5 -4 11 -4 17c0 23 20 42 43 42s43 -19 43 -42c0 -6 -2 -12 -4 -17zM43 149h426v-42h-426v42z" />
+    <glyph glyph-name="rotate_90_degrees_ccw" unicode="rotate_&#x39;&#x30;_degrees_ccw" 
+d="M413 370c75 -75 75 -196 0 -271c-37 -38 -87 -56 -136 -56c-32 0 -63 8 -92 24l32 31c19 -9 39 -13 60 -13c38 0 77 15 106 44c58 58 58 153 0 211c-29 29 -68 44 -106 44v-69l-90 90l90 91v-69c49 0 99 -19 136 -57zM79 237l78 -78l78 78l-78 78zM157 375l138 -138
+l-138 -138l-139 138z" />
+    <glyph glyph-name="rotate_left" unicode="rotate_left" 
+d="M277 425c84 -10 150 -82 150 -169s-66 -159 -150 -169v43c61 10 107 63 107 126s-46 116 -107 126v-83l-97 95l97 97v-66zM151 121l31 31c16 -12 34 -19 53 -22v-43c-30 4 -59 15 -84 34zM130 235c3 -19 10 -37 21 -53l-30 -30c-19 25 -30 53 -34 83h43zM152 330
+c-11 -16 -19 -34 -22 -53h-43c4 30 16 58 35 83z" />
+    <glyph glyph-name="rotate_right" unicode="rotate_right" 
+d="M360 182c12 16 19 34 22 53h43c-4 -30 -15 -58 -34 -83zM277 130c19 3 37 10 53 22l31 -31c-25 -19 -54 -30 -84 -34v43zM425 277h-43c-3 19 -10 37 -22 53l31 30c19 -25 30 -53 34 -83zM332 394l-97 -95v83c-61 -10 -107 -63 -107 -126s46 -116 107 -126v-43
+c-84 10 -150 82 -150 169s66 159 150 169v66z" />
+    <glyph glyph-name="rounded_corner" unicode="rounded_corner" 
+d="M448 341v-106h-43v106c0 35 -29 64 -64 64h-106v43h106c59 0 107 -48 107 -107zM64 64v43h43v-43h-43zM149 64v43h43v-43h-43zM235 64v43h42v-43h-42zM149 405v43h43v-43h-43zM64 405v43h43v-43h-43zM64 320v43h43v-43h-43zM64 149v43h43v-43h-43zM64 235v42h43v-42h-43z
+M405 149v43h43v-43h-43zM405 107h43v-43h-43v43z" />
+    <glyph glyph-name="router" unicode="router" 
+d="M320 128v43h-43v-43h43zM245 128v43h-42v-43h42zM171 128v43h-43v-43h43zM405 235c23 0 43 -20 43 -43v-85c0 -23 -20 -43 -43 -43h-298c-23 0 -43 20 -43 43v85c0 23 20 43 43 43h213v85h43v-85h42zM412 369l-17 -17c-15 15 -35 21 -54 21s-38 -6 -53 -21l-17 17
+c19 19 44 30 70 30s52 -11 71 -30zM431 386c-26 23 -58 36 -90 36s-63 -13 -89 -36l-17 17c30 30 68 45 106 45s77 -15 107 -45z" />
+    <glyph glyph-name="rowing" unicode="rowing" 
+d="M448 64l-64 -64l-64 64v32l-151 151c-7 -1 -14 -1 -20 -1v46c35 -1 77 18 100 43l30 33c7.60688 7.60688 20.1539 16 35 16h1c26 0 48 -22 48 -48v-123c0 -18 -8 -34 -20 -46l-76 76v49c-13 -11 -31 -22 -49 -30l134 -134h32zM320 491c23 0 43 -20 43 -43
+s-20 -43 -43 -43s-43 20 -43 43s20 43 43 43zM181 203l54 -54h-43l-75 -74l-32 32z" />
+    <glyph glyph-name="rss_feed" unicode="rss_feed" 
+d="M85 297c117 0 212 -95 212 -212h-61c0 83 -68 151 -151 151v61zM85 417c183 0 332 -149 332 -332h-60c0 150 -122 272 -272 272v60zM85 132c0 26 21 46 47 46s46 -20 46 -46s-20 -47 -46 -47s-47 21 -47 47z" />
+    <glyph glyph-name="rv_hookup" unicode="rv_hookup" 
+d="M363 469l64 -64l-64 -64v43h-171v43h171v42zM384 213v64h-85v-64h85zM235 85c12 0 21 10 21 22s-9 21 -21 21s-22 -9 -22 -21s10 -22 22 -22zM427 149h42v-42h-170c0 -35 -29 -64 -64 -64s-64 29 -64 64h-43c-23 0 -43 19 -43 42v64h150v64h-86v-42l-64 64l64 64v-43h235
+c23 0 43 -20 43 -43v-128z" />
+    <glyph glyph-name="satellite" unicode="satellite" 
+d="M107 128h298l-96 128l-74 -96l-54 64zM107 256c83 0 149 67 149 150h-43c0 -59 -47 -107 -106 -107v-43zM107 406v-65c35 0 64 30 64 65h-64zM405 448c23 0 43 -20 43 -43v-298c0 -23 -20 -43 -43 -43h-298c-23 0 -43 20 -43 43v298c0 23 20 43 43 43h298z" />
+    <glyph glyph-name="save" unicode="save" 
+d="M320 320v85h-213v-85h213zM256 107c35 0 64 29 64 64s-29 64 -64 64s-64 -29 -64 -64s29 -64 64 -64zM363 448l85 -85v-256c0 -23 -20 -43 -43 -43h-298c-24 0 -43 20 -43 43v298c0 23 19 43 43 43h256z" />
+    <glyph glyph-name="scanner" unicode="scanner" 
+d="M405 149v43h-213v-43h213zM149 149v43h-42v-43h42zM422 284c15 -4 26 -22 26 -39v-117c0 -23 -20 -43 -43 -43h-298c-23 0 -43 20 -43 43v85c0 23 20 43 43 43h268l-300 109l15 40z" />
+    <glyph glyph-name="schedule" unicode="schedule" 
+d="M267 363v-112l96 -57l-16 -27l-112 68v128h32zM256 85c94 0 171 77 171 171s-77 171 -171 171s-171 -77 -171 -171s77 -171 171 -171zM256 469c118 0 213 -95 213 -213s-95 -213 -213 -213s-213 95 -213 213s95 213 213 213z" />
+    <glyph glyph-name="school" unicode="school" 
+d="M256 448l235 -128v-171h-43v148l-192 -105l-235 128zM107 231l149 -82l149 82v-86l-149 -81l-149 81v86z" />
+    <glyph glyph-name="screen_lock_landscape" unicode="screen_lock_landscape" 
+d="M230 299v-22h52v22c0 14 -12 25 -26 25s-26 -11 -26 -25zM213 171c-12 0 -21 9 -21 21v64c0 12 9 21 21 21v22c0 23 19 42 43 42c23 0 43 -18 43 -42v-22c12 0 21 -9 21 -21v-64c0 -12 -9 -21 -21 -21h-86zM405 149v214h-298v-214h298zM448 405c23 0 43 -19 43 -42v-214
+c0 -23 -20 -42 -43 -42h-384c-23 0 -43 19 -43 42v214c0 23 20 42 43 42h384z" />
+    <glyph glyph-name="screen_lock_portrait" unicode="screen_lock_portrait" 
+d="M363 107v298h-214v-298h214zM363 491c23 0 42 -20 42 -43v-384c0 -23 -19 -43 -42 -43h-214c-23 0 -42 20 -42 43v384c0 23 19 43 42 43h214zM230 299v-22h52v22c0 14 -12 25 -26 25s-26 -11 -26 -25zM213 171c-12 0 -21 9 -21 21v64c0 12 9 21 21 21v22
+c0 23 19 42 43 42c23 0 43 -18 43 -42v-22c12 0 21 -9 21 -21v-64c0 -12 -9 -21 -21 -21h-86z" />
+    <glyph glyph-name="screen_lock_rotation" unicode="screen_lock_rotation" 
+d="M358 459v-11h73v11c0 20 -16 36 -36 36s-37 -16 -37 -36zM341 320c-12 0 -21 9 -21 21v86c0 12 9 21 21 21v11c0 29 25 53 54 53s53 -24 53 -53v-11c12 0 21 -9 21 -21v-86c0 -12 -9 -21 -21 -21h-107zM181 75l28 28l81 -81l-14 -1c-134 0 -244 104 -255 235h32
+c8 -80 58 -148 128 -181zM496 240c13 -12 13 -33 0 -46l-136 -135c-12 -13 -32 -13 -45 0l-256 256c-13 12 -13 32 0 45l135 136c12 13 33 13 46 0l52 -52l-30 -30l-45 44l-121 -120l242 -242l120 121l-47 47l30 30z" />
+    <glyph glyph-name="screen_rotation" unicode="screen_rotation" 
+d="M160 54l29 28l81 -81l-14 -1c-134 0 -244 104 -255 235h32c8 -80 57 -148 127 -181zM316 60l136 136l-256 256l-136 -136zM218 475l257 -257c13 -12 13 -32 0 -45l-136 -136c-12 -13 -32 -13 -45 0l-257 257c-13 12 -13 32 0 45l136 136c12 13 32 13 45 0zM352 458
+l-29 -28l-81 81l14 1c134 0 244 -104 255 -235h-32c-8 80 -57 148 -127 181z" />
+    <glyph glyph-name="screen_share" unicode="screen_share" 
+d="M277 203l86 80l-86 80v-46c-83 -12 -116 -68 -128 -125c30 40 69 58 128 58v-47zM427 128h85v-43h-512v43h85c-24 0 -42 20 -42 43v213c0 24 18 43 42 43h342c23 0 42 -19 42 -43v-213c0 -23 -19 -43 -42 -43z" />
+    <glyph glyph-name="sd_card" unicode="sd_card" 
+d="M384 341v86h-43v-86h43zM320 341v86h-43v-86h43zM256 341v86h-43v-86h43zM384 469c23 0 43 -19 43 -42v-342c0 -23 -20 -42 -43 -42h-256c-23 0 -43 19 -43 42l1 256l127 128h171z" />
+    <glyph glyph-name="sd_storage" unicode="sd_storage" 
+d="M384 341v86h-43v-86h43zM320 341v86h-43v-86h43zM256 341v86h-43v-86h43zM384 469c23 0 43 -19 43 -42v-342c0 -23 -20 -42 -43 -42h-256c-23 0 -43 19 -43 42l1 256l127 128h171z" />
+    <glyph glyph-name="search" unicode="search" 
+d="M203 213c53 0 96 43 96 96s-43 96 -96 96s-96 -43 -96 -96s43 -96 96 -96zM331 213l106 -106l-32 -32l-106 106v17l-6 6c-24 -21 -56 -33 -90 -33c-77 0 -139 61 -139 138s62 139 139 139s138 -62 138 -139c0 -34 -12 -66 -33 -90l6 -6h17z" />
+    <glyph glyph-name="security" unicode="security" 
+d="M256 491l192 -86v-128c0 -118 -82 -229 -192 -256c-110 27 -192 138 -192 256v128zM256 256v-191c79 25 138 103 149 191h-149zM256 256v188l-149 -66v-122h149z" />
+    <glyph glyph-name="select_all" unicode="select_all" 
+d="M192 320v-128h128v128h-128zM149 149v214h214v-214h-214zM320 405v43h43v-43h-43zM320 64v43h43v-43h-43zM405 149v43h43v-43h-43zM405 320v43h43v-43h-43zM405 64v43h43c0 -23 -20 -43 -43 -43zM405 235v42h43v-42h-43zM235 64v43h42v-43h-42zM192 448v-43h-43v43h43z
+M64 149v43h43v-43h-43zM107 64c-23 0 -43 20 -43 43h43v-43zM405 448c23 0 43 -20 43 -43h-43v43zM277 448v-43h-42v43h42zM64 320v43h43v-43h-43zM149 64v43h43v-43h-43zM64 235v42h43v-42h-43zM64 405c0 23 20 43 43 43v-43h-43z" />
+    <glyph glyph-name="send" unicode="send" 
+d="M43 64v149l320 43l-320 43v149l448 -192z" />
+    <glyph glyph-name="sentiment_dissatisfied" unicode="sentiment_dissatisfied" 
+d="M256 213c50 0 92 -30 109 -74h-35c-15 25 -42 42 -74 42s-59 -17 -74 -42h-35c17 44 59 74 109 74zM256 85c94 0 171 77 171 171s-77 171 -171 171s-171 -77 -171 -171s77 -171 171 -171zM256 469c118 0 213 -95 213 -213s-95 -213 -213 -213s-213 95 -213 213
+s95 213 213 213zM149 309c0 18 14 32 32 32s32 -14 32 -32s-14 -32 -32 -32s-32 14 -32 32zM299 309c0 18 14 32 32 32s32 -14 32 -32s-14 -32 -32 -32s-32 14 -32 32z" />
+    <glyph glyph-name="sentiment_neutral" unicode="sentiment_neutral" 
+d="M256 85c94 0 171 77 171 171s-77 171 -171 171s-171 -77 -171 -171s77 -171 171 -171zM256 469c118 0 213 -95 213 -213s-95 -213 -213 -213s-213 95 -213 213s95 213 213 213zM149 309c0 18 14 32 32 32s32 -14 32 -32s-14 -32 -32 -32s-32 14 -32 32zM299 309
+c0 18 14 32 32 32s32 -14 32 -32s-14 -32 -32 -32s-32 14 -32 32zM192 213h128v-32h-128v32z" />
+    <glyph glyph-name="sentiment_satisfied" unicode="sentiment_satisfied" 
+d="M256 171c32 0 59 17 74 42h35c-17 -44 -59 -74 -109 -74s-92 30 -109 74h35c15 -25 42 -42 74 -42zM256 85c94 0 171 77 171 171s-77 171 -171 171s-171 -77 -171 -171s77 -171 171 -171zM256 469c118 0 213 -95 213 -213s-95 -213 -213 -213s-213 95 -213 213
+s95 213 213 213zM149 309c0 18 14 32 32 32s32 -14 32 -32s-14 -32 -32 -32s-32 14 -32 32zM299 309c0 18 14 32 32 32s32 -14 32 -32s-14 -32 -32 -32s-32 14 -32 32z" />
+    <glyph glyph-name="sentiment_very_dissatisfied" unicode="sentiment_very_dissatisfied" 
+d="M256 213c50 0 92 -30 109 -74h-218c17 44 59 74 109 74zM167 256l-23 23l23 22l-23 23l23 22l22 -22l23 22l23 -22l-23 -23l23 -22l-23 -23l-23 23zM345 346l23 -22l-23 -23l23 -22l-23 -23l-22 23l-23 -23l-23 23l23 22l-23 23l23 22l23 -22zM256 85
+c94 0 171 77 171 171s-77 171 -171 171s-171 -77 -171 -171s77 -171 171 -171zM256 469c118 0 213 -95 213 -213s-95 -213 -213 -213s-213 95 -213 213s95 213 213 213z" />
+    <glyph glyph-name="sentiment_very_satisfied" unicode="sentiment_very_satisfied" 
+d="M256 139c-50 0 -92 30 -109 74h218c-17 -44 -59 -74 -109 -74zM189 300l-22 -23l-23 23l45 45l46 -45l-23 -23zM277 300l46 45l45 -45l-23 -23l-22 23l-23 -23zM256 85c94 0 171 77 171 171s-77 171 -171 171s-171 -77 -171 -171s77 -171 171 -171zM256 469
+c118 0 213 -95 213 -213s-95 -213 -213 -213s-213 95 -213 213s95 213 213 213z" />
+    <glyph glyph-name="settings" unicode="settings" 
+d="M256 181c41 0 75 34 75 75s-34 75 -75 75s-75 -34 -75 -75s34 -75 75 -75zM415 235l45 -35c4 -3 5 -9 2 -14l-43 -74c-3 -5 -8 -6 -13 -4l-53 21c-11 -8 -23 -16 -36 -21l-8 -56c-1 -5 -5 -9 -10 -9h-86c-5 0 -9 4 -10 9l-8 56c-13 5 -25 12 -36 21l-53 -21
+c-5 -2 -10 -1 -13 4l-43 74c-3 5 -2 11 2 14l45 35c-1 7 -1 14 -1 21s0 14 1 21l-45 35c-4 3 -5 9 -2 14l43 74c3 5 8 6 13 4l53 -21c11 8 23 16 36 21l8 56c1 5 5 9 10 9h86c5 0 9 -4 10 -9l8 -56c13 -5 25 -12 36 -21l53 21c5 2 10 1 13 -4l43 -74c3 -5 2 -11 -2 -14
+l-45 -35c1 -7 1 -14 1 -21s0 -14 -1 -21z" />
+    <glyph glyph-name="settings_applications" unicode="settings_applications" 
+d="M368 256c0 5 0 10 -1 15l32 24c3 2 3 7 1 10l-30 52c-2 3 -6 4 -9 3l-37 -15c-8 6 -16 11 -25 15l-6 39c-1 3 -3 6 -7 6h-60c-4 0 -6 -2 -7 -6l-6 -40c-9 -4 -17 -8 -25 -14l-37 15c-3 1 -7 -1 -9 -4l-30 -51c-2 -3 -2 -8 1 -10l32 -24c-1 -5 -1 -10 -1 -15s0 -10 1 -15
+l-32 -24c-3 -2 -3 -7 -1 -10l30 -52c2 -3 6 -4 9 -3l37 15c8 -6 16 -11 25 -15l6 -39c1 -3 3 -6 7 -6h60c4 0 6 2 7 6l6 40c9 4 17 8 25 14l37 -15c3 -1 7 1 9 4l30 51c2 3 2 8 -1 10l-32 24c1 5 1 10 1 15zM405 448c24 0 43 -20 43 -43v-298c0 -23 -19 -43 -43 -43h-298
+c-24 0 -43 20 -43 43v298c0 23 19 43 43 43h298zM256 299c23 0 43 -20 43 -43s-20 -43 -43 -43s-43 20 -43 43s20 43 43 43z" />
+    <glyph glyph-name="settings_backup_restore" unicode="settings_backup_restore" 
+d="M256 448c106 0 192 -86 192 -192s-86 -192 -192 -192c-44 0 -85 15 -117 40l30 30c25 -17 55 -27 87 -27c83 0 149 66 149 149s-66 149 -149 149s-149 -66 -149 -149h64l-86 -85l-85 85h64c0 106 86 192 192 192zM299 256c0 -23 -20 -43 -43 -43s-43 20 -43 43
+s20 43 43 43s43 -20 43 -43z" />
+    <glyph glyph-name="settings_bluetooth" unicode="settings_bluetooth" 
+d="M317 207l-40 40v-80zM277 430v-80l40 40zM378 390l-92 -91l92 -92l-122 -122h-21v162l-98 -98l-30 30l119 120l-119 119l30 30l98 -98v162h21zM320 0v43h43v-43h-43zM149 0v43h43v-43h-43zM235 0v43h42v-43h-42z" />
+    <glyph glyph-name="settings_brightness" unicode="settings_brightness" 
+d="M256 320v-128c35 0 64 29 64 64s-29 64 -64 64zM171 171v53l-32 32l32 32v53h53l32 32l32 -32h53v-53l32 -32l-32 -32v-53h-53l-32 -32l-32 32h-53zM448 106v300h-384v-300h384zM448 448c23 0 43 -20 43 -43v-298c0 -23 -20 -43 -43 -43h-384c-23 0 -43 20 -43 43v298
+c0 23 20 43 43 43h384z" />
+    <glyph glyph-name="settings_cell" unicode="settings_cell" 
+d="M341 171v256h-170v-256h170zM341 512c23 0 43 -20 43 -43v-341c0 -23 -20 -43 -43 -43h-170c-23 0 -43 20 -43 43v341c0 23 20 43 43 43h170zM320 0v43h43v-43h-43zM235 0v43h42v-43h-42zM149 0v43h43v-43h-43z" />
+    <glyph glyph-name="settings_ethernet" unicode="settings_ethernet" 
+d="M379 395l116 -139l-116 -139l-33 27l93 112l-93 112zM235 235v42h42v-42h-42zM363 277v-42h-43v42h43zM149 235v42h43v-42h-43zM166 368l-93 -112l93 -112l-33 -27l-116 139l116 139z" />
+    <glyph glyph-name="settings_input_antenna" unicode="settings_input_antenna" 
+d="M256 491c129 0 235 -106 235 -235h-43c0 106 -86 192 -192 192s-192 -86 -192 -192h-43c0 129 106 235 235 235zM277 207v-70l73 -73l-30 -30l-64 64l-64 -64l-30 30l73 73v70c-19 8 -32 27 -32 49c0 29 24 53 53 53s53 -24 53 -53c0 -22 -13 -41 -32 -49zM256 405
+c83 0 149 -66 149 -149h-42c0 59 -48 107 -107 107s-107 -48 -107 -107h-42c0 83 66 149 149 149z" />
+    <glyph glyph-name="settings_input_component" unicode="settings_input_component" 
+d="M363 171v42h128v-42c0 -28 -18 -51 -43 -60v-90h-43v90c-25 9 -42 32 -42 60zM277 469v-85h43v-128h-128v128h43v85c0 12 9 22 21 22s21 -10 21 -22zM448 384h43v-128h-128v128h42v85c0 12 10 22 22 22s21 -10 21 -22v-85zM21 171v42h128v-42c0 -28 -17 -51 -42 -60v-90
+h-43v90c-25 9 -43 32 -43 60zM192 171v42h128v-42c0 -28 -18 -51 -43 -60v-90h-42v90c-25 9 -43 32 -43 60zM107 469v-85h42v-128h-128v128h43v85c0 12 9 22 21 22s22 -10 22 -22z" />
+    <glyph glyph-name="settings_input_composite" unicode="settings_input_composite" 
+d="M363 171v42h128v-42c0 -28 -18 -51 -43 -60v-90h-43v90c-25 9 -42 32 -42 60zM277 469v-85h43v-128h-128v128h43v85c0 12 9 22 21 22s21 -10 21 -22zM448 384h43v-128h-128v128h42v85c0 12 10 22 22 22s21 -10 21 -22v-85zM21 171v42h128v-42c0 -28 -17 -51 -42 -60v-90
+h-43v90c-25 9 -43 32 -43 60zM192 171v42h128v-42c0 -28 -18 -51 -43 -60v-90h-42v90c-25 9 -43 32 -43 60zM107 469v-85h42v-128h-128v128h43v85c0 12 9 22 21 22s22 -10 22 -22z" />
+    <glyph glyph-name="settings_input_hdmi" unicode="settings_input_hdmi" 
+d="M171 427v-64h42v42h22v-42h42v42h22v-42h42v64h-170zM384 363h21v-128l-64 -128v-64h-170v64l-64 128v128h21v64c0 23 20 42 43 42h170c23 0 43 -19 43 -42v-64z" />
+    <glyph glyph-name="settings_input_svideo" unicode="settings_input_svideo" 
+d="M331 192c18 0 32 -14 32 -32s-14 -32 -32 -32s-32 14 -32 32s14 32 32 32zM373 299c18 0 32 -14 32 -32s-14 -32 -32 -32s-32 14 -32 32s14 32 32 32zM256 64c106 0 192 86 192 192s-86 192 -192 192s-192 -86 -192 -192s86 -192 192 -192zM256 491
+c129 0 235 -106 235 -235s-106 -235 -235 -235s-235 106 -235 235s106 235 235 235zM181 192c18 0 32 -14 32 -32s-14 -32 -32 -32s-32 14 -32 32s14 32 32 32zM320 373c0 -18 -14 -32 -32 -32h-64c-18 0 -32 14 -32 32s14 32 32 32h64c18 0 32 -14 32 -32zM171 267
+c0 -18 -14 -32 -32 -32s-32 14 -32 32s14 32 32 32s32 -14 32 -32z" />
+    <glyph glyph-name="settings_overscan" unicode="settings_overscan" 
+d="M448 106v300h-384v-300h384zM448 448c23 0 43 -20 43 -43v-298c0 -23 -20 -43 -43 -43h-384c-23 0 -43 20 -43 43v298c0 23 20 43 43 43h384zM299 171l-43 -54l-43 54h86zM128 299v-86l-53 43zM384 299l53 -43l-53 -43v86zM256 395l43 -54h-86z" />
+    <glyph glyph-name="settings_phone" unicode="settings_phone" 
+d="M405 320h43v-43h-43v43zM427 181c12 0 21 -9 21 -21v-75c0 -12 -9 -21 -21 -21c-200 0 -363 163 -363 363c0 12 9 21 21 21h75c12 0 21 -9 21 -21c0 -27 4 -52 12 -76c2 -7 1 -16 -5 -22l-47 -47c31 -60 81 -110 141 -141l47 47c6 6 15 7 22 5c24 -8 49 -12 76 -12z
+M363 320v-43h-43v43h43zM277 320v-43h-42v43h42z" />
+    <glyph glyph-name="settings_power" unicode="settings_power" 
+d="M320 0v43h43v-43h-43zM353 417c44 -31 74 -82 74 -140c0 -94 -77 -170 -171 -170s-171 76 -171 170c0 58 30 109 74 140l30 -30c-37 -23 -61 -64 -61 -110c0 -71 57 -128 128 -128s128 57 128 128c0 46 -25 87 -62 109zM277 469v-213h-42v213h42zM235 0v43h42v-43h-42z
+M149 0v43h43v-43h-43z" />
+    <glyph glyph-name="settings_remote" unicode="settings_remote" 
+d="M256 512c65 0 124 -26 166 -69l-30 -30c-35 35 -83 56 -136 56s-101 -21 -136 -56l-30 30c42 42 101 69 166 69zM150 383c27 27 65 44 106 44s79 -17 106 -44l-30 -30c-19 19 -47 31 -76 31s-57 -12 -76 -31zM256 192c23 0 43 20 43 43s-20 42 -43 42s-43 -19 -43 -42
+s20 -43 43 -43zM320 320c12 0 21 -9 21 -21v-256c0 -12 -9 -22 -21 -22h-128c-12 0 -21 10 -21 22v256c0 12 9 21 21 21h128z" />
+    <glyph glyph-name="settings_system_daydream" unicode="settings_system_daydream" 
+d="M448 106v300h-384v-300h384zM448 448c23 0 43 -20 43 -43v-298c0 -23 -20 -43 -43 -43h-384c-23 0 -43 20 -43 43v298c0 23 20 43 43 43h384zM192 171c-35 0 -64 29 -64 64c0 33 25 60 57 63h4c12 25 37 43 67 43c38 0 69 -28 74 -64h1c29 0 53 -24 53 -53
+s-24 -53 -53 -53h-139z" />
+    <glyph glyph-name="settings_voice" unicode="settings_voice" 
+d="M405 299c0 -73 -58 -134 -128 -144v-70h-42v70c-70 10 -128 71 -128 144h36c0 -64 54 -109 113 -109s113 45 113 109h36zM320 0v43h43v-43h-43zM235 0v43h42v-43h-42zM256 235c-35 0 -64 29 -64 64v128c0 35 29 64 64 64s64 -29 64 -64v-128c0 -35 -29 -64 -64 -64z
+M149 0v43h43v-43h-43z" />
+    <glyph glyph-name="share" unicode="share" 
+d="M384 169c34 0 62 -28 62 -62s-28 -63 -62 -63s-62 29 -62 63c0 5 0 10 1 14l-151 88c-12 -11 -27 -17 -44 -17c-35 0 -64 29 -64 64s29 64 64 64c17 0 32 -6 44 -17l150 87c-1 5 -2 10 -2 15c0 35 29 64 64 64s64 -29 64 -64s-29 -64 -64 -64c-17 0 -32 7 -44 18
+l-150 -88c1 -5 2 -10 2 -15s-1 -10 -2 -15l152 -88c11 10 26 16 42 16z" />
+    <glyph glyph-name="shop" unicode="shop" 
+d="M192 128l160 107l-160 85v-192zM213 427v-43h86v43h-86zM341 384h128v-277c0 -24 -18 -43 -42 -43h-342c-24 0 -42 19 -42 43v277h128v43c0 24 18 42 42 42h86c24 0 42 -18 42 -42v-43z" />
+    <glyph glyph-name="shop_two" unicode="shop_two" 
+d="M256 192l117 85l-117 64v-149zM256 448v-43h85v43h-85zM384 405h107v-234c0 -24 -19 -43 -43 -43h-299c-24 0 -42 19 -42 43v234h106v43c0 24 19 43 43 43h85c24 0 43 -19 43 -43v-43zM64 320v-235h341c0 -24 -18 -42 -42 -42h-299c-24 0 -43 18 -43 42v235h43z" />
+    <glyph glyph-name="shopping_basket" unicode="shopping_basket" 
+d="M256 149c23 0 43 20 43 43s-20 43 -43 43s-43 -20 -43 -43s20 -43 43 -43zM192 320h128l-64 94zM367 320h102c12 0 22 -9 22 -21c-17.3126 -69.0207 -36.8524 -135.814 -55 -204c-5 -18 -21 -31 -41 -31h-278c-20 0 -36 13 -41 31l-54 198c-1 2 -1 4 -1 6
+c0 12 10 21 22 21h102l93 140c4 6 11 9 18 9s14 -3 18 -9z" />
+    <glyph glyph-name="shopping_cart" unicode="shopping_cart" 
+d="M363 128c23 0 42 -20 42 -43s-19 -42 -42 -42s-43 19 -43 42s20 43 43 43zM21 469h70l20 -42h316c12 0 21 -10 21 -22c0 -4 -1 -7 -3 -10l-76 -138c-7 -13 -21 -22 -37 -22h-159l-19 -35l-1 -3c0 -3 2 -5 5 -5h247v-43h-256c-23 0 -42 20 -42 43c0 7 2 14 5 20l29 53
+l-77 162h-43v42zM149 128c23 0 43 -20 43 -43s-20 -42 -43 -42s-42 19 -42 42s19 43 42 43z" />
+    <glyph glyph-name="short_text" unicode="short_text" 
+d="M85 235h214v-43h-214v43zM85 320h342v-43h-342v43z" />
+    <glyph glyph-name="show_chart" unicode="show_chart" 
+d="M75 118l-32 32l160 160l85 -86l151 170l30 -30l-181 -204l-85 86z" />
+    <glyph glyph-name="shuffle" unicode="shuffle" 
+d="M316 226l67 -67l44 44v-118h-118l44 44l-67 67zM309 427h118v-118l-44 44l-268 -268l-30 30l268 268zM226 316l-30 -30l-111 111l30 30z" />
+    <glyph glyph-name="signal_cellular_4_bar" unicode="signal_cellular_&#x34;_bar" 
+d="M43 43l426 426v-426h-426z" />
+    <glyph glyph-name="signal_cellular_connected_no_internet_4_bar" unicode="signal_cellular_connected_no_internet_&#x34;_bar" 
+d="M43 43l426 426v-128h-85v-298h-341zM427 43v42h42v-42h-42zM427 128v171h42v-171h-42z" />
+    <glyph glyph-name="signal_cellular_no_sim" unicode="signal_cellular_no_sim" 
+d="M78 429l373 -372l-28 -28l-40 41c-6 -3 -13 -6 -20 -6h-214c-23 0 -42 20 -42 43v239l-56 56zM405 405v-249l-242 242l50 50h150c23 0 42 -20 42 -43z" />
+    <glyph glyph-name="signal_cellular_null" unicode="signal_cellular_null" 
+d="M469 469v-426h-426zM427 366l-281 -281h281v281z" />
+    <glyph glyph-name="signal_cellular_off" unicode="signal_cellular_off" 
+d="M102 416l367 -368l-27 -27l-42 43h-379l189 189l-135 136zM448 491v-367l-183 183z" />
+    <glyph glyph-name="signal_wifi_4_bar" unicode="signal_wifi_&#x34;_bar" 
+d="M256 54l-248 309c10 7 105 85 248 85s238 -78 248 -85z" />
+    <glyph glyph-name="signal_wifi_4_bar_lock" unicode="signal_wifi_&#x34;_bar_lock" 
+d="M331 203v-56l-75 -94l-247 310c9 6 104 85 247 85s238 -79 247 -85l-44 -56c-6 2 -13 2 -22 2c-60 0 -106 -46 -106 -106zM469 171v32c0 17 -15 32 -32 32s-32 -15 -32 -32v-32h64zM491 171c11 0 21 -11 21 -22v-85c0 -11 -10 -21 -21 -21h-107c-11 0 -21 10 -21 21v85
+c0 11 10 22 21 22v32c0 30 23 53 53 53s54 -23 54 -53v-32z" />
+    <glyph glyph-name="signal_wifi_off" unicode="signal_wifi_off" 
+d="M70 481c122.302 -122.698 245.474 -244.526 367 -368l-27 -27l-71 71l-83 -103l-248 309c5 4 32 26 78 47l-43 44zM504 363l-116 -145l-221 220c27 6 57 10 89 10c143 0 238 -78 248 -85z" />
+    <glyph glyph-name="sim_card" unicode="sim_card" 
+d="M363 192v85h-43v-85h43zM277 235v42h-42v-42h42zM277 107v85h-42v-85h42zM192 192v85h-43v-85h43zM363 107v42h-43v-42h43zM192 107v42h-43v-42h43zM426 427l1 -342c0 -23 -20 -42 -43 -42h-256c-23 0 -43 19 -43 42v256l128 128h171c23 0 42 -19 42 -42z" />
+    <glyph glyph-name="sim_card_alert" unicode="sim_card_alert" 
+d="M277 235v106h-42v-106h42zM277 149v43h-42v-43h42zM384 469c23 0 43 -19 43 -42v-342c0 -23 -20 -42 -43 -42h-256c-23 0 -43 19 -43 42l1 256l127 128h171z" />
+    <glyph glyph-name="skip_next" unicode="skip_next" 
+d="M341 384h43v-256h-43v256zM128 128v256l181 -128z" />
+    <glyph glyph-name="skip_previous" unicode="skip_previous" 
+d="M203 256l181 128v-256zM128 384h43v-256h-43v256z" />
+    <glyph glyph-name="slideshow" unicode="slideshow" 
+d="M405 107v298h-298v-298h298zM405 448c23 0 43 -20 43 -43v-298c0 -23 -20 -43 -43 -43h-298c-23 0 -43 20 -43 43v298c0 23 20 43 43 43h298zM213 341l107 -85l-107 -85v170z" />
+    <glyph glyph-name="slow_motion_video" unicode="slow_motion_video" 
+d="M469 256c0 -110 -84 -201 -191 -212v43c84 11 149 83 149 169s-65 158 -149 169v43c107 -11 191 -102 191 -212zM121 91l30 30c24 -18 53 -30 84 -34v-43c-43 4 -82 21 -114 47zM87 235c4 -31 16 -60 34 -83l-30 -31c-26 32 -43 71 -47 114h43zM121 361
+c-18 -24 -30 -53 -34 -84h-43c4 43 21 82 47 114zM235 425c-31 -4 -60 -16 -84 -34l-30 30c32 26 71 43 114 47v-43zM278 303l63 -47c-42.8195 -31.8471 -85.479 -63.8543 -128 -96z" />
+    <glyph glyph-name="smartphone" unicode="smartphone" 
+d="M363 107v298h-214v-298h214zM363 490c23 0 42 -19 42 -42v-384c0 -23 -19 -43 -42 -43h-214c-23 0 -42 20 -42 43v384c0 23 19 43 42 43z" />
+    <glyph glyph-name="smoke_free" unicode="smoke_free" 
+d="M363 172l-63 63h63v-63zM309 326c-39 0 -71 33 -71 72s32 71 71 71v-32c-22 0 -39 -15 -39 -37s17 -43 39 -43h33c40 0 74 -29 74 -67v-34h-32v27c0 28 -20 43 -42 43h-33zM402 408c40 -19 67 -60 67 -108v-44h-32v44c0 48 -37 87 -85 87v32c22 0 39 18 39 40h32
+c0 -20 -8 -38 -21 -51zM384 235h32v-64h-32v64zM437 235h32v-64h-32v64zM43 384l26 27l363 -363l-27 -27l-149 150h-213v64h149z" />
+    <glyph glyph-name="smoking_rooms" unicode="smoking_rooms" 
+d="M342 294c40 0 74 -28 74 -67v-35h-32v28c0 28 -20 43 -42 43h-33c-39 0 -71 33 -71 72s32 71 71 71v-32c-22 0 -39 -15 -39 -37s17 -43 39 -43h33zM402 347c40 -19 67 -60 67 -107v-48h-32v48c0 48 -37 86 -85 86v32c22 0 39 18 39 40s-17 39 -39 39v32
+c39 0 71 -32 71 -71c0 -20 -8 -38 -21 -51zM384 171h32v-64h-32v64zM437 171h32v-64h-32v64zM43 171h320v-64h-320v64z" />
+    <glyph glyph-name="sms" unicode="sms" 
+d="M363 277v43h-43v-43h43zM277 277v43h-42v-43h42zM192 277v43h-43v-43h43zM427 469c23 0 42 -19 42 -42v-256c0 -23 -19 -43 -42 -43h-299l-85 -85v384c0 23 19 42 42 42h342z" />
+    <glyph glyph-name="sms_failed" unicode="sms_failed" 
+d="M277 299v85h-42v-85h42zM277 213v43h-42v-43h42zM427 469c23 0 42 -19 42 -42v-256c0 -23 -19 -43 -42 -43h-299l-85 -85v384c0 23 19 42 42 42h342z" />
+    <glyph glyph-name="snooze" unicode="snooze" 
+d="M192 277v43h128v-38l-77 -90h77v-43h-128v39l77 89h-77zM256 85c83 0 149 67 149 150s-66 149 -149 149s-149 -66 -149 -149s66 -150 149 -150zM256 427c106 0 192 -86 192 -192s-86 -192 -192 -192s-192 86 -192 192s86 192 192 192zM469 390l-27 -33l-98 83l27 32z
+M168 440l-98 -82l-27 32l98 82z" />
+    <glyph glyph-name="sort" unicode="sort" 
+d="M64 235v42h256v-42h-256zM64 384h384v-43h-384v43zM64 128v43h128v-43h-128z" />
+    <glyph glyph-name="sort_by_alpha" unicode="sort_by_alpha" 
+d="M336 168h130v-34h-182v27l126 183h-125v34h177v-27zM106 221h83l-42 111zM130 378h35l96 -244h-39l-20 52h-109l-20 -52h-39zM219 99h99l-50 -50zM319 413h-101l50 50z" />
+    <glyph glyph-name="spa" unicode="spa" 
+d="M330 307c-27 -15 -52 -34 -74 -57c-22 23 -47 42 -74 57c5 59 29 116 75 162c45 -45 69 -102 73 -162zM43 299c95.1702 0 171.746 -54.2229 213 -117c41.2966 62.8426 117.856 117 213 117c0 -113 -71 -209 -171 -245c-14 -5 -27 -8 -42 -11c-15 2 -29 6 -42 11
+c-100 36 -171 132 -171 245z" />
+    <glyph glyph-name="space_bar" unicode="space_bar" 
+d="M384 320h43v-128h-342v128h43v-85h256v85z" />
+    <glyph glyph-name="speaker" unicode="speaker" 
+d="M256 256c35 0 64 -29 64 -64s-29 -64 -64 -64s-64 29 -64 64s29 64 64 64zM256 85c59 0 107 48 107 107s-48 107 -107 107s-107 -48 -107 -107s48 -107 107 -107zM256 427c-24 0 -43 -20 -43 -43s19 -43 43 -43c23 0 43 20 43 43s-20 43 -43 43zM363 469
+c23 0 42 -19 42 -42v-342c0 -23 -19 -42 -42 -42h-214c-23 0 -42 19 -42 42v342c0 23 19 42 42 42h214z" />
+    <glyph glyph-name="speaker_group" unicode="speaker_group" 
+d="M128 405v-341h213v-43h-213c-24 0 -43 20 -43 43v341h43zM245 245c0 29 25 54 54 54s53 -25 53 -54s-24 -53 -53 -53s-54 24 -54 53zM299 160c47 0 85 38 85 85s-38 86 -85 86s-86 -39 -86 -86s39 -85 86 -85zM299 448c-23 0 -43 -19 -43 -43s20 -42 43 -42s42 18 42 42
+s-19 43 -42 43zM388 491c21 0 39 -18 39 -39v-307c0 -21 -18 -38 -39 -38h-179c-21 0 -38 17 -38 38v307c0 21 17 39 38 39h179z" />
+    <glyph glyph-name="speaker_notes" unicode="speaker_notes" 
+d="M384 341v43h-171v-43h171zM384 277v43h-171v-43h171zM320 213v43h-107v-43h107zM171 341v43h-43v-43h43zM171 277v43h-43v-43h43zM171 213v43h-43v-43h43zM427 469c23 0 42 -19 42 -42v-256c0 -23 -19 -43 -42 -43h-299l-85 -85v384c0 23 19 42 42 42h342z" />
+    <glyph glyph-name="speaker_notes_off" unicode="speaker_notes_off" 
+d="M427 469c23 0 42 -19 42 -42v-256c0 -23 -18 -42 -41 -43l-149 149h105v43h-148l-21 21h169v43h-171v-41l-126 126h340zM128 277h43l-43 43v-43zM171 213v43h-43v-43h43zM27 475l442 -442l-27 -27l-122 122h-192l-85 -85v362l-43 43z" />
+    <glyph glyph-name="speaker_phone" unicode="speaker_phone" 
+d="M320 85v171h-128v-171h128zM317 298c13 0 24 -11 24 -24v-207c0 -13 -11 -24 -24 -24h-122c-13 0 -24 11 -24 24v207c0 13 11 25 24 25zM256 491c64 0 123 -27 165 -69l-30 -30c-35 35 -82 56 -135 56s-100 -21 -135 -56l-30 30c42 42 101 69 165 69zM149 361
+c27 27 65 44 107 44s80 -17 107 -44l-31 -30c-19 19 -46 31 -76 31s-57 -12 -76 -31z" />
+    <glyph glyph-name="spellcheck" unicode="spellcheck" 
+d="M461 265l30 -30l-203 -203l-108 109l30 30l78 -79zM137 277h88l-44 118zM266 171l-25 64h-120l-24 -64h-45l109 277h40l109 -277h-44z" />
+    <glyph glyph-name="star" unicode="star" 
+d="M256 144l-132 -80l35 150l-116 101l153 13l60 141l60 -141l153 -13l-116 -101l35 -150z" />
+    <glyph glyph-name="star_border" unicode="star_border" 
+d="M256 183l80 -48l-21 91l71 62l-94 8l-36 86l-36 -86l-94 -8l71 -62l-21 -91zM469 315l-116 -101l35 -150l-132 80l-132 -80l35 150l-116 101l153 13l60 141l60 -141z" />
+    <glyph glyph-name="star_half" unicode="star_half" 
+d="M256 183l80 -48l-21 91l71 62l-94 8l-36 86v-199zM469 315l-116 -101l35 -150l-132 80l-132 -80l35 150l-116 101l153 13l60 141l60 -141z" />
+    <glyph glyph-name="stars" unicode="stars" 
+d="M346 128l-24 103l80 69l-105 9l-41 96l-41 -97l-105 -8l80 -69l-24 -103l90 54zM256 469c118 0 213 -95 213 -213s-95 -213 -213 -213s-213 95 -213 213s95 213 213 213z" />
+    <glyph glyph-name="stay_current_landscape" unicode="stay_current_landscape" 
+d="M405 363h-298v-214h298v214zM22 363c0 23 19 42 42 42h384c23 0 43 -19 43 -42v-214c0 -23 -20 -42 -43 -42h-384c-23 0 -43 19 -43 42z" />
+    <glyph glyph-name="stay_current_portrait" unicode="stay_current_portrait" 
+d="M363 107v298h-214v-298h214zM363 490c23 0 42 -19 42 -42v-384c0 -23 -19 -43 -42 -43h-214c-23 0 -42 20 -42 43v384c0 23 19 43 42 43z" />
+    <glyph glyph-name="stay_primary_landscape" unicode="stay_primary_landscape" 
+d="M405 363h-298v-214h298v214zM22 363c0 23 19 42 42 42h384c23 0 43 -19 43 -42v-214c0 -23 -20 -42 -43 -42h-384c-23 0 -43 19 -43 42z" />
+    <glyph glyph-name="stay_primary_portrait" unicode="stay_primary_portrait" 
+d="M363 107v298h-214v-298h214zM363 490c23 0 42 -19 42 -42v-384c0 -23 -19 -43 -42 -43h-214c-23 0 -42 20 -42 43v384c0 23 19 43 42 43z" />
+    <glyph glyph-name="stop" unicode="stop" 
+d="M128 384h256v-256h-256v256z" />
+    <glyph glyph-name="stop_screen_share" unicode="stop_screen_share" 
+d="M149 192c20 28 45 44 78 52l-34 34c-25 -24 -37 -54 -44 -86zM51 475l421 -421l-27 -27l-58 58h-387v43h85c-24 0 -42 19 -42 42v214c0 13 5 23 14 31l-33 33zM469 170c0 -16 -9 -30 -22 -37l-118 118l34 32l-86 79v-45c-4 -1 -7 -1 -11 -2l-112 111h273
+c23 0 42 -18 42 -42v-214zM453 128h59v-43h-17z" />
+    <glyph glyph-name="storage" unicode="storage" 
+d="M85 277v-42h43v42h-43zM43 213v86h426v-86h-426zM128 363v42h-43v-42h43zM43 427h426v-86h-426v86zM85 149v-42h43v42h-43zM43 85v86h426v-86h-426z" />
+    <glyph glyph-name="store" unicode="store" 
+d="M256 128v85h-128v-85h128zM448 213h-21v-128h-43v128h-85v-128h-214v128h-21v43l21 107h342l21 -107v-43zM427 427v-43h-342v43h342z" />
+    <glyph glyph-name="store_mall_directory" unicode="store_mall_directory" 
+d="M256 128v85h-128v-85h128zM448 213h-21v-128h-43v128h-85v-128h-214v128h-21v43l21 107h342l21 -107v-43zM427 427v-43h-342v43h342z" />
+    <glyph glyph-name="straighten" unicode="straighten" 
+d="M448 171v170h-43v-85h-42v85h-43v-85h-43v85h-42v-85h-43v85h-43v-85h-42v85h-43v-170h384zM448 384c23 0 43 -20 43 -43v-170c0 -23 -20 -43 -43 -43h-384c-23 0 -43 20 -43 43v170c0 23 20 43 43 43h384z" />
+    <glyph glyph-name="streetview" unicode="streetview" 
+d="M245 384c0 -38 16 -73 41 -98l-209 -209c-8 8 -13 18 -13 30v298c0 23 20 43 43 43h154c-10 -19 -16 -41 -16 -64zM277 384c0 59 48 107 107 107s107 -48 107 -107s-48 -107 -107 -107s-107 48 -107 107zM268 206c32 24 73 39 116 39c22 0 44 -4 64 -11v-127
+c0 -23 -20 -43 -43 -43h-149v117c0 10 5 19 12 25z" />
+    <glyph glyph-name="strikethrough_s" unicode="strikethrough_s" 
+d="M200 232c0 -38.1216 24.1545 -54 62 -54c26.1564 0 49 10.6702 49 36c0 23.9161 -12.6848 29.3424 -30 38c-3 1 -8 3 -12 4h-205v43h384v-43h-83c1 -2 3 -5 4 -7c4 -10 7 -22 7 -35c0 -46.2545 -30.1882 -69.4824 -67 -80c-14 -4 -29 -6 -46 -6c-10 0 -21 1 -31 3
+c-21.9156 4.38312 -40.6035 10.4527 -56 22c-22.8363 17.1272 -39 39.9131 -39 79h63zM311 352c0 30.7771 -19.602 45 -51 45c-22.5729 0 -39.6285 -7.25692 -47 -22c-2 -4 -3 -9 -3 -14c0 -10 6 -19 16 -26c8 -5 16 -10 30 -15h-98c-1 2 -3 3 -4 5c-6 10 -8 22 -8 36
+c0 28.7417 14.9303 49.3443 32 63c20.5411 14.3788 47.8126 24 83 24c35.0657 0 64.1326 -10.0193 83 -27c17.5603 -15.8042 31 -37.9468 31 -69h-64z" />
+    <glyph glyph-name="style" unicode="style" 
+d="M125 91v135l74 -178h-31c-23 0 -43 20 -43 43zM168 325c12 0 21 10 21 22s-9 21 -21 21s-21 -9 -21 -21s9 -22 21 -22zM470 172c9 -22 -1 -47 -23 -56l-157 -65c-5 -2 -11 -3 -17 -3c-17 0 -32 10 -39 26l-106 256c-2 6 -3 11 -3 17c0 16 10 31 26 38l158 65
+c6 2 11 3 17 3c16 0 31 -10 38 -26zM54 93c-22 9 -32 33 -23 55l52 125v-192z" />
+    <glyph glyph-name="subdirectory_arrow_left" unicode="subdirectory_arrow_left" 
+d="M235 320l30 -30l-77 -77h196v214h43v-256h-239l77 -77l-30 -30l-128 128z" />
+    <glyph glyph-name="subdirectory_arrow_right" unicode="subdirectory_arrow_right" 
+d="M405 192l-128 -128l-30 30l77 77h-239v256h43v-214h196l-77 77l30 30z" />
+    <glyph glyph-name="subject" unicode="subject" 
+d="M85 405h342v-42h-342v42zM85 192v43h342v-43h-342zM427 320v-43h-342v43h342zM299 149v-42h-214v42h214z" />
+    <glyph glyph-name="subscriptions" unicode="subscriptions" 
+d="M341 171l-128 69v-139zM469 256v-171c0 -23 -19 -42 -42 -42h-342c-23 0 -42 19 -42 42v171c0 23 19 43 42 43h342c23 0 42 -20 42 -43zM384 469v-42h-256v42h256zM427 341h-342v43h342v-43z" />
+    <glyph glyph-name="subtitles" unicode="subtitles" 
+d="M427 213v43h-214v-43h214zM427 128v43h-86v-43h86zM299 128v43h-214v-43h214zM85 256v-43h86v43h-86zM427 427c23 0 42 -20 42 -43v-256c0 -23 -19 -43 -42 -43h-342c-23 0 -42 20 -42 43v256c0 23 19 43 42 43h342z" />
+    <glyph glyph-name="subway" unicode="subway" 
+d="M384 173v147c0 56 -57 64 -128 64c-64 0 -128 -8 -128 -64v-147c0 -31 25 -56 56 -56l-24 -24v-8h36l32 32h60l32 -32h32v8l-24 24c31 0 56 25 56 56zM380 452c57 -22 89 -69 89 -129v-280h-426v280c0 60 32 107 89 129c38 15 84 17 124 17s86 -2 124 -17zM150 320h213
+v-107h-213v107zM160 171c0 12 9 21 21 21s22 -9 22 -21s-10 -22 -22 -22s-21 10 -21 22zM309 171c0 12 10 21 22 21s21 -9 21 -21s-9 -22 -21 -22s-22 10 -22 22z" />
+    <glyph glyph-name="supervisor_account" unicode="supervisor_account" 
+d="M192 235c14 0 32 -2 51 -6c-44 -24 -51 -56 -51 -74v-48h-149v53c0 50 99 75 149 75zM352 213c39 0 117 -19 117 -58v-48h-234v48c0 39 78 58 117 58zM192 277c-35 0 -64 29 -64 64s29 64 64 64s64 -29 64 -64s-29 -64 -64 -64zM352 256c-29 0 -53 24 -53 53s24 54 53 54
+s53 -25 53 -54s-24 -53 -53 -53z" />
+    <glyph glyph-name="surround_sound" unicode="surround_sound" 
+d="M256 299c23 0 43 -20 43 -43s-20 -43 -43 -43s-43 20 -43 43s20 43 43 43zM377 135c33 33 50 77 50 121s-17 88 -50 121l-31 -31c25 -25 38 -57 38 -90s-12 -66 -37 -91zM256 171c47 0 85 38 85 85s-38 85 -85 85s-85 -38 -85 -85s38 -85 85 -85zM166 166
+c-25 25 -38 57 -38 90s12 66 37 91l-30 30c-33 -33 -50 -77 -50 -121s17 -88 50 -121zM427 427c23 0 42 -20 42 -43v-256c0 -23 -19 -43 -42 -43h-342c-23 0 -42 20 -42 43v256c0 23 19 43 42 43h342z" />
+    <glyph glyph-name="swap_calls" unicode="swap_calls" 
+d="M384 427l85 -86h-64v-149c0 -47 -38 -85 -85 -85s-85 38 -85 85v149c0 23 -20 43 -43 43s-43 -20 -43 -43v-149h64l-85 -85l-85 85h64v149c0 47 38 86 85 86s85 -39 85 -86v-149c0 -23 20 -43 43 -43s43 20 43 43v149h-64z" />
+    <glyph glyph-name="swap_horiz" unicode="swap_horiz" 
+d="M448 320l-85 -85v64h-150v42h150v64zM149 277v-64h150v-42h-150v-64l-85 85z" />
+    <glyph glyph-name="swap_vert" unicode="swap_vert" 
+d="M192 448l85 -85h-64v-150h-42v150h-64zM341 149h64l-85 -85l-85 85h64v150h42v-150z" />
+    <glyph glyph-name="swap_vertical_circle" unicode="swap_vertical_circle" 
+d="M373 192h-53v85h-43v-85h-53l75 -75zM139 320h53v-85h43v85h53l-75 75zM256 469c118 0 213 -95 213 -213s-95 -213 -213 -213s-213 95 -213 213s95 213 213 213z" />
+    <glyph glyph-name="switch_camera" unicode="switch_camera" 
+d="M320 181l75 75l-75 75v-54h-128v54l-75 -75l75 -75v54h128v-54zM427 427c23 0 42 -20 42 -43v-256c0 -23 -19 -43 -42 -43h-342c-23 0 -42 20 -42 43v256c0 23 19 43 42 43h68l39 42h128l39 -42h68z" />
+    <glyph glyph-name="switch_video" unicode="switch_video" 
+d="M277 181l75 75l-75 75v-54h-128v54l-74 -75l74 -75v54h128v-54zM384 309l85 86v-278l-85 86v-75c0 -12 -9 -21 -21 -21h-299c-12 0 -21 9 -21 21v256c0 12 9 21 21 21h299c12 0 21 -9 21 -21v-75z" />
+    <glyph glyph-name="sync" unicode="sync" 
+d="M256 128v64l85 -85l-85 -86v64c-94 0 -171 77 -171 171c0 33 10 65 27 91l31 -31c-10 -18 -15 -38 -15 -60c0 -71 57 -128 128 -128zM256 427c94 0 171 -77 171 -171c0 -33 -10 -65 -27 -91l-31 31c10 18 15 38 15 60c0 71 -57 128 -128 128v-64l-85 85l85 86v-64z" />
+    <glyph glyph-name="sync_disabled" unicode="sync_disabled" 
+d="M427 427l-51 -51c31 -31 51 -73 51 -120c0 -33 -10 -64 -26 -90l-32 31c9 18 15 38 15 59c0 35 -15 67 -38 90l-47 -47v128h128zM61 397l27 27l335 -336l-27 -27l-50 50c-15 -9 -31 -16 -48 -20v44c6 2 12 5 17 8l-172 172c-9 -18 -15 -38 -15 -59c0 -35 15 -67 38 -90
+l47 47v-128h-128l51 51c-31 31 -51 73 -51 120c0 33 10 64 26 90zM213 377c-6 -2 -11 -5 -16 -8l-31 32c15 9 30 16 47 20v-44z" />
+    <glyph glyph-name="sync_problem" unicode="sync_problem" 
+d="M235 235v128h42v-128h-42zM448 427l-50 -51c31 -31 50 -73 50 -120c0 -80 -54 -146 -128 -165v44c50 17 85 65 85 121c0 35 -14 67 -37 90l-48 -47v128h128zM235 149v43h42v-43h-42zM64 256c0 80 54 146 128 165v-44c-50 -17 -85 -65 -85 -121c0 -35 14 -67 37 -90l48 47
+v-128h-128l50 51c-31 31 -50 73 -50 120z" />
+    <glyph glyph-name="system_update" unicode="system_update" 
+d="M341 235l-85 -86l-85 86h64v106h42v-106h64zM363 107v298h-214v-298h214zM363 490c23 0 42 -19 42 -42v-384c0 -23 -19 -43 -42 -43h-214c-23 0 -42 20 -42 43v384c0 23 19 43 42 43z" />
+    <glyph glyph-name="system_update_alt" unicode="system_update_alt" 
+d="M448 437c23 0 43 -19 43 -42v-299c0 -23 -20 -43 -43 -43h-384c-23 0 -43 20 -43 43v299c0 23 20 42 43 42h128v-42h-128v-299h384v299h-128v42h128zM256 160l-85 85h64v192h42v-192h64z" />
+    <glyph glyph-name="tab" unicode="tab" 
+d="M448 107v213h-171v85h-213v-298h384zM448 448c23 0 43 -20 43 -43v-298c0 -23 -20 -43 -43 -43h-384c-23 0 -43 20 -43 43v298c0 23 20 43 43 43h384z" />
+    <glyph glyph-name="tab_unselected" unicode="tab_unselected" 
+d="M363 64v43h42v-43h-42zM277 64v43h43v-43h-43zM448 235v42h43v-42h-43zM448 64v43h43c0 -23 -20 -43 -43 -43zM107 405v43h42v-43h-42zM107 64v43h42v-43h-42zM192 405v43h43v-43h-43zM448 149v43h43v-43h-43zM448 448c23 0 43 -20 43 -43v-85h-214v128h171zM64 64
+c-23 0 -43 20 -43 43h43v-43zM21 149v43h43v-43h-43zM192 64v43h43v-43h-43zM21 405c0 23 20 43 43 43v-43h-43zM21 235v42h43v-42h-43zM21 320v43h43v-43h-43z" />
+    <glyph glyph-name="tablet" unicode="tablet" 
+d="M405 128v256h-298v-256h298zM448 427c23 0 43 -20 43 -43l-1 -256c0 -23 -19 -43 -42 -43h-384c-23 0 -43 20 -43 43v256c0 23 20 43 43 43h384z" />
+    <glyph glyph-name="tablet_android" unicode="tablet_android" 
+d="M411 107v341h-310v-341h310zM299 43v21h-86v-21h86zM384 512c35 0 64 -29 64 -64v-384c0 -35 -29 -64 -64 -64h-256c-35 0 -64 29 -64 64v384c0 35 29 64 64 64h256z" />
+    <glyph glyph-name="tablet_mac" unicode="tablet_mac" 
+d="M405 107v341h-320v-341h320zM245 21c18 0 32 14 32 32s-14 32 -32 32s-32 -14 -32 -32s14 -32 32 -32zM395 512c29 0 53 -24 53 -53v-406c0 -29 -24 -53 -53 -53h-299c-29 0 -53 24 -53 53v406c0 29 24 53 53 53h299z" />
+    <glyph glyph-name="tag_faces" unicode="tag_faces" 
+d="M256 139c-50 0 -92 30 -109 74h218c-17 -44 -59 -74 -109 -74zM181 277c-18 0 -32 14 -32 32s14 32 32 32s32 -14 32 -32s-14 -32 -32 -32zM331 277c-18 0 -32 14 -32 32s14 32 32 32s32 -14 32 -32s-14 -32 -32 -32zM256 85c94 0 171 77 171 171s-77 171 -171 171
+s-171 -77 -171 -171s77 -171 171 -171zM256 469c118 0 213 -95 213 -213s-95 -213 -213 -213s-213 95 -213 213s95 213 213 213z" />
+    <glyph glyph-name="tap_and_play" unicode="tap_and_play" 
+d="M363 490c23 0 42 -19 42 -42v-363c0 -23 -19 -42 -42 -42h-45c-2 30 -9 58 -20 85h65v277h-214v-128c-14 6 -27 11 -42 14v157c0 23 19 43 42 43zM43 256c130 0 234 -105 234 -235h-42c0 106 -86 192 -192 192v43zM43 85c35 0 64 -29 64 -64h-64v64zM43 171
+c83 0 149 -67 149 -150h-43c0 59 -47 107 -106 107v43z" />
+    <glyph glyph-name="terrain" unicode="terrain" 
+d="M299 384l192 -256h-470l128 171l96 -128l34 25l-60 81z" />
+    <glyph glyph-name="text_fields" unicode="text_fields" 
+d="M459 320v-64h-64v-149h-64v149h-64v64h192zM53 427h278v-64h-107v-256h-64v256h-107v64z" />
+    <glyph glyph-name="text_format" unicode="text_format" 
+d="M256 384l-40 -107h80zM203 239l-20 -47h-44l101 235h32l101 -235h-44l-20 47h-106zM107 149h298v-42h-298v42z" />
+    <glyph glyph-name="textsms" unicode="textsms" 
+d="M363 277v43h-43v-43h43zM277 277v43h-42v-43h42zM192 277v43h-43v-43h43zM427 469c23 0 42 -19 42 -42v-256c0 -23 -19 -43 -42 -43h-299l-85 -85v384c0 23 19 42 42 42h342z" />
+    <glyph glyph-name="texture" unicode="texture" 
+d="M198 64l250 250v-61l-189 -189h-61zM448 107c0 -22.9739 -20.0355 -43 -43 -43h-42l85 85v-42zM107 448h42l-85 -85v42c0 23 20 43 43 43zM253 448h61l-250 -250v61zM416 446c15 -4 27 -15 31 -30l-351 -350c-14.6749 4.19283 -25.8059 15.3206 -30 30z" />
+    <glyph glyph-name="theaters" unicode="theaters" 
+d="M384 320v43h-43v-43h43zM384 235v42h-43v-42h43zM384 149v43h-43v-43h43zM171 320v43h-43v-43h43zM171 235v42h-43v-42h43zM171 149v43h-43v-43h43zM384 448h43v-384h-43v43h-43v-43h-170v43h-43v-43h-43v384h43v-43h43v43h170v-43h43v43z" />
+    <glyph glyph-name="thumb_down" unicode="thumb_down" 
+d="M405 448h86v-256h-86v256zM320 448c23 0 43 -20 43 -43v-213c0 -12 -5 -22 -13 -30l-140 -141l-23 23c-6 6 -9 13 -9 22v7l21 98h-135c-23 0 -43 19 -43 42l1 2h-1v41c0 6 1 11 3 16l65 150c6 15 21 26 39 26h192z" />
+    <glyph glyph-name="thumb_up" unicode="thumb_up" 
+d="M491 299l-1 -2h1v-41c0 -6 -1 -11 -3 -16l-65 -150c-6 -15 -21 -26 -39 -26h-192c-23 0 -43 20 -43 43v213c0 12 5 22 13 30l140 141l23 -23c6 -6 9 -13 9 -22v-7l-21 -98h135c23 0 43 -19 43 -42zM21 64v256h86v-256h-86z" />
+    <glyph glyph-name="thumbs_up_down" unicode="thumbs_up_down" 
+d="M480 299c18 0 32 -14 32 -32v-139c0 -9 -3 -17 -9 -23l-106 -105l-17 17c-4 4 -7 10 -7 17c4.95149 24.3818 10.0081 48.6586 15 73h-111c-12 0 -21 9 -21 21v27c0 4 1 7 2 11l49 113c5 11 16 20 29 20h144zM256 384v-27c0 -4 -1 -7 -2 -11l-49 -113
+c-5 -11 -16 -20 -29 -20h-144c-18 0 -32 14 -32 32v139c0 9 3 17 9 23l106 105l17 -17c4 -4 7 -10 7 -17c-4.95149 -24.3818 -10.0081 -48.6586 -15 -73h111c12 0 21 -9 21 -21z" />
+    <glyph glyph-name="time_to_leave" unicode="time_to_leave" 
+d="M107 299h298l-32 96h-234zM373 192c18 0 32 14 32 32s-14 32 -32 32s-32 -14 -32 -32s14 -32 32 -32zM139 192c18 0 32 14 32 32s-14 32 -32 32s-32 -14 -32 -32s14 -32 32 -32zM404 405l44 -128v-170c0 -12 -9 -22 -21 -22h-22c-12 0 -21 10 -21 22v21h-256v-21
+c0 -12 -9 -22 -21 -22h-22c-12 0 -21 10 -21 22v170l44 128c4 13 17 22 31 22h234c14 0 27 -9 31 -22z" />
+    <glyph glyph-name="timelapse" unicode="timelapse" 
+d="M256 85c94 0 171 77 171 171s-77 171 -171 171s-171 -77 -171 -171s77 -171 171 -171zM256 469c118 0 213 -95 213 -213s-95 -213 -213 -213s-213 95 -213 213s95 213 213 213zM346 346c50 -50 51 -130 1 -180s-131 -50 -181 0l90 90v128c33 0 65 -13 90 -38z" />
+    <glyph glyph-name="timeline" unicode="timeline" 
+d="M491 341c0 -23 -20 -42 -43 -42c-4 0 -8 0 -11 1l-76 -76c1 -3 2 -7 2 -11c0 -23 -20 -42 -43 -42s-43 19 -43 42c0 4 1 8 2 11l-55 55c-3 -1 -7 -2 -11 -2s-8 1 -11 2l-97 -97c1 -3 2 -7 2 -11c0 -23 -20 -43 -43 -43s-43 20 -43 43s20 42 43 42c4 0 8 0 11 -1l97 97
+c-1 3 -1 7 -1 11c0 23 19 43 42 43s43 -20 43 -43c0 -4 0 -8 -1 -11l54 -54c3 1 7 1 11 1s8 0 11 -1l76 75c-1 3 -2 7 -2 11c0 23 20 43 43 43s43 -20 43 -43z" />
+    <glyph glyph-name="timer" unicode="timer" 
+d="M256 85c83 0 149 67 149 150s-66 149 -149 149s-149 -66 -149 -149s66 -150 149 -150zM406 354c26 -33 42 -74 42 -119c0 -106 -86 -192 -192 -192s-192 86 -192 192s86 192 192 192c45 0 87 -17 120 -43l30 31c11 -9 21 -19 30 -30zM235 213v128h42v-128h-42zM320 491
+v-43h-128v43h128z" />
+    <glyph glyph-name="timer_10" unicode="timer_&#x31;&#x30;" 
+d="M275 230v54c0 23.1679 -2.28229 40.1372 -10 53c-5.32529 10.6506 -15.2041 15 -30 15c-6 0 -13 -1 -18 -3c-19.376 -11.6256 -23 -33.9937 -23 -66v-53c0 -13 0 -24 2 -33s6 -15 9 -21c5.59145 -11.1829 14.1701 -16 30 -16c15.4236 0 24.6161 5.23229 30 16
+c3 6 6 12 8 21s2 20 2 33zM152 277c0 64.1175 20.6864 109 83 109c25.9331 0 47.8484 -8.37646 60 -24c15.2136 -19.5604 22 -48.5586 22 -85v-41c0 -63.9076 -19.6435 -110 -82 -110c-62.0914 0 -83 46.0788 -83 110v41zM436 289c-16.3185 0 -30 -6.67853 -30 -23
+c0 -14.5467 7.81248 -15.525 19 -20c5 -2 12 -4 19 -5c11 -2 19 -5 28 -8s16 -8 22 -12s10 -10 13 -16s5 -12 5 -21c0 -30.9206 -20.0931 -44.031 -44 -52c-9 -3 -19 -4 -30 -4c-35.9519 0 -63.4589 14.4041 -74 39c-3 7 -5 14 -5 22h41c0 -21.2888 17.0766 -30 38 -30
+c18.6968 0 33 5.89308 33 23c0 13.5739 -8.51234 16.8049 -19 21c-12.7341 5.09362 -34.9088 9.09079 -48 14c-8 3 -14 7 -20 11c-11.0546 7.36974 -19 18.5758 -19 36c0 27.5628 20.3776 44.7925 42 52c9 3 18 4 29 4c40.9316 0 75 -19.1355 75 -59h-42
+c0 12.2774 -7.84356 22.4609 -18 25c-4 1 -10 3 -15 3zM0 347l101 37h6v-256h-43v205l-64 -22v36z" />
+    <glyph glyph-name="timer_3" unicode="timer_&#x33;" 
+d="M374 289c-15.9409 0 -31 -7.57315 -31 -23c0 -13.6828 9.30955 -15.7238 20 -20c5 -2 11 -4 18 -5c11 -2 20 -5 29 -8s16 -8 22 -12s10 -10 13 -16s5 -12 5 -21c0 -30.9206 -20.0931 -44.031 -44 -52c-9 -3 -20 -4 -31 -4c-35.3954 0 -62.613 14.7638 -73 39
+c-3 7 -5 14 -5 22h40c0 -20.4241 18.5387 -30 39 -30c18.6968 0 33 5.89308 33 23c0 13.5739 -8.51234 16.8049 -19 21c-5 2 -13 4 -21 6c-18.808 3.76159 -34.9505 10.3003 -48 19c-10.5283 7.01889 -18 19.4522 -18 36c0 27.5628 20.3776 44.7925 42 52c9 3 18 4 29 4
+c40.9316 0 75 -19.1355 75 -59h-42c0 13.019 -8.2055 22.3014 -19 25c-4 1 -9 3 -14 3zM215 259c24.7243 -9.2716 42 -25.484 42 -58c0 -25.5996 -8.85495 -43.6412 -24 -55c-14.0356 -12.0305 -34.4533 -20 -60 -20c-46.8771 0 -84 25.2474 -84 72h43
+c0 -11.5043 4.1483 -22.8612 11 -28c7.35188 -5.51391 17.5339 -10 30 -10c27.0755 0 42 14.0756 42 41c0 28.626 -17.0664 41 -46 41h-26v33h25c20.5078 0 35.1083 8.27068 41 23c2 5 2 10 2 16c0 24.8875 -12.4571 38 -38 38c-18.723 0 -29.7305 -7.46097 -36 -20
+c-2 -4 -3 -9 -3 -15h-42c0 34.3341 22.95 53.98 48 64c10 3 21 5 33 5c48.7123 0 80 -23.4793 80 -72c0 -28.4847 -18.378 -45.189 -38 -55z" />
+    <glyph glyph-name="timer_off" unicode="timer_off" 
+d="M256 85c27 0 53 8 75 21l-204 204c-13 -22 -20 -48 -20 -75c0 -83 66 -150 149 -150zM64 427l379 -379l-27 -27l-54 54c-31 -20 -67 -32 -106 -32c-106 0 -192 86 -192 192c0 39 12 76 32 106l-59 59zM235 311v30h42v-73zM320 491v-43h-128v43h128zM406 415l30 -30
+l-30 -31c26 -33 42 -74 42 -119c0 -39 -12 -76 -32 -106l-31 31c13 22 20 48 20 75c0 83 -66 149 -149 149c-27 0 -52 -7 -74 -20l-32 31c30 20 67 32 106 32c45 0 87 -16 120 -42z" />
+    <glyph glyph-name="title" unicode="title" 
+d="M107 427h298v-64h-117v-256h-64v256h-117v64z" />
+    <glyph glyph-name="toc" unicode="toc" 
+d="M405 235v42h43v-42h-43zM405 363h43v-43h-43v43zM405 149v43h43v-43h-43zM64 149v43h299v-43h-299zM64 235v42h299v-42h-299zM64 320v43h299v-43h-299z" />
+    <glyph glyph-name="today" unicode="today" 
+d="M149 299h107v-107h-107v107zM405 107v234h-298v-234h298zM405 448c23 0 43 -20 43 -43v-298c0 -23 -20 -43 -43 -43h-298c-24 0 -43 20 -43 43v298c0 23 19 43 43 43h21v43h43v-43h170v43h43v-43h21z" />
+    <glyph glyph-name="toll" unicode="toll" 
+d="M64 256c0 -56 35 -104 85 -121v-44c-74 19 -128 85 -128 165s54 146 128 165v-44c-50 -17 -85 -65 -85 -121zM320 128c71 0 128 57 128 128s-57 128 -128 128s-128 -57 -128 -128s57 -128 128 -128zM320 427c94 0 171 -77 171 -171s-77 -171 -171 -171s-171 77 -171 171
+s77 171 171 171z" />
+    <glyph glyph-name="tonality" unicode="tonality" 
+d="M421 213c2 7 3 15 4 22h-148v-22h144zM389 149c5 7 11 15 15 22h-127v-22h112zM277 87c22 3 43 10 62 20h-62v-20zM277 299v-22h148c-1 7 -2 15 -4 22h-144zM277 363v-22h127c-4 7 -10 15 -15 22h-112zM277 425v-20h62c-19 10 -40 17 -62 20zM235 87v338
+c-84 -10 -150 -82 -150 -169s66 -159 150 -169zM256 469c118 0 213 -95 213 -213s-95 -213 -213 -213s-213 95 -213 213s95 213 213 213z" />
+    <glyph glyph-name="touch_app" unicode="touch_app" 
+d="M402 173c11 -5 19 -16 19 -29v-4l-16 -113c-2 -16 -15 -27 -31 -27h-145c-9 0 -16 3 -22 9l-106 106l17 17c4 4 10 7 17 7c2 0 3 -1 5 -1l73 -15v229c0 18 14 32 32 32s32 -14 32 -32v-128h17c4 0 7 -1 11 -2zM192 272c-26 17 -43 47 -43 80c0 53 43 96 96 96
+s96 -43 96 -96c0 -33 -16 -63 -42 -80v80c0 29 -25 53 -54 53s-53 -24 -53 -53v-80z" />
+    <glyph glyph-name="toys" unicode="toys" 
+d="M256 256c0 -64 -53 -117 -117 -117s-118 53 -118 117h235zM256 256c-64 0 -117 53 -117 117s53 118 117 118v-235zM256 256c64 0 117 -53 117 -117s-53 -118 -117 -118v235zM256 256c0 64 53 117 117 117s118 -53 118 -117h-235z" />
+    <glyph glyph-name="track_changes" unicode="track_changes" 
+d="M407 407c39 -39 62 -92 62 -151c0 -118 -95 -213 -213 -213s-213 95 -213 213s95 213 213 213h21v-176c13 -7 22 -21 22 -37c0 -23 -20 -43 -43 -43s-43 20 -43 43c0 16 9 30 22 37v45c-37 -10 -64 -42 -64 -82c0 -47 38 -85 85 -85s85 38 85 85c0 23 -10 44 -25 60
+l30 30c23 -23 38 -55 38 -90c0 -71 -57 -128 -128 -128s-128 57 -128 128c0 63 46 116 107 126v43c-84 -10 -150 -82 -150 -169c0 -94 77 -171 171 -171s171 77 171 171c0 47 -19 90 -50 121z" />
+    <glyph glyph-name="traffic" unicode="traffic" 
+d="M256 320c24 0 43 20 43 43c0 24 -20 42 -43 42c-24 0 -43 -18 -43 -42c0 -23 19 -43 43 -43zM256 213c24 0 43 20 43 43s-20 43 -43 43c-24 0 -43 -20 -43 -43s19 -43 43 -43zM256 107c24 0 43 19 43 42s-20 43 -43 43c-24 0 -43 -20 -43 -43s19 -42 43 -42zM427 299
+c0 -40 -27 -73 -64 -83v-24h64c0 -40 -27 -72 -64 -82v-25c0 -12 -10 -21 -22 -21h-170c-12 0 -22 9 -22 21v25c-37 10 -64 42 -64 82h64v24c-37 10 -64 43 -64 83h64v24c-37 10 -64 42 -64 82h64v22c0 12 10 21 22 21h170c12 0 22 -9 22 -21v-22h64c0 -40 -27 -72 -64 -82
+v-24h64z" />
+    <glyph glyph-name="train" unicode="train" 
+d="M352 149c18 0 32 14 32 32s-14 32 -32 32s-32 -14 -32 -32s14 -32 32 -32zM277 299h107v85h-107v-85zM235 299v85h-107v-85h107zM160 149c18 0 32 14 32 32s-14 32 -32 32s-32 -14 -32 -32s14 -32 32 -32zM256 469c94 0 171 -10 171 -85v-203c0 -41 -34 -74 -75 -74
+l32 -32v-11h-43l-42 43h-81l-42 -43h-48v11l32 32c-41 0 -75 33 -75 74v203c0 75 86 85 171 85z" />
+    <glyph glyph-name="tram" unicode="tram" 
+d="M363 213v107h-214v-107h214zM256 117c18 0 32 14 32 32s-14 32 -32 32s-32 -14 -32 -32s14 -32 32 -32zM405 151c0 -36 -19 -66 -55 -66h2l32 -32v-10h-43l-42 42h-81l-42 -42h-48v10l34 34c-30 7 -55 33 -55 64v180c0 59 60 72 127 74l17 32h-102v32h214v-32h-70
+l-16 -32c73 -2 128 -14 128 -74v-180z" />
+    <glyph glyph-name="transfer_within_a_station" unicode="transfer_within_a_station" 
+d="M123 322l-59 -301h45l37 171l46 -43v-128h43v161l-44 44l13 64c28 -34 69 -55 116 -55v42c-39 0 -74 22 -93 53l-20 34c-7 13 -21 20 -36 20c-5 0 -11 -1 -16 -3l-112 -46v-100h42v71l38 16zM203 395c-23 0 -43 19 -43 42s20 43 43 43s42 -20 42 -43s-19 -42 -42 -42z
+M416 91v37l53 -53l-53 -54v38h-117v32h117zM352 181h117v-32h-117v-37l-53 53l53 54v-38z" />
+    <glyph glyph-name="transform" unicode="transform" 
+d="M213 341v43h128c23 0 43 -20 43 -43v-128h-43v128h-128zM469 128h-85v-43h43l-64 -64l-64 64h42v43h-170c-23 0 -43 20 -43 43v170h-85v43h85v43h-43l64 64l64 -64h-42v-256h298v-43z" />
+    <glyph glyph-name="translate" unicode="translate" 
+d="M339 149h69l-35 93zM395 299l96 -256h-43l-24 64h-101l-24 -64h-43l96 256h43zM275 191l-17 -44l-66 66l-107 -106l-30 30l109 107c-27 30 -48 62 -64 97h43c13 -25 29 -49 49 -71c31 34 54 73 68 114h-239v43h150v42h42v-42h150v-43h-63c-16 -50 -42 -98 -79 -139l-1 -1
+z" />
+    <glyph glyph-name="trending_down" unicode="trending_down" 
+d="M341 128l49 49l-104 104l-85 -85l-158 158l30 30l128 -128l85 85l134 -134l49 49v-128h-128z" />
+    <glyph glyph-name="trending_flat" unicode="trending_flat" 
+d="M469 256l-85 -85v64h-320v42h320v64z" />
+    <glyph glyph-name="trending_up" unicode="trending_up" 
+d="M341 384h128v-128l-49 49l-134 -134l-85 85l-128 -128l-30 30l158 158l85 -85l104 104z" />
+    <glyph glyph-name="tune" unicode="tune" 
+d="M320 320v128h43v-43h85v-42h-85v-43h-43zM448 235h-213v42h213v-42zM149 320h43v-128h-43v43h-85v42h85v43zM277 64h-42v128h42v-43h171v-42h-171v-43zM64 405h213v-42h-213v42zM64 149h128v-42h-128v42z" />
+    <glyph glyph-name="turned_in" unicode="turned_in" 
+d="M363 448c23 0 42 -20 42 -43v-341l-149 64l-149 -64v341c0 23 19 43 42 43h214z" />
+    <glyph glyph-name="turned_in_not" unicode="turned_in_not" 
+d="M363 128v277h-214v-277l107 47zM363 448c23 0 42 -20 42 -43v-341l-149 64l-149 -64v341c0 23 19 43 42 43h214z" />
+    <glyph glyph-name="tv" unicode="tv" 
+d="M448 149v256h-384v-256h384zM448 448c23 0 43 -20 43 -43l-1 -256c0 -23 -19 -42 -42 -42h-107v-43h-170v43h-107c-23 0 -43 19 -43 42v256c0 23 20 43 43 43h384z" />
+    <glyph glyph-name="unarchive" unicode="unarchive" 
+d="M109 405h294l-20 22h-256zM256 309l-117 -117h74v-43h86v43h74zM438 401c6 -7 10 -18 10 -28v-266c0 -23 -20 -43 -43 -43h-298c-24 0 -43 20 -43 43v266c0 10 4 21 10 28l29 35c6 7 15 12 25 12h256c10 0 19 -5 25 -12z" />
+    <glyph glyph-name="undo" unicode="undo" 
+d="M267 341c99 0 182 -65 212 -154l-50 -16c-22 68 -86 117 -162 117c-42 0 -80 -15 -110 -40l78 -77h-192v192l76 -77c39 34 91 55 148 55z" />
+    <glyph glyph-name="unfold_less" unicode="unfold_less" 
+d="M354 397l-98 -98l-98 98l30 30l68 -68l68 68zM158 115l98 98l98 -98l-30 -30l-68 68l-68 -68z" />
+    <glyph glyph-name="unfold_more" unicode="unfold_more" 
+d="M256 124l68 68l30 -30l-98 -98l-98 98l30 30zM256 388l-68 -68l-30 30l98 98l98 -98l-30 -30z" />
+    <glyph glyph-name="update" unicode="update" 
+d="M267 341v-90l74 -45l-15 -26l-91 55v106h32zM448 296h-145l59 60c-58 58 -153 60 -211 2s-58 -150 0 -208s153 -58 211 0c29 29 43 62 43 104h43c0 -42 -18 -97 -56 -134c-75 -74 -197 -74 -272 0s-75 194 0 268s195 74 270 0l58 60v-152z" />
+    <glyph glyph-name="usb" unicode="usb" 
+d="M320 363h85v-86h-21v-42c0 -24 -19 -43 -43 -43h-64v-65c15 -8 26 -24 26 -42c0 -26 -21 -47 -47 -47s-47 21 -47 47c0 18 11 34 26 42v65h-64c-24 0 -43 19 -43 43v44c-15 8 -26 23 -26 41c0 26 21 47 47 47s47 -21 47 -47c0 -18 -10 -33 -25 -41v-44h64v170h-43l64 86
+l64 -86h-43v-170h64v42h-21v86z" />
+    <glyph glyph-name="verified_user" unicode="verified_user" 
+d="M213 149l171 171l-30 30l-141 -140l-55 55l-30 -30zM256 491l192 -86v-128c0 -118 -82 -229 -192 -256c-110 27 -192 138 -192 256v128z" />
+    <glyph glyph-name="vertical_align_bottom" unicode="vertical_align_bottom" 
+d="M85 107h342v-43h-342v43zM341 235l-85 -86l-85 86h64v213h42v-213h64z" />
+    <glyph glyph-name="vertical_align_center" unicode="vertical_align_center" 
+d="M85 277h342v-42h-342v42zM341 405l-85 -85l-85 85h64v86h42v-86h64zM171 107l85 85l85 -85h-64v-86h-42v86h-64z" />
+    <glyph glyph-name="vertical_align_top" unicode="vertical_align_top" 
+d="M85 448h342v-43h-342v43zM171 277l85 86l85 -86h-64v-213h-42v213h-64z" />
+    <glyph glyph-name="vibration" unicode="vibration" 
+d="M341 107v298h-170v-298h170zM352 448c18 0 32 -14 32 -32v-320c0 -18 -14 -32 -32 -32h-192c-18 0 -32 14 -32 32v320c0 18 14 32 32 32h192zM405 149v214h43v-214h-43zM469 320h43v-128h-43v128zM64 149v214h43v-214h-43zM0 192v128h43v-128h-43z" />
+    <glyph glyph-name="video_call" unicode="video_call" 
+d="M299 235v42h-64v64h-43v-64h-64v-42h64v-64h43v64h64zM363 288l85 85v-234l-85 85v-75c0 -12 -10 -21 -22 -21h-256c-12 0 -21 9 -21 21v214c0 12 9 21 21 21h256c12 0 22 -9 22 -21v-75z" />
+    <glyph glyph-name="video_label" unicode="video_label" 
+d="M448 171v234h-384v-234h384zM448 448c23 0 43 -20 43 -43v-298c0 -23 -20 -43 -43 -43h-384c-23 0 -43 20 -43 43v298c0 23 20 43 43 43h384z" />
+    <glyph glyph-name="video_library" unicode="video_library" 
+d="M256 203l128 96l-128 96v-192zM427 469c23 0 42 -19 42 -42v-256c0 -23 -19 -43 -42 -43h-256c-23 0 -43 20 -43 43v256c0 23 20 42 43 42h256zM85 384v-299h299v-42h-299c-23 0 -42 19 -42 42v299h42z" />
+    <glyph glyph-name="videocam" unicode="videocam" 
+d="M363 288l85 85v-234l-85 85v-75c0 -12 -10 -21 -22 -21h-256c-12 0 -21 9 -21 21v214c0 12 9 21 21 21h256c12 0 22 -9 22 -21v-75z" />
+    <glyph glyph-name="videocam_off" unicode="videocam_off" 
+d="M70 469l378 -378l-27 -27l-68 68c-3 -2 -8 -4 -12 -4h-256c-12 0 -21 9 -21 21v214c0 12 9 21 21 21h16l-58 58zM448 373v-228l-239 239h132c12 0 22 -9 22 -21v-75z" />
+    <glyph glyph-name="videogame_asset" unicode="videogame_asset" 
+d="M416 256c18 0 32 14 32 32s-14 32 -32 32s-32 -14 -32 -32s14 -32 32 -32zM331 192c18 0 32 14 32 32s-14 32 -32 32s-32 -14 -32 -32s14 -32 32 -32zM235 235v42h-64v64h-43v-64h-64v-42h64v-64h43v64h64zM448 384c23 0 43 -20 43 -43v-170c0 -23 -20 -43 -43 -43h-384
+c-23 0 -43 20 -43 43v170c0 23 20 43 43 43h384z" />
+    <glyph glyph-name="view_agenda" unicode="view_agenda" 
+d="M427 448c12 0 21 -9 21 -21v-128c0 -12 -9 -22 -21 -22h-363c-12 0 -21 10 -21 22v128c0 12 9 21 21 21h363zM427 235c12 0 21 -10 21 -22v-128c0 -12 -9 -21 -21 -21h-363c-12 0 -21 9 -21 21v128c0 12 9 22 21 22h363z" />
+    <glyph glyph-name="view_array" unicode="view_array" 
+d="M171 128v277h192v-277h-192zM384 405h64v-277h-64v277zM85 128v277h64v-277h-64z" />
+    <glyph glyph-name="view_carousel" unicode="view_carousel" 
+d="M384 384h85v-235h-85v235zM43 149v235h85v-235h-85zM149 107v320h214v-320h-214z" />
+    <glyph glyph-name="view_column" unicode="view_column" 
+d="M341 405h107v-277h-107v277zM85 128v277h107v-277h-107zM213 128v277h107v-277h-107z" />
+    <glyph glyph-name="view_comfy" unicode="view_comfy" 
+d="M384 405h85v-85h-85v85zM384 107v85h85v-85h-85zM277 107v85h86v-85h-86zM171 107v85h85v-85h-85zM64 107v85h85v-85h-85zM384 213v86h85v-86h-85zM277 405h86v-85h-86v85zM171 320v85h85v-85h-85zM277 213v86h86v-86h-86zM171 213v86h85v-86h-85zM64 213v86h85v-86h-85z
+M64 320v85h85v-85h-85z" />
+    <glyph glyph-name="view_compact" unicode="view_compact" 
+d="M64 405h405v-128h-405v128zM213 107v149h256v-149h-256zM64 107v149h128v-149h-128z" />
+    <glyph glyph-name="view_day" unicode="view_day" 
+d="M43 448h405v-64h-405v64zM427 341c12 0 21 -9 21 -21v-128c0 -12 -9 -21 -21 -21h-363c-12 0 -21 9 -21 21v128c0 12 9 21 21 21h363zM43 64v64h405v-64h-405z" />
+    <glyph glyph-name="view_headline" unicode="view_headline" 
+d="M85 405h342v-42h-342v42zM85 277v43h342v-43h-342zM85 107v42h342v-42h-342zM85 192v43h342v-43h-342z" />
+    <glyph glyph-name="view_list" unicode="view_list" 
+d="M192 405h256v-85h-256v85zM192 107v85h256v-85h-256zM192 213v86h256v-86h-256zM85 320v85h86v-85h-86zM85 107v85h86v-85h-86zM85 213v86h86v-86h-86z" />
+    <glyph glyph-name="view_module" unicode="view_module" 
+d="M341 405h107v-128h-107v128zM213 277v128h107v-128h-107zM341 128v128h107v-128h-107zM213 128v128h107v-128h-107zM85 128v128h107v-128h-107zM85 277v128h107v-128h-107z" />
+    <glyph glyph-name="view_quilt" unicode="view_quilt" 
+d="M213 405h235v-128h-235v128zM341 128v128h107v-128h-107zM85 128v277h107v-277h-107zM213 128v128h107v-128h-107z" />
+    <glyph glyph-name="view_stream" unicode="view_stream" 
+d="M85 405h363v-128h-363v128zM85 128v128h363v-128h-363z" />
+    <glyph glyph-name="view_week" unicode="view_week" 
+d="M277 405c12 0 22 -9 22 -21v-256c0 -12 -10 -21 -22 -21h-64c-12 0 -21 9 -21 21v256c0 12 9 21 21 21h64zM427 405c12 0 21 -9 21 -21v-256c0 -12 -9 -21 -21 -21h-64c-12 0 -22 9 -22 21v256c0 12 10 21 22 21h64zM128 405c12 0 21 -9 21 -21v-256
+c0 -12 -9 -21 -21 -21h-64c-12 0 -21 9 -21 21v256c0 12 9 21 21 21h64z" />
+    <glyph glyph-name="vignette" unicode="vignette" 
+d="M256 128c94 0 171 57 171 128s-77 128 -171 128s-171 -57 -171 -128s77 -128 171 -128zM448 448c23 0 43 -20 43 -43v-298c0 -23 -20 -43 -43 -43h-384c-23 0 -43 20 -43 43v298c0 23 20 43 43 43h384z" />
+    <glyph glyph-name="visibility" unicode="visibility" 
+d="M256 320c35 0 64 -29 64 -64s-29 -64 -64 -64s-64 29 -64 64s29 64 64 64zM256 149c59 0 107 48 107 107s-48 107 -107 107s-107 -48 -107 -107s48 -107 107 -107zM256 416c107 0 198 -66 235 -160c-37 -94 -128 -160 -235 -160s-198 66 -235 160c37 94 128 160 235 160z
+" />
+    <glyph glyph-name="visibility_off" unicode="visibility_off" 
+d="M253 320h3c35 0 64 -29 64 -64v-4zM161 303c-7 -14 -12 -30 -12 -47c0 -59 48 -107 107 -107c17 0 33 5 47 12l-33 33c-4 -1 -9 -2 -14 -2c-35 0 -64 29 -64 64c0 5 1 10 2 14zM43 421l27 27l378 -378l-27 -27c-23.9841 23.6825 -48.1328 47.2006 -72 71
+c-29 -12 -60 -18 -93 -18c-107 0 -198 66 -235 160c17 42 45 78 80 106c-19.5086 19.4914 -38.6537 39.3463 -58 59zM256 363c-14 0 -27 -3 -39 -8l-46 46c26 10 55 15 85 15c107 0 197 -66 234 -160c-16 -40 -41 -74 -73 -101l-62 62c5 12 8 25 8 39c0 59 -48 107 -107 107
+z" />
+    <glyph glyph-name="voice_chat" unicode="voice_chat" 
+d="M384 213v171l-85 -68v68h-171v-171h171v69zM427 469c23 0 42 -19 42 -42v-256c0 -23 -19 -43 -42 -43h-299l-85 -85v384c0 23 19 42 42 42h342z" />
+    <glyph glyph-name="voicemail" unicode="voicemail" 
+d="M395 192c41 0 74 34 74 75s-33 74 -74 74s-75 -33 -75 -74s34 -75 75 -75zM117 192c41 0 75 34 75 75s-34 74 -75 74s-74 -33 -74 -74s33 -75 74 -75zM395 384c65 0 117 -52 117 -117s-52 -118 -117 -118h-278c-65 0 -117 53 -117 118s52 117 117 117s118 -52 118 -117
+c0 -28 -10 -55 -27 -75h96c-17 20 -27 47 -27 75c0 65 53 117 118 117z" />
+    <glyph glyph-name="volume_down" unicode="volume_down" 
+d="M107 320h85l107 107v-342l-107 107h-85v128zM395 256c0 -38 -22 -70 -54 -86v172c32 -16 54 -48 54 -86z" />
+    <glyph glyph-name="volume_mute" unicode="volume_mute" 
+d="M149 320h86l106 107v-342l-106 107h-86v128z" />
+    <glyph glyph-name="volume_off" unicode="volume_off" 
+d="M256 427v-90l-45 45zM91 448l357 -357l-27 -27l-44 44c-23 -18 -49 -32 -78 -39v44c18 5 34 14 48 25l-91 91v-144l-107 107h-85v128h101l-101 101zM405 256c0 68 -44 125 -106 143v44c86 -19 149 -96 149 -187c0 -32 -8 -63 -22 -89l-32 33c7 17 11 36 11 56zM352 256
+c0 -5 0 -9 -1 -13l-52 52v47c32 -16 53 -48 53 -86z" />
+    <glyph glyph-name="volume_up" unicode="volume_up" 
+d="M299 443c86 -19 149 -96 149 -187s-63 -168 -149 -187v44c62 18 106 75 106 143s-44 125 -106 143v44zM352 256c0 -38 -21 -70 -53 -86v172c32 -16 53 -48 53 -86zM64 320h85l107 107v-342l-107 107h-85v128z" />
+    <glyph glyph-name="vpn_key" unicode="vpn_key" 
+d="M149 213c23 0 43 20 43 43s-20 43 -43 43s-42 -20 -42 -43s19 -43 42 -43zM270 299h221v-86h-43v-85h-85v85h-93c-17 -50 -65 -85 -121 -85c-71 0 -128 57 -128 128s57 128 128 128c56 0 104 -35 121 -85z" />
+    <glyph glyph-name="vpn_lock" unicode="vpn_lock" 
+d="M213 65v42c-23 0 -42 19 -42 42v22l-103 102c-3 -12 -4 -25 -4 -38c0 -87 65 -160 149 -170zM404 256h43c1 -7 1 -14 1 -21c0 -118 -95 -214 -213 -214s-214 96 -214 214s96 213 214 213c22 0 44 -4 64 -10v-54c0 -23 -20 -43 -43 -43h-43v-42c0 -12 -9 -22 -21 -22h-43
+v-42h128c12 0 22 -10 22 -22v-64h21c19 0 35 -12 41 -29c28 30 44 71 44 115c0 7 0 14 -1 21zM452 427v10c0 20 -16 37 -36 37s-36 -17 -36 -37v-10h72zM469 427c12 0 22 -10 22 -22v-85c0 -12 -10 -21 -22 -21h-106c-12 0 -22 9 -22 21v85c0 12 10 22 22 22v10
+c0 29 24 54 53 54s53 -25 53 -54v-10z" />
+    <glyph glyph-name="wallpaper" unicode="wallpaper" 
+d="M85 235v-150h150v-42h-150c-23 0 -42 19 -42 42v150h42zM427 85v150h42v-150c0 -23 -19 -42 -42 -42h-150v42h150zM427 469c23 0 42 -19 42 -42v-150h-42v150h-150v42h150zM363 331c0 -18 -14 -32 -32 -32s-32 14 -32 32s14 32 32 32s32 -14 32 -32zM213 235l64 -79
+l43 57l64 -85h-256zM85 427v-150h-42v150c0 23 19 42 42 42h150v-42h-150z" />
+    <glyph glyph-name="warning" unicode="warning" 
+d="M277 213v86h-42v-86h42zM277 128v43h-42v-43h42zM21 64l235 405l235 -405h-470z" />
+    <glyph glyph-name="watch" unicode="watch" 
+d="M128 256c0 -71 57 -128 128 -128s128 57 128 128s-57 128 -128 128s-128 -57 -128 -128zM427 256c0 -54 -26 -103 -65 -134l-21 -122h-170l-21 122c-40 31 -65 80 -65 134s25 103 65 134l21 122h170l21 -122c39 -31 65 -80 65 -134z" />
+    <glyph glyph-name="watch_later" unicode="watch_later" 
+d="M346 166l17 28l-96 58v111h-32v-128zM256 469c117 0 213 -96 213 -213s-96 -213 -213 -213s-213 96 -213 213s96 213 213 213z" />
+    <glyph glyph-name="wb_auto" unicode="wb_auto" 
+d="M220 171h40l-68 192h-43l-68 -192h41l15 42h68zM469 363h39l-44 -192h-37l-32 130l-32 -130h-38l-2 9c-28 -56 -85 -95 -152 -95c-94 0 -171 77 -171 171s77 171 171 171c54 0 102 -25 133 -64h16l26 -135l32 135h34l32 -135zM146 242l25 78l24 -78h-49z" />
+    <glyph glyph-name="wb_cloudy" unicode="wb_cloudy" 
+d="M413 298c55 -4 99 -50 99 -106c0 -59 -48 -107 -107 -107h-277c-71 0 -128 57 -128 128c0 66 50 120 114 127c27 51 80 87 142 87c78 0 142 -55 157 -129z" />
+    <glyph glyph-name="wb_incandescent" unicode="wb_incandescent" 
+d="M368 125l30 29l38 -38l-30 -30zM427 288h64v-43h-64v43zM320 377c38 -22 64 -63 64 -110c0 -71 -57 -128 -128 -128s-128 57 -128 128c0 47 26 88 64 110v103h128v-103zM85 288v-43h-64v43h64zM235 33v63h42v-63h-42zM76 116l38 39l30 -30l-38 -39z" />
+    <glyph glyph-name="wb_iridescent" unicode="wb_iridescent" 
+d="M106 86l-30 31l38 38l30 -30zM76 417l30 30l38 -38l-30 -30zM436 116l-30 -30l-38 39l30 30zM277 33h-42v63h42v-63zM406 447l30 -30l-38 -38l-30 30zM235 500h42v-63h-42v63zM107 203v128h298v-128h-298z" />
+    <glyph glyph-name="wb_sunny" unicode="wb_sunny" 
+d="M76 116l38 39l30 -30l-38 -39zM235 33v63h42v-63h-42zM256 395c71 0 128 -57 128 -128s-57 -128 -128 -128s-128 57 -128 128s57 128 128 128zM427 288h64v-43h-64v43zM368 125l30 29l38 -38l-30 -30zM436 417l-38 -38l-30 30l38 38zM277 500v-63h-42v63h42zM85 288v-43
+h-64v43h64zM144 409l-30 -30l-38 38l30 30z" />
+    <glyph glyph-name="wc" unicode="wc" 
+d="M352 384c-24 0 -43 19 -43 43s19 42 43 42s43 -18 43 -42s-19 -43 -43 -43zM160 384c-24 0 -43 19 -43 43s19 42 43 42s43 -18 43 -42s-19 -43 -43 -43zM384 43h-64v128h-64l54 162c6 17 23 30 41 30h2c18 0 35 -13 41 -30l54 -162h-64v-128zM117 43v160h-32v117
+c0 23 20 43 43 43h64c23 0 43 -20 43 -43v-117h-32v-160h-86z" />
+    <glyph glyph-name="web" unicode="web" 
+d="M427 128v192h-86v-192h86zM320 235v85h-235v-85h235zM320 128v85h-235v-85h235zM427 427c23 0 42 -20 42 -43v-256c0 -23 -19 -43 -42 -43h-342c-23 0 -42 20 -42 43v256c0 23 19 43 42 43h342z" />
+    <glyph glyph-name="web_asset" unicode="web_asset" 
+d="M405 128v213h-298v-213h298zM405 427c24 0 43 -20 43 -43v-256c0 -23 -20 -43 -43 -43h-298c-24 0 -43 20 -43 43v256c0 23 19 43 43 43h298z" />
+    <glyph glyph-name="weekend" unicode="weekend" 
+d="M384 405c23 0 43 -19 43 -42v-46c-25 -9 -43 -32 -43 -60v-44h-256v44c0 28 -18 51 -43 60v46c0 23 20 42 43 42h256zM448 299c23 0 43 -20 43 -43v-107c0 -23 -20 -42 -43 -42h-384c-23 0 -43 19 -43 42v107c0 23 20 43 43 43s43 -20 43 -43v-64h298v64
+c0 23 20 43 43 43z" />
+    <glyph glyph-name="whatshot" unicode="whatshot" 
+d="M250 107c57 0 102 45 102 102c0 30 -4 58 -12 86c-22 -29 -61 -47 -99 -55s-60 -31 -60 -66c0 -37 31 -67 69 -67zM288 498c83 -67 139 -170 139 -285c0 -94 -77 -170 -171 -170s-171 76 -171 170c0 72 26 139 69 190v-8c0 -44 33 -79 77 -79s73 35 73 79
+c0 46 -16 103 -16 103z" />
+    <glyph glyph-name="widgets" unicode="widgets" 
+d="M355 476l121 -121l-121 -120h93v-171h-171v171h78l-120 120v-78h-171v171h171v-93zM64 64v171h171v-171h-171z" />
+    <glyph glyph-name="wifi" unicode="wifi" 
+d="M107 235c83 82 216 82 298 0l-42 -43c-59 59 -155 59 -214 0zM192 149c35 35 93 35 128 0l-64 -64zM21 320c130 129 341 129 470 0l-43 -43c-106 106 -278 106 -384 0z" />
+    <glyph glyph-name="wifi_lock" unicode="wifi_lock" 
+d="M469 171v32c0 18 -14 32 -32 32s-32 -14 -32 -32v-32h64zM491 171c12 0 21 -10 21 -22v-85c0 -12 -9 -21 -21 -21h-107c-12 0 -21 9 -21 21v85c0 12 9 22 21 22v32c0 29 24 53 53 53s54 -24 54 -53v-32zM437 309c-59 0 -106 -47 -106 -106v-61l-75 -99l-256 341
+c71 54 160 85 256 85s185 -31 256 -85l-57 -76c-6 1 -12 1 -18 1z" />
+    <glyph glyph-name="wifi_tethering" unicode="wifi_tethering" 
+d="M256 448c118 0 213 -95 213 -213c0 -79 -42 -148 -106 -185l-22 37c51 30 86 85 86 148c0 94 -77 170 -171 170s-171 -76 -171 -170c0 -63 34 -118 85 -148l-21 -37c-64 37 -106 106 -106 185c0 118 95 213 213 213zM384 235c0 -47 -26 -89 -64 -111l-21 37
+c25 15 42 42 42 74c0 47 -38 85 -85 85s-85 -38 -85 -85c0 -32 17 -59 42 -74l-21 -37c-38 22 -64 64 -64 111c0 71 57 128 128 128s128 -57 128 -128zM256 277c23 0 43 -19 43 -42s-20 -43 -43 -43s-43 20 -43 43s20 42 43 42z" />
+    <glyph glyph-name="work" unicode="work" 
+d="M299 384v43h-86v-43h86zM427 384c24 0 42 -19 42 -43v-234c0 -24 -18 -43 -42 -43h-342c-24 0 -42 19 -42 43v234c0 24 18 43 42 43h86v43c0 24 18 42 42 42h86c24 0 42 -18 42 -42v-43h86z" />
+    <glyph glyph-name="wrap_text" unicode="wrap_text" 
+d="M363 277c47 0 85 -38 85 -85s-38 -85 -85 -85h-43v-43l-64 64l64 64v-43h48c23 0 43 20 43 43s-20 43 -43 43h-283v42h278zM427 405v-42h-342v42h342zM85 107v42h128v-42h-128z" />
+    <glyph glyph-name="youtube_searched_for" unicode="youtube_searched_for" 
+d="M363 213l106 -106l-31 -32l-107 107v16l-6 6c-24 -21 -56 -33 -90 -33c-26 0 -50 7 -71 19l32 31c12 -5 25 -8 39 -8c53 0 96 43 96 96s-43 96 -96 96s-96 -43 -96 -96h74l-88 -85l-82 85h53c0 75 62 139 139 139s139 -62 139 -139c0 -35 -13 -66 -34 -90l6 -6h17z" />
+    <glyph glyph-name="zoom_in" unicode="zoom_in" 
+d="M256 299h-43v-43h-21v43h-43v21h43v43h21v-43h43v-21zM203 213c53 0 96 43 96 96s-43 96 -96 96s-96 -43 -96 -96s43 -96 96 -96zM331 213l106 -106l-32 -32l-106 106v17l-6 6c-24 -21 -56 -33 -90 -33c-77 0 -139 61 -139 138s62 139 139 139s138 -62 138 -139
+c0 -34 -12 -66 -33 -90l6 -6h17z" />
+    <glyph glyph-name="zoom_out" unicode="zoom_out" 
+d="M149 320h107v-21h-107v21zM203 213c53 0 96 43 96 96s-43 96 -96 96s-96 -43 -96 -96s43 -96 96 -96zM331 213l106 -106l-32 -32l-106 106v17l-6 6c-24 -21 -56 -33 -90 -33c-77 0 -139 61 -139 138s62 139 139 139s138 -62 138 -139c0 -34 -12 -66 -33 -90l6 -6h17z" />
+    <glyph glyph-name="zoom_out_map" unicode="zoom_out_map" 
+d="M448 192v-128h-128l49 49l-62 61l31 31l61 -62zM192 64h-128v128l49 -49l61 62l31 -31l-62 -61zM64 320v128h128l-49 -49l62 -61l-31 -31l-61 62zM320 448h128v-128l-49 49l-61 -62l-31 31l62 61z" />
+    <glyph glyph-name="3" unicode="3" 
+d="M0 0z" />
+    <glyph glyph-name="d" unicode="d" 
+d="M0 0z" />
+    <glyph glyph-name="_" unicode="_" 
+d="M0 0z" />
+    <glyph glyph-name="r" unicode="r" 
+d="M0 0z" />
+    <glyph glyph-name="o" unicode="o" 
+d="M0 0z" />
+    <glyph glyph-name="t" unicode="t" 
+d="M0 0z" />
+    <glyph glyph-name="a" unicode="a" 
+d="M0 0z" />
+    <glyph glyph-name="i" unicode="i" 
+d="M0 0z" />
+    <glyph glyph-name="n" unicode="n" 
+d="M0 0z" />
+    <glyph glyph-name="c" unicode="c" 
+d="M0 0z" />
+    <glyph glyph-name="u" unicode="u" 
+d="M0 0z" />
+    <glyph glyph-name="e" unicode="e" 
+d="M0 0z" />
+    <glyph glyph-name="s" unicode="s" 
+d="M0 0z" />
+    <glyph glyph-name="l" unicode="l" 
+d="M0 0z" />
+    <glyph glyph-name="m" unicode="m" 
+d="M0 0z" />
+    <glyph glyph-name="b" unicode="b" 
+d="M0 0z" />
+    <glyph glyph-name="y" unicode="y" 
+d="M0 0z" />
+    <glyph glyph-name="w" unicode="w" 
+d="M0 0z" />
+    <glyph glyph-name="x" unicode="x" 
+d="M0 0z" />
+    <glyph glyph-name="p" unicode="p" 
+d="M0 0z" />
+    <glyph glyph-name="h" unicode="h" 
+d="M0 0z" />
+    <glyph glyph-name="g" unicode="g" 
+d="M0 0z" />
+    <glyph glyph-name="q" unicode="q" 
+d="M0 0z" />
+    <glyph glyph-name="j" unicode="j" 
+d="M0 0z" />
+    <glyph glyph-name="f" unicode="f" 
+d="M0 0z" />
+    <glyph glyph-name="v" unicode="v" 
+d="M0 0z" />
+    <glyph glyph-name="k" unicode="k" 
+d="M0 0z" />
+    <glyph glyph-name="z" unicode="z" 
+d="M0 0z" />
+    <glyph glyph-name="1" unicode="1" 
+d="M0 0z" />
+    <glyph glyph-name="2" unicode="2" 
+d="M0 0z" />
+    <glyph glyph-name="4" unicode="4" 
+d="M0 0z" />
+    <glyph glyph-name="5" unicode="5" 
+d="M0 0z" />
+    <glyph glyph-name="6" unicode="6" 
+d="M0 0z" />
+    <glyph glyph-name="7" unicode="7" 
+d="M0 0z" />
+    <glyph glyph-name="9" unicode="9" 
+d="M0 0z" />
+    <glyph glyph-name="8" unicode="8" 
+d="M0 0z" />
+    <glyph glyph-name="0" unicode="0" 
+d="M0 0z" />
+  </font>
+</defs></svg>

BIN
support/client/lib/vwf/view/lib/mdc/iconfont/MaterialIcons-Regular.ttf


BIN
support/client/lib/vwf/view/lib/mdc/iconfont/MaterialIcons-Regular.woff


BIN
support/client/lib/vwf/view/lib/mdc/iconfont/MaterialIcons-Regular.woff2


+ 9 - 0
support/client/lib/vwf/view/lib/mdc/iconfont/README.md

@@ -0,0 +1,9 @@
+The recommended way to use the Material Icons font is by linking to the web font hosted on Google Fonts:
+
+```html
+<link href="https://fonts.googleapis.com/icon?family=Material+Icons"
+      rel="stylesheet">
+```
+
+Read more in our full usage guide:
+http://google.github.io/material-design-icons/#icon-font-for-the-web

+ 932 - 0
support/client/lib/vwf/view/lib/mdc/iconfont/codepoints

@@ -0,0 +1,932 @@
+3d_rotation e84d
+ac_unit eb3b
+access_alarm e190
+access_alarms e191
+access_time e192
+accessibility e84e
+accessible e914
+account_balance e84f
+account_balance_wallet e850
+account_box e851
+account_circle e853
+adb e60e
+add e145
+add_a_photo e439
+add_alarm e193
+add_alert e003
+add_box e146
+add_circle e147
+add_circle_outline e148
+add_location e567
+add_shopping_cart e854
+add_to_photos e39d
+add_to_queue e05c
+adjust e39e
+airline_seat_flat e630
+airline_seat_flat_angled e631
+airline_seat_individual_suite e632
+airline_seat_legroom_extra e633
+airline_seat_legroom_normal e634
+airline_seat_legroom_reduced e635
+airline_seat_recline_extra e636
+airline_seat_recline_normal e637
+airplanemode_active e195
+airplanemode_inactive e194
+airplay e055
+airport_shuttle eb3c
+alarm e855
+alarm_add e856
+alarm_off e857
+alarm_on e858
+album e019
+all_inclusive eb3d
+all_out e90b
+android e859
+announcement e85a
+apps e5c3
+archive e149
+arrow_back e5c4
+arrow_downward e5db
+arrow_drop_down e5c5
+arrow_drop_down_circle e5c6
+arrow_drop_up e5c7
+arrow_forward e5c8
+arrow_upward e5d8
+art_track e060
+aspect_ratio e85b
+assessment e85c
+assignment e85d
+assignment_ind e85e
+assignment_late e85f
+assignment_return e860
+assignment_returned e861
+assignment_turned_in e862
+assistant e39f
+assistant_photo e3a0
+attach_file e226
+attach_money e227
+attachment e2bc
+audiotrack e3a1
+autorenew e863
+av_timer e01b
+backspace e14a
+backup e864
+battery_alert e19c
+battery_charging_full e1a3
+battery_full e1a4
+battery_std e1a5
+battery_unknown e1a6
+beach_access eb3e
+beenhere e52d
+block e14b
+bluetooth e1a7
+bluetooth_audio e60f
+bluetooth_connected e1a8
+bluetooth_disabled e1a9
+bluetooth_searching e1aa
+blur_circular e3a2
+blur_linear e3a3
+blur_off e3a4
+blur_on e3a5
+book e865
+bookmark e866
+bookmark_border e867
+border_all e228
+border_bottom e229
+border_clear e22a
+border_color e22b
+border_horizontal e22c
+border_inner e22d
+border_left e22e
+border_outer e22f
+border_right e230
+border_style e231
+border_top e232
+border_vertical e233
+branding_watermark e06b
+brightness_1 e3a6
+brightness_2 e3a7
+brightness_3 e3a8
+brightness_4 e3a9
+brightness_5 e3aa
+brightness_6 e3ab
+brightness_7 e3ac
+brightness_auto e1ab
+brightness_high e1ac
+brightness_low e1ad
+brightness_medium e1ae
+broken_image e3ad
+brush e3ae
+bubble_chart e6dd
+bug_report e868
+build e869
+burst_mode e43c
+business e0af
+business_center eb3f
+cached e86a
+cake e7e9
+call e0b0
+call_end e0b1
+call_made e0b2
+call_merge e0b3
+call_missed e0b4
+call_missed_outgoing e0e4
+call_received e0b5
+call_split e0b6
+call_to_action e06c
+camera e3af
+camera_alt e3b0
+camera_enhance e8fc
+camera_front e3b1
+camera_rear e3b2
+camera_roll e3b3
+cancel e5c9
+card_giftcard e8f6
+card_membership e8f7
+card_travel e8f8
+casino eb40
+cast e307
+cast_connected e308
+center_focus_strong e3b4
+center_focus_weak e3b5
+change_history e86b
+chat e0b7
+chat_bubble e0ca
+chat_bubble_outline e0cb
+check e5ca
+check_box e834
+check_box_outline_blank e835
+check_circle e86c
+chevron_left e5cb
+chevron_right e5cc
+child_care eb41
+child_friendly eb42
+chrome_reader_mode e86d
+class e86e
+clear e14c
+clear_all e0b8
+close e5cd
+closed_caption e01c
+cloud e2bd
+cloud_circle e2be
+cloud_done e2bf
+cloud_download e2c0
+cloud_off e2c1
+cloud_queue e2c2
+cloud_upload e2c3
+code e86f
+collections e3b6
+collections_bookmark e431
+color_lens e3b7
+colorize e3b8
+comment e0b9
+compare e3b9
+compare_arrows e915
+computer e30a
+confirmation_number e638
+contact_mail e0d0
+contact_phone e0cf
+contacts e0ba
+content_copy e14d
+content_cut e14e
+content_paste e14f
+control_point e3ba
+control_point_duplicate e3bb
+copyright e90c
+create e150
+create_new_folder e2cc
+credit_card e870
+crop e3be
+crop_16_9 e3bc
+crop_3_2 e3bd
+crop_5_4 e3bf
+crop_7_5 e3c0
+crop_din e3c1
+crop_free e3c2
+crop_landscape e3c3
+crop_original e3c4
+crop_portrait e3c5
+crop_rotate e437
+crop_square e3c6
+dashboard e871
+data_usage e1af
+date_range e916
+dehaze e3c7
+delete e872
+delete_forever e92b
+delete_sweep e16c
+description e873
+desktop_mac e30b
+desktop_windows e30c
+details e3c8
+developer_board e30d
+developer_mode e1b0
+device_hub e335
+devices e1b1
+devices_other e337
+dialer_sip e0bb
+dialpad e0bc
+directions e52e
+directions_bike e52f
+directions_boat e532
+directions_bus e530
+directions_car e531
+directions_railway e534
+directions_run e566
+directions_subway e533
+directions_transit e535
+directions_walk e536
+disc_full e610
+dns e875
+do_not_disturb e612
+do_not_disturb_alt e611
+do_not_disturb_off e643
+do_not_disturb_on e644
+dock e30e
+domain e7ee
+done e876
+done_all e877
+donut_large e917
+donut_small e918
+drafts e151
+drag_handle e25d
+drive_eta e613
+dvr e1b2
+edit e3c9
+edit_location e568
+eject e8fb
+email e0be
+enhanced_encryption e63f
+equalizer e01d
+error e000
+error_outline e001
+euro_symbol e926
+ev_station e56d
+event e878
+event_available e614
+event_busy e615
+event_note e616
+event_seat e903
+exit_to_app e879
+expand_less e5ce
+expand_more e5cf
+explicit e01e
+explore e87a
+exposure e3ca
+exposure_neg_1 e3cb
+exposure_neg_2 e3cc
+exposure_plus_1 e3cd
+exposure_plus_2 e3ce
+exposure_zero e3cf
+extension e87b
+face e87c
+fast_forward e01f
+fast_rewind e020
+favorite e87d
+favorite_border e87e
+featured_play_list e06d
+featured_video e06e
+feedback e87f
+fiber_dvr e05d
+fiber_manual_record e061
+fiber_new e05e
+fiber_pin e06a
+fiber_smart_record e062
+file_download e2c4
+file_upload e2c6
+filter e3d3
+filter_1 e3d0
+filter_2 e3d1
+filter_3 e3d2
+filter_4 e3d4
+filter_5 e3d5
+filter_6 e3d6
+filter_7 e3d7
+filter_8 e3d8
+filter_9 e3d9
+filter_9_plus e3da
+filter_b_and_w e3db
+filter_center_focus e3dc
+filter_drama e3dd
+filter_frames e3de
+filter_hdr e3df
+filter_list e152
+filter_none e3e0
+filter_tilt_shift e3e2
+filter_vintage e3e3
+find_in_page e880
+find_replace e881
+fingerprint e90d
+first_page e5dc
+fitness_center eb43
+flag e153
+flare e3e4
+flash_auto e3e5
+flash_off e3e6
+flash_on e3e7
+flight e539
+flight_land e904
+flight_takeoff e905
+flip e3e8
+flip_to_back e882
+flip_to_front e883
+folder e2c7
+folder_open e2c8
+folder_shared e2c9
+folder_special e617
+font_download e167
+format_align_center e234
+format_align_justify e235
+format_align_left e236
+format_align_right e237
+format_bold e238
+format_clear e239
+format_color_fill e23a
+format_color_reset e23b
+format_color_text e23c
+format_indent_decrease e23d
+format_indent_increase e23e
+format_italic e23f
+format_line_spacing e240
+format_list_bulleted e241
+format_list_numbered e242
+format_paint e243
+format_quote e244
+format_shapes e25e
+format_size e245
+format_strikethrough e246
+format_textdirection_l_to_r e247
+format_textdirection_r_to_l e248
+format_underlined e249
+forum e0bf
+forward e154
+forward_10 e056
+forward_30 e057
+forward_5 e058
+free_breakfast eb44
+fullscreen e5d0
+fullscreen_exit e5d1
+functions e24a
+g_translate e927
+gamepad e30f
+games e021
+gavel e90e
+gesture e155
+get_app e884
+gif e908
+golf_course eb45
+gps_fixed e1b3
+gps_not_fixed e1b4
+gps_off e1b5
+grade e885
+gradient e3e9
+grain e3ea
+graphic_eq e1b8
+grid_off e3eb
+grid_on e3ec
+group e7ef
+group_add e7f0
+group_work e886
+hd e052
+hdr_off e3ed
+hdr_on e3ee
+hdr_strong e3f1
+hdr_weak e3f2
+headset e310
+headset_mic e311
+healing e3f3
+hearing e023
+help e887
+help_outline e8fd
+high_quality e024
+highlight e25f
+highlight_off e888
+history e889
+home e88a
+hot_tub eb46
+hotel e53a
+hourglass_empty e88b
+hourglass_full e88c
+http e902
+https e88d
+image e3f4
+image_aspect_ratio e3f5
+import_contacts e0e0
+import_export e0c3
+important_devices e912
+inbox e156
+indeterminate_check_box e909
+info e88e
+info_outline e88f
+input e890
+insert_chart e24b
+insert_comment e24c
+insert_drive_file e24d
+insert_emoticon e24e
+insert_invitation e24f
+insert_link e250
+insert_photo e251
+invert_colors e891
+invert_colors_off e0c4
+iso e3f6
+keyboard e312
+keyboard_arrow_down e313
+keyboard_arrow_left e314
+keyboard_arrow_right e315
+keyboard_arrow_up e316
+keyboard_backspace e317
+keyboard_capslock e318
+keyboard_hide e31a
+keyboard_return e31b
+keyboard_tab e31c
+keyboard_voice e31d
+kitchen eb47
+label e892
+label_outline e893
+landscape e3f7
+language e894
+laptop e31e
+laptop_chromebook e31f
+laptop_mac e320
+laptop_windows e321
+last_page e5dd
+launch e895
+layers e53b
+layers_clear e53c
+leak_add e3f8
+leak_remove e3f9
+lens e3fa
+library_add e02e
+library_books e02f
+library_music e030
+lightbulb_outline e90f
+line_style e919
+line_weight e91a
+linear_scale e260
+link e157
+linked_camera e438
+list e896
+live_help e0c6
+live_tv e639
+local_activity e53f
+local_airport e53d
+local_atm e53e
+local_bar e540
+local_cafe e541
+local_car_wash e542
+local_convenience_store e543
+local_dining e556
+local_drink e544
+local_florist e545
+local_gas_station e546
+local_grocery_store e547
+local_hospital e548
+local_hotel e549
+local_laundry_service e54a
+local_library e54b
+local_mall e54c
+local_movies e54d
+local_offer e54e
+local_parking e54f
+local_pharmacy e550
+local_phone e551
+local_pizza e552
+local_play e553
+local_post_office e554
+local_printshop e555
+local_see e557
+local_shipping e558
+local_taxi e559
+location_city e7f1
+location_disabled e1b6
+location_off e0c7
+location_on e0c8
+location_searching e1b7
+lock e897
+lock_open e898
+lock_outline e899
+looks e3fc
+looks_3 e3fb
+looks_4 e3fd
+looks_5 e3fe
+looks_6 e3ff
+looks_one e400
+looks_two e401
+loop e028
+loupe e402
+low_priority e16d
+loyalty e89a
+mail e158
+mail_outline e0e1
+map e55b
+markunread e159
+markunread_mailbox e89b
+memory e322
+menu e5d2
+merge_type e252
+message e0c9
+mic e029
+mic_none e02a
+mic_off e02b
+mms e618
+mode_comment e253
+mode_edit e254
+monetization_on e263
+money_off e25c
+monochrome_photos e403
+mood e7f2
+mood_bad e7f3
+more e619
+more_horiz e5d3
+more_vert e5d4
+motorcycle e91b
+mouse e323
+move_to_inbox e168
+movie e02c
+movie_creation e404
+movie_filter e43a
+multiline_chart e6df
+music_note e405
+music_video e063
+my_location e55c
+nature e406
+nature_people e407
+navigate_before e408
+navigate_next e409
+navigation e55d
+near_me e569
+network_cell e1b9
+network_check e640
+network_locked e61a
+network_wifi e1ba
+new_releases e031
+next_week e16a
+nfc e1bb
+no_encryption e641
+no_sim e0cc
+not_interested e033
+note e06f
+note_add e89c
+notifications e7f4
+notifications_active e7f7
+notifications_none e7f5
+notifications_off e7f6
+notifications_paused e7f8
+offline_pin e90a
+ondemand_video e63a
+opacity e91c
+open_in_browser e89d
+open_in_new e89e
+open_with e89f
+pages e7f9
+pageview e8a0
+palette e40a
+pan_tool e925
+panorama e40b
+panorama_fish_eye e40c
+panorama_horizontal e40d
+panorama_vertical e40e
+panorama_wide_angle e40f
+party_mode e7fa
+pause e034
+pause_circle_filled e035
+pause_circle_outline e036
+payment e8a1
+people e7fb
+people_outline e7fc
+perm_camera_mic e8a2
+perm_contact_calendar e8a3
+perm_data_setting e8a4
+perm_device_information e8a5
+perm_identity e8a6
+perm_media e8a7
+perm_phone_msg e8a8
+perm_scan_wifi e8a9
+person e7fd
+person_add e7fe
+person_outline e7ff
+person_pin e55a
+person_pin_circle e56a
+personal_video e63b
+pets e91d
+phone e0cd
+phone_android e324
+phone_bluetooth_speaker e61b
+phone_forwarded e61c
+phone_in_talk e61d
+phone_iphone e325
+phone_locked e61e
+phone_missed e61f
+phone_paused e620
+phonelink e326
+phonelink_erase e0db
+phonelink_lock e0dc
+phonelink_off e327
+phonelink_ring e0dd
+phonelink_setup e0de
+photo e410
+photo_album e411
+photo_camera e412
+photo_filter e43b
+photo_library e413
+photo_size_select_actual e432
+photo_size_select_large e433
+photo_size_select_small e434
+picture_as_pdf e415
+picture_in_picture e8aa
+picture_in_picture_alt e911
+pie_chart e6c4
+pie_chart_outlined e6c5
+pin_drop e55e
+place e55f
+play_arrow e037
+play_circle_filled e038
+play_circle_outline e039
+play_for_work e906
+playlist_add e03b
+playlist_add_check e065
+playlist_play e05f
+plus_one e800
+poll e801
+polymer e8ab
+pool eb48
+portable_wifi_off e0ce
+portrait e416
+power e63c
+power_input e336
+power_settings_new e8ac
+pregnant_woman e91e
+present_to_all e0df
+print e8ad
+priority_high e645
+public e80b
+publish e255
+query_builder e8ae
+question_answer e8af
+queue e03c
+queue_music e03d
+queue_play_next e066
+radio e03e
+radio_button_checked e837
+radio_button_unchecked e836
+rate_review e560
+receipt e8b0
+recent_actors e03f
+record_voice_over e91f
+redeem e8b1
+redo e15a
+refresh e5d5
+remove e15b
+remove_circle e15c
+remove_circle_outline e15d
+remove_from_queue e067
+remove_red_eye e417
+remove_shopping_cart e928
+reorder e8fe
+repeat e040
+repeat_one e041
+replay e042
+replay_10 e059
+replay_30 e05a
+replay_5 e05b
+reply e15e
+reply_all e15f
+report e160
+report_problem e8b2
+restaurant e56c
+restaurant_menu e561
+restore e8b3
+restore_page e929
+ring_volume e0d1
+room e8b4
+room_service eb49
+rotate_90_degrees_ccw e418
+rotate_left e419
+rotate_right e41a
+rounded_corner e920
+router e328
+rowing e921
+rss_feed e0e5
+rv_hookup e642
+satellite e562
+save e161
+scanner e329
+schedule e8b5
+school e80c
+screen_lock_landscape e1be
+screen_lock_portrait e1bf
+screen_lock_rotation e1c0
+screen_rotation e1c1
+screen_share e0e2
+sd_card e623
+sd_storage e1c2
+search e8b6
+security e32a
+select_all e162
+send e163
+sentiment_dissatisfied e811
+sentiment_neutral e812
+sentiment_satisfied e813
+sentiment_very_dissatisfied e814
+sentiment_very_satisfied e815
+settings e8b8
+settings_applications e8b9
+settings_backup_restore e8ba
+settings_bluetooth e8bb
+settings_brightness e8bd
+settings_cell e8bc
+settings_ethernet e8be
+settings_input_antenna e8bf
+settings_input_component e8c0
+settings_input_composite e8c1
+settings_input_hdmi e8c2
+settings_input_svideo e8c3
+settings_overscan e8c4
+settings_phone e8c5
+settings_power e8c6
+settings_remote e8c7
+settings_system_daydream e1c3
+settings_voice e8c8
+share e80d
+shop e8c9
+shop_two e8ca
+shopping_basket e8cb
+shopping_cart e8cc
+short_text e261
+show_chart e6e1
+shuffle e043
+signal_cellular_4_bar e1c8
+signal_cellular_connected_no_internet_4_bar e1cd
+signal_cellular_no_sim e1ce
+signal_cellular_null e1cf
+signal_cellular_off e1d0
+signal_wifi_4_bar e1d8
+signal_wifi_4_bar_lock e1d9
+signal_wifi_off e1da
+sim_card e32b
+sim_card_alert e624
+skip_next e044
+skip_previous e045
+slideshow e41b
+slow_motion_video e068
+smartphone e32c
+smoke_free eb4a
+smoking_rooms eb4b
+sms e625
+sms_failed e626
+snooze e046
+sort e164
+sort_by_alpha e053
+spa eb4c
+space_bar e256
+speaker e32d
+speaker_group e32e
+speaker_notes e8cd
+speaker_notes_off e92a
+speaker_phone e0d2
+spellcheck e8ce
+star e838
+star_border e83a
+star_half e839
+stars e8d0
+stay_current_landscape e0d3
+stay_current_portrait e0d4
+stay_primary_landscape e0d5
+stay_primary_portrait e0d6
+stop e047
+stop_screen_share e0e3
+storage e1db
+store e8d1
+store_mall_directory e563
+straighten e41c
+streetview e56e
+strikethrough_s e257
+style e41d
+subdirectory_arrow_left e5d9
+subdirectory_arrow_right e5da
+subject e8d2
+subscriptions e064
+subtitles e048
+subway e56f
+supervisor_account e8d3
+surround_sound e049
+swap_calls e0d7
+swap_horiz e8d4
+swap_vert e8d5
+swap_vertical_circle e8d6
+switch_camera e41e
+switch_video e41f
+sync e627
+sync_disabled e628
+sync_problem e629
+system_update e62a
+system_update_alt e8d7
+tab e8d8
+tab_unselected e8d9
+tablet e32f
+tablet_android e330
+tablet_mac e331
+tag_faces e420
+tap_and_play e62b
+terrain e564
+text_fields e262
+text_format e165
+textsms e0d8
+texture e421
+theaters e8da
+thumb_down e8db
+thumb_up e8dc
+thumbs_up_down e8dd
+time_to_leave e62c
+timelapse e422
+timeline e922
+timer e425
+timer_10 e423
+timer_3 e424
+timer_off e426
+title e264
+toc e8de
+today e8df
+toll e8e0
+tonality e427
+touch_app e913
+toys e332
+track_changes e8e1
+traffic e565
+train e570
+tram e571
+transfer_within_a_station e572
+transform e428
+translate e8e2
+trending_down e8e3
+trending_flat e8e4
+trending_up e8e5
+tune e429
+turned_in e8e6
+turned_in_not e8e7
+tv e333
+unarchive e169
+undo e166
+unfold_less e5d6
+unfold_more e5d7
+update e923
+usb e1e0
+verified_user e8e8
+vertical_align_bottom e258
+vertical_align_center e259
+vertical_align_top e25a
+vibration e62d
+video_call e070
+video_label e071
+video_library e04a
+videocam e04b
+videocam_off e04c
+videogame_asset e338
+view_agenda e8e9
+view_array e8ea
+view_carousel e8eb
+view_column e8ec
+view_comfy e42a
+view_compact e42b
+view_day e8ed
+view_headline e8ee
+view_list e8ef
+view_module e8f0
+view_quilt e8f1
+view_stream e8f2
+view_week e8f3
+vignette e435
+visibility e8f4
+visibility_off e8f5
+voice_chat e62e
+voicemail e0d9
+volume_down e04d
+volume_mute e04e
+volume_off e04f
+volume_up e050
+vpn_key e0da
+vpn_lock e62f
+wallpaper e1bc
+warning e002
+watch e334
+watch_later e924
+wb_auto e42c
+wb_cloudy e42d
+wb_incandescent e42e
+wb_iridescent e436
+wb_sunny e430
+wc e63d
+web e051
+web_asset e069
+weekend e16b
+whatshot e80e
+widgets e1bd
+wifi e63e
+wifi_lock e1e1
+wifi_tethering e1e2
+work e8f9
+wrap_text e25b
+youtube_searched_for e8fa
+zoom_in e8ff
+zoom_out e900
+zoom_out_map e56b

+ 36 - 0
support/client/lib/vwf/view/lib/mdc/iconfont/material-icons.css

@@ -0,0 +1,36 @@
+@font-face {
+  font-family: 'Material Icons';
+  font-style: normal;
+  font-weight: 400;
+  src: url(MaterialIcons-Regular.eot); /* For IE6-8 */
+  src: local('Material Icons'),
+       local('MaterialIcons-Regular'),
+       url(MaterialIcons-Regular.woff2) format('woff2'),
+       url(MaterialIcons-Regular.woff) format('woff'),
+       url(MaterialIcons-Regular.ttf) format('truetype');
+}
+
+.material-icons {
+  font-family: 'Material Icons';
+  font-weight: normal;
+  font-style: normal;
+  font-size: 24px;  /* Preferred icon size */
+  display: inline-block;
+  line-height: 1;
+  text-transform: none;
+  letter-spacing: normal;
+  word-wrap: normal;
+  white-space: nowrap;
+  direction: ltr;
+
+  /* Support for all WebKit browsers. */
+  -webkit-font-smoothing: antialiased;
+  /* Support for Safari and Chrome. */
+  text-rendering: optimizeLegibility;
+
+  /* Support for Firefox. */
+  -moz-osx-font-smoothing: grayscale;
+
+  /* Support for IE. */
+  font-feature-settings: 'liga';
+}

Vissa filer visades inte eftersom för många filer har ändrats