diff --git a/css/button.css b/css/button.css
index b75191d0..daa1d4e1 100644
--- a/css/button.css
+++ b/css/button.css
@@ -84,6 +84,7 @@ button [class*=" icon-"],
 
 .button.active {
   border-bottom-color: rgb(var(--accent));
+  color: var(--white);
 }
 
 .button-small {
diff --git a/css/menu.css b/css/menu.css
index 727ef57d..b68040bc 100644
--- a/css/menu.css
+++ b/css/menu.css
@@ -12,6 +12,10 @@
   z-index: var(--z-index-menu);
 }
 
+.menu:focus {
+  outline: 0;
+}
+
 .is-menu-open .menu {
   transform: translateY(0);
 }
@@ -89,11 +93,6 @@
   padding-bottom: 1.5em;
 }
 
-.menu-nav-button.active {
-  background-color: var(--gray-04);
-  color: var(--white);
-}
-
 @media (min-width: 550px) {
   .menu {
     max-height: calc(90vh - 2em);
@@ -116,11 +115,13 @@
   .menu {
     width: calc(60vw - 2em);
     max-height: calc(100vh - 2em);
+    max-width: 40em;
   }
 }
 
 @media (min-width: 1100px) {
   .menu {
     width: calc(50vw - 2em);
+    max-width: 50em;
   }
 }
diff --git a/index.html b/index.html
index 86fe6e07..60293c04 100644
--- a/index.html
+++ b/index.html
@@ -85,7 +85,7 @@
     </div>
   </section>
 
-  <section class="menu">
+  <section class="menu" tabindex="1">
     <div class="menu-area">
 
       <div class="menu-nav">
diff --git a/js/menu.js b/js/menu.js
index 1f854f44..06ecfa14 100644
--- a/js/menu.js
+++ b/js/menu.js
@@ -51,7 +51,7 @@ var menu = (function() {
     var html = helper.e("html");
     if (state.get().menu.active) {
       helper.addClass(html, "is-menu-open");
-      helper.e(".menu-nav-button.active").focus();
+      helper.e(".menu").focus();
       shade.render({
         action: function() {
           close();