diff --git a/cms/static/coffee/main.coffee b/cms/static/coffee/main.coffee
index 06b8701366..66f375a7cc 100644
--- a/cms/static/coffee/main.coffee
+++ b/cms/static/coffee/main.coffee
@@ -37,6 +37,8 @@ $ ->
         $(this).parent().parent().hide()
         return false
 
+    # $('html').keypress ->
+    #   $('.wip').css('visibility', 'visible')
 
     setHeight = ->
         windowHeight = $(this).height()
@@ -63,6 +65,9 @@ $ ->
             $('section.edit-pane').show()
             return false
 
+        $('a.module-edit').click ->
+          $('body.content .cal').css('height', contentHeight)
+
     $(document).ready(setHeight)
     $(window).bind('resize', setHeight)
 
diff --git a/cms/static/sass/_base.scss b/cms/static/sass/_base.scss
index d961f461fd..afda14800f 100644
--- a/cms/static/sass/_base.scss
+++ b/cms/static/sass/_base.scss
@@ -2,65 +2,14 @@ $fg-column: 70px;
 $fg-gutter: 26px;
 $fg-max-columns: 12;
 $body-font-family: "Lucida Grande", "Lucida Sans Unicode", "Lucida Sans", Geneva, Verdana, sans-serif;
+$body-font-size: 14px;
+$body-line-height: 20px;
 
+// Base html styles
 html {
   height: 100%;
 }
 
