diff --git a/node_modules/material-design-lite/dist/components/dialog/index.html b/node_modules/material-design-lite/dist/components/dialog/index.html
new file mode 100644
index 0000000..0434845
--- /dev/null
+++ b/node_modules/material-design-lite/dist/components/dialog/index.html
@@ -0,0 +1,155 @@
+
+
+
+<h2 id="introduction">Introduction</h2>
+<p>The Material Design Lite (MDL) <strong>dialog</strong> component allows for verification of
+user actions, simple data input, and alerts to provide extra information to users.</p>
+<h2 id="basic-usage">Basic Usage</h2>
+<p>To use the dialog component, you must be using a browser that supports the <a href="http://www.w3.org/TR/2013/CR-html5-20130806/interactive-elements.html#the-dialog-element">dialog element</a>.
+Only Chrome and Opera have native support at the time of writing.
+For other browsers you will need to include the <a href="https://github.com/GoogleChrome/dialog-polyfill">dialog polyfill</a> or create your own.</p>
+<p>Once you have dialog support create a dialog element.
+The element when using the polyfill <strong>must</strong> be a child of the <code>body</code> element.
+Within that container, add a content element with the class <code>mdl-dialog__content</code>.
+Add you content, then create an action container with the class <code>mdl-dialog__actions</code>.
+Finally for the markup, add your buttons within this container for triggering dialog functions.</p>
+<p>Keep in mind, the order is automatically reversed for actions.
+Material Design requires that the primary (confirmation) action be displayed last.
+So, the first action you create will appear last on the action bar.
+This allows for more natural coding and tab ordering while following the specification.</p>
+<p>Remember to add the event handlers for your action items.
+After your dialog markup is created, add the event listeners to the page to trigger the dialog to show.</p>
+<p>For example:</p>
+<pre><code class="lang-javascript">  var button = document.querySelector(&#39;button&#39;);
+  var dialog = document.querySelector(&#39;dialog&#39;);
+  button.addEventListener(&#39;click&#39;, function() {
+    dialog.showModal();
+    /* Or dialog.show(); to show the dialog without a backdrop. */
+  });
+</code></pre>
+<h2 id="examples">Examples</h2>
+<h3 id="simple-dialog">Simple Dialog</h3>
+<p>See this example live in <a href="http://codepen.io/Garbee/full/EPoaMj/">codepen</a>.</p>
+<pre><code class="lang-html">&lt;body&gt;
+  &lt;button id=&quot;show-dialog&quot; type=&quot;button&quot; class=&quot;mdl-button&quot;&gt;Show Dialog&lt;/button&gt;
+  &lt;dialog class=&quot;mdl-dialog&quot;&gt;
+    &lt;h4 class=&quot;mdl-dialog__title&quot;&gt;Allow data collection?&lt;/h4&gt;
+    &lt;div class=&quot;mdl-dialog__content&quot;&gt;
+      &lt;p&gt;
+        Allowing us to collect data will let us get you the information you want faster.
+      &lt;/p&gt;
+    &lt;/div&gt;
+    &lt;div class=&quot;mdl-dialog__actions&quot;&gt;
+      &lt;button type=&quot;button&quot; class=&quot;mdl-button&quot;&gt;Agree&lt;/button&gt;
+      &lt;button type=&quot;button&quot; class=&quot;mdl-button close&quot;&gt;Disagree&lt;/button&gt;
+    &lt;/div&gt;
+  &lt;/dialog&gt;
+  &lt;script&gt;
+    var dialog = document.querySelector(&#39;dialog&#39;);
+    var showDialogButton = document.querySelector(&#39;#show-dialog&#39;);
+    if (! dialog.showModal) {
+      dialogPolyfill.registerDialog(dialog);
+    }
+    showDialogButton.addEventListener(&#39;click&#39;, function() {
+      dialog.showModal();
+    });
+    dialog.querySelector(&#39;.close&#39;).addEventListener(&#39;click&#39;, function() {
+      dialog.close();
+    });
+  &lt;/script&gt;
+&lt;/body&gt;
+</code></pre>
+<h3 id="dialog-with-full-width-actions">Dialog with full width actions</h3>
+<p>See this example live in <a href="http://codepen.io/Garbee/full/JGMowG/">codepen</a>.</p>
+<pre><code class="lang-html">&lt;body&gt;
+  &lt;button type=&quot;button&quot; class=&quot;mdl-button show-modal&quot;&gt;Show Modal&lt;/button&gt;
+  &lt;dialog class=&quot;mdl-dialog&quot;&gt;
+    &lt;div class=&quot;mdl-dialog__content&quot;&gt;
+      &lt;p&gt;
+        Allow this site to collect usage data to improve your experience?
+      &lt;/p&gt;
+    &lt;/div&gt;
+    &lt;div class=&quot;mdl-dialog__actions mdl-dialog__actions--full-width&quot;&gt;
+      &lt;button type=&quot;button&quot; class=&quot;mdl-button&quot;&gt;Agree&lt;/button&gt;
+      &lt;button type=&quot;button&quot; class=&quot;mdl-button close&quot;&gt;Disagree&lt;/button&gt;
+    &lt;/div&gt;
+  &lt;/dialog&gt;
+  &lt;script&gt;
+    var dialog = document.querySelector(&#39;dialog&#39;);
+    var showModalButton = document.querySelector(&#39;.show-modal&#39;);
+    if (! dialog.showModal) {
+      dialogPolyfill.registerDialog(dialog);
+    }
+    showModalButton.addEventListener(&#39;click&#39;, function() {
+      dialog.showModal();
+    });
+    dialog.querySelector(&#39;.close&#39;).addEventListener(&#39;click&#39;, function() {
+      dialog.close();
+    });
+  &lt;/script&gt;
+&lt;/body&gt;
+</code></pre>
+<h2 id="css-classes">CSS Classes</h2>
+<h3 id="blocks">Blocks</h3>
+<table>
+<thead>
+<tr>
+<th>MDL Class</th>
+<th>Effect</th>
+<th>Remarks</th>
+</tr>
+</thead>
+<tbody>
+<tr>
+<td><code>mdl-dialog</code></td>
+<td>Defines the container of the dialog component.</td>
+<td>Required on dialog container.</td>
+</tr>
+</tbody>
+</table>
+<h3 id="elements">Elements</h3>
+<table>
+<thead>
+<tr>
+<th>MDL Class</th>
+<th>Effect</th>
+<th>Remarks</th>
+</tr>
+</thead>
+<tbody>
+<tr>
+<td><code>mdl-dialog__title</code></td>
+<td>Defines the title container in the dialog.</td>
+<td>Optional on title container.</td>
+</tr>
+<tr>
+<td><code>mdl-dialog__content</code></td>
+<td>Defines the content container of the dialog.</td>
+<td>Required on content container.</td>
+</tr>
+<tr>
+<td><code>mdl-dialog__actions</code></td>
+<td>Defines the actions container in the dialog.</td>
+<td>Required on action container.</td>
+</tr>
+</tbody>
+</table>
+<h3 id="modifiers">Modifiers</h3>
+<table>
+<thead>
+<tr>
+<th>MDL Class</th>
+<th>Effect</th>
+<th>Remarks</th>
+</tr>
+</thead>
+<tbody>
+<tr>
+<td><code>mdl-dialog__actions--full-width</code></td>
+<td>Modifies the actions to each take the full width of the container. This makes each take their own line.</td>
+<td>Optional on action container.</td>
+</tr>
+</tbody>
+</table>
+
+