diff --git a/package-lock.json b/package-lock.json
index 62799b8..4ac3d06 100644
--- a/package-lock.json
+++ b/package-lock.json
@@ -2083,6 +2083,37 @@
       "integrity": "sha1-ojD2T1aDEOFJgAmUB5DsmVRbyn4=",
       "dev": true
     },
+    "css-loader": {
+      "version": "2.1.0",
+      "resolved": "https://registry.npmjs.org/css-loader/-/css-loader-2.1.0.tgz",
+      "integrity": "sha512-MoOu+CStsGrSt5K2OeZ89q3Snf+IkxRfAIt9aAKg4piioTrhtP1iEFPu+OVn3Ohz24FO6L+rw9UJxBILiSBw5Q==",
+      "dev": true,
+      "requires": {
+        "icss-utils": "^4.0.0",
+        "loader-utils": "^1.2.1",
+        "lodash": "^4.17.11",
+        "postcss": "^7.0.6",
+        "postcss-modules-extract-imports": "^2.0.0",
+        "postcss-modules-local-by-default": "^2.0.3",
+        "postcss-modules-scope": "^2.0.0",
+        "postcss-modules-values": "^2.0.0",
+        "postcss-value-parser": "^3.3.0",
+        "schema-utils": "^1.0.0"
+      },
+      "dependencies": {
+        "schema-utils": {
+          "version": "1.0.0",
+          "resolved": "https://registry.npmjs.org/schema-utils/-/schema-utils-1.0.0.tgz",
+          "integrity": "sha512-i27Mic4KovM/lnGsy8whRCHhc7VicJajAjTrYg11K9zfZXnYIt4k5F+kZkwjnrhKzLic/HLU4j11mjsz2G/75g==",
+          "dev": true,
+          "requires": {
+            "ajv": "^6.1.0",
+            "ajv-errors": "^1.0.0",
+            "ajv-keywords": "^3.1.0"
+          }
+        }
+      }
+    },
     "css-select": {
       "version": "1.2.0",
       "resolved": "https://registry.npmjs.org/css-select/-/css-select-1.2.0.tgz",
@@ -2095,12 +2126,29 @@
         "nth-check": "~1.0.1"
       }
     },
+    "css-selector-tokenizer": {
+      "version": "0.7.1",
+      "resolved": "https://registry.npmjs.org/css-selector-tokenizer/-/css-selector-tokenizer-0.7.1.tgz",
+      "integrity": "sha512-xYL0AMZJ4gFzJQsHUKa5jiWWi2vH77WVNg7JYRyewwj6oPh4yb/y6Y9ZCw9dsj/9UauMhtuxR+ogQd//EdEVNA==",
+      "dev": true,
+      "requires": {
+        "cssesc": "^0.1.0",
+        "fastparse": "^1.1.1",
+        "regexpu-core": "^1.0.0"
+      }
+    },
     "css-what": {
       "version": "2.1.2",
       "resolved": "https://registry.npmjs.org/css-what/-/css-what-2.1.2.tgz",
       "integrity": "sha512-wan8dMWQ0GUeF7DGEPVjhHemVW/vy6xUYmFzRY8RYqgA0JtXC9rJmbScBjqSu6dg9q0lwPQy6ZAmJVr3PPTvqQ==",
       "dev": true
     },
+    "cssesc": {
+      "version": "0.1.0",
+      "resolved": "https://registry.npmjs.org/cssesc/-/cssesc-0.1.0.tgz",
+      "integrity": "sha1-yBSQPkViM3GgR3tAEJqq++6t27Q=",
+      "dev": true
+    },
     "cssom": {
       "version": "0.3.4",
       "resolved": "https://registry.npmjs.org/cssom/-/cssom-0.3.4.tgz",
@@ -3086,6 +3134,12 @@
       "integrity": "sha1-PYpcZog6FqMMqGQ+hR8Zuqd5eRc=",
       "dev": true
     },
