diff --git a/dashboard-ui/css/site.css b/dashboard-ui/css/site.css
index 8431512b76..be270cb0d1 100644
--- a/dashboard-ui/css/site.css
+++ b/dashboard-ui/css/site.css
@@ -59,7 +59,7 @@ h1 {
 }
 
 .toolsSidebar h1 {
-    font-size: 36pt;
+    font-size: 40px;
 }
 
 .ui-loader h1 {
@@ -123,7 +123,7 @@ pre, textarea.pre {
     Header
     */
 .header {
-    padding: 15px 0 15px 15px;
+    padding: 10px 0 0 15px;
 }
 
 .imgLogoIcon {
@@ -144,8 +144,8 @@ pre, textarea.pre {
 .headerButtons {
     float: right;
     position: absolute;
-    top: 15px;
-    right: 20px;
+    top: 10px;
+    right: 5px;
 }
 
 .header .imageLink {
@@ -210,13 +210,6 @@ h1 .imageLink {
         cursor: default;
     }
 
-/*
-    Forms
-    */
-form, .readOnlyContent {
-    max-width: 600px;
-}
-
 .fieldDescription {
     font-size: 12px;
     padding-left: 5px;
@@ -251,21 +244,17 @@ form, .readOnlyContent {
     margin-bottom: 0!important;
 }
 
-.content-primary {
-    padding-top: 25px;
-}
-
-
 .content-secondary {
     z-index: 99996;
     background: #262626;
     border: 0;
     margin-top: 40px;
+    display: none;
 }
 
     .content-secondary h1 {
         margin: 0;
-        padding: 20px 0 20px 30px;
+        padding: 20px 0 15px 20px;
         color: #fff;
     }
 
@@ -275,7 +264,7 @@ form, .readOnlyContent {
     text-decoration: none;
     color: #fff!important;
     text-shadow: none!important;
-    font-weight: normal!important;
+    font-weight: 400!important;
     font-size: 17px;
 }
 
@@ -312,6 +301,46 @@ form, .readOnlyContent {
     padding-bottom: 100px;
 }
 
+.dashboardPanelDivider {
+    height: 1px;
+    background: #444;
+    margin: .25em 0;
+}
+
+.dashboardPanelLink {
+    padding: .75em .5em .75em 1.25em;
+    display: block;
+    text-decoration: none;
+    font-size: 14px;
+    color: #fff!important;
+    font-weight: normal !important;
+}
+
+    .dashboardPanelLink:hover {
+        background: #f2f2f2;
+           color: #000!important;
+ }
+
+.selectedDashboardPanelLink {
+    background: #2572EB;
+    color: #fff!important;
+}
+
+.dashboardPanel .ui-panel-inner {
+    padding: 0;
+}
+
+.dashboardPanel {
+    background: #262626!important;
+}
+
+@media all and (min-width: 450px) {
+
+    .currentUsername {
+        display: inline;
+    }
+}
+
 @media all and (min-width: 650px) {
 
     .imgLogoIcon {
@@ -321,14 +350,30 @@ form, .readOnlyContent {
     .imageLink.supporterIcon {
         display: inline-block;
     }
+}
+
+@media all and (min-width: 750px) {
+
+    /*
+    Forms
+    */
+    form, .readOnlyContent {
+        max-width: 600px;
+    }
+
+    .imgLogoText {
+        height: 50px;
+        display: inline;
+    }
+
+    .header {
+        padding-top: 15px;
+        padding-bottom: 15px;
+    }
 
     .headerButtons {
         top: 20px;
-        right: 30px;
-    }
-
-    .currentUsername {
-        display: inline;
+        right: 20px;
     }
 
     .type-interior > .ui-content, .type-interior > .ui-panel-content-wrap > .ui-content {
@@ -340,18 +385,19 @@ form, .readOnlyContent {
 
     .content-secondary {
         text-align: left;
-        width: 45%;
+        width: 34%;
         position: fixed;
         top: 0;
         left: 0;
         bottom: 0;
         margin: 0;
+        display: block;
     }
 
     .content-primary {
-        width: 45%;
+        width: 56%;
         float: right;
-        padding: 40px 6% 3em 0;
+        padding: 10px 6% 3em 0;
         margin: 0;
     }
 
@@ -360,22 +406,6 @@ form, .readOnlyContent {
         }
 }
 
-@media all and (min-width: 750px) {
-
-    .imgLogoText {
-        height: 50px;
-        display: inline;
-    }
-
-    .content-secondary {
-        width: 34%;
-    }
-
-    .content-primary {
-        width: 56%;
-    }
-}
-
 @media all and (min-width: 850px) {
 
     .content-primary {
@@ -383,6 +413,13 @@ form, .readOnlyContent {
     }
 }
 
+@media all and (min-width: 900px) {
+
+    .header {
+        padding-top: 0;
+    }
+}
+
 @media all and (min-width: 1200px) {
 
 
diff --git a/dashboard-ui/scripts/site.js b/dashboard-ui/scripts/site.js
index 630957eadc..13494042ad 100644
--- a/dashboard-ui/scripts/site.js
+++ b/dashboard-ui/scripts/site.js
@@ -575,10 +575,17 @@ var Dashboard = {
             }
 
             headerHtml += '</a>';
+
+            if (page.hasClass('type-interior')) {
+                headerHtml += '<div>';
+                headerHtml += '<button type="button" data-icon="bars" data-inline="true" data-iconpos="notext" class="ui-alt-icon" onclick="Dashboard.showDashboardMenu();">Menu</button>';
+                headerHtml += '</div>';
+            }
+
             headerHtml += '</div>';
             page.prepend(headerHtml);
 
-            header = $('.header', page);
+            header = $('.header', page).trigger('create');
         }
 
         var imageColor = "black";
@@ -605,14 +612,14 @@ var Dashboard = {
             headerHtml += '</a>';
 
             if (user.Configuration.IsAdministrator) {
-                headerHtml += '<a class="imageLink btnTools" href="dashboard.html"><img src="css/images/tools' + imageColor + '.png" /></a>';
+                headerHtml += '<a class="imageLink btnTools" href="dashboard.html" data-role="button" data-icon="gear" data-inline="true" data-iconpos="notext">Tools</a>';
             }
 
         }
 
         headerHtml += '</div>';
 
-        header.append(headerHtml);
+        header.append(headerHtml).trigger('create');
 
         if (!$('.supporterIcon', header).length) {
 
@@ -647,9 +654,11 @@ var Dashboard = {
 
             var links = Dashboard.getToolsMenuLinks(page);
 
-            for (var i = 0, length = links.length; i < length; i++) {
+            var i, length, link;
 
-                var link = links[i];
+            for (i = 0, length = links.length; i < length; i++) {
+
+                link = links[i];
 
                 if (link.divider) {
                     html += "<div class='sidebarDivider'></div>";
@@ -666,18 +675,49 @@ var Dashboard = {
                 }
             }
 
-            //html += '<a href="edititemmetadata.html">Metadata Manager</a>';
-
             // collapsible
             html += '</div>';
 
             // content-secondary
             html += '</div>';
 
-            $(page).append(html);
+            html += '<div data-role="panel" id="dashboardPanel" class="dashboardPanel" data-position="left" data-display="overlay" data-position-fixed="true" data-theme="b">';
+
+            html += '<a href="index.html" class="imageLink" style="display: inline-block;margin: 20px 0 20px 15px;"><img src="css/images/mblogoicon.png" style="height:24px;" /></a>';
+
+            for (i = 0, length = links.length; i < length; i++) {
+
+                link = links[i];
+
+                if (link.divider) {
+                    html += "<div class='dashboardPanelDivider'></div>";
+                }
+
+                if (link.href) {
+
+                    if (link.selected) {
+                        html += '<a class="selectedDashboardPanelLink dashboardPanelLink" href="' + link.href + '">' + link.name + '</a>';
+                    } else {
+                        html += '<a class="dashboardPanelLink" href="' + link.href + '">' + link.name + '</a>';
+                    }
+
+                }
+            }
+
+            html += '</div>';
+
+            $(page).append(html).trigger('create');
         }
     },
 
+    showDashboardMenu: function () {
+
+        var page = $.mobile.activePage;
+
+
+        $("#dashboardPanel", page).panel("open");
+    },
+
     getToolsMenuLinks: function (page) {
 
         var pageElem = page[0];