diff --git a/doc-src/Gemfile.lock b/doc-src/Gemfile.lock
index 75417ca8..b7a3c224 100644
--- a/doc-src/Gemfile.lock
+++ b/doc-src/Gemfile.lock
@@ -14,7 +14,7 @@ GIT
 PATH
   remote: ..
   specs:
-    compass (0.11.alpha.4.bc93883)
+    compass (0.11.alpha.4.e616fa1)
       chunky_png (~> 0.10.3)
       sass (>= 3.1.0.alpha.50)
 
diff --git a/doc-src/assets/javascripts/site.js b/doc-src/assets/javascripts/site.js
index 47b98a11..b273aee4 100644
--- a/doc-src/assets/javascripts/site.js
+++ b/doc-src/assets/javascripts/site.js
@@ -70,14 +70,14 @@ function getSyntaxPreference(defaultSyntax, defaultMarkup) {
 
   // add example styling preferences
   if ($('body').hasClass('demo')){
-    //markupCookie = $.cookie("compass-example-markup");
+    markupCookie = $.cookie("compass-example-markup");
     styleCookie = $.cookie("compass-example-style");
 
-    //markup = (markupCookie) ? markupCookie : defaultMarkup;
+    markup = (markupCookie) ? markupCookie : defaultMarkup;
     style = (styleCookie) ? styleCookie : defaultSyntax;
 
     changeExampleStyleSyntax(style)
-    //changeExampleMarkupSyntax(markup);
+    changeExampleMarkupSyntax(markup);
   }
 }
 