+    "fastparse": {
+      "version": "1.1.2",
+      "resolved": "https://registry.npmjs.org/fastparse/-/fastparse-1.1.2.tgz",
+      "integrity": "sha512-483XLLxTVIwWK3QTrMGRqUfUpoOs/0hbQrl2oz4J0pAcm3A3bu84wxTFqGqkJzewCLdME38xJLJAxBABfQT8sQ==",
+      "dev": true
+    },
     "faye-websocket": {
       "version": "0.10.0",
       "resolved": "https://registry.npmjs.org/faye-websocket/-/faye-websocket-0.10.0.tgz",
@@ -3355,7 +3409,8 @@
         "ansi-regex": {
           "version": "2.1.1",
           "bundled": true,
-          "dev": true
+          "dev": true,
+          "optional": true
         },
         "aproba": {
           "version": "1.2.0",
@@ -3376,12 +3431,14 @@
         "balanced-match": {
           "version": "1.0.0",
           "bundled": true,
-          "dev": true
+          "dev": true,
+          "optional": true
         },
         "brace-expansion": {
           "version": "1.1.11",
           "bundled": true,
           "dev": true,
+          "optional": true,
           "requires": {
             "balanced-match": "^1.0.0",
             "concat-map": "0.0.1"
@@ -3396,17 +3453,20 @@
         "code-point-at": {
           "version": "1.1.0",
           "bundled": true,
-          "dev": true
+          "dev": true,
+          "optional": true
         },
         "concat-map": {
           "version": "0.0.1",
           "bundled": true,
-          "dev": true
+          "dev": true,
+          "optional": true
         },
         "console-control-strings": {
           "version": "1.1.0",
           "bundled": true,
-          "dev": true
+          "dev": true,
+          "optional": true
         },
         "core-util-is": {
           "version": "1.0.2",
@@ -3523,7 +3583,8 @@
         "inherits": {
           "version": "2.0.3",
           "bundled": true,
-          "dev": true
+          "dev": true,
+          "optional": true
         },
         "ini": {
           "version": "1.3.5",
@@ -3535,6 +3596,7 @@
           "version": "1.0.0",
           "bundled": true,
           "dev": true,
+          "optional": true,
           "requires": {
             "number-is-nan": "^1.0.0"
           }
@@ -3549,6 +3611,7 @@
           "version": "3.0.4",
           "bundled": true,
           "dev": true,
+          "optional": true,
           "requires": {
             "brace-expansion": "^1.1.7"
           }
@@ -3556,12 +3619,14 @@
         "minimist": {
           "version": "0.0.8",
           "bundled": true,
-          "dev": true
+          "dev": true,
+          "optional": true
         },
         "minipass": {
           "version": "2.3.5",
           "bundled": true,
           "dev": true,
+          "optional": true,
           "requires": {
             "safe-buffer": "^5.1.2",
             "yallist": "^3.0.0"
@@ -3580,6 +3645,7 @@
           "version": "0.5.1",
           "bundled": true,
           "dev": true,
+          "optional": true,
           "requires": {
             "minimist": "0.0.8"
           }
@@ -3660,7 +3726,8 @@
         "number-is-nan": {
           "version": "1.0.1",
           "bundled": true,
-          "dev": true
+          "dev": true,
+          "optional": true
         },
         "object-assign": {
           "version": "4.1.1",
@@ -3672,6 +3739,7 @@
           "version": "1.4.0",
           "bundled": true,
           "dev": true,
+          "optional": true,
           "requires": {
             "wrappy": "1"
           }
@@ -3757,7 +3825,8 @@
         "safe-buffer": {
           "version": "5.1.2",
           "bundled": true,
-          "dev": true
+          "dev": true,
+          "optional": true
         },
         "safer-buffer": {
           "version": "2.1.2",
@@ -3793,6 +3862,7 @@
           "version": "1.0.2",
           "bundled": true,
           "dev": true,
+          "optional": true,
           "requires": {
             "code-point-at": "^1.0.0",
             "is-fullwidth-code-point": "^1.0.0",
@@ -3812,6 +3882,7 @@
           "version": "3.0.1",
           "bundled": true,
           "dev": true,
+          "optional": true,
           "requires": {
             "ansi-regex": "^2.0.0"
           }
@@ -3855,12 +3926,14 @@
         "wrappy": {
           "version": "1.0.2",
           "bundled": true,
-          "dev": true
+          "dev": true,
+          "optional": true
         },
         "yallist": {
           "version": "3.0.3",
           "bundled": true,
-          "dev": true
+          "dev": true,
+          "optional": true
         }
       }
     },
@@ -4449,6 +4522,21 @@
         "safer-buffer": ">= 2.1.2 < 3"
       }
     },
+    "icss-replace-symbols": {
+      "version": "1.1.0",
+      "resolved": "https://registry.npmjs.org/icss-replace-symbols/-/icss-replace-symbols-1.1.0.tgz",
+      "integrity": "sha1-Bupvg2ead0njhs/h/oEq5dsiPe0=",
+      "dev": true
+    },
+    "icss-utils": {
+      "version": "4.0.0",
+      "resolved": "https://registry.npmjs.org/icss-utils/-/icss-utils-4.0.0.tgz",
+      "integrity": "sha512-bA/xGiwWM17qjllIs9X/y0EjsB7e0AV08F3OL8UPsoNkNRibIuu8f1eKTnQ8QO1DteKKTxTUAn+IEWUToIwGOA==",
+      "dev": true,
+      "requires": {
+        "postcss": "^7.0.5"
+      }
+    },
     "ieee754": {
       "version": "1.1.12",
       "resolved": "https://registry.npmjs.org/ieee754/-/ieee754-1.1.12.tgz",
@@ -7635,6 +7723,80 @@
       "integrity": "sha1-AerA/jta9xoqbAL+q7jB/vfgDqs=",
       "dev": true
     },
+    "postcss": {
+      "version": "7.0.14",
+      "resolved": "https://registry.npmjs.org/postcss/-/postcss-7.0.14.tgz",
+      "integrity": "sha512-NsbD6XUUMZvBxtQAJuWDJeeC4QFsmWsfozWxCJPWf3M55K9iu2iMDaKqyoOdTJ1R4usBXuxlVFAIo8rZPQD4Bg==",
+      "dev": true,
+      "requires": {
+        "chalk": "^2.4.2",
+        "source-map": "^0.6.1",
+        "supports-color": "^6.1.0"
+      },
+      "dependencies": {
+        "source-map": {
+          "version": "0.6.1",
+          "resolved": "https://registry.npmjs.org/source-map/-/source-map-0.6.1.tgz",
+          "integrity": "sha512-UjgapumWlbMhkBgzT7Ykc5YXUT46F0iKu8SGXq0bcwP5dz/h0Plj6enJqjz1Zbq2l5WaqYnrVbwWOWMyF3F47g==",
+          "dev": true
+        },
+        "supports-color": {
+          "version": "6.1.0",
+          "resolved": "https://registry.npmjs.org/supports-color/-/supports-color-6.1.0.tgz",
+          "integrity": "sha512-qe1jfm1Mg7Nq/NSh6XE24gPXROEVsWHxC1LIx//XNlD9iw7YZQGjZNjYN7xGaEG6iKdA8EtNFW6R0gjnVXp+wQ==",
+          "dev": true,
+          "requires": {
+            "has-flag": "^3.0.0"
+          }
+        }
+      }
+    },
+    "postcss-modules-extract-imports": {
+      "version": "2.0.0",
+      "resolved": "https://registry.npmjs.org/postcss-modules-extract-imports/-/postcss-modules-extract-imports-2.0.0.tgz",
+      "integrity": "sha512-LaYLDNS4SG8Q5WAWqIJgdHPJrDDr/Lv775rMBFUbgjTz6j34lUznACHcdRWroPvXANP2Vj7yNK57vp9eFqzLWQ==",
+      "dev": true,
+      "requires": {
+        "postcss": "^7.0.5"
+      }
+    },
+    "postcss-modules-local-by-default": {
+      "version": "2.0.5",
+      "resolved": "https://registry.npmjs.org/postcss-modules-local-by-default/-/postcss-modules-local-by-default-2.0.5.tgz",
+      "integrity": "sha512-iFgxlCAVLno5wIJq+4hyuOmc4VjZEZxzpdeuZcBytLNWEK5Bx2oRF9PPcAz5TALbaFvrZm8sJYtJ3hV+tMSEIg==",
+      "dev": true,
+      "requires": {
+        "css-selector-tokenizer": "^0.7.0",
+        "postcss": "^7.0.6",
+        "postcss-value-parser": "^3.3.1"
+      }
+    },
+    "postcss-modules-scope": {
+      "version": "2.0.1",
+      "resolved": "https://registry.npmjs.org/postcss-modules-scope/-/postcss-modules-scope-2.0.1.tgz",
+      "integrity": "sha512-7+6k9c3/AuZ5c596LJx9n923A/j3nF3ormewYBF1RrIQvjvjXe1xE8V8A1KFyFwXbvnshT6FBZFX0k/F1igneg==",
+      "dev": true,
+      "requires": {
+        "css-selector-tokenizer": "^0.7.0",
+        "postcss": "^7.0.6"
+      }
+    },
+    "postcss-modules-values": {
+      "version": "2.0.0",
+      "resolved": "https://registry.npmjs.org/postcss-modules-values/-/postcss-modules-values-2.0.0.tgz",
+      "integrity": "sha512-Ki7JZa7ff1N3EIMlPnGTZfUMe69FFwiQPnVSXC9mnn3jozCRBYIxiZd44yJOV2AmabOo4qFf8s0dC/+lweG7+w==",
+      "dev": true,
+      "requires": {
+        "icss-replace-symbols": "^1.1.0",
+        "postcss": "^7.0.6"
+      }
+    },
+    "postcss-value-parser": {
+      "version": "3.3.1",
+      "resolved": "https://registry.npmjs.org/postcss-value-parser/-/postcss-value-parser-3.3.1.tgz",
+      "integrity": "sha512-pISE66AbVkp4fDQ7VHBwRNXzAAKJjw4Vw7nWI/+Q3vuly7SNfgYXvm6i5IgFylHGK5sP/xHAbB7N49OS4gWNyQ==",
+      "dev": true
+    },
     "prelude-ls": {
       "version": "1.1.2",
       "resolved": "https://registry.npmjs.org/prelude-ls/-/prelude-ls-1.1.2.tgz",
@@ -8030,6 +8192,12 @@
       "resolved": "https://registry.npmjs.org/redux-thunk/-/redux-thunk-2.3.0.tgz",
       "integrity": "sha512-km6dclyFnmcvxhAcrQV2AkZmPQjzPDjgVlQtR0EQjxZPyJ0BnMf3in1ryuR8A2qU0HldVRfxYXbFSKlI3N7Slw=="
     },
+    "regenerate": {
+      "version": "1.4.0",
+      "resolved": "https://registry.npmjs.org/regenerate/-/regenerate-1.4.0.tgz",
+      "integrity": "sha512-1G6jJVDWrt0rK99kBjvEtziZNCICAuvIPkSiUFIQxVP06RCVpq3dmDo2oi6ABpYaDYaTRr67BEhL8r1wgEZZKg==",
+      "dev": true
+    },
     "regenerator-runtime": {
       "version": "0.12.1",
       "resolved": "https://registry.npmjs.org/regenerator-runtime/-/regenerator-runtime-0.12.1.tgz",
@@ -8054,6 +8222,17 @@
         "safe-regex": "^1.1.0"
       }
     },
+    "regexpu-core": {
+      "version": "1.0.0",
+      "resolved": "https://registry.npmjs.org/regexpu-core/-/regexpu-core-1.0.0.tgz",
+      "integrity": "sha1-hqdj9Y7k18L2sQLkdkBQ3n7ZDGs=",
+      "dev": true,
+      "requires": {
+        "regenerate": "^1.2.1",
+        "regjsgen": "^0.2.0",
+        "regjsparser": "^0.1.4"
+      }
+    },
     "registry-auth-token": {
       "version": "3.3.2",
       "resolved": "https://registry.npmjs.org/registry-auth-token/-/registry-auth-token-3.3.2.tgz",
@@ -8073,6 +8252,29 @@
         "rc": "^1.0.1"
       }
     },
+    "regjsgen": {
+      "version": "0.2.0",
+      "resolved": "https://registry.npmjs.org/regjsgen/-/regjsgen-0.2.0.tgz",
+      "integrity": "sha1-bAFq3qxVT3WCP+N6wFuS1aTtsfc=",
+      "dev": true
+    },
+    "regjsparser": {
+      "version": "0.1.5",
+      "resolved": "https://registry.npmjs.org/regjsparser/-/regjsparser-0.1.5.tgz",
+      "integrity": "sha1-fuj4Tcb6eS0/0K4ijSS9lJ6tIFw=",
+      "dev": true,
+      "requires": {
+        "jsesc": "~0.5.0"
+      },
+      "dependencies": {
+        "jsesc": {
+          "version": "0.5.0",
+          "resolved": "https://registry.npmjs.org/jsesc/-/jsesc-0.5.0.tgz",
+          "integrity": "sha1-597mbjXW/Bb3EP6R1c9p9w8IkR0=",
+          "dev": true
+        }
+      }
+    },
     "relateurl": {
       "version": "0.2.7",
       "resolved": "https://registry.npmjs.org/relateurl/-/relateurl-0.2.7.tgz",
@@ -9059,6 +9261,29 @@
       "integrity": "sha1-PFMZQukIwml8DsNEhYwobHygpgo=",
       "dev": true
     },
+    "style-loader": {
+      "version": "0.23.1",
+      "resolved": "https://registry.npmjs.org/style-loader/-/style-loader-0.23.1.tgz",
+      "integrity": "sha512-XK+uv9kWwhZMZ1y7mysB+zoihsEj4wneFWAS5qoiLwzW0WzSqMrrsIy+a3zkQJq0ipFtBpX5W3MqyRIBF/WFGg==",
+      "dev": true,
+      "requires": {
+        "loader-utils": "^1.1.0",
+        "schema-utils": "^1.0.0"
+      },
+      "dependencies": {
+        "schema-utils": {
+          "version": "1.0.0",
+          "resolved": "https://registry.npmjs.org/schema-utils/-/schema-utils-1.0.0.tgz",
+          "integrity": "sha512-i27Mic4KovM/lnGsy8whRCHhc7VicJajAjTrYg11K9zfZXnYIt4k5F+kZkwjnrhKzLic/HLU4j11mjsz2G/75g==",
+          "dev": true,
+          "requires": {
+            "ajv": "^6.1.0",
+            "ajv-errors": "^1.0.0",
+            "ajv-keywords": "^3.1.0"
+          }
+        }
+      }
+    },
     "supports-color": {
       "version": "5.5.0",
       "resolved": "https://registry.npmjs.org/supports-color/-/supports-color-5.5.0.tgz",
diff --git a/package.json b/package.json
index aa9fda8..20d185e 100644
--- a/package.json
+++ b/package.json
@@ -13,31 +13,33 @@
   "author": "",
   "license": "ISC",
   "devDependencies": {
-    "@types/express": "^4.16.1",
     "@types/body-parser": "^1.17.0",
-    "@types/node": "~10.12.21",
+    "@types/cors": "^2.8.4",
+    "@types/express": "^4.16.1",
     "@types/jest": "^23.3.13",
+    "@types/node": "~10.12.21",
     "@types/react": "^16.7.20",
     "@types/react-dom": "^16.0.11",
     "@types/react-redux": "^7.0.0",
     "@types/redux": "^3.6.0",
-    "@types/cors": "^2.8.4",
     "@types/uuid": "^3.4.4",
     "body-parser": "^1.18.3",
     "cors": "^2.8.5",
+    "css-loader": "^2.1.0",
+    "fork-ts-checker-async-overlay-webpack-plugin": "^0.1.0",
+    "fork-ts-checker-webpack-plugin": "^0.5.2",
     "html-webpack-plugin": "^3.2.0",
     "jest": "^23.6.0",
-    "fork-ts-checker-webpack-plugin": "^0.5.2",
-    "fork-ts-checker-async-overlay-webpack-plugin": "^0.1.0",
+    "nodemon": "^1.18.9",
+    "npm-run-all": "^4.1.5",
+    "style-loader": "^0.23.1",
     "ts-jest": "^23.10.5",
     "ts-loader": "^5.3.3",
     "typescript": "^3.3.3",
+    "uuid": "^3.3.2",
     "webpack": "^4.28.4",
     "webpack-cli": "^3.2.1",
-    "webpack-dev-server": "^3.1.14",
-    "npm-run-all": "^4.1.5",
-    "nodemon": "^1.18.9",
-    "uuid": "^3.3.2"
+    "webpack-dev-server": "^3.1.14"
   },
   "dependencies": {
     "@uifabric/experiments": "^6.57.0",
diff --git a/step1-00/css-demo/css-demo.html b/step1-00/css-demo/css-demo.html
index 6aed91a..295440c 100644
--- a/step1-00/css-demo/css-demo.html
+++ b/step1-00/css-demo/css-demo.html
@@ -14,7 +14,7 @@
         </div>
         <div>
           <h2>Our Logo</h2>
-          <img src="./fabric.jpg" width="100" alt="fabric logo" />
+          <img src="../assets/fabric.jpg" width="100" alt="fabric logo" />
         </div>
         <div>
           <h2>Contact Us</h2>
diff --git a/step1-00/html-demo/html-demo.html b/step1-00/html-demo/html-demo.html
index 25f19ac..356790f 100644
--- a/step1-00/html-demo/html-demo.html
+++ b/step1-00/html-demo/html-demo.html
@@ -4,17 +4,17 @@
     <link rel="stylesheet" href="./style.css" />
 
     <style>
-      a {
-        color: #333333;
+      hr {
+        margin: 40px;
       }
     </style>
   </head>
 
   <body>
-    <h2><a href="https://developer.mozilla.org/en-US/docs/Web/HTML/Element#Document_metadata">Document Meta Data</a></h2>
+    <h2><a target="_blank" href="https://developer.mozilla.org/en-US/docs/Web/HTML/Element#Document_metadata">Document Meta Data</a></h2>
     <p>head, title, link, style</p>
 
-    <h2><a href="https://developer.mozilla.org/en-US/docs/Web/HTML/Element#Content_sectioning">Content Sections</a></h2>
+    <h2><a target="_blank" href="https://developer.mozilla.org/en-US/docs/Web/HTML/Element#Content_sectioning">Content Sections</a></h2>
 
     <section>
       <header>
@@ -59,34 +59,33 @@
       </main>
       <footer>Copyright 2019</footer>
     </section>
+    <hr />
     <section>
-      <h2><a href="https://developer.mozilla.org/en-US/docs/Web/HTML/Element#Text_content">Block Text content</a></h2>
+      <h2><a target="_blank" href="https://developer.mozilla.org/en-US/docs/Web/HTML/Element#Text_content">Block Text content</a></h2>
 
-      <h3>Blockquote</h3>
+      <h3>Div</h3>
+      <div>
+        Lorem ipsum dolor sit amet consectetur adipisicing elit. Quo et quod odio velit, hic qui autem dolores magni earum ducimus dolorem
+        modi, numquam laborum accusamus adipisci eius excepturi doloremque vero.
+      </div>
+      <div>
+        Lorem ipsum dolor sit amet consectetur adipisicing elit. Dolore voluptatum maiores vitae? Architecto amet provident labore error
+        officia accusantium reiciendis, vero perspiciatis. Incidunt numquam enim deserunt, velit earum totam veritatis.
+        <div>
+          Lorem ipsum dolor sit amet consectetur adipisicing elit. Laudantium nobis ex optio, minus in, eum ratione magnam aut distinctio,
+          aliquid libero eaque nihil provident nemo est adipisci repellendus nisi numquam?
+        </div>
+      </div>
 
-      <blockquote cite="https://www.huxley.net/bnw/four.html">
-        <p>Words can be like X-rays, if you use them properly – they'll go through anything. You read and you're pierced.</p>
-      </blockquote>
-
-      <cite>– Aldous Huxley, Brave New World</cite>
-
-      <h3>Definition List</h3>
-      <dl>
-        <dt>Beast of Bodmin</dt>
-        <dd>A large feline inhabiting Bodmin Moor.</dd>
-
-        <dt>Morgawr</dt>
-        <dd>A sea serpent.</dd>
-
-        <dt>Owlman</dt>
-        <dd>A giant owl-like creature.</dd>
-      </dl>
-
-      <h3>Figure</h3>
-      <figure>
-        <img src="../assets/fabric.jpg" alt="Fabric Logo" />
-        <figcaption>The Fabric Logo</figcaption>
-      </figure>
+      <h3>Paragraph</h3>
+      <p>
+        Lorem ipsum dolor sit amet consectetur, adipisicing elit. Officia, vero! Eum optio veniam nisi, assumenda ea velit in corrupti vel
+        eos reprehenderit beatae libero rem iusto, maiores, corporis sunt laborum.
+      </p>
+      <p>
+        Lorem ipsum dolor sit, amet consectetur adipisicing elit. Reiciendis porro consequuntur exercitationem, perspiciatis nam saepe, odit
+        enim omnis qui commodi cupiditate in eveniet. Nemo maxime ipsam recusandae consectetur voluptatum non?
+      </p>
 
       <h3>Ordered List</h3>
       <ol>
@@ -102,15 +101,6 @@
         <li>items</li>
       </ul>
 
-      <h3>Paragraph</h3>
-      <p>
-        Lorem ipsum dolor sit amet consectetur, adipisicing elit. Officia, vero! Eum optio veniam nisi, assumenda ea velit in corrupti vel
-        eos reprehenderit beatae libero rem iusto, maiores, corporis sunt laborum.
-      </p>
-      <p>
-        Lorem ipsum dolor sit, amet consectetur adipisicing elit. Reiciendis porro consequuntur exercitationem, perspiciatis nam saepe, odit
-        enim omnis qui commodi cupiditate in eveniet. Nemo maxime ipsam recusandae consectetur voluptatum non?
-      </p>
       <h3>Pre</h3>
       <pre>
         // This is a pre tag            --           It respects spacing and tabs
@@ -122,20 +112,24 @@
         &lt;/ul&gt;
       </pre>
     </section>
+    <hr />
     <section>
-      <h2><a href="https://developer.mozilla.org/en-US/docs/Web/HTML/Element#Inline_text_semantics">Inline text elements</a></h2>
+      <h2>
+        <a target="_blank" href="https://developer.mozilla.org/en-US/docs/Web/HTML/Element#Inline_text_semantics">Inline text elements</a>
+      </h2>
 
       <h3>Anchor tag, br and span</h3>
 
       <a target="_blank" href="https://example.com"> Website <span style="color: red">address</span> </a><br />
-      <a href="mailto:m.bluth@example.com">Email</a><br />
-      <a href="tel:+123456789">Phone</a><br />
+      <a target="_blank" href="mailto:m.bluth@example.com">Email</a><br />
+      <a target="_blank" href="tel:+123456789">Phone</a><br />
 
       <h3>Inline style tags</h3>
       <p><b>b tag</b> <em>em tag</em> <i>i tag</i> <sub>sub tag</sub> <sup>sup tab</sup> <code>code tag</code></p>
     </section>
+    <hr />
     <section>
-      <h2><a href="https://developer.mozilla.org/en-US/docs/Web/HTML/Element#Table_content">Table content</a></h2>
+      <h2><a target="_blank" href="https://developer.mozilla.org/en-US/docs/Web/HTML/Element#Table_content">Table content</a></h2>
 
       <table border="1">
         <thead>
@@ -155,8 +149,9 @@
         </tbody>
       </table>
     </section>
+    <hr />
     <section>
-      <h2><a href="https://developer.mozilla.org/en-US/docs/Web/HTML/Element#Forms">Forms</a></h2>
+      <h2><a target="_blank" href="https://developer.mozilla.org/en-US/docs/Web/HTML/Element#Forms">Forms</a></h2>
 
       <form action="" method="get" class="form-example">
         <div>
@@ -224,5 +219,6 @@
         </div>
       </form>
     </section>
+    <hr />
   </body>
 </html>
diff --git a/step1-00/html-demo/style.css b/step1-00/html-demo/style.css
index b1a4247..54da6e3 100644
--- a/step1-00/html-demo/style.css
+++ b/step1-00/html-demo/style.css
@@ -8,3 +8,16 @@ aside {
 form > div {
   margin-bottom: 20px;
 }
+
+h2 a {
+  color: #0078d4;
+  text-decoration: none;
+}
+
+h2 a:hover {
+  text-decoration: underline;
+}
+
+body {
+  font-family: 'Segoe UI', Tahoma, Geneva, Verdana, sans-serif;
+}
diff --git a/step1-00/index.html b/step1-00/index.html
index 7764819..8e0bfb1 100644
--- a/step1-00/index.html
+++ b/step1-00/index.html
@@ -10,6 +10,7 @@
         <li class="Tile"><a href="./html-demo/html-demo.html" class="Tile-link">HTML Demo</a></li>
         <li class="Tile"><a href="./css-demo/css-demo.html" class="Tile-link">CSS Demo</a></li>
         <li class="Tile"><a href="./css-demo/css-demo-finished.html" class="Tile-link">CSS Demo Finished</a></li>
+        <li class="Tile"><a href="./js-demo/js-demo.html" class="Tile-link">JS Demo</a></li>
       </ul>
     </div>
   </body>
diff --git a/step1-00/js-demo/js-demo.html b/step1-00/js-demo/js-demo.html
new file mode 100644
index 0000000..ce350c2
--- /dev/null
+++ b/step1-00/js-demo/js-demo.html
@@ -0,0 +1,41 @@
+<html>
+  <head> </head>
+  <body>
+    <div>
+      <h1>This is my <span>Title</span></h1>
+      <div class="tiles">
+        <div class="links">
+          <h2>Important Links</h2>
+          <a href="#">We're Awesome</a>
+          <a href="#">Learn More</a>
+          <a href="#">Hire Us</a>
+        </div>
+        <div>
+          <h2>Our Logo</h2>
+          <img src="../assets/fabric.jpg" width="100" alt="fabric logo" />
+        </div>
+        <div>
+          <h2>Contact Us</h2>
+          <div id="contact-form">
+            <label>Email</label><input class="email" type="email" />
+            <input onclick="displayMatches()" class="submit" value="Submit" type="submit" />
+          </div>
+        </div>
+      </div>
+    </div>
+  </body>
+  <script>
+    const match = 'a';
+    let matches = 0;
+
+    function displayMatches() {
+      const text = document.querySelector('.email').value;
+      for (let letter of text) {
+        if (letter === match) {
+          matches++;
+        }
+      }
+      document.querySelector('.submit').value = matches + ' matches';
+    }
+  </script>
+</html>
diff --git a/step1-04/src/App.tsx b/step1-04/src/App.tsx
index 23cb3da..84c7fd6 100644
--- a/step1-04/src/App.tsx
+++ b/step1-04/src/App.tsx
@@ -1,13 +1,13 @@
 import React from 'react';
-
+import { Counter } from './components/Counter';
 
 export class App extends React.Component {
   render() {
-
     return (
-        <div>
-         
-        </div>
+      <div>
+        <h2>My App</h2>
+        <Counter start={2} />
+      </div>
     );
   }
 }
diff --git a/step1-04/src/components/Button.css b/step1-04/src/components/Button.css
new file mode 100644
index 0000000..029cf38
--- /dev/null
+++ b/step1-04/src/components/Button.css
@@ -0,0 +1,14 @@
+.Button {
+  background: #0078d4;
+  color: white;
+  padding: 5px 10px;
+  outline: none;
+  border: none;
+}
+.Button:hover {
+  background: #005a9e;
+}
+
+.Button:active {
+  background: #004578;
+}
diff --git a/step1-04/src/components/Button.tsx b/step1-04/src/components/Button.tsx
new file mode 100644
index 0000000..f0410d2
--- /dev/null
+++ b/step1-04/src/components/Button.tsx
@@ -0,0 +1,10 @@
+import React from 'react';
+import './Button.css';
+
+export const Button = props => {
+  return (
+    <button className="Button" onClick={props.onClick}>
+      {props.children}
+    </button>
+  );
+};
diff --git a/step1-04/src/components/Counter.tsx b/step1-04/src/components/Counter.tsx
new file mode 100644
index 0000000..1357253
--- /dev/null
+++ b/step1-04/src/components/Counter.tsx
@@ -0,0 +1,25 @@
+import React from 'react';
+import { Button } from './Button';
+
+export class Counter extends React.Component<any, any> {
+  constructor(props) {
+    super(props);
+    this.state = {
+      counter: props.start
+    };
+  }
+  render() {
+    return (
+      <div>
+        <span> {this.state.counter} </span>
+        <Button
+          onClick={() => {
+            this.setState({ counter: this.state.counter + 1 });
+          }}
+        >
+          Click Me
+        </Button>
+      </div>
+    );
+  }
+}
diff --git a/webpack.config.js b/webpack.config.js
index 54cf914..f49ed99 100644
--- a/webpack.config.js
+++ b/webpack.config.js
@@ -41,6 +41,11 @@ module.exports = function() {
             }
           },
           exclude: /node_modules/
+        },
+        {
+          test: /\.css$/,
+          use: ['style-loader', 'css-loader'],
+          exclude: /node_modules/
         }
       ]
     },