diff --git a/courseware.html b/courseware.html
index b77806f3e1..cd6f08f387 100644
--- a/courseware.html
+++ b/courseware.html
@@ -1,37 +1,23 @@
 <%inherit file="main.html" />
 
+<%block name="headextra">
 <!-- TODO: http://docs.jquery.com/Plugins/Validation -->
 <script type="text/javascript">
   $(function() {
       ${init}
-
-      // Show and hide sidebar
-      var acc_hidden=false;
-      $('#hide_acc').click(function() {
-        if(acc_hidden) {
-          $('#accordion').show();
-          $('#acc_td').attr("width","320");
-          $('#hide_acc').html("&lt;<br>&lt;<br>&lt;");
-          acc_hidden=false;
-        } else {
-          $('#accordion').hide();
-          $('#acc_td').attr("width","0");
-          $('#hide_acc').html("&gt;<br>&gt;<br>&gt;");
-          acc_hidden=true;
-        }
-      });
     });
 </script>
+</%block>
 
 <%include file="navigation.html" args="active_page='courseware'" />
 
 <section class="main-content">
   <div class="course-wrapper">
     <section class="course-index">
-      <div id="open_close_accordion">
+      <header id="open_close_accordion">
         <h2>Courseware Index</h2>
         <a href="#">close</a>
-      </div>
+      </header>
 
       <div id="accordion">
         ${accordion}
diff --git a/main.html b/main.html
index 4652fa7046..48424122af 100644
--- a/main.html
+++ b/main.html
@@ -117,5 +117,7 @@ $(function() {
     });
 </script>
 
+<%block name="js_extra"/>
+
 </body>
 </html>
