diff --git a/css/style.css b/css/style.css
index 4c5d7b9..96aae4e 100644
--- a/css/style.css
+++ b/css/style.css
@@ -11,6 +11,9 @@
 .usa-nav {
   z-index: 500;
 }
+.usa-overlay {
+  z-index: 499;
+}
 
 /* Some basic styling of horizontal button situations, like local tasks. */
 .uswds-horizontal-list li {
@@ -93,3 +96,27 @@ label.visually-hidden + input[type=checkbox] {
 .search-block-form {
   display: inline-block;
 }
+
+/* Mobile nav styling - may be temporary if this PR
+   is merged: https://github.com/18F/web-design-standards/pull/2020
+*/
+.usa-nav-desktop {
+  display: none;
+}
+@media screen and (min-width: 951px) {
+  .usa-nav-mobile {
+    display: none;
+  }
+  .usa-nav-desktop {
+    display: block;
+  }
+}
+
+/* More mobile nav styling fixes */
+.usa-nav-mobile .usa-sidenav-sub_list[aria-hidden=true] {
+  display: none;
+}
+.usa-nav-mobile .usa-sidenav-sub_list {
+  padding: 0;
+  overflow: visible;
+}
diff --git a/examples/my_subtheme/my_subtheme.info.yml.rename-me b/examples/my_subtheme/my_subtheme.info.yml.rename-me
index ab13c34..cd3b910 100644
--- a/examples/my_subtheme/my_subtheme.info.yml.rename-me
+++ b/examples/my_subtheme/my_subtheme.info.yml.rename-me
@@ -29,6 +29,7 @@ regions:
   header: 'Header'
   primary_menu: 'Primary Menu'
   secondary_menu: 'Secondary Menu'
+  mobile_menu: 'Mobile Menu'
   sidebar_first: 'First sidebar'
   sidebar_second: 'Second sidebar'
   breadcrumb: 'Breadcrumb'
diff --git a/includes/menus.inc b/includes/menus.inc
index 05e486b..8bb7fed 100644
--- a/includes/menus.inc
+++ b/includes/menus.inc
@@ -15,7 +15,7 @@ function uswds_theme_suggestions_block_alter(array &$suggestions, array $variabl
   if (in_array('block__system_menu_block', $suggestions)) {
     if (!empty($variables['elements']['#id'])) {
       $block = Block::load($variables['elements']['#id']);
-      $menu_regions = ['primary_menu', 'secondary_menu', 'sidebar_first', 'footer_menu'];
+      $menu_regions = ['primary_menu', 'secondary_menu', 'mobile_menu', 'sidebar_first', 'footer_menu'];
       if (in_array($block->getRegion(), $menu_regions)) {
         $suggestions[] = 'block__system_menu_block__' . $block->getRegion();
       }
@@ -52,3 +52,33 @@ function _uswds_mark_menu_items(&$variables, $region) {
     $item['#uswds_region'] = $region;
   }
 }
+
+/**
+ * Helper function to find the active menu item.
+ *
+ * @param array $items
+ *   Array of items as passed into hook_preprocess_menu().
+ *
+ * @return
+ *   TRUE if found, FALSE if not.
+ *
+ * @TODO: SURELY there is a better way to mark the current
+ * menu item in Drupal 8??
+ */
+function _uswds_find_active_menu_item(&$items) {
+  $current_path = \Drupal::request()->getRequestUri();
+  foreach ($items as &$item) {
+    if ($item['url']->toString() == $current_path) {
+      $item['is_current'] = TRUE;
+      // No need to keep looking.
+      return TRUE;
+    }
+    if (!empty($item['below'])) {
+      $found = _uswds_find_active_menu_item($item['below']);
+      if ($found) {
+        return TRUE;
+      }
+    }
+  }
+  return FALSE;
+}
diff --git a/preprocess/block/block__system_menu_block__mobile_menu.preprocess.inc b/preprocess/block/block__system_menu_block__mobile_menu.preprocess.inc
new file mode 100644
index 0000000..1603467
--- /dev/null
+++ b/preprocess/block/block__system_menu_block__mobile_menu.preprocess.inc
@@ -0,0 +1,16 @@
+<?php
+
+/**
+ * @file
+ * Preprocess function for this hook.
+ */
+
+/**
+ * Implements hook_preprocess_block__DELTA__REGION().
+ *
+ * This made possible by our custom theme suggestion.
+ * @see uswds_theme_suggestions_block_alter().
+ */
+function uswds_preprocess_block__system_menu_block__mobile_menu(&$variables) {
+  _uswds_mark_menu_items($variables, 'mobile_menu');
+}
diff --git a/preprocess/menu/menu__mobile_menu.preprocess.inc b/preprocess/menu/menu__mobile_menu.preprocess.inc
new file mode 100644
index 0000000..c1581c7
--- /dev/null
+++ b/preprocess/menu/menu__mobile_menu.preprocess.inc
@@ -0,0 +1,24 @@
+<?php
+
+/**
+ * @file
+ * Preprocess function for this hook.
+ */
+
+/**
+ * Implements hook_preprocess_menu__REGION().
+ *
+ * This made possible by our custom theme suggestion.
+ * @see uswds_theme_suggestions_menu_alter().
+ */
+function uswds_preprocess_menu__mobile_menu(&$variables) {
+
+  // Pass in uuids to help match accordion buttons with content.
+  foreach ($variables['items'] as &$item) {
+    $uuid = $item['original_link']->getDerivativeId();
+    $item['uuid'] = $uuid;
+  }
+
+  // Indicate which item is current with "is_current".
+  _uswds_find_active_menu_item($variables['items']);
+}
diff --git a/templates/system/block/block--system-menu-block--mobile_menu.html.twig b/templates/system/block/block--system-menu-block--mobile_menu.html.twig
new file mode 100644
index 0000000..e84ac26
--- /dev/null
+++ b/templates/system/block/block--system-menu-block--mobile_menu.html.twig
@@ -0,0 +1,7 @@
+{#
+/**
+ * @file
+ * Minimal markup for a USWDS menu block.
+ */
+#}
+{{ content }}
diff --git a/templates/system/layout/page.html.twig b/templates/system/layout/page.html.twig
index e4099d3..df257e2 100644
--- a/templates/system/layout/page.html.twig
+++ b/templates/system/layout/page.html.twig
@@ -29,13 +29,25 @@
     {{ page.header }}
   </div>
 
+  <div class="usa-overlay"></div>
   <div class="usa-nav" role="navigation">
     <div class="usa-nav-inner">
 
-      {% if page.primary_menu %}
       <button class="usa-nav-close">
         <img src="{{ active_theme_path }}/assets/img/close.svg" alt="close" />
       </button>
+
+      {% if page.mobile_menu %}
+      <div class="usa-nav-mobile">
+        {{ page.mobile_menu }}
+      </div>
+      {% endif %}
+
+      {% if page.mobile_menu %}
+      <div class="usa-nav-desktop">
+      {% endif %}
+
+      {% if page.primary_menu %}
       {{ page.primary_menu }}
       {% endif %}
 
@@ -43,6 +55,10 @@
       {{ page.secondary_menu }}
       {% endif %}
 
+      {% if page.mobile_menu %}
+      </div>
+      {% endif %}
+
     </div>
   </div>
 
diff --git a/templates/system/menu/menu--mobile_menu.html.twig b/templates/system/menu/menu--mobile_menu.html.twig
new file mode 100644
index 0000000..939008e
--- /dev/null
+++ b/templates/system/menu/menu--mobile_menu.html.twig
@@ -0,0 +1,50 @@
+{#
+/**
+ * @file
+ * Override of system/menu.html.twig for the mobile menu.
+ */
+#}
+
+{% import _self as menus %}
+
+{#
+  We call a macro which calls itself to render the full tree.
+  @see http://twig.sensiolabs.org/doc/tags/macro.html
+#}
+{{ menus.menu_links(items, 0, NULL) }}
+
+{% macro menu_links(items, menu_level, parent) %}
+  {% import _self as menus %}
+
+  {% if items %}
+
+    {% if menu_level == 0 %}
+    <ul class="usa-sidenav-list usa-accordion" aria-multiselectable="true">
+    {% else %}
+    <ul id="mobilemenu-{{ parent.uuid }}" class="usa-sidenav-sub_list">
+      <li>
+        <a href="{{ parent.url }}"{% if parent.is_current %} class="usa-current"{% endif %}>
+          <span>{{ parent.title }}</span>
+        </a>
+      </li>
+    {% endif %}
+
+    {% for item in items %}
+      <li>
+
+        {% if item.below %}
+        <button class="usa-accordion-button" aria-expanded="{{ item.in_active_trail ? 'true' : 'false' }}" aria-controls="mobilemenu-{{ item.uuid }}">
+          <span>{{ item.title }}</span>
+        </button>
+        {{ menus.menu_links(item.below, menu_level + 1, item) }}
+        {% else %}
+        <a href="{{ item.url }}"{% if item.is_current %} class="usa-current"{% endif %}>
+          <span>{{ item.title }}</span>
+        </a>
+        {% endif %}
+
+      </li>
+    {% endfor %}
+    </ul>
+  {% endif %}
+{% endmacro %}
diff --git a/uswds.info.yml b/uswds.info.yml
index 65389e4..92c4594 100644
--- a/uswds.info.yml
+++ b/uswds.info.yml
@@ -15,6 +15,7 @@ regions:
   header: 'Header'
   primary_menu: 'Primary Menu'
   secondary_menu: 'Secondary Menu'
+  mobile_menu: 'Mobile Menu'
   sidebar_first: 'First sidebar'
   sidebar_second: 'Second sidebar'
   breadcrumb: 'Breadcrumb'