-body {
-  @include clearfix();
-  height: 100%;
-  font: 14px $body-font-family;
-
-  > section {
-    display: table;
-    width: 100%;
-  }
-
-  > header {
-    background: #000;
-    color: #fff;
-    display: block;
-    float: none;
-    padding: 6px 20px;
-    width: 100%;
-    @include box-sizing(border-box);
-
-    nav {
-      @include clearfix;
-
-      h2 {
-        font-size: 14px;
-        text-transform: uppercase;
-        float: left;
-      }
-
-      ul {
-        float: left;
-
-        &.user-nav {
-          float: right;
-        }
-
-        li {
-          @include inline-block();
-          margin-left: 15px;
-        }
-      }
-    }
-  }
-
-  &.content {
-    section.main-content {
-      border-left: 2px solid #000;
-      @include box-sizing(border-box);
-      width: flex-grid(9);
-      float: left;
-      @include box-shadow( -2px 0 3px #ddd );
-    }
-  }
-}
-
 a {
   text-decoration: none;
   color: #888;
@@ -77,6 +26,13 @@ input[type="submit"], .button {
   padding: 6px;
 }
 
+textarea {
+  @include box-sizing(border-box);
+  display: block;
+  width: 100%;
+}
+
+// Extends
 .new-module {
   position: relative;
 
@@ -112,6 +68,16 @@ input[type="submit"], .button {
   float: right;
 }
 
-textarea {
-  overflow: auto;
+.wip {
+  outline: 1px solid #f00 !important;
+  position: relative;
+
+  &:after {
+   content: "WIP";
+   font-size: 8px;
+   padding: 2px;
+   background: #f00;
+   color: #fff;
+   @include position(absolute, 0px 0px 0 0);
+  }
 }
diff --git a/cms/static/sass/_calendar.scss b/cms/static/sass/_calendar.scss
index fa10c65950..71f12f2425 100644
--- a/cms/static/sass/_calendar.scss
+++ b/cms/static/sass/_calendar.scss
@@ -49,7 +49,6 @@ section.cal {
   ol {
     list-style: none;
     @include clearfix;
-    @include box-sizing(border-box);
     border-left: 1px solid #333;
     border-top: 1px solid #333;
     width: 100%;
diff --git a/cms/static/sass/_layout.scss b/cms/static/sass/_layout.scss
new file mode 100644
index 0000000000..98f49940fd
--- /dev/null
+++ b/cms/static/sass/_layout.scss
@@ -0,0 +1,53 @@
+body {
+  @include clearfix();
+  height: 100%;
+  font: 14px $body-font-family;
+
+  > section {
+    display: table;
+    width: 100%;
+  }
+
+  > header {
+    background: #000;
+    color: #fff;
+    display: block;
+    float: none;
+    padding: 6px 20px;
+    width: 100%;
+    @include box-sizing(border-box);
+
+    nav {
+      @include clearfix;
+
+      h2 {
+        font-size: 14px;
+        text-transform: uppercase;
+        float: left;
+      }
+
+      ul {
+        float: left;
+
+        &.user-nav {
+          float: right;
+        }
+
+        li {
+          @include inline-block();
+          margin-left: 15px;
+        }
+      }
+    }
+  }
+
+  &.content {
+    section.main-content {
+      border-left: 2px solid #000;
+      @include box-sizing(border-box);
+      width: flex-grid(9);
+      float: left;
+      @include box-shadow( -2px 0 3px #ddd );
+    }
+  }
+}
diff --git a/cms/static/sass/_module-header.scss b/cms/static/sass/_module-header.scss
deleted file mode 100644
index 03acbecd9b..0000000000
--- a/cms/static/sass/_module-header.scss
+++ /dev/null
@@ -1,125 +0,0 @@
-section.video-new, 
-section.video-edit, 
-section.problem-new, 
-section.problem-edit,
-section.html-edit {
-  background: #fff;
-  border: 1px solid #333;
-  border-right: 0;
-
-  > header {
-    background: #eee;
-    @include clearfix;
-    padding: 6px;
-    border-bottom: 1px solid #333;
-    -webkit-font-smoothing: antialiased;
-
-    h2 {
-      float: left;
-      font-size: 14px;
-    }
-
-    a {
-      color: #fff;
-
-      &.save-update {
-        float: right;
-      }
-
-      &.cancel {
-        float: left;
-      }
-    }
-
-  }
-
-  > section {
-    padding: 20px;
-
-    > header {
-      h1 {
-        font-size: 24px;
-        margin: 12px 0;
-      }
-
-      section {
-        &.status-settings {
-          ul {
-            list-style: none;
-            @include border-radius(2px);
-            border: 1px solid #999;
-            @include inline-block();
-
-            li {
-              @include inline-block();
-              border-right: 1px solid #999;
-              padding: 6px;
-
-              &:last-child {
-                border-right: 0;
-              }
-
-              &.current {
-                background: #eee;
-              }
-            }
-          }
-
-          a.settings {
-            @include inline-block();
-            margin: 0 20px;
-            border: 1px solid #999;
-            padding: 6px;
-          }
-
-          select {
-            float: right;
-          }
-        }
-
-        &.meta {
-          background: #eee;
-          padding: 10px;
-          margin: 20px 0;
-          @include clearfix();
-
-          div {
-            float: left;
-            margin-right: 20px;
-
-            h2 {
-              font-size: 14px;
-              @include inline-block();
-            }
-
-            p {
-              @include inline-block();
-            }
-          }
-        }
-      }
-    }
-
-    section.notes {
-      margin-top: 20px;
-      padding: 6px;
-      background: #eee;
-      border: 1px solid #ccc;
-
-      textarea {
-        @include box-sizing(border-box);
-        display: block;
-        width: 100%;
-      }
-
-      h2 {
-        font-size: 14px;
-        margin-bottom: 6px;
-      }
-
-      input[type="submit"]{
-         margin-top: 10px;
-      }
-    }
-  }
-}
diff --git a/cms/static/sass/_problem.scss b/cms/static/sass/_problem.scss
deleted file mode 100644
index 39df062cde..0000000000
--- a/cms/static/sass/_problem.scss
+++ /dev/null
@@ -1,71 +0,0 @@
-section#unit-wrapper {
-  > header {
-    border-bottom: 2px solid #333;
-    @include clearfix();
-    padding: 6px 20px;
-
-    h1 {
-      font-size: 18px;
-      text-transform: uppercase;
-      letter-spacing: 1px;
-      float: left;
-    }
-
-    p {
-      float: right;
-    }
-  }
-  > section {
-    padding: 20px;
-    a.save-update {
-      @extend .button;
-      @include inline-block();
-      margin-top: 20px;
-    }
-  }
-}
-
-section.problem-new,
-section.problem-edit,
-section.html-edit {
-  textarea {
-    @include box-sizing(border-box);
-    display: block;
-    width: 100%;
-  }
-
-
-  div.preview {
-    background: #eee;
-    @include box-sizing(border-box);
-    min-height: 40px;
-    padding: 10px;
-    width: 100%;
-    margin-top: 10px;
-
-    h1 {
-      font-size: 24px;
-      margin-bottom: 1em;
-    }
-
-    h2 {
-      font-size: 20px;
-      margin-bottom: 1em;
-    }
-
-    h3 {
-      font-size: 18;
-      margin-bottom: 1em;
-    }
-
-    ul {
-      padding-left: 20px;
-      margin-bottom: 1em;
-    }
-
-    p {
-      margin-bottom: 1em;
-    }
-  }
-}
-
diff --git a/cms/static/sass/_section.scss b/cms/static/sass/_section.scss
new file mode 100644
index 0000000000..2048607565
--- /dev/null
+++ b/cms/static/sass/_section.scss
@@ -0,0 +1,182 @@
+section#unit-wrapper {
+  section.filters {
+    @include clearfix;
+    margin-bottom: 10px;
+    background: #efefef;
+    border: 1px solid #ddd;
+
+    ul {
+      @include clearfix();
+      list-style: none;
+      padding: 6px;
+
+      li {
+        @include inline-block();
+
+        &.advanced {
+          float: right;
+        }
+      }
+    }
+  }
+
+  div.content {
+    display: table;
+    border: 1px solid;
+    width: 100%;
+
+    section {
+      header {
+        background: #eee;
+        padding: 6px;
+        border-bottom: 1px solid #ccc;
+        @include clearfix;
+
+        h2 {
+          text-transform: uppercase;
+          letter-spacing: 1px;
+          font-size: 12px;
+          float: left;
+        }
+      }
+
+      &.modules {
+        @include box-sizing(border-box);
+        display: table-cell;
+        width: flex-grid(6, 9);
+        border-right: 1px solid #333;
+
+        &.empty {
+          text-align: center;
+          vertical-align: middle;
+
+          a {
+            @extend .button;
+            @include inline-block();
+            margin-top: 10px;
+          }
+        }
+
+        ol {
+          list-style: none;
+          border-bottom: 1px solid #333;
+
+          li {
+            border-bottom: 1px solid #333;
+
+            &:last-child{
+              border-bottom: 0;
+            }
+
+            a {
+              color: #000;
+            }
+
+            ol {
+              list-style: none;
+
+              li {
+                padding: 6px;
+
+                &:hover {
+                  a.draggable {
+                    opacity: 1;
+                  }
+                }
+
+                a.draggable {
+                  float: right;
+                  opacity: .5;
+                }
+
+                &.group {
+                  padding: 0;
+
+                  header {
+                    padding: 6px;
+                    background: none;
+
+                    h3 {
+                      font-size: 14px;
+                    }
+                  }
+
+
+                  ol {
+                    border-left: 4px solid #999;
+                    border-bottom: 0;
+
+                    li {
+                      &:last-child {
+                        border-bottom: 0;
+                      }
+                    }
+                  }
+                }
+              }
+            }
+          }
+        }
+      }
+
+      &.scratch-pad {
+        @include box-sizing(border-box);
+        display: table-cell;
+        width: flex-grid(3, 9) + flex-gutter(9);
+        vertical-align: top;
+
+        ol {
+          list-style: none;
+          border-bottom: 1px solid #999;
+
+          li {
+            border-bottom: 1px solid #999;
+            background: #f9f9f9;
+
+            &:last-child {
+              border-bottom: 0;
+            }
+
+            ul {
+              list-style: none;
+
+              li {
+                padding: 6px;
+
+                &:last-child {
+                  border-bottom: 0;
+                }
+
+                &:hover {
+                  a.draggable {
+                    opacity: 1;
+                  }
+                }
+
+                &.empty {
+                  padding: 12px;
+
+                  a {
+                    @extend .button;
+                    display: block;
+                    text-align: center;
+                  }
+                }
+
+                a.draggable {
+                  float: right;
+                  opacity: .3;
+                }
+
+                a {
+                  color: #000;
+                }
+              }
+            }
+
+          }
+        }
+      }
+    }
+  }
+}
diff --git a/cms/static/sass/_unit.scss b/cms/static/sass/_unit.scss
new file mode 100644
index 0000000000..f1e47d36be
--- /dev/null
+++ b/cms/static/sass/_unit.scss
@@ -0,0 +1,199 @@
+section#unit-wrapper {
+  > header {
+    border-bottom: 2px solid #333;
+    @include clearfix();
+    padding: 6px 20px;
+
+    section {
+      float: left;
+
+      h1 {
+        font-size: 16px;
+        text-transform: uppercase;
+        letter-spacing: 1px;
+        @include inline-block();
+      }
+
+      p {
+        @include inline-block();
+        margin-left: 10px;
+        color: #999;
+        font-size: 12px;
+        font-style: italic;
+      }
+    }
+
+    div {
+      float: right;
+      color: #666;
+
+      a {
+       &.cancel {
+         margin-right: 20px;
+         font-style: italic;
+         font-size: 12px;
+       }
+      }
+    }
+  }
+
+  > section {
+    padding: 20px;
+
+    section.meta {
+      section {
+        &.status-settings {
+          float: left;
+          margin-bottom: 10px;
+
+          ul {
+            list-style: none;
+            @include border-radius(2px);
+            border: 1px solid #999;
+            @include inline-block();
+
+            li {
+              @include inline-block();
+              border-right: 1px solid #999;
+              padding: 6px;
+
+              &:last-child {
+                border-right: 0;
+              }
+
+              &.current {
+                background: #eee;
+              }
+            }
+          }
+
+          a.settings {
+            @include inline-block();
+            margin: 0 20px;
+            border: 1px solid #999;
+            padding: 6px;
+          }
+
+          select {
+            float: right;
+          }
+        }
+
+        &.author {
+          float: right;
+
+          dl {
+            dt {
+              font-weight: bold;
+            }
+
+            dd, dt {
+              @include inline-block();
+            }
+          }
+        }
+
+        &.tags {
+          background: #eee;
+          padding: 10px;
+          margin: 0 0 20px;
+          @include clearfix();
+          clear: both;
+
+          div {
+            float: left;
+            margin-right: 20px;
+
+            h2 {
+              font-size: 14px;
+              @include inline-block();
+            }
+
+            p {
+              @include inline-block();
+            }
+          }
+        }
+      }
+    }
+
+    //general styles for main content
+    div.preview {
+      background: #eee;
+      @include box-sizing(border-box);
+      min-height: 40px;
+      padding: 10px;
+      width: 100%;
+      margin-top: 10px;
+
+      h1 {
+        font-size: 24px;
+        margin-bottom: 1em;
+      }
+
+      h2 {
+        font-size: 20px;
+        margin-bottom: 1em;
+      }
+
+      h3 {
+        font-size: 18;
+        margin-bottom: 1em;
+      }
+
+      ul {
+        padding-left: 20px;
+        margin-bottom: 1em;
+      }
+
+      p {
+        margin-bottom: 1em;
+      }
+    }
+
+    //notes
+    section.notes {
+      margin-top: 20px;
+      padding: 20px 0 0;
+      border-top: 1px solid #ccc;
+
+      h2 {
+        font-size: 14px;
+        margin-bottom: 6px;
+      }
+
+      form {
+        margin-bottom: 20px;
+
+        input[type="submit"]{
+          margin-top: 10px;
+        }
+      }
+
+      ul {
+        list-style: none;
+
+        li {
+          margin-bottom: 20px;
+
+          p {
+            margin-bottom: 10px;
+
+            &.author {
+              font-style: italic;
+              color: #999;
+            }
+          }
+        }
+      }
+    }
+
+    div.actions {
+      a.save-update {
+        @extend .button;
+        @include inline-block();
+        margin-top: 20px;
+      }
+    }
+  }
+}
diff --git a/cms/static/sass/_video.scss b/cms/static/sass/_video.scss
deleted file mode 100644
index b68176e2db..0000000000
--- a/cms/static/sass/_video.scss
+++ /dev/null
@@ -1,33 +0,0 @@
-section.video-new, section.video-edit {
-  > section {
-
-    section.upload {
-      padding: 6px;
-      margin-bottom: 10px;
-      border: 1px solid #ddd;
-
-      a.upload-button {
-        @extend .button;
-        @include inline-block();
-      }
-    }
-
-    section.in-use {
-      h2 {
-        font-size: 14px;
-      }
-
-      div {
-        background: #eee;
-        text-align: center;
-        padding: 6px;
-      }
-    }
-
-    a.save-update {
-      @extend .button;
-      @include inline-block();
-      margin-top: 20px;
-    }
-  }
-}
diff --git a/cms/static/sass/_week.scss b/cms/static/sass/_week.scss
deleted file mode 100644
index b638a36f5c..0000000000
--- a/cms/static/sass/_week.scss
+++ /dev/null
@@ -1,256 +0,0 @@
-section.week-edit,
-section.week-new,
-section.sequence-edit {
-
-  > header {
-    border-bottom: 2px solid #333;
-    @include clearfix();
-
-    div {
-      @include clearfix();
-      padding: 6px 20px;
-
-      h1 {
-        font-size: 18px;
-        text-transform: uppercase;
-        letter-spacing: 1px;
-        float: left;
-      }
-
-      p {
-        float: right;
-      }
-
-      &.week {
-        background: #eee;
-        font-size: 12px;
-        border-bottom: 1px solid #ccc;
-
-        h2 {
-          font-size: 12px;
-          @include inline-block();
-          margin-right: 20px;
-        }
-
-        ul {
-          list-style: none;
-          @include inline-block();
-
-          li {
-            @include inline-block();
-            margin-right: 10px;
-
-            p {
-              float: none;
-            }
-          }
-        }
-      }
-    }
-
-    section.goals {
-      background: #eee;
-      padding: 6px 20px;
-      border-top: 1px solid #ccc;
-
-      ul {
-        list-style: none;
-        color: #999;
-
-        li {
-          margin-bottom: 6px;
-
-          &:last-child {
-            margin-bottom: 0;
-          }
-        }
-      }
-    }
-  }
-
-  > section.content {
-    @include box-sizing(border-box);
-    padding: 20px;
-
-    section.filters {
-      @include clearfix;
-      margin-bottom: 10px;
-      background: #efefef;
-      border: 1px solid #ddd;
-
-      ul {
-        @include clearfix();
-        list-style: none;
-        padding: 6px;
-
-        li {
-          @include inline-block();
-
-          &.advanced {
-            float: right;
-          }
-        }
-      }
-    }
-
-    > div {
-      display: table;
-      border: 1px solid;
-      width: 100%;
-
-      section {
-        header {
-          background: #eee;
-          padding: 6px;
-          border-bottom: 1px solid #ccc;
-          @include clearfix;
-
-          h2 {
-            text-transform: uppercase;
-            letter-spacing: 1px;
-            font-size: 12px;
-            float: left;
-          }
-        }
-
-        &.modules {
-          @include box-sizing(border-box);
-          display: table-cell;
-          width: flex-grid(6, 9);
-          border-right: 1px solid #333;
-
-          &.empty {
-            text-align: center;
-            vertical-align: middle;
-
-            a {
-              @extend .button;
-              @include inline-block();
-              margin-top: 10px;
-            }
-          }
-
-          ol {
-            list-style: none;
-            border-bottom: 1px solid #333;
-
-            li {
-              border-bottom: 1px solid #333;
-
-              &:last-child{
-                border-bottom: 0;
-              }
-
-              a {
-                color: #000;
-              }
-
-              ol {
-                list-style: none;
-
-                li {
-                  padding: 6px;
-
-                  &:hover {
-                    a.draggable {
-                      opacity: 1;
-                    }
-                  }
-
-                  a.draggable {
-                    float: right;
-                    opacity: .5;
-                  }
-
-                  &.group {
-                    padding: 0;
-
-                    header {
-                      padding: 6px;
-                      background: none;
-
-                      h3 {
-                        font-size: 14px;
-                      }
-                    }
-
-
-                    ol {
-                    border-left: 4px solid #999;
-                    border-bottom: 0;
-
-                      li {
-                        &:last-child {
-                          border-bottom: 0;
-                        }
-                      }
-                    }
-                  }
-                }
-              }
-            }
-          }
-        }
-
-        &.scratch-pad {
-          @include box-sizing(border-box);
-          display: table-cell;
-          width: flex-grid(3, 9) + flex-gutter(9);
-          vertical-align: top;
-
-          ol {
-            list-style: none;
-            border-bottom: 1px solid #999;
-
-            li {
-              border-bottom: 1px solid #999;
-              background: #f9f9f9;
-
-              &:last-child {
-                border-bottom: 0;
-              }
-
-              ul {
-                list-style: none;
-
-                li {
-                  padding: 6px;
-
-                  &:last-child {
-                    border-bottom: 0;
-                  }
-
-                  &:hover {
-                    a.draggable {
-                      opacity: 1;
-                    }
-                  }
-
-                  &.empty {
-                    padding: 12px;
-
-                    a {
-                      @extend .button;
-                      display: block;
-                      text-align: center;
-                    }
-                  }
-
-                  a.draggable {
-                    float: right;
-                    opacity: .3;
-                  }
-
-                  a {
-                    color: #000;
-                  }
-                }
-              }
-
-            }
-          }
-        }
-      }
-    }
-  }
-}
diff --git a/cms/static/sass/base-style.scss b/cms/static/sass/base-style.scss
index 133e1bda1b..3a6c6e0cea 100644
--- a/cms/static/sass/base-style.scss
+++ b/cms/static/sass/base-style.scss
@@ -1,6 +1,6 @@
 @import 'bourbon/bourbon';
 @import 'reset';
 
-@import 'base';
+@import 'base', 'layout';
 @import 'calendar';
-@import 'week', 'video', 'problem', 'module-header';
+@import 'section', 'unit';
diff --git a/cms/templates/unit.html b/cms/templates/unit.html
index c9a3d82b5a..8cc75cd3bf 100644
--- a/cms/templates/unit.html
+++ b/cms/templates/unit.html
@@ -1,19 +1,17 @@
 <section id="unit-wrapper" class="${type}">
   <header>
-    <h1 class="editable">${name}</h1>
-    <p>Unit type: ${type}</p>
-    <!-- <div class="actions"> -->
-    <!--   <a href="#" class="cancel">Cancel</a> -->
-    <!--   <a href="#" class="save-update">Save &amp; Update</a> -->
-    <!-- </div> -->
+    <section>
+      <h1 class="editable">${name}</h1>
+      <p>${type}</p>
+    </section>
+
+    <div class="actions">
+      <a href="#" class="cancel">Cancel</a>
+      <a href="" class="save-update">Save &amp; Update</a>
+    </div>
   </header>
+
   <section>
     ${contents}
   </section>
-  <section>
-    <div class="actions">
-      <a href="" class="save-update">Save &amp; Update</a>
-      <a href="#" class="cancel">Cancel</a>
-    </div>
-  </section>
 </section>
diff --git a/cms/templates/widgets/html-edit.html b/cms/templates/widgets/html-edit.html
index cbd8a7f3df..7eec86215a 100644
--- a/cms/templates/widgets/html-edit.html
+++ b/cms/templates/widgets/html-edit.html
@@ -1,4 +1,45 @@
 <section class="html-edit">
+  <section class="meta wip">
+
+    <section class="status-settings">
+      <ul>
+        <li><a href="#" class="current">Scrap</a></li>
+        <li><a href="#">Draft</a></li>
+        <li><a href="#">Proofed</a></li>
+        <li><a href="#">Published</a></li>
+      </ul>
+      <a href="#" class="settings">Settings</a>
+    </section>
+
+    <section class="author">
+      <dl>
+        <dt>Last modified:</dt>
+        <dd>mm/dd/yy</dd>
+        <dt>By</dt>
+        <dd>Anant Agarwal</dd>
+      </dl>
+    </section>
+
+    <section class="tags">
+      <div>
+        <h2>Tags:</h2>
+        <p class="editable">Click to edit</p>
+      </div>
+
+      <div>
+        <h2>Goal</h2>
+        <p class="editable">Click to edit</p>
+      </div>
+    </section>
+  </section>
+
   <textarea name="" class="edit-box" rows="8" cols="40">${module.definition['data']['text']}</textarea>
   <div class="preview">${module.definition['data']['text']}</div>
+
+  <div class="actions wip">
+    <a href="" class="save-update">Save &amp; Update</a>
+    <a href="#" class="cancel">Cancel</a>
+  </div>
+
+  <%include file="notes.html"/>
 </section>
diff --git a/cms/templates/widgets/module-dropdown.html b/cms/templates/widgets/module-dropdown.html
index 7c6e1e068c..6edb142e40 100644
--- a/cms/templates/widgets/module-dropdown.html
+++ b/cms/templates/widgets/module-dropdown.html
@@ -1,4 +1,4 @@
-<li class="create-module">
+<li class="create-module wip">
   <a href="#" class="new-module">
     + Add new module
   </a>
diff --git a/cms/templates/widgets/navigation.html b/cms/templates/widgets/navigation.html
index 3fbcda675c..cbdc7660ce 100644
--- a/cms/templates/widgets/navigation.html
+++ b/cms/templates/widgets/navigation.html
@@ -1,5 +1,5 @@
 <section class="cal">
-  <header>
+  <header class="wip">
     <h2>Filter content:</h2>
     <ul>
       <li>
diff --git a/cms/templates/widgets/notes.html b/cms/templates/widgets/notes.html
new file mode 100644
index 0000000000..920e88cbcd
--- /dev/null
+++ b/cms/templates/widgets/notes.html
@@ -0,0 +1,21 @@
+<section class="notes wip">
+  <h2>Notes</h2>
+
+  <ul>
+    <li>
+      <p>Sed ut perspiciatis unde omnis iste natus error sit voluptatem accusantium doloremque laudantium, totam rem aperiam, eaque ipsa quae ab illo inventore veritatis et quasi architecto beatae vitae dicta sunt explicabo. Nemo enim ipsam voluptatem quia voluptas sit aspernatur aut odit aut fugit, sed quia consequuntur magni dolores eos qui ratione voluptatem sequi nesciunt.</p>
+      <p class="author">Anant Agarwal</p>
+    </li>
+    <li>
+      <p>Sed ut perspiciatis unde omnis iste natus error sit voluptatem accusantium doloremque laudantium, totam rem aperiam, eaque ipsa quae ab illo inventore veritatis et quasi architecto beatae vitae dicta sunt explicabo. Nemo enim ipsam voluptatem quia voluptas sit aspernatur aut odit aut fugit, sed quia consequuntur magni dolores eos qui ratione voluptatem sequi nesciunt.</p>
+      <p class="author">Anant Agarwal</p>
+    </li>
+  </ul>
+
+  <form>
+    <h2>Add a note</h2>
+    <textarea name="" id= rows="8" cols="40"></textarea>
+    <input type="submit" name="" id="" value="post" />
+  </form>
+</section>
+
diff --git a/cms/templates/widgets/problem-edit.html b/cms/templates/widgets/problem-edit.html
index 991326c987..a2da078927 100644
--- a/cms/templates/widgets/problem-edit.html
+++ b/cms/templates/widgets/problem-edit.html
@@ -1,73 +1,48 @@
 <section class="problem-edit">
-  <header>
-    <a href="#" class="cancel">Cancel</a>
-    <a href="#" class="save-update">Save &amp; Update</a>
-  </header>
-
-  <section>
-    <header>
-      <h1 class="editable">${module.name}</h1>
-      <section class="author">
-        <div>
-          <h2>Last modified:</h2>
-          <p>mm/dd/yy</p>
-        </div>
-
-        <div>
-          <h2>By</h2>
-          <p>Anant Agarwal</p>
-        </div>
-      </section>
-
-      <section class="status-settings">
-        <ul>
-          <li><a href="#" class="current">Scrap</a></li>
-          <li><a href="#">Draft</a></li>
-          <li><a href="#">Proofed</a></li>
-          <li><a href="#">Published</a></li>
-        </ul>
-        <a href="#" class="settings">Settings</a>
-
-        <select name="" id="">
-          <option>Global</option>
-        </select>
-      </section>
-      <section class="meta">
-        <div>
-          <h2>Tags:</h2>
-          <p class="editable">Click to edit</p>
-        </div>
-
-        <div>
-          <h2>Goal</h2>
-          <p class="editable">Click to edit</p>
-        </div>
-      </section>
-    </header>
-
-    <section>
-      <textarea name="" id= rows="8" cols="40">Sed ut perspiciatis unde omnis iste natus error sit voluptatem accusantium doloremque laudantium, totam rem aperiam, eaque ipsa quae ab illo inventore veritatis et quasi architecto beatae vitae dicta sunt explicabo. Nemo enim ipsam voluptatem quia voluptas sit aspernatur aut odit aut fugit, sed quia consequuntur magni dolores eos qui ratione voluptatem sequi nesciunt.</textarea>
-      <div class="preview">
-        Sed ut perspiciatis unde omnis iste natus error sit voluptatem accusantium doloremque laudantium, totam rem aperiam, eaque ipsa quae ab illo inventore veritatis et quasi architecto beatae vitae dicta sunt explicabo. Nemo enim ipsam voluptatem quia voluptas sit aspernatur aut odit aut fugit, sed quia consequuntur magni dolores eos qui ratione voluptatem sequi nesciunt.
-      </div>
+  <section class="meta">
+    <section class="status-settings">
+      <ul>
+        <li><a href="#" class="current">Scrap</a></li>
+        <li><a href="#">Draft</a></li>
+        <li><a href="#">Proofed</a></li>
+        <li><a href="#">Published</a></li>
+      </ul>
+      <a href="#" class="settings">Settings</a>
     </section>
 
-    <section class="notes">
-      <h2>Add notes</h2>
-      <textarea name="" id= rows="8" cols="40"></textarea>
-      <input type="submit" name="" id="" value="post" />
+    <section class="author">
+      <dl>
+        <dt>Last modified:</dt>
+        <dd>mm/dd/yy</dd>
+        <dt>By</dt>
+        <dd>Anant Agarwal</dd>
+      </dl>
+    </section>
 
-      <ul>
-        <li>
-          <p>Sed ut perspiciatis unde omnis iste natus error sit voluptatem accusantium doloremque laudantium, totam rem aperiam, eaque ipsa quae ab illo inventore veritatis et quasi architecto beatae vitae dicta sunt explicabo. Nemo enim ipsam voluptatem quia voluptas sit aspernatur aut odit aut fugit, sed quia consequuntur magni dolores eos qui ratione voluptatem sequi nesciunt.</p>
-          <p class="author">Anant Agarwal</p>
-        </li>
-        <li>
-          <p>Sed ut perspiciatis unde omnis iste natus error sit voluptatem accusantium doloremque laudantium, totam rem aperiam, eaque ipsa quae ab illo inventore veritatis et quasi architecto beatae vitae dicta sunt explicabo. Nemo enim ipsam voluptatem quia voluptas sit aspernatur aut odit aut fugit, sed quia consequuntur magni dolores eos qui ratione voluptatem sequi nesciunt.</p>
-          <p class="author">Anant Agarwal</p>
-        </li>
-      </ul>    </section>
+    <section class="tags">
+      <div>
+        <h2>Tags:</h2>
+        <p class="editable">Click to edit</p>
+      </div>
 
-    <a href="" class="save-update">Save &amp; Update</a>
+      <div>
+        <h2>Goal</h2>
+        <p class="editable">Click to edit</p>
+      </div>
+    </section>
   </section>
+
+  <section>
+    <textarea name="" id= rows="8" cols="40">Sed ut perspiciatis unde omnis iste natus error sit voluptatem accusantium doloremque laudantium, totam rem aperiam, eaque ipsa quae ab illo inventore veritatis et quasi architecto beatae vitae dicta sunt explicabo. Nemo enim ipsam voluptatem quia voluptas sit aspernatur aut odit aut fugit, sed quia consequuntur magni dolores eos qui ratione voluptatem sequi nesciunt.</textarea>
+    <div class="preview">
+      Sed ut perspiciatis unde omnis iste natus error sit voluptatem accusantium doloremque laudantium, totam rem aperiam, eaque ipsa quae ab illo inventore veritatis et quasi architecto beatae vitae dicta sunt explicabo. Nemo enim ipsam voluptatem quia voluptas sit aspernatur aut odit aut fugit, sed quia consequuntur magni dolores eos qui ratione voluptatem sequi nesciunt.
+    </div>
+
+    <div class="actions">
+      <a href="#" class="cancel">Cancel</a>
+      <a href="" class="save-update">Save &amp; Update</a>
+    </div>
+  </section>
+
+  <%include file="notes.html"/>
 </section>
diff --git a/cms/templates/widgets/sequence-edit.html b/cms/templates/widgets/sequence-edit.html
index 219145aefb..abeec9209d 100644
--- a/cms/templates/widgets/sequence-edit.html
+++ b/cms/templates/widgets/sequence-edit.html
@@ -1,119 +1,106 @@
 <section class="sequence-edit">
-  <header>
-    <div>
-      <h1 class="editable">${module.name}</h1>
-      <p><strong>Module Type:</strong>${module.type}</p>
-    </div>
-  </header>
+  <section class="filters">
+    <ul>
+      <li>
+        <label for="">Sort by</label>
+        <select>
+          <option value="">Recently Modified</option>
+        </select>
+      </li>
 
-  <section class="content">
-    <section class="filters">
-      <ul>
+      <li>
+        <label for="">Display</label>
+        <select>
+          <option value="">All content</option>
+        </select>
+      </li>
+      <li>
+        <select>
+          <option value="">Internal Only</option>
+        </select>
+      </li>
+
+      <li class="advanced">
+        <a href="#">Advanced filters</a>
+      </li>
+
+      <li>
+        <input type="search" name="" id="" value="" />
+      </li>
+    </ul>
+  </section>
+
+  <div class="content">
+    <section class="modules">
+      <ol>
         <li>
-          <label for="">Sort by</label>
-          <select>
-            <option value="">Recently Modified</option>
-          </select>
+          <ol>
+            % for child in module.get_children():
+            <li>
+              <a href="#" class="module-edit" id="${child.url}">${child.name}</a>
+              <a href="#" class="draggable">handle</a>
+            </li>
+            %endfor
+          </ol>
         </li>
 
-        <li>
-          <label for="">Display</label>
-          <select>
-            <option value="">All content</option>
-          </select>
-        </li>
-        <li>
-          <select>
-            <option value="">Internal Only</option>
-          </select>
-        </li>
-
-        <li class="advanced">
-          <a href="#">Advanced filters</a>
-        </li>
-
-        <li>
-          <input type="search" name="" id="" value="" />
-        </li>
-      </ul>
+      </ol>
     </section>
 
-    <div>
-      <section class="modules">
-        <ol>
-          <li>
-            <ol>
-              % for child in module.get_children():
-              <li>
-                <a href="#" class="module-edit" id="${child.url}">${child.name}</a>
-                <a href="#" class="draggable">handle</a>
-              </li>
-              %endfor
-            </ol>
-          </li>
-
-          <!-- <li class="new-module"> -->
-          <!--   <%include file="new-module.html"/> -->
-          <!-- </li> -->
-        </ol>
-      </section>
-
-      <section class="scratch-pad">
-        <ol>
-          <li>
-            <header>
-              <h2>Section Scratch</h2>
-            </header>
-            <ul>
-              <li>
-                <a href="#" class="problem-edit">Problem title 11</a>
-                <a href="#" class="draggable">handle</a>
-              </li>
-              <li>
-                <a href="#" class="problem-edit">Problem title 13 </a>
+    <section class="scratch-pad">
+      <ol>
+        <li class="new-module">
+          <%include file="new-module.html"/>
+        </li>
+        <li>
+          <header>
+            <h2>Section Scratch</h2>
+          </header>
+          <ul>
+            <li>
+              <a href="#" class="problem-edit">Problem title 11</a>
               <a href="#" class="draggable">handle</a>
-              </li>
-              <li>
-                <a href="#" class="problem-edit"> Problem title 14</a>
+            </li>
+            <li>
+              <a href="#" class="problem-edit">Problem title 13 </a>
               <a href="#" class="draggable">handle</a>
-              </li>
-              <li>
-                <a href="" class="video-edit">Video 3</a>
-                <a href="#" class="draggable">handle</a>
-              </li>
-            </ul>
-          </li>
-          <li>
-            <header>
-              <h2>Course Scratch</h2>
-            </header>
+            </li>
+            <li>
+              <a href="#" class="problem-edit"> Problem title 14</a>
+              <a href="#" class="draggable">handle</a>
+            </li>
+            <li>
+              <a href="" class="video-edit">Video 3</a>
+              <a href="#" class="draggable">handle</a>
+            </li>
+          </ul>
+        </li>
+        <li>
+          <header>
+            <h2>Course Scratch</h2>
+          </header>
 
-            <ul>
-              <li>
-                <a href="#" class="problem-edit">Problem title 11</a>
-                <a href="#" class="draggable">handle</a>
-              </li>
-              <li>
-                <a href="#" class="problem-edit">Problem title 13 </a>
-                <a href="#" class="draggable">handle</a>
-              </li>
-              <li>
-                <a href="#" class="problem-edit"> Problem title 14</a>
-                <a href="#" class="draggable">handle</a>
-              </li>
-              <li>
-                <a href="" class="video-edit">Video 3</a>
-                <a href="#" class="draggable">handle</a>
-              </li>
-            </ul>
-          </li>
-
-          <!-- <li class="new-module"> -->
-          <!--   <%include file="new-module.html"/> -->
-          <!-- </li> -->
-        </ol>
-      </section>
-    </div>
-  </section>
+          <ul>
+            <li>
+              <a href="#" class="problem-edit">Problem title 11</a>
+              <a href="#" class="draggable">handle</a>
+            </li>
+            <li>
+              <a href="#" class="problem-edit">Problem title 13 </a>
+              <a href="#" class="draggable">handle</a>
+            </li>
+            <li>
+              <a href="#" class="problem-edit"> Problem title 14</a>
+              <a href="#" class="draggable">handle</a>
+            </li>
+            <li>
+              <a href="" class="video-edit">Video 3</a>
+              <a href="#" class="draggable">handle</a>
+            </li>
+          </ul>
+        </li>
+      </ol>
+    </section>
+  </div>
 </section>