diff --git a/css/styles.css b/css/styles.css
@@ -64,6 +64,79 @@ img {
   width: 0;
 }
 
+/*---------------------------*/
+/*---- Syntax Hightlight ----*/
+/*---------------------------*/
+
+/*
+ * GitHub style for Pygments syntax highlighter, for use with Jekyll
+ * Courtesy of GitHub.com
+ */
+
+.highlight pre, pre, .highlight .hll { background-color: #f8f8f8; border: 1px solid #ccc; padding: 6px 10px; border-radius: 3px; }
+.highlight .c { color: #999988; font-style: italic; }
+.highlight .err { color: #a61717; background-color: #e3d2d2; }
+.highlight .k { font-weight: bold; }
+.highlight .o { font-weight: bold; }
+.highlight .cm { color: #999988; font-style: italic; }
+.highlight .cp { color: #999999; font-weight: bold; }
+.highlight .c1 { color: #999988; font-style: italic; }
+.highlight .cs { color: #999999; font-weight: bold; font-style: italic; }
+.highlight .gd { color: #000000; background-color: #ffdddd; }
+.highlight .gd .x { color: #000000; background-color: #ffaaaa; }
+.highlight .ge { font-style: italic; }
+.highlight .gr { color: #aa0000; }
+.highlight .gh { color: #999999; }
+.highlight .gi { color: #000000; background-color: #ddffdd; }
+.highlight .gi .x { color: #000000; background-color: #aaffaa; }
+.highlight .go { color: #888888; }
+.highlight .gp { color: #555555; }
+.highlight .gs { font-weight: bold; }
+.highlight .gu { color: #800080; font-weight: bold; }
+.highlight .gt { color: #aa0000; }
+.highlight .kc { font-weight: bold; }
+.highlight .kd { font-weight: bold; }
+.highlight .kn { font-weight: bold; }
+.highlight .kp { font-weight: bold; }
+.highlight .kr { font-weight: bold; }
+.highlight .kt { color: #445588; font-weight: bold; }
+.highlight .m { color: #009999; }
+.highlight .s { color: #dd1144; }
+.highlight .n { color: #333333; }
+.highlight .na { color: teal; }
+.highlight .nb { color: #0086b3; }
+.highlight .nc { color: #445588; font-weight: bold; }
+.highlight .no { color: teal; }
+.highlight .ni { color: purple; }
+.highlight .ne { color: #990000; font-weight: bold; }
+.highlight .nf { color: #990000; font-weight: bold; }
+.highlight .nn { color: #555555; }
+.highlight .nt { color: navy; }
+.highlight .nv { color: teal; }
+.highlight .ow { font-weight: bold; }
+.highlight .w { color: #bbbbbb; }
+.highlight .mf { color: #009999; }
+.highlight .mh { color: #009999; }
+.highlight .mi { color: #009999; }
+.highlight .mo { color: #009999; }
+.highlight .sb { color: #dd1144; }
+.highlight .sc { color: #dd1144; }
+.highlight .sd { color: #dd1144; }
+.highlight .s2 { color: #dd1144; }
+.highlight .se { color: #dd1144; }
+.highlight .sh { color: #dd1144; }
+.highlight .si { color: #dd1144; }
+.highlight .sx { color: #dd1144; }
+.highlight .sr { color: #009926; }
+.highlight .s1 { color: #dd1144; }
+.highlight .ss { color: #990073; }
+.highlight .bp { color: #999999; }
+.highlight .vc { color: teal; }
+.highlight .vg { color: teal; }
+.highlight .vi { color: teal; }
+.highlight .il { color: #009999; }
+.highlight .gc { color: #999; background-color: #EAF2F5; }
+
 /*---------------------------*/
 /*-------- Site styles ------*/
 /*---------------------------*/
@@ -80,7 +153,7 @@ html {
 body {
     display: flex;
     flex-direction: column;
-    font-family: 'Roboto', Helvetica, serif;
+    font-family: 'Helvetica Neue', Helvetica, serif;
     font-weight: normal;
     margin: 0;
     min-height: 100%;
@@ -226,28 +299,61 @@ a.site-nav-list-link:focus {
     }
 }
 
-.site-tag {
-    color: #fff;
-    margin: 0 0 1.5rem 0;
-    padding: 0;
-}
-
 /*--------------------------------------------*/
 /*---------- Home page ----------------*/
 /*--------------------------------------------*/
 
 .main {
-    background-color: #403B6E;
+    /*background-color: #403B6E;*/
+
 }
 
-.main-content {
+.wrapper {
     max-width: 1040px;
     margin: 0 auto;
     padding: 1em;
+    display: flex;
 }
 
 @media (min-width: 65em) {
     .main-content {
         padding: 0;
     }
 }
+
+.sidebar {
+    flex: 0 0 240px;
+}
+
+.sidebar-list {
+    padding-left: 0;
+}
+
+.sidebar-item ~ .sidebar-item{
+    padding-top: 1rem;
+}
+
+table {
+  padding: 0; }
+  table tr {
+    border-top: 1px solid #cccccc;
+    background-color: white;
+    margin: 0;
+    padding: 0; }
+    table tr:nth-child(2n) {
+      background-color: #f8f8f8; }
+    table tr th {
+      font-weight: bold;
+      border: 1px solid #cccccc;
+      text-align: left;
+      margin: 0;
+      padding: 6px 13px; }
+    table tr td {
+      border: 1px solid #cccccc;
+      text-align: left;
+      margin: 0;
+      padding: 6px 13px; }
+    table tr th :first-child, table tr td :first-child {
+      margin-top: 0; }
+    table tr th :last-child, table tr td :last-child {
+      margin-bottom: 0; }
diff --git a/main/QUnit.module.md b/main/QUnit.module.md
@@ -1,6 +1,7 @@
 ---
 layout: default
 title: QUnit.module
+description: Group related tests under a single label.
 categories:
   - main
 ---
@@ -11,18 +12,18 @@ Group related tests under a single label.
 
 | parameter | description |
 |-----------|-------------|
-| name (string) | Label for this group of tests. |
-| hooks (object) | Callbacks to run during test execution. |
-| nested (function) | A callback used for nested modules. |
+| `name` (string) | Label for this group of tests. |
+| `hooks` (object) | Callbacks to run during test execution. |
+| `nested` (function) | A callback used for nested modules. |
 
 #### hooks properties: `{ before, beforeEach, afterEach, after }`
 
 | name | description |
 |-----------|-------------|
-| before (function) | Runs before the first test. |
-| beforeEach (function) | Runs before each test. |
-| afterEach (function) | Runs after each test. |
-| after (function) | Runs after the last test. |
+| `before` (function) | Runs before the first test. |
+| `beforeEach` (function) | Runs before each test. |
+| `afterEach` (function) | Runs after each test. |
+| `after` (function) | Runs after the last test. |
 
 > Note: If additional tests are defined after the module's queue has emptied, it will not run the `after` hook again.
 

diff --git a/main/QUnit.only.md b/main/QUnit.only.md
@@ -1,6 +1,7 @@
 ---
 layout: default
 title: QUnit.only
+description: Adds a test to exclusively run, preventing all other tests from running.
 categories:
   - main
 ---

diff --git a/main/QUnit.skip.md b/main/QUnit.skip.md
@@ -1,6 +1,7 @@
 ---
 layout: default
 title: QUnit.skip
+description: Adds a test like object to be skipped
 categories:
   - main
 ---

diff --git a/main/QUnit.start.md b/main/QUnit.start.md
@@ -1,6 +1,7 @@
 ---
 layout: default
 title: QUnit.start
+description: QUnit.start() is used to start an async test set
 categories:
   - main
   - async

diff --git a/main/QUnit.test.md b/main/QUnit.test.md
@@ -1,6 +1,7 @@
 ---
 layout: default
 title: QUnit.test
+description: Add a test to run.
 categories:
   - main
   - async

diff --git a/main/QUnit.todo.md b/main/QUnit.todo.md
@@ -1,6 +1,7 @@
 ---
 layout: default
 title: QUnit.todo
+description: Adds a test which expects at least one failing assertion during its run.
 categories:
   - main
 ---

diff --git a/main/index.md b/main/index.md
@@ -0,0 +1,7 @@
+---
+layout: page
+title: Main assertions
+category: main
+categories:
+  - topics
+---