diff --git a/sass/_zen.scss b/sass/_zen.scss
index 1049aee..ac53db3 100644
--- a/sass/_zen.scss
+++ b/sass/_zen.scss
@@ -131,8 +131,12 @@ article {
   }
 
   code {
-    @include type-layout(s, 1);
+    @include type-layout(xs, 1);
     word-wrap: break-word;
+
+    @include respond-to(xxl) {
+      @include type-layout(xs-2, 1);
+    }
   }
 
   pre {
@@ -143,7 +147,11 @@ article {
     background-color: color(text-bg);
     overflow: auto;
     max-height: 250px;
-    max-width: 550px;
+    max-width: 90vw;
+
+    @include respond-to(s) {
+      max-width: 600px;
+    }
 
     & > code {
       display: inline-block;
@@ -319,21 +327,26 @@ figcaption {
 /* Mobile menu */
 
 .mobile-nav-wrapper {
-  position: fixed;
+  @include typeface(headings);
+  position: absolute;
   right: 0;
   top: 0;
   width: 100vw;
   height: 100vh;
   overflow: hidden;
-  z-index: 10;
+  z-index: 20;
   pointer-events: none;
+
+  .js-nav-open & {
+    position: fixed;
+  }
 }
 
 .mobile-nav-cover {
   position: absolute;
   width: 100vw;
   height: 100vh;
-  background-color: rgba(color(nearblack), .2);
+  background-color: rgba(color('black'), .2);
   opacity: 0;
 
   .js-nav-open & {
@@ -343,13 +356,12 @@ figcaption {
 }
 
 .mobile-nav-toggle {
-  @include typeface(headings);
   display: block;
   position: absolute;
   top: $zen-gutters / 2;
-  right: $zen-gutters + $zen-gutters / 2 + $zen-gutters / 4;
+  right: $zen-gutters / 2;
   padding: 3px ($zen-gutters + $zen-gutters / 4 + 4px) 2px 4px;
-  z-index: 12;
+  z-index: 22;
   text-decoration: none;
   font-weight: bold;
   line-height: 1;
@@ -377,13 +389,12 @@ figcaption {
 }
 
 .mobile-nav-sheet {
-  position: relative;
   background-color: color(header-bg);
   width: 90vw;
   height: 100vh;
   padding: 2rem;
   transform: translateX(100vw);
-  z-index: 11;
+  z-index: 21;
 
   .js-nav-open & {
     pointer-events: auto;
@@ -407,6 +418,10 @@ figcaption {
       }
     }
   }
+
+  .js-region {
+    @include padding(.5 0);
+  }
 }
 
 .mobile-nav-cover,
diff --git a/sass/components/header/_header.scss b/sass/components/header/_header.scss
index 318819c..d8de690 100644
--- a/sass/components/header/_header.scss
+++ b/sass/components/header/_header.scss
@@ -46,8 +46,11 @@
 
   // Wrapper for any blocks placed in the header region.
   &__region {
+    @include padding(.5 0);
+
     @include respond-to(s) {
       margin-left: auto;
+      padding: 0;
 
       @include rtl() {
         margin-right: auto;
diff --git a/sass/components/hidden/_hidden.scss b/sass/components/hidden/_hidden.scss
index dd4f678..34f34f5 100644
--- a/sass/components/hidden/_hidden.scss
+++ b/sass/components/hidden/_hidden.scss
@@ -24,3 +24,10 @@
     @extend %hidden;
   }
 }
+
+.nojs-hidden,
+%nojs-hidden {
+  html.nojs & {
+    @extend %hidden;
+  }
+}
diff --git a/sass/navigation/navbar/_navbar.scss b/sass/navigation/navbar/_navbar.scss
index 2df9f9c..cbcc3da 100644
--- a/sass/navigation/navbar/_navbar.scss
+++ b/sass/navigation/navbar/_navbar.scss
@@ -12,6 +12,7 @@
 .navbar,
 %navbar {
   display: flex;
+  flex-wrap: wrap;
   margin: 0;
   padding: 0;
   text-align: left;
diff --git a/static/js/script.js b/static/js/script.js
index 539b44a..fa475ea 100644
--- a/static/js/script.js
+++ b/static/js/script.js
@@ -8,7 +8,7 @@
   'use strict';
 
   // Add a js class to the html-tag when JavsScript is active.
-  $('html').addClass('js');
+  $('html').removeClass('nojs').addClass('js');
 
   // Activate the mobil menu for small screens.
   if (window.matchMedia) {
@@ -18,16 +18,21 @@
       $('.mobile-nav-wrapper').removeClass('hidden');
 
       // Populate the mobile nav sheet.
+      $('.header__region').removeClass('header__region region hidden').addClass('js-region').appendTo('.mobile-nav-sheet');
       $('.main-menu').addClass('hidden').clone().removeClass('main-menu layout__navigation layout__full hidden hidden').addClass('js-main-menu').appendTo('.mobile-nav-sheet').find('.navbar').removeClass('navbar').addClass('js-navbar');
-      $('.header__region').addClass('hidden').clone().removeClass('header__region region hidden').addClass('js-region').appendTo('.mobile-nav-sheet');
 
       // Toggle the mobile nav sheet.
       $('.mobile-nav-cover, .mobile-nav-toggle').on('click toushstart', function (e) {
         e.preventDefault();
-        $('.mobile-nav-wrapper').toggleClass('js-nav-open');
+        $('body').scrollTop(0).toggleClass('js-nav-open');
       });
 
     }
   }
 
+  // Display CSS grid layout warning to old browsers.
+  if (!window.CSS || !window.CSS.supports || !window.CSS.supports('display', 'grid')) {
+    $('.header').after('<div class="layout__grid-notice" role="complementary">Your browsers does not support modern grid layout so this page will not look or behave as it should. Resent versions of Chrome, Firefox and Safari all works so please update. Support is coming in Microsoft Edge as well, until then use another browser. <a href="https://www.whatbrowser.org/">What Browser?</a></div>');
+  }
+
 })(jQuery);