diff --git a/lms/static/images/logo.png b/lms/static/images/logo.png
index b5b510224a..b9e4199c85 100644
Binary files a/lms/static/images/logo.png and b/lms/static/images/logo.png differ
diff --git a/lms/static/images/logo_bw.png b/lms/static/images/logo_bw.png
new file mode 100644
index 0000000000..6ce9c460db
Binary files /dev/null and b/lms/static/images/logo_bw.png differ
diff --git a/lms/static/js/my_courses_dropdown.js b/lms/static/js/my_courses_dropdown.js
index 9c65631174..afd0f21686 100644
--- a/lms/static/js/my_courses_dropdown.js
+++ b/lms/static/js/my_courses_dropdown.js
@@ -1,9 +1,9 @@
 $(document).ready(function () {
-  $('a.options').toggle(function() {
-    $('ol.user-options').addClass("expanded");
-    $('a.options').addClass("active");
+  $('a.dropdown').toggle(function() {
+    $('ul.dropdown-menu').addClass("expanded");
+    $('a.dropdown').addClass("active");
   }, function() {
-    $('ol.user-options').removeClass("expanded");
-    $('a.options').removeClass("active");
+    $('ul.dropdown-menu').removeClass("expanded");
+    $('a.dropdown').removeClass("active");
   });
 });
diff --git a/lms/static/sass/_about.scss b/lms/static/sass/_about.scss
index 56cec0aa13..668b05c863 100644
--- a/lms/static/sass/_about.scss
+++ b/lms/static/sass/_about.scss
@@ -87,7 +87,7 @@
   }
 
   .faq {
-    //display: none;
+    display: none;
     @include clearfix;
 
     nav.categories {
@@ -99,6 +99,7 @@
       width: flex-grid(3);
 
       a {
+        color: $lighter-base-font-color;
         display: block;
         letter-spacing: 1px;
         margin-right: -20px;
@@ -107,6 +108,7 @@
         text-transform: uppercase;
 
         &:hover {
+          color: $blue;
           background: rgb(245,245,245);
         }
       }
diff --git a/lms/static/sass/_base.scss b/lms/static/sass/_base.scss
index 3d1145f57f..d0ef3dd742 100644
--- a/lms/static/sass/_base.scss
+++ b/lms/static/sass/_base.scss
@@ -77,6 +77,11 @@ a:link, a:visited {
   }
 }
 
+.content-wrapper {
+  margin: 0 auto 0;
+  width: flex-grid(12);
+}
+
 .container {
   @include clearfix;
   margin: 0 auto 0;
diff --git a/lms/static/sass/_find_courses.scss b/lms/static/sass/_find_courses.scss
index 4a6968bbcf..f5428ae690 100644
--- a/lms/static/sass/_find_courses.scss
+++ b/lms/static/sass/_find_courses.scss
@@ -1,8 +1,12 @@
 .find-courses {
+  .container {
+    margin-bottom: 60px;
+  }
+
   header.search-intro {
     background: rgb(240,240,240);
     border-bottom: 1px solid rgb(200,200,200);
-    @include box-shadow(inset 0 1px 5px 0 rgba(0,0,0, 0.1));
+    @include box-shadow(inset 0 -1px 5px 0 rgba(0,0,0, 0.1));
     width: 100%;
 
     .inner-wrapper {
diff --git a/lms/static/sass/_index.scss b/lms/static/sass/_index.scss
index 48cddf1bd7..aa92657087 100644
--- a/lms/static/sass/_index.scss
+++ b/lms/static/sass/_index.scss
@@ -1,13 +1,21 @@
 .home {
-  margin: 50px 10px 100px;
+  margin: 0px 0px 100px;
 
   > header {
+    background: rgb(250,250,250);
+    border-bottom: 1px solid rgb(200,200,200);
+    @include box-shadow(inset 0 -1px 5px 0 rgba(0,0,0, 0.1));
     @include clearfix;
     min-height: 335px;
-    margin-bottom: 40px;
-    position: relative;
+    padding: 60px 0px 50px;
     width: flex-grid(12);
 
+    .inner-wrapper {
+      max-width: 1200px;
+      margin: 0 auto;
+      position: relative;
+    }
+
     .video-wrapper {
       right: 0px;
       position: absolute;
@@ -98,7 +106,6 @@
     @include background-image(linear-gradient(180deg, rgba(245,245,245, 0) 0%,
                                                       rgba(245,245,245, 1) 50%,
                                                       rgba(245,245,245, 0) 100%));
-    border-top: 1px solid rgb(210,210,210);
     border-bottom: 1px solid rgb(210,210,210);
     margin-bottom: 0px;
     overflow: hidden;
@@ -234,25 +241,23 @@
     width: flex-grid(12);
 
     > h2 {
-      background: rgb(245,245,245);
-      border: 1px solid rgb(220,220,220);
+      @include background-image(linear-gradient(-90deg, rgb(250,250,250), rgb(230,230,230)));
+      @include box-shadow(inset 0 0 0 1px rgba(255,255,255, 0.4));
+      border: 1px solid rgb(210,210,210);
       border-top: none;
       @include border-bottom-radius(4px);
       @include box-shadow(0 1px 8px 0 rgba(0,0,0, 0.1));
       color: $lighter-base-font-color;
       letter-spacing: 1px;
+      margin-bottom: 0px;
       padding: 15px 10px;
       text-align: center;
       text-transform: uppercase;
-    }
+      text-shadow: 0 1px rgba(255,255,255, 0.6);
 
-    .courses {
-      //background: rgb(245,245,245);
-      //@include background-image(linear-gradient(180deg, rgba(255,255,255, 1) 0%,
-                                                        //rgba(255,255,255, 0.5) 20%,
-                                                        //rgba(255,255,255, 0) 50%,
-                                                        //rgba(255,255,255, 0.5) 80%,
-                                                        //rgba(255,255,255, 1) 100%));
+      .lowercase {
+        text-transform: none;
+      }
     }
   }
 
diff --git a/lms/static/sass/_shared_footer.scss b/lms/static/sass/_shared_footer.scss
index 955a37b46e..148afedef7 100644
--- a/lms/static/sass/_shared_footer.scss
+++ b/lms/static/sass/_shared_footer.scss
@@ -1,5 +1,7 @@
 footer {
-  max-width: 1200px;
+  background: rgb(250,250,250);
+  border-top: 1px solid rgb(200,200,200);
+  @include box-shadow(inset 0 1px 3px 0 rgba(0,0,0, 0.1));
   margin: 0 auto;
   padding: 0 0 40px;
   width: flex-grid(12);
@@ -11,7 +13,6 @@ footer {
   }
 
   nav {
-    border-top: 1px solid rgb(200,200,200);
     @include box-sizing(border-box);
     @include clearfix;
     max-width: 1200px;
@@ -24,16 +25,23 @@ footer {
       padding-top: 2px;
 
       a.logo {
-        @include box-sizing(border-box);
+        @include background-image(url('/static/images/logo.png'));
+        background-position: 0 -24px;
+        background-repeat: no-repeat;
         @include inline-block;
         float: left;
-        height: 100%;
-        margin-right: 14px;
-        margin-top: 1px;
+        height: 23px;
+        margin-right: 15px;
+        margin-top: 2px;
         padding-right: 15px;
         position: relative;
+        width: 47px;
         vertical-align: middle;
 
+        &:hover {
+          background-position: 0 0;
+        }
+
         &::after {
           @extend .faded-vertical-divider;
           content: "";
@@ -44,16 +52,11 @@ footer {
           top: -2px;
           width: 1px;
         }
-
-        img {
-          position: relative;
-          z-index: 2;
-        }
       }
 
       p {
         color: $lighter-base-font-color;
-        font: normal 1.2rem/1.6rem $serif;
+        font: italic 1.2rem/1.6rem $serif;
         @include inline-block;
         margin: 0 auto;
         padding-top: 4px;
@@ -62,9 +65,9 @@ footer {
 
         a {
           color: $lighter-base-font-color;
-          font: normal 1.2rem/1.6rem $serif;
+          font: italic 1.2rem/1.6rem $serif;
           margin-left: 5px;
-          text-decoration: underline;
+          //text-decoration: underline;
         }
       }
     }
@@ -74,7 +77,6 @@ footer {
       font-size: 0em;
 
       li {
-        //border-right: 1px solid rgb(200,200,200);
         @include inline-block;
         list-style: none;
         padding: 0px 15px;
@@ -94,7 +96,8 @@ footer {
 
         a:link, a:visited {
           color: $lighter-base-font-color;
-          font: normal 1.2rem/1.6rem $serif;
+          font: 300 1.2rem/1.6rem $sans-serif;
+          letter-spacing: 1px;
           padding: 6px 0px;
         }
 
diff --git a/lms/static/sass/_shared_header.scss b/lms/static/sass/_shared_header.scss
index 2060ef3266..52c6c3d48e 100644
--- a/lms/static/sass/_shared_header.scss
+++ b/lms/static/sass/_shared_header.scss
@@ -1,44 +1,62 @@
-header.app {
+header.global {
+  background: rgb(255,255,255);
   border-bottom: 1px solid rgb(200,200,200);
-  @include background-image(linear-gradient(-90deg, rgb(245,245,245), rgb(230,230,230)));
-  height: 55px;
+  @include box-shadow(0 1px 5px 0 rgba(0,0,0, 0.1));
+  //@include background-image(linear-gradient(-90deg, rgb(255,255,255), rgba(245,245,245, 1)));
+  height: 75px;
+  position: relative;
   width: 100%;
+  z-index: 10;
 
-  .wrapper {
+  nav {
     @include clearfix;
     @include box-sizing(border-box);
-    max-width: 1200px;
+    height: 40px;
     margin: 0 auto;
-    padding: 0px 10px;
+    max-width: 1200px;
+    padding-top: 20px;
     width: flex-grid(12);
   }
 
-  a.logo {
-    @include box-sizing(border-box);
-    display: block;
+  h1.logo {
     float: left;
-    height: 100%;
-    margin: 16px 15px 0px 0px;
+    margin: 7px 15px 0px 0px;
+    padding-right: 20px;
     position: relative;
 
-    img {
-      position: relative;
-      z-index: 2;
+    &::before {
+      @extend .faded-vertical-divider;
+      content: "";
+      display: block;
+      height: 45px;
+      position: absolute;
+      right: 1px;
+      top: -12px;
+      width: 1px;
+    }
+
+    &::after {
+      @extend .faded-vertical-divider-light;
+      content: "";
+      display: block;
+      height: 36px;
+      position: absolute;
+      right: 0px;
+      top: 0px;
+      width: 1px;
+    }
+
+    a {
+      @include background-image(url('/static/images/logo.png'));
+      background-position: 0 0;
+      background-repeat: no-repeat;
+      display: block;
+      height: 23px;
+      width: 47px;
     }
   }
 
-  .divider {
-    @extend .vertical-divider;
-    @include inline-block;
-    height: 40px;
-    vertical-align: middle;
-  }
-
-
-  nav {
-    height: 40px;
-    margin-top: 8px;
-
+  ol {
     &.find-courses {
       float: left;
     }
@@ -47,67 +65,70 @@ header.app {
       float: right;
     }
 
-    ol {
-      font-size: 0em;
+    > li {
+      @include inline-block;
+      margin-right: 20px;
+      position: relative;
+      vertical-align: middle;
 
-      li {
-        @include inline-block;
-        vertical-align: top;
+      &:last-child {
+        margin-right: 0px;
       }
 
-      li.secondary {
-        margin: 0px 15px;
+      a {
+        letter-spacing: 1px;
+        vertical-align: middle;
+      }
+    }
 
-        a {
-          @include border-radius(3px);
-          border: 1px solid transparent;
-          @include box-sizing(border-box);
-          color: $lighter-base-font-color;
-          display: block;
-          font: italic 1.2rem/1.4rem $serif;
-          height: 30px;
-          @include inline-block;
-          margin: 5px 15px 5px 0px;
-          padding: 7px 2px;
-          text-decoration: none;
-          text-transform: lowercase;
-          text-shadow: 0 1px rgba(255,255,255, 0.6);
-          vertical-align: middle;
+    li.secondary {
+      > a {
+        color: $lighter-base-font-color;
+        color: $blue;
+        display: block;
+        //font: italic 1.2rem/1.4rem $serif;
+        font: normal 1.2rem/1.4rem $sans-serif;
+        @include inline-block;
+        margin: 0px 20px 0px 0px;
+        text-decoration: none;
+        //text-transform: lowercase;
+        text-transform: uppercase;
+        text-shadow: 0 1px rgba(255,255,255, 0.6);
 
-          &:last-child {
-            margin-right: 0px;
-          }
+        &:last-child {
+          margin-right: 0px;
+        }
 
-          &:hover {
-            color: $base-font-color;
-          }
+        &:hover {
+          color: $base-font-color;
         }
       }
+    }
 
-      li.primary {
-        position: relative;
+    li.primary {
+      > a {
+        @include background-image(linear-gradient(-90deg, rgb(245,245,245) 0%, rgb(243,243,243) 50%, rgb(237,237,237) 50%, rgb(235,235,235) 100%));
+        border: 1px solid transparent;
+        border-color: rgb(200,200,200);
+        @include border-radius(3px);
+        @include box-sizing(border-box);
+        @include box-shadow(0 1px 0 0 rgba(255,255,255, 0.6));
+        color: $base-font-color;
+        display: inline-block;
+        font: normal 1.2rem/1.4rem $sans-serif;
+        @include inline-block;
+        margin: 1px 5px;
+        padding: 8px 12px;
+        text-decoration: none;
+        text-transform: uppercase;
+        text-shadow: 0 1px rgba(255,255,255, 0.6);
+        vertical-align: middle;
 
-        a {
-          border: 1px solid transparent;
-          @include border-radius(3px);
-          @include box-sizing(border-box);
-          color: $base-font-color;
-          display: block;
-          font: normal 1.2rem/1.4rem $sans-serif;
-          height: 38px;
-          @include inline-block;
-          margin: 1px 5px;
-          padding: 10px 8px;
-          text-decoration: none;
-          text-transform: uppercase;
-          text-shadow: 0 1px rgba(255,255,255, 0.6);
-          vertical-align: middle;
+        &:last-child {
+          margin-right: 0px;
+        }
 
-          &:hover, &.active {
-            @include background-image(linear-gradient(-90deg, rgb(245,245,245) 0%, rgb(243,243,243) 50%, rgb(237,237,237) 50%, rgb(235,235,235) 100%));
-            border-color: rgb(200,200,200);
-            @include box-shadow(0 1px 0 0 rgba(255,255,255, 0.6));
-          }
+        &:hover, &.active {
         }
       }
     }
@@ -116,7 +137,7 @@ header.app {
       float: right;
 
       a.user-link {
-        padding: 9px 8px 11px 40px;
+        padding: 8px 12px 8px 40px;
         position: relative;
         text-transform: none;
 
@@ -129,15 +150,15 @@ header.app {
         .avatar {
           background: rgb(220,220,220);
           @include border-radius(3px);
-          border: 1px solid rgb(180,180,180);
+          border: 1px solid rgb(80,80,80);
           @include box-shadow(0 1px 0 0 rgba(255,255,255, 0.6));
-          height: 22px;
+          height: 21px;
           @include inline-block;
-          left: 8px;
+          left: 6px;
           overflow: hidden;
           position: absolute;
-          top: 6px;
-          width: 22px;
+          top: 5px;
+          width: 21px;
 
           &::after {
             @include background-image(linear-gradient((-60deg), rgba(0,0,0, 0) 0%, rgba(0,0,0, 0.1) 50%, rgba(0,0,0, 0.2) 50%, rgba(0,0,0, 0.3) 100%));
@@ -160,17 +181,17 @@ header.app {
         }
       }
 
-      ol.user-options {
+      ul.dropdown-menu {
         @include border-radius(4px);
         @include box-shadow(0 1px 6px 0 rgba(0,0,0, 0.3));
         border: 1px solid rgb(0,0,0);
         @include background-image(linear-gradient(-90deg, rgba(0,0,0, 0.9) 0%,
                                                           rgba(0,0,0, 0.7) 100%));
         display: none;
-        right: 0px;
         padding: 5px 10px;
         position: absolute;
-        top: 52px;
+        right: 4px;
+        top: 50px;
         width: 150px;
         z-index: 3;
 
@@ -209,6 +230,7 @@ header.app {
 
           > a {
             @include box-sizing(border-box);
+            @include border-radius(3px);
             color: rgba(255,255,255, 0.9);
             display: block;
             font: italic 1.2rem/1.4rem $serif;
diff --git a/lms/static/sass/_shared_list_of_courses.scss b/lms/static/sass/_shared_list_of_courses.scss
index 2b84cfb355..7f76731dba 100644
--- a/lms/static/sass/_shared_list_of_courses.scss
+++ b/lms/static/sass/_shared_list_of_courses.scss
@@ -21,26 +21,27 @@
         margin-right: 0;
       }
 
-      //.meta-info {
-        //background: rgba(0,0,0, 0.6);
-        //bottom: 8px;
-        //border: 1px solid rgba(0,0,0, 0.5);
-        //@include box-shadow(0 1px 5px 0 rgba(0,0,0, 0.15));
-        //@include clearfix;
-        //left: -4px;
-        //position: absolute;
-        //@include transition(all, 0.15s, linear);
+      .meta-info {
+        background: rgba(0,0,0, 0.6);
+        bottom: 6px;
+        border: 1px solid rgba(0,0,0, 0.5);
+        @include border-right-radius(2px);
+        @include box-shadow(0 1px 5px 0 rgba(0,0,0, 0.15));
+        @include clearfix;
+        position: absolute;
+        right: -3px;
+        @include transition(all, 0.15s, linear);
 
-        //p {
-          //color: rgb(255,255,255);
-          //font: 300 1.2rem/1.4rem $sans-serif;
-          //padding: 5px 12px;
+        p {
+          color: rgb(255,255,255);
+          font: 300 1.2rem/1.4rem $sans-serif;
+          padding: 5px 12px;
 
-          //&.university {
-            //float: left;
-          //}
-        //}
-      //}
+          &.university {
+            float: left;
+          }
+        }
+      }
 
       .inner-wrapper {
         border: 1px solid rgba(255,255,255, 1);
@@ -114,6 +115,7 @@
       }
 
       .info {
+        background: rgb(255,255,255);
         height: 180px + 130px;
         left: 0px;
         position: absolute;
@@ -121,31 +123,6 @@
         @include transition(all, 0.15s, linear);
         width: 100%;
 
-        .meta-info {
-          background: rgba(0,0,0, 0.6);
-          bottom: 130px;
-          border-top: 1px solid rgba(0,0,0, 0.5);
-          @include clearfix;
-          position: absolute;
-          @include transition(all, 0.15s, linear);
-          width: 100%;
-
-          p {
-            color: rgb(255,255,255);
-            font: 300 1.2rem/1.4rem $sans-serif;
-            padding: 5px 10px;
-
-            &.university {
-              float: left;
-            }
-
-            &.dates {
-              float: right;
-              margin-top: 0px;
-            }
-          }
-        }
-
         .cover-image {
           height: 180px;
           overflow: hidden;
@@ -159,13 +136,49 @@
         }
 
         .desc {
-          background: rgb(255,255,255);
           @include box-sizing(border-box);
-          height: 130px;
+          height: 100px;
           overflow: hidden;
-          padding: 10px;
+          padding: 10px 10px 15px 10px;
+          position: relative;
           width: 100%;
 
+          p {
+            height: 100%;
+            overflow: hidden;
+            text-overflow: ellipsis;
+          }
+        }
+
+        .bottom {
+          @include box-sizing(border-box);
+          @include clearfix;
+          padding: 6px 10px;
+          width: 100%;
+
+          > p, a {
+            color: $lighter-base-font-color;
+            font: 300 1.2rem/1.4rem $sans-serif;
+            letter-spacing: 1px;
+            padding: 0;
+
+            &.university {
+              border-right: 1px solid $lighter-base-font-color;
+              display: block;
+              float: left;
+              margin-right: 10px;
+              padding-right: 10px;
+
+              &:hover {
+                color: $blue;
+              }
+            }
+
+            &.dates {
+              float: left;
+              margin-top: 0px;
+            }
+          }
         }
       }
 
@@ -176,10 +189,10 @@
 
         .info {
           top: -130px;
+        }
 
-          .meta-info {
-            opacity: 0;
-          }
+        .meta-info {
+          opacity: 0;
         }
       }
     }
diff --git a/lms/static/sass/application.css b/lms/static/sass/application.css
index 8e7465fcee..7e7bfc3450 100755
--- a/lms/static/sass/application.css
+++ b/lms/static/sass/application.css
@@ -393,6 +393,10 @@ a:link, a:visited {
   a:link:hover, a:visited:hover {
     color: #3c3c3c; }
 
+.content-wrapper {
+  margin: 0 auto 0;
+  width: 100%; }
+
 .container {
   zoom: 1;
   margin: 0 auto 0;
@@ -431,7 +435,7 @@ a:link, a:visited {
   height: 1px;
   width: 100%; }
 
-.faded-vertical-divider, .vertical-divider, header.app .divider, footer nav .copyright a.logo::after, footer nav ol li::after, .home .university-partners .partners li.partner::before {
+.faded-vertical-divider, .vertical-divider, footer nav .copyright a.logo::after, footer nav ol li::after, header.global h1.logo::before, .home .university-partners .partners li.partner::before {
   background-image: -webkit-linear-gradient(90deg, rgba(200, 200, 200, 0) 0%, #c8c8c8 50%, rgba(200, 200, 200, 0));
   background-image: -moz-linear-gradient(90deg, rgba(200, 200, 200, 0) 0%, #c8c8c8 50%, rgba(200, 200, 200, 0));
   background-image: -ms-linear-gradient(90deg, rgba(200, 200, 200, 0) 0%, #c8c8c8 50%, rgba(200, 200, 200, 0));
@@ -440,7 +444,7 @@ a:link, a:visited {
   height: 100%;
   width: 1px; }
 
-.faded-vertical-divider-light, .vertical-divider::after, header.app .divider::after, .home .university-partners .partners li.partner::after {
+.faded-vertical-divider-light, .vertical-divider::after, header.global h1.logo::after, .home .university-partners .partners li.partner::after {
   background-image: -webkit-linear-gradient(90deg, rgba(255, 255, 255, 0) 0%, rgba(255, 255, 255, 0.6) 50%, rgba(255, 255, 255, 0));
   background-image: -moz-linear-gradient(90deg, rgba(255, 255, 255, 0) 0%, rgba(255, 255, 255, 0.6) 50%, rgba(255, 255, 255, 0));
   background-image: -ms-linear-gradient(90deg, rgba(255, 255, 255, 0) 0%, rgba(255, 255, 255, 0.6) 50%, rgba(255, 255, 255, 0));
@@ -449,9 +453,9 @@ a:link, a:visited {
   height: 100%;
   width: 1px; }
 
-.vertical-divider, header.app .divider {
+.vertical-divider {
   position: relative; }
-  .vertical-divider::after, header.app .divider::after {
+  .vertical-divider::after {
     content: "";
     display: block;
     position: absolute;
@@ -1326,7 +1330,11 @@ form {
       box-shadow: inset 0 0 20px 0 #00295f, 0 1px 0 white; }
 
 footer {
-  max-width: 1200px;
+  background: #fafafa;
+  border-top: 1px solid #c8c8c8;
+  -webkit-box-shadow: inset 0 1px 3px 0 rgba(0, 0, 0, 0.1);
+  -moz-box-shadow: inset 0 1px 3px 0 rgba(0, 0, 0, 0.1);
+  box-shadow: inset 0 1px 3px 0 rgba(0, 0, 0, 0.1);
   margin: 0 auto;
   padding: 0 0 40px;
   width: 100%; }
@@ -1335,7 +1343,6 @@ footer {
     max-width: 100%;
     position: absolute; }
   footer nav {
-    border-top: 1px solid #c8c8c8;
     -webkit-box-sizing: border-box;
     -moz-box-sizing: border-box;
     box-sizing: border-box;
@@ -1353,9 +1360,13 @@ footer {
       float: left;
       padding-top: 2px; }
       footer nav .copyright a.logo {
-        -webkit-box-sizing: border-box;
-        -moz-box-sizing: border-box;
-        box-sizing: border-box;
+        background-image: url("/static/images/logo.png");
+        background-image: url("/static/images/logo.png");
+        background-image: url("/static/images/logo.png");
+        background-image: url("/static/images/logo.png");
+        background-image: url("/static/images/logo.png");
+        background-position: 0 -24px;
+        background-repeat: no-repeat;
         display: -moz-inline-box;
         -moz-box-orient: vertical;
         display: inline-block;
@@ -1364,12 +1375,15 @@ footer {
         *display: inline;
         *vertical-align: auto;
         float: left;
-        height: 100%;
-        margin-right: 14px;
-        margin-top: 1px;
+        height: 23px;
+        margin-right: 15px;
+        margin-top: 2px;
         padding-right: 15px;
         position: relative;
+        width: 47px;
         vertical-align: middle; }
+        footer nav .copyright a.logo:hover {
+          background-position: 0 0; }
         footer nav .copyright a.logo::after {
           content: "";
           display: block;
@@ -1378,12 +1392,9 @@ footer {
           position: absolute;
           top: -2px;
           width: 1px; }
-        footer nav .copyright a.logo img {
-          position: relative;
-          z-index: 2; }
       footer nav .copyright p {
         color: #a0a0a0;
-        font: normal 1.2rem/1.6rem Georgia, Cambria, "Times New Roman", Times, serif;
+        font: italic 1.2rem/1.6rem Georgia, Cambria, "Times New Roman", Times, serif;
         display: -moz-inline-box;
         -moz-box-orient: vertical;
         display: inline-block;
@@ -1397,9 +1408,8 @@ footer {
         vertical-align: middle; }
         footer nav .copyright p a {
           color: #a0a0a0;
-          font: normal 1.2rem/1.6rem Georgia, Cambria, "Times New Roman", Times, serif;
-          margin-left: 5px;
-          text-decoration: underline; }
+          font: italic 1.2rem/1.6rem Georgia, Cambria, "Times New Roman", Times, serif;
+          margin-left: 5px; }
     footer nav ol {
       float: right;
       font-size: 0em; }
@@ -1425,7 +1435,8 @@ footer {
           width: 1px; }
         footer nav ol li a:link, footer nav ol li a:visited {
           color: #a0a0a0;
-          font: normal 1.2rem/1.6rem Georgia, Cambria, "Times New Roman", Times, serif;
+          font: 300 1.2rem/1.6rem "Open Sans", Verdana, Geneva, sans-serif;
+          letter-spacing: 1px;
           padding: 6px 0px; }
         footer nav ol li.social {
           border: none;
@@ -1458,42 +1469,68 @@ footer {
             footer nav ol li.social a:hover {
               opacity: 0.7; }
 
-header.app {
+header.global {
+  background: white;
   border-bottom: 1px solid #c8c8c8;
-  background-image: -webkit-linear-gradient(-90deg, #f5f5f5, #e6e6e6);
-  background-image: -moz-linear-gradient(-90deg, #f5f5f5, #e6e6e6);
-  background-image: -ms-linear-gradient(-90deg, #f5f5f5, #e6e6e6);
-  background-image: -o-linear-gradient(-90deg, #f5f5f5, #e6e6e6);
-  background-image: linear-gradient(-90deg, #f5f5f5, #e6e6e6);
-  height: 55px;
-  width: 100%; }
-  header.app .wrapper {
+  -webkit-box-shadow: 0 1px 5px 0 rgba(0, 0, 0, 0.1);
+  -moz-box-shadow: 0 1px 5px 0 rgba(0, 0, 0, 0.1);
+  box-shadow: 0 1px 5px 0 rgba(0, 0, 0, 0.1);
+  height: 75px;
+  position: relative;
+  width: 100%;
+  z-index: 10; }
+  header.global nav {
     zoom: 1;
     -webkit-box-sizing: border-box;
     -moz-box-sizing: border-box;
     box-sizing: border-box;
-    max-width: 1200px;
+    height: 40px;
     margin: 0 auto;
-    padding: 0px 10px;
+    max-width: 1200px;
+    padding-top: 20px;
     width: 100%; }
-    header.app .wrapper:before, header.app .wrapper:after {
+    header.global nav:before, header.global nav:after {
       content: "";
       display: table; }
-    header.app .wrapper:after {
+    header.global nav:after {
       clear: both; }
-  header.app a.logo {
-    -webkit-box-sizing: border-box;
-    -moz-box-sizing: border-box;
-    box-sizing: border-box;
-    display: block;
+  header.global h1.logo {
     float: left;
-    height: 100%;
-    margin: 16px 15px 0px 0px;
+    margin: 7px 15px 0px 0px;
+    padding-right: 20px;
     position: relative; }
-    header.app a.logo img {
-      position: relative;
-      z-index: 2; }
-  header.app .divider {
+    header.global h1.logo::before {
+      content: "";
+      display: block;
+      height: 45px;
+      position: absolute;
+      right: 1px;
+      top: -12px;
+      width: 1px; }
+    header.global h1.logo::after {
+      content: "";
+      display: block;
+      height: 36px;
+      position: absolute;
+      right: 0px;
+      top: 0px;
+      width: 1px; }
+    header.global h1.logo a {
+      background-image: url("/static/images/logo.png");
+      background-image: url("/static/images/logo.png");
+      background-image: url("/static/images/logo.png");
+      background-image: url("/static/images/logo.png");
+      background-image: url("/static/images/logo.png");
+      background-position: 0 0;
+      background-repeat: no-repeat;
+      display: block;
+      height: 23px;
+      width: 47px; }
+  header.global ol.find-courses {
+    float: left; }
+  header.global ol.guest {
+    float: right; }
+  header.global ol > li {
     display: -moz-inline-box;
     -moz-box-orient: vertical;
     display: inline-block;
@@ -1501,18 +1538,94 @@ header.app {
     zoom: 1;
     *display: inline;
     *vertical-align: auto;
-    height: 40px;
+    margin-right: 20px;
+    position: relative;
     vertical-align: middle; }
-  header.app nav {
-    height: 40px;
-    margin-top: 8px; }
-    header.app nav.find-courses {
-      float: left; }
-    header.app nav.guest {
-      float: right; }
-    header.app nav ol {
-      font-size: 0em; }
-      header.app nav ol li {
+    header.global ol > li:last-child {
+      margin-right: 0px; }
+    header.global ol > li a {
+      letter-spacing: 1px;
+      vertical-align: middle; }
+  header.global ol li.secondary > a {
+    color: #a0a0a0;
+    color: #1d9dd9;
+    display: block;
+    font: normal 1.2rem/1.4rem "Open Sans", Verdana, Geneva, sans-serif;
+    display: -moz-inline-box;
+    -moz-box-orient: vertical;
+    display: inline-block;
+    vertical-align: baseline;
+    zoom: 1;
+    *display: inline;
+    *vertical-align: auto;
+    margin: 0px 20px 0px 0px;
+    text-decoration: none;
+    text-transform: uppercase;
+    text-shadow: 0 1px rgba(255, 255, 255, 0.6); }
+    header.global ol li.secondary > a:last-child {
+      margin-right: 0px; }
+    header.global ol li.secondary > a:hover {
+      color: #3c3c3c; }
+  header.global ol li.primary > a {
+    background-image: -webkit-linear-gradient(-90deg, #f5f5f5 0%, #f3f3f3 50%, #ededed 50%, #ebebeb 100%);
+    background-image: -moz-linear-gradient(-90deg, #f5f5f5 0%, #f3f3f3 50%, #ededed 50%, #ebebeb 100%);
+    background-image: -ms-linear-gradient(-90deg, #f5f5f5 0%, #f3f3f3 50%, #ededed 50%, #ebebeb 100%);
+    background-image: -o-linear-gradient(-90deg, #f5f5f5 0%, #f3f3f3 50%, #ededed 50%, #ebebeb 100%);
+    background-image: linear-gradient(-90deg, #f5f5f5 0%, #f3f3f3 50%, #ededed 50%, #ebebeb 100%);
+    border: 1px solid transparent;
+    border-color: #c8c8c8;
+    -webkit-border-radius: 3px;
+    -moz-border-radius: 3px;
+    -ms-border-radius: 3px;
+    -o-border-radius: 3px;
+    border-radius: 3px;
+    -webkit-box-sizing: border-box;
+    -moz-box-sizing: border-box;
+    box-sizing: border-box;
+    -webkit-box-shadow: 0 1px 0 0 rgba(255, 255, 255, 0.6);
+    -moz-box-shadow: 0 1px 0 0 rgba(255, 255, 255, 0.6);
+    box-shadow: 0 1px 0 0 rgba(255, 255, 255, 0.6);
+    color: #3c3c3c;
+    display: inline-block;
+    font: normal 1.2rem/1.4rem "Open Sans", Verdana, Geneva, sans-serif;
+    display: -moz-inline-box;
+    -moz-box-orient: vertical;
+    display: inline-block;
+    vertical-align: baseline;
+    zoom: 1;
+    *display: inline;
+    *vertical-align: auto;
+    margin: 1px 5px;
+    padding: 8px 12px;
+    text-decoration: none;
+    text-transform: uppercase;
+    text-shadow: 0 1px rgba(255, 255, 255, 0.6);
+    vertical-align: middle; }
+    header.global ol li.primary > a:last-child {
+      margin-right: 0px; }
+  header.global ol.user {
+    float: right; }
+    header.global ol.user a.user-link {
+      padding: 8px 12px 8px 40px;
+      position: relative;
+      text-transform: none; }
+      @media screen and (max-width: 768px) {
+        header.global ol.user a.user-link {
+          font-size: 0em;
+          padding: 10px 0px;
+          width: 38px; } }
+      header.global ol.user a.user-link .avatar {
+        background: #dcdcdc;
+        -webkit-border-radius: 3px;
+        -moz-border-radius: 3px;
+        -ms-border-radius: 3px;
+        -o-border-radius: 3px;
+        border-radius: 3px;
+        border: 1px solid #505050;
+        -webkit-box-shadow: 0 1px 0 0 rgba(255, 255, 255, 0.6);
+        -moz-box-shadow: 0 1px 0 0 rgba(255, 255, 255, 0.6);
+        box-shadow: 0 1px 0 0 rgba(255, 255, 255, 0.6);
+        height: 21px;
         display: -moz-inline-box;
         -moz-box-orient: vertical;
         display: inline-block;
@@ -1520,242 +1633,144 @@ header.app {
         zoom: 1;
         *display: inline;
         *vertical-align: auto;
-        vertical-align: top; }
-      header.app nav ol li.secondary {
-        margin: 0px 15px; }
-        header.app nav ol li.secondary a {
-          -webkit-border-radius: 3px;
-          -moz-border-radius: 3px;
-          -ms-border-radius: 3px;
-          -o-border-radius: 3px;
-          border-radius: 3px;
-          border: 1px solid transparent;
-          -webkit-box-sizing: border-box;
-          -moz-box-sizing: border-box;
-          box-sizing: border-box;
-          color: #a0a0a0;
-          display: block;
-          font: italic 1.2rem/1.4rem Georgia, Cambria, "Times New Roman", Times, serif;
-          height: 30px;
-          display: -moz-inline-box;
-          -moz-box-orient: vertical;
-          display: inline-block;
-          vertical-align: baseline;
-          zoom: 1;
-          *display: inline;
-          *vertical-align: auto;
-          margin: 5px 15px 5px 0px;
-          padding: 7px 2px;
-          text-decoration: none;
-          text-transform: lowercase;
-          text-shadow: 0 1px rgba(255, 255, 255, 0.6);
-          vertical-align: middle; }
-          header.app nav ol li.secondary a:last-child {
-            margin-right: 0px; }
-          header.app nav ol li.secondary a:hover {
-            color: #3c3c3c; }
-      header.app nav ol li.primary {
-        position: relative; }
-        header.app nav ol li.primary a {
-          border: 1px solid transparent;
-          -webkit-border-radius: 3px;
-          -moz-border-radius: 3px;
-          -ms-border-radius: 3px;
-          -o-border-radius: 3px;
-          border-radius: 3px;
-          -webkit-box-sizing: border-box;
-          -moz-box-sizing: border-box;
-          box-sizing: border-box;
-          color: #3c3c3c;
-          display: block;
-          font: normal 1.2rem/1.4rem "Open Sans", Verdana, Geneva, sans-serif;
-          height: 38px;
-          display: -moz-inline-box;
-          -moz-box-orient: vertical;
-          display: inline-block;
-          vertical-align: baseline;
-          zoom: 1;
-          *display: inline;
-          *vertical-align: auto;
-          margin: 1px 5px;
-          padding: 10px 8px;
-          text-decoration: none;
-          text-transform: uppercase;
-          text-shadow: 0 1px rgba(255, 255, 255, 0.6);
-          vertical-align: middle; }
-          header.app nav ol li.primary a:hover, header.app nav ol li.primary a.active, header.app nav.sequence-nav ol li.primary a.seq_video_active, header.app nav.sequence-nav ol li.primary a.seq_other_active, header.app nav.sequence-nav ol li.primary a.seq_vertical_active, header.app nav.sequence-nav ol li.primary a.seq_problem_active {
-            background-image: -webkit-linear-gradient(-90deg, #f5f5f5 0%, #f3f3f3 50%, #ededed 50%, #ebebeb 100%);
-            background-image: -moz-linear-gradient(-90deg, #f5f5f5 0%, #f3f3f3 50%, #ededed 50%, #ebebeb 100%);
-            background-image: -ms-linear-gradient(-90deg, #f5f5f5 0%, #f3f3f3 50%, #ededed 50%, #ebebeb 100%);
-            background-image: -o-linear-gradient(-90deg, #f5f5f5 0%, #f3f3f3 50%, #ededed 50%, #ebebeb 100%);
-            background-image: linear-gradient(-90deg, #f5f5f5 0%, #f3f3f3 50%, #ededed 50%, #ebebeb 100%);
-            border-color: #c8c8c8;
-            -webkit-box-shadow: 0 1px 0 0 rgba(255, 255, 255, 0.6);
-            -moz-box-shadow: 0 1px 0 0 rgba(255, 255, 255, 0.6);
-            box-shadow: 0 1px 0 0 rgba(255, 255, 255, 0.6); }
-    header.app nav.user {
-      float: right; }
-      header.app nav.user a.user-link {
-        padding: 9px 8px 11px 40px;
-        position: relative;
-        text-transform: none; }
-        @media screen and (max-width: 768px) {
-          header.app nav.user a.user-link {
-            font-size: 0em;
-            padding: 10px 0px;
-            width: 38px; } }
-        header.app nav.user a.user-link .avatar {
-          background: #dcdcdc;
-          -webkit-border-radius: 3px;
-          -moz-border-radius: 3px;
-          -ms-border-radius: 3px;
-          -o-border-radius: 3px;
-          border-radius: 3px;
-          border: 1px solid #b4b4b4;
-          -webkit-box-shadow: 0 1px 0 0 rgba(255, 255, 255, 0.6);
-          -moz-box-shadow: 0 1px 0 0 rgba(255, 255, 255, 0.6);
-          box-shadow: 0 1px 0 0 rgba(255, 255, 255, 0.6);
-          height: 22px;
-          display: -moz-inline-box;
-          -moz-box-orient: vertical;
-          display: inline-block;
-          vertical-align: baseline;
-          zoom: 1;
-          *display: inline;
-          *vertical-align: auto;
-          left: 8px;
-          overflow: hidden;
-          position: absolute;
-          top: 6px;
-          width: 22px; }
-          header.app nav.user a.user-link .avatar::after {
-            background-image: -webkit-linear-gradient(-60deg, rgba(0, 0, 0, 0) 0%, rgba(0, 0, 0, 0.1) 50%, rgba(0, 0, 0, 0.2) 50%, rgba(0, 0, 0, 0.3) 100%);
-            background-image: -moz-linear-gradient(-60deg, rgba(0, 0, 0, 0) 0%, rgba(0, 0, 0, 0.1) 50%, rgba(0, 0, 0, 0.2) 50%, rgba(0, 0, 0, 0.3) 100%);
-            background-image: -ms-linear-gradient(-60deg, rgba(0, 0, 0, 0) 0%, rgba(0, 0, 0, 0.1) 50%, rgba(0, 0, 0, 0.2) 50%, rgba(0, 0, 0, 0.3) 100%);
-            background-image: -o-linear-gradient(-60deg, rgba(0, 0, 0, 0) 0%, rgba(0, 0, 0, 0.1) 50%, rgba(0, 0, 0, 0.2) 50%, rgba(0, 0, 0, 0.3) 100%);
-            background-image: linear-gradient(-60deg, rgba(0, 0, 0, 0) 0%, rgba(0, 0, 0, 0.1) 50%, rgba(0, 0, 0, 0.2) 50%, rgba(0, 0, 0, 0.3) 100%);
-            content: "";
-            display: block;
-            height: 100%;
-            position: absolute;
-            right: 0px;
-            top: 0px;
-            width: 100%; }
-          header.app nav.user a.user-link .avatar img {
-            -webkit-border-radius: 4px;
-            -moz-border-radius: 4px;
-            -ms-border-radius: 4px;
-            -o-border-radius: 4px;
-            border-radius: 4px;
-            display: block;
-            min-height: 100%;
-            min-width: 100%;
-            height: 100%; }
-      header.app nav.user ol.user-options {
-        -webkit-border-radius: 4px;
-        -moz-border-radius: 4px;
-        -ms-border-radius: 4px;
-        -o-border-radius: 4px;
-        border-radius: 4px;
-        -webkit-box-shadow: 0 1px 6px 0 rgba(0, 0, 0, 0.3);
-        -moz-box-shadow: 0 1px 6px 0 rgba(0, 0, 0, 0.3);
-        box-shadow: 0 1px 6px 0 rgba(0, 0, 0, 0.3);
-        border: 1px solid black;
-        background-image: -webkit-linear-gradient(-90deg, rgba(0, 0, 0, 0.9) 0%, rgba(0, 0, 0, 0.7) 100%);
-        background-image: -moz-linear-gradient(-90deg, rgba(0, 0, 0, 0.9) 0%, rgba(0, 0, 0, 0.7) 100%);
-        background-image: -ms-linear-gradient(-90deg, rgba(0, 0, 0, 0.9) 0%, rgba(0, 0, 0, 0.7) 100%);
-        background-image: -o-linear-gradient(-90deg, rgba(0, 0, 0, 0.9) 0%, rgba(0, 0, 0, 0.7) 100%);
-        background-image: linear-gradient(-90deg, rgba(0, 0, 0, 0.9) 0%, rgba(0, 0, 0, 0.7) 100%);
-        display: none;
-        right: 0px;
-        padding: 5px 10px;
+        left: 6px;
+        overflow: hidden;
         position: absolute;
-        top: 52px;
-        width: 150px;
-        z-index: 3; }
-        header.app nav.user ol.user-options.expanded {
-          display: block; }
-        header.app nav.user ol.user-options::before {
-          background: transparent;
-          border-top: 6px solid black;
-          border-right: 6px solid black;
-          border-bottom: 6px solid transparent;
-          border-left: 6px solid transparent;
-          -webkit-box-shadow: 1px 0 0 0 black, 0 -1px 0 0 black;
-          -moz-box-shadow: 1px 0 0 0 black, 0 -1px 0 0 black;
-          box-shadow: 1px 0 0 0 black, 0 -1px 0 0 black;
+        top: 5px;
+        width: 21px; }
+        header.global ol.user a.user-link .avatar::after {
+          background-image: -webkit-linear-gradient(-60deg, rgba(0, 0, 0, 0) 0%, rgba(0, 0, 0, 0.1) 50%, rgba(0, 0, 0, 0.2) 50%, rgba(0, 0, 0, 0.3) 100%);
+          background-image: -moz-linear-gradient(-60deg, rgba(0, 0, 0, 0) 0%, rgba(0, 0, 0, 0.1) 50%, rgba(0, 0, 0, 0.2) 50%, rgba(0, 0, 0, 0.3) 100%);
+          background-image: -ms-linear-gradient(-60deg, rgba(0, 0, 0, 0) 0%, rgba(0, 0, 0, 0.1) 50%, rgba(0, 0, 0, 0.2) 50%, rgba(0, 0, 0, 0.3) 100%);
+          background-image: -o-linear-gradient(-60deg, rgba(0, 0, 0, 0) 0%, rgba(0, 0, 0, 0.1) 50%, rgba(0, 0, 0, 0.2) 50%, rgba(0, 0, 0, 0.3) 100%);
+          background-image: linear-gradient(-60deg, rgba(0, 0, 0, 0) 0%, rgba(0, 0, 0, 0.1) 50%, rgba(0, 0, 0, 0.2) 50%, rgba(0, 0, 0, 0.3) 100%);
           content: "";
           display: block;
-          height: 0px;
+          height: 100%;
           position: absolute;
-          -webkit-transform: rotate(-45deg);
-          -moz-transform: rotate(-45deg);
-          -ms-transform: rotate(-45deg);
-          -o-transform: rotate(-45deg);
-          transform: rotate(-45deg);
-          right: 12px;
-          top: -6px;
-          width: 0px; }
-        header.app nav.user ol.user-options li {
+          right: 0px;
+          top: 0px;
+          width: 100%; }
+        header.global ol.user a.user-link .avatar img {
+          -webkit-border-radius: 4px;
+          -moz-border-radius: 4px;
+          -ms-border-radius: 4px;
+          -o-border-radius: 4px;
+          border-radius: 4px;
           display: block;
-          border-top: 1px solid rgba(0, 0, 0, 0.4);
-          -webkit-box-shadow: inset 0 1px 0 0 rgba(255, 255, 255, 0.05);
-          -moz-box-shadow: inset 0 1px 0 0 rgba(255, 255, 255, 0.05);
-          box-shadow: inset 0 1px 0 0 rgba(255, 255, 255, 0.05); }
-          header.app nav.user ol.user-options li:first-child {
-            border: none;
+          min-height: 100%;
+          min-width: 100%;
+          height: 100%; }
+    header.global ol.user ul.dropdown-menu {
+      -webkit-border-radius: 4px;
+      -moz-border-radius: 4px;
+      -ms-border-radius: 4px;
+      -o-border-radius: 4px;
+      border-radius: 4px;
+      -webkit-box-shadow: 0 1px 6px 0 rgba(0, 0, 0, 0.3);
+      -moz-box-shadow: 0 1px 6px 0 rgba(0, 0, 0, 0.3);
+      box-shadow: 0 1px 6px 0 rgba(0, 0, 0, 0.3);
+      border: 1px solid black;
+      background-image: -webkit-linear-gradient(-90deg, rgba(0, 0, 0, 0.9) 0%, rgba(0, 0, 0, 0.7) 100%);
+      background-image: -moz-linear-gradient(-90deg, rgba(0, 0, 0, 0.9) 0%, rgba(0, 0, 0, 0.7) 100%);
+      background-image: -ms-linear-gradient(-90deg, rgba(0, 0, 0, 0.9) 0%, rgba(0, 0, 0, 0.7) 100%);
+      background-image: -o-linear-gradient(-90deg, rgba(0, 0, 0, 0.9) 0%, rgba(0, 0, 0, 0.7) 100%);
+      background-image: linear-gradient(-90deg, rgba(0, 0, 0, 0.9) 0%, rgba(0, 0, 0, 0.7) 100%);
+      display: none;
+      padding: 5px 10px;
+      position: absolute;
+      right: 4px;
+      top: 50px;
+      width: 150px;
+      z-index: 3; }
+      header.global ol.user ul.dropdown-menu.expanded {
+        display: block; }
+      header.global ol.user ul.dropdown-menu::before {
+        background: transparent;
+        border-top: 6px solid black;
+        border-right: 6px solid black;
+        border-bottom: 6px solid transparent;
+        border-left: 6px solid transparent;
+        -webkit-box-shadow: 1px 0 0 0 black, 0 -1px 0 0 black;
+        -moz-box-shadow: 1px 0 0 0 black, 0 -1px 0 0 black;
+        box-shadow: 1px 0 0 0 black, 0 -1px 0 0 black;
+        content: "";
+        display: block;
+        height: 0px;
+        position: absolute;
+        -webkit-transform: rotate(-45deg);
+        -moz-transform: rotate(-45deg);
+        -ms-transform: rotate(-45deg);
+        -o-transform: rotate(-45deg);
+        transform: rotate(-45deg);
+        right: 12px;
+        top: -6px;
+        width: 0px; }
+      header.global ol.user ul.dropdown-menu li {
+        display: block;
+        border-top: 1px solid rgba(0, 0, 0, 0.4);
+        -webkit-box-shadow: inset 0 1px 0 0 rgba(255, 255, 255, 0.05);
+        -moz-box-shadow: inset 0 1px 0 0 rgba(255, 255, 255, 0.05);
+        box-shadow: inset 0 1px 0 0 rgba(255, 255, 255, 0.05); }
+        header.global ol.user ul.dropdown-menu li:first-child {
+          border: none;
+          -webkit-box-shadow: none;
+          -moz-box-shadow: none;
+          box-shadow: none; }
+        header.global ol.user ul.dropdown-menu li > a {
+          -webkit-box-sizing: border-box;
+          -moz-box-sizing: border-box;
+          box-sizing: border-box;
+          -webkit-border-radius: 3px;
+          -moz-border-radius: 3px;
+          -ms-border-radius: 3px;
+          -o-border-radius: 3px;
+          border-radius: 3px;
+          color: rgba(255, 255, 255, 0.9);
+          display: block;
+          font: italic 1.2rem/1.4rem Georgia, Cambria, "Times New Roman", Times, serif;
+          height: auto;
+          margin: 5px 0px;
+          overflow: hidden;
+          padding: 3px 5px 4px;
+          text-shadow: none;
+          text-overflow: ellipsis;
+          text-transform: none;
+          -webkit-transition-property: padding;
+          -moz-transition-property: padding;
+          -ms-transition-property: padding;
+          -o-transition-property: padding;
+          transition-property: padding;
+          -webkit-transition-duration: 0.1s;
+          -moz-transition-duration: 0.1s;
+          -ms-transition-duration: 0.1s;
+          -o-transition-duration: 0.1s;
+          transition-duration: 0.1s;
+          -webkit-transition-timing-function: linear;
+          -moz-transition-timing-function: linear;
+          -ms-transition-timing-function: linear;
+          -o-transition-timing-function: linear;
+          transition-timing-function: linear;
+          -webkit-transition-delay: 0;
+          -moz-transition-delay: 0;
+          -ms-transition-delay: 0;
+          -o-transition-delay: 0;
+          transition-delay: 0;
+          white-space: nowrap;
+          width: 100%; }
+          header.global ol.user ul.dropdown-menu li > a:hover {
+            background: #1d9dd9;
+            background-image: -webkit-linear-gradient(-90deg, #5abbe9 0%, #1d9dd9 100%);
+            background-image: -moz-linear-gradient(-90deg, #5abbe9 0%, #1d9dd9 100%);
+            background-image: -ms-linear-gradient(-90deg, #5abbe9 0%, #1d9dd9 100%);
+            background-image: -o-linear-gradient(-90deg, #5abbe9 0%, #1d9dd9 100%);
+            background-image: linear-gradient(-90deg, #5abbe9 0%, #1d9dd9 100%);
+            border-color: black;
             -webkit-box-shadow: none;
             -moz-box-shadow: none;
-            box-shadow: none; }
-          header.app nav.user ol.user-options li > a {
-            -webkit-box-sizing: border-box;
-            -moz-box-sizing: border-box;
-            box-sizing: border-box;
-            color: rgba(255, 255, 255, 0.9);
-            display: block;
-            font: italic 1.2rem/1.4rem Georgia, Cambria, "Times New Roman", Times, serif;
-            height: auto;
-            margin: 5px 0px;
-            overflow: hidden;
-            padding: 3px 5px 4px;
-            text-shadow: none;
-            text-overflow: ellipsis;
-            text-transform: none;
-            -webkit-transition-property: padding;
-            -moz-transition-property: padding;
-            -ms-transition-property: padding;
-            -o-transition-property: padding;
-            transition-property: padding;
-            -webkit-transition-duration: 0.1s;
-            -moz-transition-duration: 0.1s;
-            -ms-transition-duration: 0.1s;
-            -o-transition-duration: 0.1s;
-            transition-duration: 0.1s;
-            -webkit-transition-timing-function: linear;
-            -moz-transition-timing-function: linear;
-            -ms-transition-timing-function: linear;
-            -o-transition-timing-function: linear;
-            transition-timing-function: linear;
-            -webkit-transition-delay: 0;
-            -moz-transition-delay: 0;
-            -ms-transition-delay: 0;
-            -o-transition-delay: 0;
-            transition-delay: 0;
-            white-space: nowrap;
-            width: 100%; }
-            header.app nav.user ol.user-options li > a:hover {
-              background: #1d9dd9;
-              background-image: -webkit-linear-gradient(-90deg, #5abbe9 0%, #1d9dd9 100%);
-              background-image: -moz-linear-gradient(-90deg, #5abbe9 0%, #1d9dd9 100%);
-              background-image: -ms-linear-gradient(-90deg, #5abbe9 0%, #1d9dd9 100%);
-              background-image: -o-linear-gradient(-90deg, #5abbe9 0%, #1d9dd9 100%);
-              background-image: linear-gradient(-90deg, #5abbe9 0%, #1d9dd9 100%);
-              border-color: black;
-              -webkit-box-shadow: none;
-              -moz-box-shadow: none;
-              box-shadow: none;
-              padding-left: 8px;
-              text-shadow: 0 -1px rgba(0, 0, 0, 0.2); }
+            box-shadow: none;
+            padding-left: 8px;
+            text-shadow: 0 -1px rgba(0, 0, 0, 0.2); }
 
 .highlighted-courses .courses, .find-courses .courses {
   zoom: 1;
@@ -1807,6 +1822,59 @@ header.app {
     transition-delay: 0; }
     .highlighted-courses .courses .course:nth-child(3n+3), .find-courses .courses .course:nth-child(3n+3) {
       margin-right: 0; }
+    .highlighted-courses .courses .course .meta-info, .find-courses .courses .course .meta-info {
+      background: rgba(0, 0, 0, 0.6);
+      bottom: 6px;
+      border: 1px solid rgba(0, 0, 0, 0.5);
+      -webkit-border-top-right-radius: 2px;
+      -moz-border-top-right-radius: 2px;
+      -moz-border-radius-topright: 2px;
+      -ms-border-top-right-radius: 2px;
+      -o-border-top-right-radius: 2px;
+      border-top-right-radius: 2px;
+      -webkit-border-bottom-right-radius: 2px;
+      -moz-border-bottom-right-radius: 2px;
+      -moz-border-radius-bottomright: 2px;
+      -ms-border-bottom-right-radius: 2px;
+      -o-border-bottom-right-radius: 2px;
+      border-bottom-right-radius: 2px;
+      -webkit-box-shadow: 0 1px 5px 0 rgba(0, 0, 0, 0.15);
+      -moz-box-shadow: 0 1px 5px 0 rgba(0, 0, 0, 0.15);
+      box-shadow: 0 1px 5px 0 rgba(0, 0, 0, 0.15);
+      zoom: 1;
+      position: absolute;
+      right: -3px;
+      -webkit-transition-property: all;
+      -moz-transition-property: all;
+      -ms-transition-property: all;
+      -o-transition-property: all;
+      transition-property: all;
+      -webkit-transition-duration: 0.15s;
+      -moz-transition-duration: 0.15s;
+      -ms-transition-duration: 0.15s;
+      -o-transition-duration: 0.15s;
+      transition-duration: 0.15s;
+      -webkit-transition-timing-function: linear;
+      -moz-transition-timing-function: linear;
+      -ms-transition-timing-function: linear;
+      -o-transition-timing-function: linear;
+      transition-timing-function: linear;
+      -webkit-transition-delay: 0;
+      -moz-transition-delay: 0;
+      -ms-transition-delay: 0;
+      -o-transition-delay: 0;
+      transition-delay: 0; }
+      .highlighted-courses .courses .course .meta-info:before, .highlighted-courses .courses .course .meta-info:after, .find-courses .courses .course .meta-info:before, .find-courses .courses .course .meta-info:after {
+        content: "";
+        display: table; }
+      .highlighted-courses .courses .course .meta-info:after, .find-courses .courses .course .meta-info:after {
+        clear: both; }
+      .highlighted-courses .courses .course .meta-info p, .find-courses .courses .course .meta-info p {
+        color: white;
+        font: 300 1.2rem/1.4rem "Open Sans", Verdana, Geneva, sans-serif;
+        padding: 5px 12px; }
+        .highlighted-courses .courses .course .meta-info p.university, .find-courses .courses .course .meta-info p.university {
+          float: left; }
     .highlighted-courses .courses .course .inner-wrapper, .find-courses .courses .course .inner-wrapper {
       border: 1px solid white;
       height: 100%;
@@ -1873,6 +1941,7 @@ header.app {
           .highlighted-courses .courses .course header.course-preview > a:hover h2, .find-courses .courses .course header.course-preview > a:hover h2 {
             text-decoration: underline; }
     .highlighted-courses .courses .course .info, .find-courses .courses .course .info {
+      background: white;
       height: 310px;
       left: 0px;
       position: absolute;
@@ -1898,47 +1967,6 @@ header.app {
       -o-transition-delay: 0;
       transition-delay: 0;
       width: 100%; }
-      .highlighted-courses .courses .course .info .meta-info, .find-courses .courses .course .info .meta-info {
-        background: rgba(0, 0, 0, 0.6);
-        bottom: 130px;
-        border-top: 1px solid rgba(0, 0, 0, 0.5);
-        zoom: 1;
-        position: absolute;
-        -webkit-transition-property: all;
-        -moz-transition-property: all;
-        -ms-transition-property: all;
-        -o-transition-property: all;
-        transition-property: all;
-        -webkit-transition-duration: 0.15s;
-        -moz-transition-duration: 0.15s;
-        -ms-transition-duration: 0.15s;
-        -o-transition-duration: 0.15s;
-        transition-duration: 0.15s;
-        -webkit-transition-timing-function: linear;
-        -moz-transition-timing-function: linear;
-        -ms-transition-timing-function: linear;
-        -o-transition-timing-function: linear;
-        transition-timing-function: linear;
-        -webkit-transition-delay: 0;
-        -moz-transition-delay: 0;
-        -ms-transition-delay: 0;
-        -o-transition-delay: 0;
-        transition-delay: 0;
-        width: 100%; }
-        .highlighted-courses .courses .course .info .meta-info:before, .highlighted-courses .courses .course .info .meta-info:after, .find-courses .courses .course .info .meta-info:before, .find-courses .courses .course .info .meta-info:after {
-          content: "";
-          display: table; }
-        .highlighted-courses .courses .course .info .meta-info:after, .find-courses .courses .course .info .meta-info:after {
-          clear: both; }
-        .highlighted-courses .courses .course .info .meta-info p, .find-courses .courses .course .info .meta-info p {
-          color: white;
-          font: 300 1.2rem/1.4rem "Open Sans", Verdana, Geneva, sans-serif;
-          padding: 5px 10px; }
-          .highlighted-courses .courses .course .info .meta-info p.university, .find-courses .courses .course .info .meta-info p.university {
-            float: left; }
-          .highlighted-courses .courses .course .info .meta-info p.dates, .find-courses .courses .course .info .meta-info p.dates {
-            float: right;
-            margin-top: 0px; }
       .highlighted-courses .courses .course .info .cover-image, .find-courses .courses .course .info .cover-image {
         height: 180px;
         overflow: hidden;
@@ -1948,14 +1976,46 @@ header.app {
           min-height: 100%;
           width: 100%; }
       .highlighted-courses .courses .course .info .desc, .find-courses .courses .course .info .desc {
-        background: white;
         -webkit-box-sizing: border-box;
         -moz-box-sizing: border-box;
         box-sizing: border-box;
-        height: 130px;
+        height: 100px;
         overflow: hidden;
-        padding: 10px;
+        padding: 10px 10px 15px 10px;
+        position: relative;
         width: 100%; }
+        .highlighted-courses .courses .course .info .desc p, .find-courses .courses .course .info .desc p {
+          height: 100%;
+          overflow: hidden;
+          text-overflow: ellipsis; }
+      .highlighted-courses .courses .course .info .bottom, .find-courses .courses .course .info .bottom {
+        -webkit-box-sizing: border-box;
+        -moz-box-sizing: border-box;
+        box-sizing: border-box;
+        zoom: 1;
+        padding: 6px 10px;
+        width: 100%; }
+        .highlighted-courses .courses .course .info .bottom:before, .highlighted-courses .courses .course .info .bottom:after, .find-courses .courses .course .info .bottom:before, .find-courses .courses .course .info .bottom:after {
+          content: "";
+          display: table; }
+        .highlighted-courses .courses .course .info .bottom:after, .find-courses .courses .course .info .bottom:after {
+          clear: both; }
+        .highlighted-courses .courses .course .info .bottom > p, .highlighted-courses .courses .course .info .bottom a, .find-courses .courses .course .info .bottom > p, .find-courses .courses .course .info .bottom a {
+          color: #a0a0a0;
+          font: 300 1.2rem/1.4rem "Open Sans", Verdana, Geneva, sans-serif;
+          letter-spacing: 1px;
+          padding: 0; }
+          .highlighted-courses .courses .course .info .bottom > p.university, .highlighted-courses .courses .course .info .bottom a.university, .find-courses .courses .course .info .bottom > p.university, .find-courses .courses .course .info .bottom a.university {
+            border-right: 1px solid #a0a0a0;
+            display: block;
+            float: left;
+            margin-right: 10px;
+            padding-right: 10px; }
+            .highlighted-courses .courses .course .info .bottom > p.university:hover, .highlighted-courses .courses .course .info .bottom a.university:hover, .find-courses .courses .course .info .bottom > p.university:hover, .find-courses .courses .course .info .bottom a.university:hover {
+              color: #1d9dd9; }
+          .highlighted-courses .courses .course .info .bottom > p.dates, .highlighted-courses .courses .course .info .bottom a.dates, .find-courses .courses .course .info .bottom > p.dates, .find-courses .courses .course .info .bottom a.dates {
+            float: left;
+            margin-top: 0px; }
     .highlighted-courses .courses .course:hover, .find-courses .courses .course:hover {
       background: #f5f5f5;
       border-color: #aaaaaa;
@@ -1964,8 +2024,8 @@ header.app {
       box-shadow: 0 1px 16px 0 rgba(29, 157, 217, 0.4); }
       .highlighted-courses .courses .course:hover .info, .find-courses .courses .course:hover .info {
         top: -130px; }
-        .highlighted-courses .courses .course:hover .info .meta-info, .find-courses .courses .course:hover .info .meta-info {
-          opacity: 0; }
+      .highlighted-courses .courses .course:hover .meta-info, .find-courses .courses .course:hover .meta-info {
+        opacity: 0; }
 
 .filter {
   height: 60px; }
@@ -2361,18 +2421,26 @@ header.app {
         color: #3c3c3c; }
 
 .home {
-  margin: 50px 10px 100px; }
+  margin: 0px 0px 100px; }
   .home > header {
+    background: #fafafa;
+    border-bottom: 1px solid #c8c8c8;
+    -webkit-box-shadow: inset 0 -1px 5px 0 rgba(0, 0, 0, 0.1);
+    -moz-box-shadow: inset 0 -1px 5px 0 rgba(0, 0, 0, 0.1);
+    box-shadow: inset 0 -1px 5px 0 rgba(0, 0, 0, 0.1);
     zoom: 1;
     min-height: 335px;
-    margin-bottom: 40px;
-    position: relative;
+    padding: 60px 0px 50px;
     width: 100%; }
     .home > header:before, .home > header:after {
       content: "";
       display: table; }
     .home > header:after {
       clear: both; }
+    .home > header .inner-wrapper {
+      max-width: 1200px;
+      margin: 0 auto;
+      position: relative; }
     .home > header .video-wrapper {
       right: 0px;
       position: absolute;
@@ -2534,7 +2602,6 @@ header.app {
     background-image: -ms-linear-gradient(180deg, rgba(245, 245, 245, 0) 0%, #f5f5f5 50%, rgba(245, 245, 245, 0) 100%);
     background-image: -o-linear-gradient(180deg, rgba(245, 245, 245, 0) 0%, #f5f5f5 50%, rgba(245, 245, 245, 0) 100%);
     background-image: linear-gradient(180deg, rgba(245, 245, 245, 0) 0%, #f5f5f5 50%, rgba(245, 245, 245, 0) 100%);
-    border-top: 1px solid #d2d2d2;
     border-bottom: 1px solid #d2d2d2;
     margin-bottom: 0px;
     overflow: hidden;
@@ -2732,8 +2799,15 @@ header.app {
     margin-bottom: 60px;
     width: 100%; }
     .home .highlighted-courses > h2 {
-      background: #f5f5f5;
-      border: 1px solid #dcdcdc;
+      background-image: -webkit-linear-gradient(-90deg, #fafafa, #e6e6e6);
+      background-image: -moz-linear-gradient(-90deg, #fafafa, #e6e6e6);
+      background-image: -ms-linear-gradient(-90deg, #fafafa, #e6e6e6);
+      background-image: -o-linear-gradient(-90deg, #fafafa, #e6e6e6);
+      background-image: linear-gradient(-90deg, #fafafa, #e6e6e6);
+      -webkit-box-shadow: inset 0 0 0 1px rgba(255, 255, 255, 0.4);
+      -moz-box-shadow: inset 0 0 0 1px rgba(255, 255, 255, 0.4);
+      box-shadow: inset 0 0 0 1px rgba(255, 255, 255, 0.4);
+      border: 1px solid #d2d2d2;
       border-top: none;
       -webkit-border-bottom-left-radius: 4px;
       -moz-border-bottom-left-radius: 4px;
@@ -2752,9 +2826,13 @@ header.app {
       box-shadow: 0 1px 8px 0 rgba(0, 0, 0, 0.1);
       color: #a0a0a0;
       letter-spacing: 1px;
+      margin-bottom: 0px;
       padding: 15px 10px;
       text-align: center;
-      text-transform: uppercase; }
+      text-transform: uppercase;
+      text-shadow: 0 1px rgba(255, 255, 255, 0.6); }
+      .home .highlighted-courses > h2 .lowercase {
+        text-transform: none; }
   .home .more-info {
     margin-bottom: 60px;
     width: 100%; }
@@ -3441,12 +3519,14 @@ nav.course-material {
     background: #f0f0f0;
     height: 600px; }
 
+.find-courses .container {
+  margin-bottom: 60px; }
 .find-courses header.search-intro {
   background: #f0f0f0;
   border-bottom: 1px solid #c8c8c8;
-  -webkit-box-shadow: inset 0 1px 5px 0 rgba(0, 0, 0, 0.1);
-  -moz-box-shadow: inset 0 1px 5px 0 rgba(0, 0, 0, 0.1);
-  box-shadow: inset 0 1px 5px 0 rgba(0, 0, 0, 0.1);
+  -webkit-box-shadow: inset 0 -1px 5px 0 rgba(0, 0, 0, 0.1);
+  -moz-box-shadow: inset 0 -1px 5px 0 rgba(0, 0, 0, 0.1);
+  box-shadow: inset 0 -1px 5px 0 rgba(0, 0, 0, 0.1);
   width: 100%; }
   .find-courses header.search-intro .inner-wrapper {
     height: 120px;
@@ -4092,6 +4172,7 @@ nav.course-material {
       .about .vision .message:last-child {
         margin-bottom: 0px; }
   .about .faq {
+    display: none;
     zoom: 1; }
     .about .faq:before, .about .faq:after {
       content: "";
@@ -4108,6 +4189,7 @@ nav.course-material {
       padding-right: 20px;
       width: 23.482%; }
       .about .faq nav.categories a {
+        color: #a0a0a0;
         display: block;
         letter-spacing: 1px;
         margin-right: -20px;
@@ -4115,6 +4197,7 @@ nav.course-material {
         text-align: right;
         text-transform: uppercase; }
         .about .faq nav.categories a:hover {
+          color: #1d9dd9;
           background: #f5f5f5; }
     .about .faq .responses {
       float: left;
diff --git a/lms/templates/course.html b/lms/templates/course.html
index a9abfca010..b6ad751e4e 100644
--- a/lms/templates/course.html
+++ b/lms/templates/course.html
@@ -14,16 +14,188 @@
       </a>
     </header>
     <section class="info">
-      <div class="meta-info">
-        <p class="university">${course.get_about_section('university')}</p>
-        <p class="dates"><span class="start">7/23/12</span> &rarr; <span class="end">12/15/12</span></p>
-      </div>
       <div class="cover-image">
         <img src="${static.url('images/courses/history.png')}">
       </div>
       <div class="desc">
-        <p>An advanced introduction to analog circuits.</p>
+        <p>${course.get_about_section('university')} An advanced introduction to analog circuits. An advanced introduction to analog circuits.</p>
+      </div>
+      <div class="bottom">
+        <a href="#" class="university">${course.institution}</a>
+        <p class="dates"><span class="start">7/23/12</span></p>
       </div>
     </section>
   </div>
+  <div class="meta-info">
+    <p class="university">${course.institution}</p>
+  </div>
+</article>
+%endfor
+
+<article id="${course.id}"class="course">
+  <div class="inner-wrapper">
+    <header class="course-preview">
+      <a href="${reverse('about_course', args=[course.id])}">
+        <hgroup>
+          <h2>${course.title}</h2>
+        </hgroup>
+        <div class="info-link">&#x2794;</div>
+      </a>
+    </header>
+    <section class="info">
+      <div class="cover-image">
+        <img src="${static.url('images/courses/math.png')}">
+      </div>
+      <div class="desc">
+        <p>An advanced introduction to analog circuits.</p>
+      </div>
+      <div class="bottom">
+        <a href="#" class="university">${course.institution}</a>
+        <p class="dates"><span class="start">7/23/12</span></p>
+      </div>
+    </section>
+  </div>
+  <div class="meta-info">
+    <p class="university">${course.institution}</p>
+  </div>
+</article>
+
+<article id="${course.id}"class="course">
+  <div class="inner-wrapper">
+    <header class="course-preview">
+      <a href="${reverse('about_course', args=[course.id])}">
+        <hgroup>
+          <h2>${course.title}</h2>
+        </hgroup>
+        <div class="info-link">&#x2794;</div>
+      </a>
+    </header>
+    <section class="info">
+      <div class="cover-image">
+        <img src="${static.url('images/courses/python.png')}">
+      </div>
+      <div class="desc">
+        <p>An advanced introduction to analog circuits.</p>
+      </div>
+      <div class="bottom">
+        <a href="#" class="university">${course.institution}</a>
+        <p class="dates"><span class="start">7/23/12</span></p>
+      </div>
+    </section>
+  </div>
+  <div class="meta-info">
+    <p class="university">${course.institution}</p>
+  </div>
+</article>
+
+<article id="${course.id}"class="course">
+  <div class="inner-wrapper">
+    <header class="course-preview">
+      <a href="${reverse('about_course', args=[course.id])}">
+        <hgroup>
+          <h2>${course.title}</h2>
+        </hgroup>
+        <div class="info-link">&#x2794;</div>
+      </a>
+    </header>
+    <section class="info">
+      <div class="cover-image">
+        <img src="${static.url('images/courses/space1.jpg')}">
+      </div>
+      <div class="desc">
+        <p>An advanced introduction to analog circuits.</p>
+      </div>
+      <div class="bottom">
+        <a href="#" class="university">${course.institution}</a>
+        <p class="dates"><span class="start">7/23/12</span></p>
+      </div>
+    </section>
+  </div>
+  <div class="meta-info">
+    <p class="university">${course.institution}</p>
+  </div>
+</article>
+
+<article id="${course.id}"class="course">
+  <div class="inner-wrapper">
+    <header class="course-preview">
+      <a href="${reverse('about_course', args=[course.id])}">
+        <hgroup>
+          <h2>${course.title}</h2>
+        </hgroup>
+        <div class="info-link">&#x2794;</div>
+      </a>
+    </header>
+    <section class="info">
+      <div class="cover-image">
+        <img src="${static.url('images/courses/space2.jpg')}">
+      </div>
+      <div class="desc">
+        <p>An advanced introduction to analog circuits.</p>
+      </div>
+      <div class="bottom">
+        <a href="#" class="university">${course.institution}</a>
+        <p class="dates"><span class="start">7/23/12</span></p>
+      </div>
+    </section>
+  </div>
+  <div class="meta-info">
+    <p class="university">${course.institution}</p>
+  </div>
+</article>
+
+<article id="${course.id}"class="course">
+  <div class="inner-wrapper">
+    <header class="course-preview">
+      <a href="${reverse('about_course', args=[course.id])}">
+        <hgroup>
+          <h2>${course.title}</h2>
+        </hgroup>
+        <div class="info-link">&#x2794;</div>
+      </a>
+    </header>
+    <section class="info">
+      <div class="cover-image">
+        <img src="${static.url('images/courses/space4.jpg')}">
+      </div>
+      <div class="desc">
+        <p>An advanced introduction to analog circuits.</p>
+      </div>
+      <div class="bottom">
+        <a href="#" class="university">${course.institution}</a>
+        <p class="dates"><span class="start">7/23/12</span></p>
+      </div>
+    </section>
+  </div>
+  <div class="meta-info">
+    <p class="university">${course.institution}</p>
+  </div>
+</article>
+
+<article id="${course.id}"class="course">
+  <div class="inner-wrapper">
+    <header class="course-preview">
+      <a href="${reverse('about_course', args=[course.id])}">
+        <hgroup>
+          <h2>${course.title}</h2>
+        </hgroup>
+        <div class="info-link">&#x2794;</div>
+      </a>
+    </header>
+    <section class="info">
+      <div class="cover-image">
+        <img src="${static.url('images/courses/space3.jpg')}">
+      </div>
+      <div class="desc">
+        <p>An advanced introduction to analog circuits.</p>
+      </div>
+      <div class="bottom">
+        <a href="#" class="university">${course.institution}</a>
+        <p class="dates"><span class="start">7/23/12</span></p>
+      </div>
+    </section>
+  </div>
+  <div class="meta-info">
+    <p class="university">${course.institution}</p>
+  </div>
 </article>
diff --git a/lms/templates/footer.html b/lms/templates/footer.html
index 45ae0d199a..3f5f5ce664 100644
--- a/lms/templates/footer.html
+++ b/lms/templates/footer.html
@@ -4,10 +4,8 @@
 <footer>
   <nav>
     <section class="copyright">
-      <a href="${reverse('root')}" class="logo">
-        <img src="${static.url('images/logo.png')}" />
-      </a>
-      <p>Copyright &copy; 2012.edX. <a href="#">Some rights reserved.</a></p>
+      <a href="${reverse('root')}" class="logo"></a>
+      <p>&copy; 2012 edX, <a href="#">some rights reserved.</a></p>
     </section>
     <ol>
       <li>
diff --git a/lms/templates/index.html b/lms/templates/index.html
index 9774eb3d45..66406695cd 100644
--- a/lms/templates/index.html
+++ b/lms/templates/index.html
@@ -2,9 +2,9 @@
 <%inherit file="main.html" />
 <%namespace name='static' file='static_content.html'/>
 
-<section class="container">
-  <section class="home">
-    <header>
+<section class="content-wrapper home">
+  <header>
+    <div class="inner-wrapper">
       <section class="video-wrapper">
         <div class="video-player">
           <div class="video-inner">
@@ -16,7 +16,7 @@
         <div class="intro">
           <h1>The Future of Online Education</h1>
           <p>
-            EdX is a joint partnership between The Massachusetts Institute of Technology (MIT) and Harvard University to offer online learning to millions of people around the world. EdX will offer Harvard and MIT classes online for free. Through this partnership, the institutions aim to extend their collective reach to build a global community of online learners and to improve education.
+            edX is a joint partnership between The Massachusetts Institute of Technology (MIT) and Harvard University to offer online learning to millions of people around the world. edX will offer Harvard and MIT classes online for free. Through this partnership, the institutions aim to extend their collective reach to build a global community of online learners and to improve education.
           </p>
         </div>
         <div class="signup-wrapper">
@@ -25,39 +25,42 @@
           </section>
         </div>
       </section>
-    </header>
-
-    <section class="university-partners">
-      <ol class="partners">
-        <li class="partner mit">
-          <a href="/university_profile.html">
-            <img src="${static.url('images/mit.png')}" />
-            <div class="name">
-              <span>MITx</span>
-            </div>
-          </a>
-        </li>
-        <li class="partner">
-          <a href="/university_profile.html">
-            <img src="${static.url('images/harvard.png')}" />
-            <div class="name">
-              <span>HarvardX</span>
-            </div>
-          </a>
-        </li>
-        <li class="partner">
-          <a href="/university_profile.html">
-            <img src="${static.url('images/berkeley.png')}" />
-            <div class="name">
-              <span>BerkeleyX</span>
-            </div>
-          </a>
-        </li>
-      </ol>
-    </section>
+    </div>
+  </header>
 
+  <section class="container">
     <section class="highlighted-courses">
-      <h2>Explore courses from edX universities</h2>
+    <h2>Explore courses from <span class="lowercase">edX</span> universities</h2>
+
+      <section class="university-partners">
+        <ol class="partners">
+          <li class="partner mit">
+            <a href="/university_profile.html">
+              <img src="${static.url('images/mit.png')}" />
+              <div class="name">
+                <span>MITx</span>
+              </div>
+            </a>
+          </li>
+          <li class="partner">
+            <a href="/university_profile.html">
+              <img src="${static.url('images/harvard.png')}" />
+              <div class="name">
+                <span>HarvardX</span>
+              </div>
+            </a>
+          </li>
+          <li class="partner">
+            <a href="/university_profile.html">
+              <img src="${static.url('images/berkeley.png')}" />
+              <div class="name">
+                <span>BerkeleyX</span>
+              </div>
+            </a>
+          </li>
+        </ol>
+      </section>
+
       <section class="courses">
         %for course in courses:
           <%include file="course.html" args="course=course" />
diff --git a/lms/templates/jobs.html b/lms/templates/jobs.html
index c8694ed723..0b7626dcaf 100644
--- a/lms/templates/jobs.html
+++ b/lms/templates/jobs.html
@@ -1,3 +1,5 @@
+<%namespace name='static' file='static_content.html'/>
+
 <%inherit file="main.html" />
 
 <section class="container jobs">
@@ -7,7 +9,7 @@
   <section class="company-mission message left">
     <div class="inner-wrapper">
       <div class="photo">
-        <img src="">
+        <img src="${static.url('images/courses/space5.jpg')}">
       </div>
       <h2>Mission: Educate 1 billion people around the world</h2>
       <p>“EdX represents a unique opportunity to improve education on our own campuses through online learning, while simultaneously creating a bold new educational path for millions of learners worldwide,” MIT President Susan Hockfield said.</p>
@@ -18,7 +20,7 @@
 
   <section class="our-culture message right">
     <div class="photo">
-      <img src="">
+      <img src="${static.url('images/courses/space2.jpg')}">
     </div>
     <h2>What it's like to work here</h2>
     <p>“Harvard and MIT will use these new technologies and the research they will make possible to lead the direction of online learning in a way that benefits our students, our peers, and people across the nation and the globe,” Faust continued.</p>
@@ -28,7 +30,7 @@
 
   <section class="benefits message left">
     <div class="photo">
-      <img src="">
+      <img src="${static.url('images/courses/space3.jpg')}">
     </div>
     <h2>Mission: Educate 1 billion people around the world</h2>
     <p>“EdX represents a unique opportunity to improve education on our own campuses through online learning, while simultaneously creating a bold new educational path for millions of learners worldwide,” MIT President Susan Hockfield said.</p>
diff --git a/lms/templates/navigation.html b/lms/templates/navigation.html
index 82912b33b5..5c74f619b9 100644
--- a/lms/templates/navigation.html
+++ b/lms/templates/navigation.html
@@ -3,63 +3,48 @@
 ## instead of using settings.COURSE_TITLE
 <%namespace name='static' file='static_content.html'/>
 <%! from django.core.urlresolvers import reverse %>
-<header class="app" aria-label="Global Navigation">
-  <section class="wrapper">
-    <a href="${reverse('root')}" class="logo">
-      <img src="${static.url('images/logo.png')}" />
-    </a>
-    <nav class="find-courses">
-      <ol>
-        <li class="primary">
-          <div class="divider"></div>
-          <a href="${reverse('courses')}">Find Courses</a>
-          <div class="divider"></div>
-        </li>
-        %if not user.is_authenticated():
-        <li class="secondary">
-          <a href="${reverse('about_edx')}">About</a>
-          <a href="#">Blog</a>
-          <a href="${reverse('jobs')}">Jobs</a>
-        </li>
-        %endif
-      </ol>
-    </nav>
 
-    %if user.is_authenticated():
-    <nav class="user">
-      <ol>
-        <li class="primary">
-          <div class="divider"></div>
-          <a href="${reverse('dashboard')}" class="user-link">
-            <span class="avatar"><img src="${static.url('images/profile.jpg')}" /></span>
-            ${user.username}
-          </a>
-          <div class="divider"></div>
-          <a href="#" class="options">&#9662</a>
-          <div class="divider"></div>
-          <ol class="user-options">
+<header class="global" aria-label="Global Navigation">
+  <nav>
+    <h1 class="logo"><a href="${reverse('root')}"></a></h1>
+    <ol class="find-courses">
+      <li class="primary">
+        <a href="${reverse('courses')}">Find Courses</a>
+      </li>
+    </ol>
+
+  %if user.is_authenticated():
+    <ol class="user">
+      <li class="primary">
+        <a href="${reverse('dashboard')}" class="user-link">
+          <span class="avatar"><img src="${static.url('images/profile.jpg')}" /></span>
+          ${user.username}
+        </a>
+      </li>
+      <li class="primary">
+        <a href="#" class="dropdown">&#9662</a>
+          <ul class="dropdown-menu">
             <li><a href="#">Account Settings</a></li>
             <li><a href="${reverse('help')}">Help</a></li>
             <li><a href="${reverse('logout')}">Log Out</a></li>
-          </ol>
-        </li>
-      </ol>
-    </nav>
+          </ul>
+      </li>
+    </ol>
 
-    %else:
-    <nav class="guest">
-      <ol>
-        <li class="primary">
-          <div class="divider"></div>
-          <a href="#" id="login">Log In</a>
-          <div class="divider"></div>
-          <a href="#" id="signup">Sign Up</a>
-          <div class="divider"></div>
-        </li>
-      </ol>
-    </nav>
-    %endif
-  </section>
+  %else:
+    <ol class="guest">
+      <li class="secondary">
+        <a href="${reverse('about_edx')}">About</a>
+        <a href="#">Blog</a>
+        <a href="${reverse('jobs')}">Jobs</a>
+        <a href="#" id="login">Log In</a>
+      </li>
+      <li class="primary">
+        <a href="#" id="signup">Sign Up</a>
+      </li>
+    </ol>
+  </nav>
+  %endif
 </header>
 
 %if not user.is_authenticated():