diff --git a/sass/_info.scss b/sass/_info.scss
index 9f0762cd59..9e67b5c657 100644
--- a/sass/_info.scss
+++ b/sass/_info.scss
@@ -43,8 +43,10 @@ div.info-wrapper {
     border-left: 1px solid #d3d3d3;
 
     h1 {
-      padding: 0 lh();
+      padding: lh(.5) lh();
       font-size: 18px;
+      margin: 0 ;
+      @extend .bottom-border;
     }
 
     ol {
diff --git a/sass/_profile.scss b/sass/_profile.scss
index 8a08759294..00b25ceb12 100644
--- a/sass/_profile.scss
+++ b/sass/_profile.scss
@@ -9,8 +9,10 @@ div.profile-wrapper {
     border-right: 0;
 
     h1 {
-      padding:0 lh();
+      padding: lh(.5) lh();
       font-size: 18px;
+      margin: 0 ;
+      @extend .bottom-border;
     }
 
     ul {
diff --git a/sass/_textbook.scss b/sass/_textbook.scss
index ea49f20d96..8943eb1064 100644
--- a/sass/_textbook.scss
+++ b/sass/_textbook.scss
@@ -1,43 +1,47 @@
 div.book-wrapper {
   @extend .table-wrapper;
 
-  ul#booknav {
+  section.book-sidebar {
     @extend .sidebar;
     @include box-sizing(border-box);
+    @extend .tran;
 
-    a {
-      color: #000;
+    ul#booknav {
 
-      &:hover {
-        color: #666;
-      }
-    }
-
-    li {
-      background: none;
-      padding-left: 30px;
-
-      div.hitarea {
-        margin-left: -22px;
-        background-image: url('/static/images/treeview-default.gif');
-        position: relative;
-        top: 4px;
+      a {
+        color: #000;
 
         &:hover {
-          opacity: 0.6;
-          filter: alpha(opacity=60);
+          color: #666;
         }
       }
 
-      ul {
+      li {
         background: none;
-      }
-    }
+        padding-left: 30px;
 
-    > li {
-      border-bottom: 1px solid #d3d3d3;
-      @include box-shadow(0 1px 0 #eee);
-      padding: 7px 7px 7px 30px;
+        div.hitarea {
+          margin-left: -22px;
+          background-image: url('/static/images/treeview-default.gif');
+          position: relative;
+          top: 4px;
+
+          &:hover {
+            opacity: 0.6;
+            filter: alpha(opacity=60);
+          }
+        }
+
+        ul {
+          background: none;
+        }
+      }
+
+      > li {
+        border-bottom: 1px solid #d3d3d3;
+        @include box-shadow(0 1px 0 #eee);
+        padding: 7px 7px 7px 30px;
+      }
     }
   }
 
@@ -92,4 +96,36 @@ div.book-wrapper {
       }
     }
   }
+
+  &.closed {
+    section.book-sidebar {
+      width: flex-grid(.6);
+
+      header#open_close_accordion {
+        padding: 0;
+
+        a {
+          background-image: url('/static/images/slide-right-icon.png');
+        }
+
+        h2 {
+          visibility: hidden;
+          width: 10px;
+          padding: 0;
+        }
+      }
+
+      ul#booknav {
+        visibility: hidden;
+        width: 10px;
+        padding: 0;
+        overflow: hidden;
+        max-height: 100px;
+      }
+    }
+
+    section.course-content {
+      width: flex-grid(11.5) + flex-gutter();
+    }
+  }
 }
diff --git a/sass/base/_extends.scss b/sass/base/_extends.scss
index c482b947e6..2469315630 100644
--- a/sass/base/_extends.scss
+++ b/sass/base/_extends.scss
@@ -10,8 +10,8 @@
   margin: 0 auto;
   max-width: $fg-max-width;
   min-width: $fg-min-width;
-  width: flex-grid(12);
   text-align: left;
+  width: flex-grid(12);
 
   div.table-wrapper {
     display: table;
@@ -20,24 +20,24 @@
 }
 
 h1.top-header {
-  margin: (-(lh())) (-(lh())) lh();
-  padding: lh();
   background: #f3f3f3;
   border-bottom: 1px solid #e3e3e3;
+  margin: (-(lh())) (-(lh())) lh();
+  padding: lh();
 }
 
 .button {
-  @include box-shadow(inset 0 1px 0 lighten(#888, 10%), 0 0 3px #ccc);
-  @include linear-gradient(lighten(#888, 5%), darken(#888, 5%));
-  @include border-radius(3px);
   border: 1px solid darken(#888, 10%);
-  padding: 4px 8px;
+  @include border-radius(3px);
+  @include box-shadow(inset 0 1px 0 lighten(#888, 10%), 0 0 3px #ccc);
   color: #fff;
-  font: bold $body-font-size $body-font-family;
   cursor: pointer;
-  -webkit-font-smoothing: antialiased;
-  text-shadow: none;
+  font: bold $body-font-size $body-font-family;
+  @include linear-gradient(lighten(#888, 5%), darken(#888, 5%));
+  padding: 4px 8px;
   text-decoration: none;
+  text-shadow: none;
+  -webkit-font-smoothing: antialiased;
 
   &:hover, &:focus {
     @include box-shadow(inset 0 1px 0 lighten(#888, 20%), 0 0 3px #ccc);
@@ -47,8 +47,8 @@ h1.top-header {
 }
 
 .content {
-  @include box-sizing(border-box);
   @include box-shadow(inset 0 0 2px 3px #f3f3f3);
+  @include box-sizing(border-box);
   display: table-cell;
   padding: lh();
   vertical-align: top;
@@ -56,39 +56,51 @@ h1.top-header {
 }
 
 .sidebar {
+  background: #e3e3e3;
+  @include border-radius(4px 0 0 4px);
+  border-right: 1px solid #d3d3d3;
   @include box-shadow( inset 0 0 0 1px #f6f6f6);
   @include box-sizing(border-box);
-  @include border-radius(4px 0 0 4px);
-  background: #e3e3e3;
-  border-right: 1px solid #d3d3d3;
   display: table-cell;
   font-family: $body-font-family;
+  position: relative;
   text-shadow: 0 1px 0 #f1f1f1;
   vertical-align: top;
   width: flex-grid(3);
-  position: relative;
+
+  h1, h2 {
+   font-size: 18px;
+   font-weight: 800;
+   letter-spacing: 0;
+   text-transform: none;
+  }
+
+  .bottom-border {
+    @include box-shadow(0 1px 0 #eee);
+    border-bottom: 1px solid #d3d3d3;
+  }
 
   h3 {
-    @include box-shadow(0 1px 0 #eee);
-    background: none;
     border: none;
     border-bottom: 1px solid #d3d3d3;
+    @extend .bottom-border;
+    background: none;
     color: #000;
     font-weight: normal;
     margin: 0;
     overflow: hidden;
 
     a {
-      @include transition();
       color: lighten($text-color, 10%);
       display: block;
       font-size: $body-font-size;
       padding: 7px 7px 7px 30px;
       text-decoration: none;
+      @include transition();
 
       &:hover {
-        @include box-shadow(0 1px 0 #fff);
         background: #efefef;
+        @include box-shadow(0 1px 0 #fff);
       }
     }
 
@@ -97,10 +109,10 @@ h1.top-header {
     }
 
     &.active {
-      @include box-shadow(none);
       background: none;
       border: 0;
       border-bottom: 1px solid #bbb;
+      @include box-shadow(none);
       color: #000;
       font-weight: bold;
 
@@ -110,19 +122,48 @@ h1.top-header {
     }
   }
 
+  header#open_close_accordion {
+    border-bottom: 1px solid #d3d3d3;
+    @include box-shadow(0 1px 0 #eee);
+    padding: lh(.5) lh();
+    position: relative;
+
+    h2 {
+      padding-right: 20px;
+      margin: 0;
+    }
+
+    a {
+      background: #eee url('/static/images/slide-left-icon.png') center center no-repeat;
+      border: 1px solid #D3D3D3;
+      @include border-radius(3px 0 0 3px);
+      height: 16px;
+      padding: 8px;
+      position: absolute;
+      right: -1px;
+      text-indent: -9999px;
+      top: 6px;
+      width: 16px;
+
+      &:hover {
+        background-color: white;
+      }
+    }
+  }
+
   a.button {
     text-decoration: none;
   }
 }
 
 .topbar {
+  @extend .clearfix;
   background: #F6EFD4;
   border-bottom: 1px solid darken(#F6EFD4, 10%);
-  margin: (-$body-line-height) (-$body-line-height) $body-line-height;
-  font-size: 12px;
-  text-shadow: 0 1px 0 #fff;
   @include box-shadow(inset 0 1px 0 #fff, inset 1px 0 0 #fff);
-  @extend .clearfix;
+  font-size: 12px;
+  margin: (-$body-line-height) (-$body-line-height) $body-line-height;
+  text-shadow: 0 1px 0 #fff;
 
   a {
     color: darken(#F6EFD4, 80%);
@@ -133,12 +174,12 @@ h1.top-header {
     }
 
     &.block-link {
-      @include box-shadow(inset 1px 0 0 lighten(#f6efd4, 5%));
       background: darken(#F6EFD4, 5%);
       border-left: 1px solid darken(#f6efd4, 20%);
+      @include box-shadow(inset 1px 0 0 lighten(#f6efd4, 5%));
+      display: block;
       padding: lh(.75);
       text-transform: uppercase;
-      display: block;
 
       &:hover {
         background: none;
@@ -146,3 +187,7 @@ h1.top-header {
     }
   }
 }
+
+.tran {
+  @include transition( all, .2s, $ease-in-out-quad);
+}
diff --git a/sass/courseware/_courseware.scss b/sass/courseware/_courseware.scss
index 9d7ab8123a..13d58a3870 100644
--- a/sass/courseware/_courseware.scss
+++ b/sass/courseware/_courseware.scss
@@ -5,10 +5,6 @@ div.course-wrapper {
     list-style: none;
   }
 
-  .tran {
-    @include transition( all, .2s, $ease-in-out-quad);
-  }
-
   section.course-content {
     @extend .content;
 
@@ -160,7 +156,7 @@ div.course-wrapper {
     section.course-index {
       width: flex-grid(.6);
 
-      div#open_close_accordion {
+      header#open_close_accordion {
         padding: 0;
 
         a {
diff --git a/sass/courseware/_sidebar.scss b/sass/courseware/_sidebar.scss
index 3f937433f2..98659f12e0 100644
--- a/sass/courseware/_sidebar.scss
+++ b/sass/courseware/_sidebar.scss
@@ -2,34 +2,6 @@ section.course-index {
   @extend .sidebar;
   @extend .tran;
 
-  div#open_close_accordion {
-    @include box-shadow(0 1px 0 #eee);
-    border-bottom: 1px solid #d3d3d3;
-    padding: 0 lh();
-    position: relative;
-
-    h2 {
-      padding-right: 20px;
-    }
-
-    a {
-      width: 16px;
-      text-indent: -9999px;
-      height: 16px;
-      position: absolute;
-      padding: 8px;
-      top: -12px;
-      right: -1px;
-      border: 1px solid #D3D3D3;
-      background: #eee url('/static/images/slide-left-icon.png') center center no-repeat;
-      @include border-radius(3px 0 0 3px);
-
-      &:hover {
-        background-color: white;
-      }
-    }
-  }
-
   div#accordion {
 
     h3 {
diff --git a/sass/discussion/_profile.scss b/sass/discussion/_profile.scss
index 394107a57a..3ff1194bdd 100644
--- a/sass/discussion/_profile.scss
+++ b/sass/discussion/_profile.scss
@@ -3,15 +3,19 @@ body.user-profile-page {
     // @extend .sidebar;
     header {
       @extend .clearfix;
+      border-bottom: 1px solid #d3d3d3;
+      @include box-shadow(0 1px 0 #eee);
+      padding: 0 lh();
+      margin: 0 (-(lh())) lh();
+
       section {
         float: left;
         width: flex-grid(2, 3);
         margin-right: flex-gutter(3);
 
-      h1 {
-        @extend h2;
-        margin-top: 0;
-      }
+        h1 {
+          margin-top: 0;
+        }
       }
 
       p.karma {
diff --git a/sass/discussion/_sidebar.scss b/sass/discussion/_sidebar.scss
index 341fe7ee91..37810749a2 100644
--- a/sass/discussion/_sidebar.scss
+++ b/sass/discussion/_sidebar.scss
@@ -1,13 +1,17 @@
-
 div.discussion-wrapper aside {
   @extend .sidebar;
-  @include box-shadow(inset 1px 0 0 #f6f6f6);
-  @include border-radius(0 4px 4px 0);
   border-left: 1px solid #d3d3d3;
+  @include border-radius(0 4px 4px 0);
   border-right: 1px solid #f6f6f6;
+  @include box-shadow(inset 1px 0 0 #f6f6f6);
   padding: lh();
   width: flex-grid(3);
 
+  h1 {
+    @extend .bottom-border;
+    margin: (-(lh())) (-(lh())) 0;
+    padding: lh(.5) lh();
+  }
 
   h2 {
     color: #4D4D4D;
@@ -27,17 +31,28 @@ div.discussion-wrapper aside {
   }
 
   div.box {
-    @include box-shadow(0 1px 0 #eee);
-    border-bottom: 1px solid #d3d3d3;
     display: block;
-    padding-bottom: 20px;
-    overflow: hidden;
+    margin: lh(.5) 0;
 
     &:last-child {
       @include box-shadow(none);
       border: 0;
     }
 
+    h2 {
+      text-transform: uppercase;
+      font-weight: bold;
+      font-size: 14px;
+      letter-spacing: 1px;
+
+      &:not(.first) {
+        @include box-shadow(inset 0 1px 0 #eee);
+        border-top: 1px solid #d3d3d3;
+        margin: 0 (-(lh())) 0;
+        padding: lh(.5) lh();
+      }
+    }
+
     &.contributors {
 
       a {
@@ -70,11 +85,8 @@ div.discussion-wrapper aside {
     }
   }
 
-  #displayTagFilterControl {
-    margin-top: 10px;
-  }
-
   div.search-box {
+    margin-top: lh(.5);
     input {
       @include box-sizing(border-box);
       display: inline;
@@ -118,6 +130,34 @@ div.discussion-wrapper aside {
     }
   }
 
+  div#tagSelector {
+    h2 {
+      @include box-shadow(inset 0 1px 0 #eee);
+      border-top: 1px solid #d3d3d3;
+      margin: 0 (-(lh())) 0;
+      padding: lh(.5) lh();
+      text-transform: uppercase;
+      font-weight: bold;
+      font-size: 14px;
+      letter-spacing: 1px;
+    }
+
+    ul {
+      margin: 0;
+    }
+
+    div.inputs {
+      margin-bottom: lh();
+    }
+
+    div#displayTagFilterControl {
+      p.choice {
+        @include inline-block();
+        margin-right: lh(.5);
+      }
+    }
+  }
+
   // Question view sopecific
 
   div.follow-buttons {
@@ -136,11 +176,10 @@ div.discussion-wrapper aside {
   div.question-stats {
     ul {
       color: #777;
+      list-style: none;
 
       li {
-        @include box-shadow(0 1px 0 #eee);
-        border-bottom: 1px solid #d3d3d3;
-        padding: 7px 0;
+        padding: 7px 0 0;
 
         &:last-child {
           @include box-shadow(none);
diff --git a/sass/layout/_layout.scss b/sass/layout/_layout.scss
index 584e1e1fa2..d0240b951f 100644
--- a/sass/layout/_layout.scss
+++ b/sass/layout/_layout.scss
@@ -11,13 +11,13 @@ html {
     section.main-content {
       @extend .clearfix;
       @extend .wrapper;
-      @include box-sizing(border-box);
-      overflow: hidden;
       background: #fff;
+      border: 1px solid #bbb;
       border-bottom: 1px solid #bbb;
+      @include box-shadow(0 0 4px #dfdfdf);
+      @include box-sizing(border-box);
       margin-top: 3px;
-        @include box-shadow(0 0 4px #dfdfdf);
-        border: 1px solid #bbb;
+      overflow: hidden;
 
       @media screen and (min-width: 1400px) {
         @include border-radius(4px);
diff --git a/sass/wiki/_sidebar.scss b/sass/wiki/_sidebar.scss
index 513b3c2556..61575d811d 100644
--- a/sass/wiki/_sidebar.scss
+++ b/sass/wiki/_sidebar.scss
@@ -2,6 +2,13 @@ div#wiki_panel {
   @extend .sidebar;
   overflow: auto;
 
+  h2 {
+    padding: lh(.5) lh();
+    font-size: 18px;
+    margin: 0 ;
+    @extend .bottom-border;
+  }
+
   input[type="button"] {
     @extend h3;
     @include transition();
diff --git a/simplewiki_base.html b/simplewiki_base.html
index 0f4e70cb2c..90d5506e8b 100644
--- a/simplewiki_base.html
+++ b/simplewiki_base.html
@@ -77,6 +77,7 @@
   <div class="wiki-wrapper">
     <%block name="wiki_panel">
     <div id="wiki_panel">
+    <h2>Course Wiki</h2>
       <%
           if (wiki_article is not UNDEFINED):
           	baseURL = reverse("wiki_view", args=[wiki_article.get_url()])
diff --git a/staticbook.html b/staticbook.html
index fe3116025c..dcde36559c 100644
--- a/staticbook.html
+++ b/staticbook.html
@@ -1,4 +1,6 @@
 <%inherit file="main.html" />
+
+<%block name="js_extra">
 <script>
 var page=${ page };
 
@@ -32,18 +34,35 @@ function next_page() {
   goto_page(newpage);
   log_event("book", {"type":"nextpage","new":page});
 }
+
+$("#open_close_accordion a").click(function(){
+  if ($(".book-wrapper").hasClass("closed")){
+    $(".book-wrapper").removeClass("closed");
+  } else {
+    $(".book-wrapper").addClass("closed");
+  }
+});
+
 </script>
+</%block>
 
 <%include file="navigation.html" args="active_page='book'" />
 
 <section class="main-content">
   <div class="book-wrapper">
-    <ul id="booknav" class="treeview-booknav">
-      <%include file="book_toc.html" />
-    </ul>
+
+    <section class="book-sidebar">
+      <header id="open_close_accordion">
+        <h2>Table of Contents</h2>
+        <a href="#">close</a>
+      </header>
+
+      <ul id="booknav" class="treeview-booknav">
+        <%include file="book_toc.html" />
+      </ul>
+    </section>
 
     <section class="book">
-
       <section class="page">
         <nav>
           <ul>