diff --git a/docs/docs/api_docs/python_api.md b/docs/docs/api_docs/python_api.md
index ca10d19..cc8c0fd 100644
--- a/docs/docs/api_docs/python_api.md
+++ b/docs/docs/api_docs/python_api.md
@@ -3,16 +3,22 @@
 The Python API is a light wrapper of the C API. It creates an object that has [all the C functions](c_api/functions.md):
 
     from brpy import init_brpy
+
     # br_loc is /usr/local/lib by default,
     # you may change this by passing a different path to the shared objects
     br = init_brpy(br_loc='/path/to/libopenbr')
     br.br_initialize_default()
+
     img = open('catpic.jpg','rb').read()
+
     br.br_set_property('algorithm','MyCatFaceDetectionModel')
     br.br_set_property('enrollAll','true')
+
     tmpl = br.br_load_img(img, len(img))
     catfaces = br.br_enroll_template(tmpl)
+
     print('This pic has %i cats in it!' % br.br_num_templates(catfaces))
+
     br.br_free_template(tmpl)
     br.br_free_template_list(catfaces)
     br.br_finalize()
diff --git a/docs/docs/index.md b/docs/docs/index.md
index 6fe46bb..7119061 100644
--- a/docs/docs/index.md
+++ b/docs/docs/index.md
@@ -13,7 +13,7 @@ Please read [our paper](http://openbiometrics.org/publications/klontz2013open.pd
 
 ---
 
-<figure id="abstraction">
+<figure id="abstraction" style="display:block; margin: 0 auto;">
   <img src="img/abstraction.svg">
   <figcaption>The two principal software artifacts are the shared library 'openbr' and command line application 'br'.</figcaption>
 </figure>
diff --git a/docs/themes/materialize/base.html b/docs/themes/materialize/base.html
index 066cd74..cd68266 100644
--- a/docs/themes/materialize/base.html
+++ b/docs/themes/materialize/base.html
@@ -50,20 +50,22 @@
             </nav>
         </div>
 
-        <ul id="slide-out" class="side-nav fixed">
-            <li class="logo" style="height: 120px;">
-                <a id="logo-container" href="http://openbiometrics.org/" class="brand-logo" style="width: 285px; height: 120px; padding-left: 85px; padding-top: 10px;">
-                    <img src="{{ base_url }}/img/openbr.png" style="width: 100px; height: 100px;">
-                </a>
-            </li>
-            <hr style="margin: 0px;">
+        <div class="container">
+            <ul id="slide-out" class="side-nav fixed">
+                <li class="logo" style="height: 120px;">
+                    <a id="logo-container" href="http://openbiometrics.org/" class="brand-logo" style="width: 285px; height: 120px; padding-left: 85px; padding-top: 10px;">
+                        <img src="{{ base_url }}/img/openbr.png" style="width: 100px; height: 100px;">
+                    </a>
+                </li>
+                <hr style="margin: 0px;">
 
-            {% for nav_item in nav %}
-                {% include "nav.html" %}
-            {% endfor %}
-        </ul>
+                {% for nav_item in nav %}
+                    {% include "nav.html" %}
+                {% endfor %}
+            </ul>
+        </div>
     </header>
-    
+
     <main>
         <div class="container">
             <div class="row">
@@ -73,15 +75,9 @@
                     </div>
 
                     <div class="col m3 l2">
-                        <div class="toc-wrapper" style="position: fixed;">
-                            <span class="card-title">Table of Contents</span>
-                            <div class="divider"></div>
-                            <ul class="section table-of-contents">
-                                {% for toc_item in toc %}
-                                    <li class="no-padding"><a href="{{ toc_item.url }}">{{ toc_item.title }}</a></li>
-                                {% endfor %}
-                            </ul>
-                        </div>
+                        {% if toc.items %}
+                            {% include "toc.html" %}
+                        {% endif %}
                     </div>
                 {% endblock %}
             </div>
diff --git a/docs/themes/materialize/css/materialize.css b/docs/themes/materialize/css/materialize.css
index 5ba8eac..371606b 100644
--- a/docs/themes/materialize/css/materialize.css
+++ b/docs/themes/materialize/css/materialize.css
@@ -2036,7 +2036,7 @@ ul {
 blockquote {
   margin: 20px 0;
   padding-left: 1.5rem;
-  border-left: 5px solid #EF9A9A; }
+  border-left: 5px solid #37474f; }
 
 i {
   line-height: inherit; }
@@ -5926,15 +5926,15 @@ a.waves-effect .waves-ripple {
 .side-nav .collapsible-header {
   background-color: transparent;
   border: none;
-  line-height: inherit;
-  height: inherit;
+  /*line-height: inherit;
+  height: inherit;*/
   margin: 0 1rem; }
   .side-nav .collapsible-header i {
     line-height: inherit; }
 .side-nav .collapsible-body {
   border: 0;
   background-color: #FFF; }
-  .side-nav .collapsible-body li a {
+  .side-nav .collapsible-body li  a {
     margin: 0 1rem 0 2rem; }
 
 .collapsible.popout {
diff --git a/docs/themes/materialize/js/theme.js b/docs/themes/materialize/js/theme.js
index 5af4eb5..25a9dad 100644
--- a/docs/themes/materialize/js/theme.js
+++ b/docs/themes/materialize/js/theme.js
@@ -1,6 +1,14 @@
+$(document).ready(function(){
+    $('.toc-wrapper').pushpin({ top: $('nav').height() });
+
+    $('.scrollspy').scrollSpy();
+    $('.button-collapse').sideNav({'edge': 'left'});
+})
+
 $('.button-collapse').sideNav({
       menuWidth: 300, // Default is 240
       edge: 'right', // Choose the horizontal origin
       closeOnClick: true // Closes side-nav on <a> clicks, useful for Angular/Meteor
     }
   );
+$('.collapsible').collapsible();
diff --git a/docs/themes/materialize/nav.html b/docs/themes/materialize/nav.html
index 4a651c0..545a27c 100644
--- a/docs/themes/materialize/nav.html
+++ b/docs/themes/materialize/nav.html
@@ -1,7 +1,7 @@
 {% if nav_item.children %}
     <li class="no-padding {% if nav_item.active %}active{% endif %}">
-        <ul class="collapsible collapsible-accordion">
-            <li class="{% if nav_item.active %}active{% endif %}">
+        <ul class="collapsible {% if nav_item.active %}active{% endif %}">
+            <li class="bold {% if nav_item.active %}active{% endif %}">
                 <a class="collapsible-header waves-effect waves-teal">{{ nav_item.title }}</a>
                 <div class="collapsible-body">
                     <ul>
@@ -15,6 +15,6 @@
     </li>
 {% else %}
     <li class="{% if nav_item.active %}active{% endif %}">
-        <a href="{{ nav_item.url }}">{{ nav_item.title }}</a>
+        <a class="waves-effect waves-teal" href="{{ nav_item.url }}">{{ nav_item.title }}</a>
     </li>
 {% endif %}
diff --git a/docs/themes/materialize/toc.html b/docs/themes/materialize/toc.html
index 08a1e38..6abc31a 100644
--- a/docs/themes/materialize/toc.html
+++ b/docs/themes/materialize/toc.html
@@ -1,6 +1,9 @@
-<ul>
-    <li><span>Table of Contents</span></li>
-    {% for toc_item in toc %}
-        <li><a href="{{ toc_item.url }}">{{ toc_item.title }}</a></li>
-    {% endfor %}
-</ul>
+<div class="toc-wrapper" style="position: fixed; overflow: scroll; height: 70%; width: 100%;">
+    <span class="card-title">Table of Contents</span>
+    <div class="divider" style="width: 125px;"></div>
+    <ul class="section table-of-contents">
+        {% for toc_item in toc %}
+            <li class="no-padding"><a href="{{ toc_item.url }}"><span>{{ toc_item.title }}</span></a></li>
+        {% endfor %}
+    </ul>
+</div>