@@ -98,10 +98,11 @@ $('document').ready(function(){
     // Set Demo page syntax preferences
     } else if (target.parent().is('.syntax_pref')) {
       event.preventDefault();
-      //if (target.parent().parent().is('#markup')) {
-      //  changeExampleMarkupSyntax(target.attr("rel"), true);
-      //else
-      changeExampleStyleSyntax(target.attr("rel"), true);
+      if (target.parent().parent().is('#markup')) {
+        changeExampleMarkupSyntax(target.attr("rel"), true);
+      } else {
+        changeExampleStyleSyntax(target.attr("rel"), true);
+      }
 
     // Set Theme preference
     } else if (target.is('#theme_pref') || target.parent().is('#theme_pref')) {
diff --git a/doc-src/content/CHANGELOG.markdown b/doc-src/content/CHANGELOG.markdown
index 56f963e4..64c85d5d 100644
--- a/doc-src/content/CHANGELOG.markdown
+++ b/doc-src/content/CHANGELOG.markdown
@@ -2,7 +2,7 @@
 title: Compass History
 crumb: CHANGELOG
 body_id: changelog
-layout: article
+layout: default
 ---
 COMPASS CHANGELOG
 =================
diff --git a/doc-src/content/get-involved/index.haml b/doc-src/content/get-involved/index.haml
new file mode 100644
index 00000000..debd0668
--- /dev/null
+++ b/doc-src/content/get-involved/index.haml
@@ -0,0 +1,33 @@
+---
+title: Get involved with the Compass community
+crumb: Get Involved
+classnames:
+  - get-involved
+layout: default
+---
+
+%h1 Get Involved With Compass
+
+:markdown
+
+  Many [wonderful people](https://github.com/chriseppstein/compass/contributors) have helped to make Compass awesome.
+  Here are some ways you can get involved with the Compass community.
+
+  ## Share Sweet Stylesheets
+
+  So you've written some smashing Sass and you want to share them with others. Here are some ways you can.
+
+  1. [**Contribute to Compass**](/help/tutorials/contributing).
+  2. [**Develop a Compass Extension**](/help/tutorials/extensions).
+  3. [**Contribute to Sass Recipies**](http://chriseppstein.github.com/sass-recipes/).
+  4. Publish your code somewhere and email a link to the [mailing list](http://groups.google.com/group/compass-users).
+
+  ## Help Others
+
+  Join the [mailing list](http://groups.google.com/group/compass-users) and help answer questions and share from your experience. If you're
+  writing a blog post about Sass or Compass send a link to the mailing list and we'll help you spread the word.
+
+  ## Give Financially
+
+  Compass is charityware. We ask users to [donate to United Mitochondrial Disease Foundation](http://umdf.org/compass)
+  to support their efforts to find a cure for this disease.
diff --git a/doc-src/content/help/tutorials.haml b/doc-src/content/help/tutorials.haml
index f94b392b..dbeb2ee5 100644
--- a/doc-src/content/help/tutorials.haml
+++ b/doc-src/content/help/tutorials.haml
@@ -7,6 +7,15 @@ layout: tutorial
 ---
 %h1 Compass Tutorials
 
-%p
-  The compass tutorials are still a Work-in-progress, but
-  what we have is available for you to peruse.
+:markdown
+  These tutorials are still a work-in-progress, if you have questions that aren't covered here let us know on the [Compass users mailing list](http://groups.google.com/group/compass-users) where there are lots of
+  friendly Compass users standing by to help you out.
+
+  ## New to Compass?
+
+  If you're new to Compass, you might be interested in [best practices](/help/tutorials/best-practices), the [configuration reference](/help/tutorials/configuration-reference), [configurable variables](/help/tutorials/configurable-variables),
+  or the [command line documentation](/help/tutorials/command-line).
+
+  ## Want to contribute?
+
+  If you've been using Compass for a while and you'd like to give back, check out the tutorials on [contributing](/help/tutorials/contributing) and [creating extensions](/help/tutorials/extensions).
diff --git a/doc-src/content/stylesheets/partials/_code.scss b/doc-src/content/stylesheets/partials/_code.scss
index 6c5e4a40..6b5858c9 100644
--- a/doc-src/content/stylesheets/partials/_code.scss
+++ b/doc-src/content/stylesheets/partials/_code.scss
@@ -1,12 +1,16 @@
 //html.sass .mixin-source .scss, html.scss .mixin-source .sass { @extend .hide;}
 .mixin-source, .example-source {
   position: relative; @extend .fixed-font;
-  .syntaxhighlighter {
-  &.scss, &.sass, &.css { display: none; } } }
+  .syntaxhighlighter, pre {
+  &.scss, &.sass, &.css, &.haml, &.html { display: none; } } }
 
 html.sass { .mixin-source .syntaxhighlighter.sass, .example-source .syntaxhighlighter.sass { display: block; } }
 html.scss { .mixin-source .syntaxhighlighter.scss, .example-source .syntaxhighlighter.scss { display: block; } }
 html.css .example-source .syntaxhighlighter.css { display: block; }
+html.html .example-source .html { display: block; }
+html.haml .example-source .haml { display: block; }
+
+
 
 .mixin-source { display: none; }
 
diff --git a/doc-src/content/stylesheets/partials/_example.scss b/doc-src/content/stylesheets/partials/_example.scss
index b8e30010..57fbeee6 100644
--- a/doc-src/content/stylesheets/partials/_example.scss
+++ b/doc-src/content/stylesheets/partials/_example.scss
@@ -20,7 +20,6 @@ html.light #demo, html.dark #demo {
   section + section { float: right; }
 
   .example-source { clear: both; }
-  #markup { margin-top: 12px; }
 }
 
 
diff --git a/doc-src/content/stylesheets/partials/_layout.scss b/doc-src/content/stylesheets/partials/_layout.scss
index 3c04f4be..8f263e94 100644
--- a/doc-src/content/stylesheets/partials/_layout.scss
+++ b/doc-src/content/stylesheets/partials/_layout.scss
@@ -18,4 +18,4 @@ header { padding: 22px 0 0; position: relative; }
 aside { float: left; width: $side-nav-width; position: relative; z-index: 2;}
 
 body#home #page article { padding-left: 0;}
-body.site, body#changelog { max-width: 1024px; }
+body.site, body#changelog, body.default { max-width: 1024px; }
diff --git a/doc-src/content/stylesheets/partials/_main.scss b/doc-src/content/stylesheets/partials/_main.scss
index cd91ae18..be5ec4b1 100644
--- a/doc-src/content/stylesheets/partials/_main.scss
+++ b/doc-src/content/stylesheets/partials/_main.scss
@@ -1,3 +1,5 @@
+body.get-involved h1 + p { font-size: 1.2em; line-height: 1.45em; }
+
 #page {
   position: relative;
   padding-top: 40px;
@@ -19,7 +21,7 @@
 #syntax_pref, .syntax_pref { padding: 4px 8px 5px; a { font-size: .9em; padding: 0px 6px 1px; display: inline-block; line-height: 1.45em;} }
 
 .syntax_pref {
-  float: right; @include round-top-corners; border: 1px solid; border-bottom: 0;
+  float: left; @include round-top-corners; border: 1px solid; border-bottom: 0;
   a { text-decoration: none; }
 }
 
diff --git a/doc-src/content/stylesheets/partials/_theme.scss b/doc-src/content/stylesheets/partials/_theme.scss
index b2ee864c..aae569a2 100644
--- a/doc-src/content/stylesheets/partials/_theme.scss
+++ b/doc-src/content/stylesheets/partials/_theme.scss
@@ -13,6 +13,7 @@
   body.tutorial #main-nav a[rel=help],
   body.reference #main-nav a[rel=documentation],
   body#changelog #main-nav a[rel=documentation],
+  body.demo #main-nav a[rel=documentation],
   body#get-involved #main-nav a[rel=get-involved]{ color: $main-nav-selected; }
 
   #search-docs input {
@@ -65,8 +66,8 @@
   #module-nav li.selected { @extend .selected-marker-#{$theme};
     a { color: $module-nav-selected; } }
 
-  a[rel=sass], a[rel=scss], a[rel=css] { @extend .syntax-switch-#{$theme}; }
-  &.sass a[rel=sass], &.scss a[rel=scss], &.css a[rel=css] { color: $heading; color: rgba($heading, .7); @extend .round-corners-em; @extend .inset-panel-#{$theme}; }
+  a[rel=sass], a[rel=scss], a[rel=css], a[rel=html], a[rel=haml] { @extend .syntax-switch-#{$theme}; }
+  &.sass a[rel=sass], &.scss a[rel=scss], &.css a[rel=css], &.html a[rel=html], &.haml a[rel=haml] { color: $heading; color: rgba($heading, .7); @extend .round-corners-em; @extend .inset-panel-#{$theme}; }
 
   #version { color: rgba($heading, .3); a { color: rgba($nav-link, .7); } }
   .mixin-source, .example-source { @extend .mixin-panel-#{$theme}; }
diff --git a/doc-src/layouts/default.haml b/doc-src/layouts/default.haml
index 9676f54c..36592fba 100644
--- a/doc-src/layouts/default.haml
+++ b/doc-src/layouts/default.haml
@@ -1,21 +1,29 @@
-!!! Strict
-%html
+!!!5
+- # This template is just the stuff until the body tag.
+%html.no-js{:dir => "ltr", :lang => "en"}
   %head
-    %title
-      #{@item[:title]} - Compass
-    %meta{ :content => "text/html; charset=utf-8", "http-equiv" => "Content-Type" }
+    %meta{:charset => "utf-8"}/
+    %meta{:content => "chrome=1", "http-equiv" => "X-UA-Compatible"}
     %meta(name="viewport" content="width=780")
-    - if @item[:meta_description]
-      %meta{:name => "description", :content => @item[:meta_description]}
     %link(rel="shortcut icon" type="image/png" href="/images/compass_icon.png")
-    %link{ :href => "/stylesheets/legacy/main.css", :rel => "stylesheet", :type => "text/css", :media => "screen" }
-    %script{:src => "/javascripts/jquery-1.3.2.min.js", :type => "text/javascript"}
-  %body{body_attributes(@item)}
-    #container
-      #main
-        = yield
-      #sidebar
-        = render "partials/sidebar", :default_stylesheet => "_compass.scss"
-      #footer= render "partials/footer"
-    %script(src="/javascripts/fixups.js" deferred)
+    %title
+      #{@item[:title]} | Compass Documentation
+    %link{:charset => "utf-8", :href => "/stylesheets/screen.css", :rel => "stylesheet", :type => "text/css"}
+    %script(src="/javascripts/jquery-1.3.2.min.js" type="text/javascript")
+    %script(src="/javascripts/jquery.cookie.js" type="text/javascript")
+    %script(src="/javascripts/site.js" type="text/javascript")
+    %script(src="/javascripts/modernizr-1.6.min.js" type="text/javascript")
+  %body.default{body_attributes(@item)}
+    #wrap
+      = render "partials/main-navigation"
+      #page
+        #docs_panel
+          #theme_pref
+            %a{:href => "#", :rel => "theme", :title => "switch theme" } Q
+          #version
+            Version:
+            %a.number(href="/CHANGELOG/")= compass_version
+        %article= yield
+      %footer(role="contentinfo")= render "partials/footer"
     = render "partials/analytics"
+
diff --git a/doc-src/layouts/partials/example.haml b/doc-src/layouts/partials/example.haml
index 9b9520da..554bbaf4 100644
--- a/doc-src/layouts/partials/example.haml
+++ b/doc-src/layouts/partials/example.haml
@@ -5,12 +5,12 @@
 
 #how
   %section#markup
-    -#.syntax_pref
+    .syntax_pref
       %a{:href => "#", :rel => "html" } html
       %a{:href => "#", :rel => "haml" } haml
     .example-source
       %pre.source-code.html= h(example_html)
-      -# %pre.source-code.haml= h(example_haml)
+      %pre.source-code.haml= h(example_haml)
   %section#styles
     .syntax_pref
       %a{:href => "#", :rel => "scss" } scss