From ab90559af52373f23d306d3e8d8239e319607cdd Mon Sep 17 00:00:00 2001
From: Mavis Ou <mmmavis@users.noreply.github.com>
Date: Tue, 16 Apr 2019 15:48:37 -0700
Subject: [PATCH 1/9] Update alignment on Primary & Bannered Campaign Pages

---
 .../wagtailpages/fragments/primary_heroguts.html   | 14 ++++++--------
 source/sass/global.scss                            | 12 ++++++++++++
 2 files changed, 18 insertions(+), 8 deletions(-)

diff --git a/network-api/networkapi/wagtailpages/templates/wagtailpages/fragments/primary_heroguts.html b/network-api/networkapi/wagtailpages/templates/wagtailpages/fragments/primary_heroguts.html
index 2012da1bde1..75ef8ee1b68 100644
--- a/network-api/networkapi/wagtailpages/templates/wagtailpages/fragments/primary_heroguts.html
+++ b/network-api/networkapi/wagtailpages/templates/wagtailpages/fragments/primary_heroguts.html
@@ -21,14 +21,12 @@
   </div>
 
   <div class="container">
-    <div class="row">
-      <div class="col-12 col-md-8">
-        <div class="cutout p-3 px-md-5 py-md-3">
-          <h1 class="h1-heading">{% if root.title %}{{ root.title }}{% elif page.header %}{{ page.header }}{% else %}{{ page.title }}{% endif %}</h1>
-          {% if page.intro %}
-          <p class="body-large mb-0">{{ page.intro }}</p>
-          {% endif %}
-        </div>
+    <div class="row no-gutters">
+      <div class="cutout col-12 col-md-8 py-3">
+        <h1 class="h1-heading">{% if root.title %}{{ root.title }}{% elif page.header %}{{ page.header }}{% else %}{{ page.title }}{% endif %}</h1>
+        {% if page.intro %}
+        <p class="body-large mb-0">{{ page.intro }}</p>
+        {% endif %}
       </div>
     </div>
   </div>
diff --git a/source/sass/global.scss b/source/sass/global.scss
index e40b9a6b4d9..c835f4718a7 100644
--- a/source/sass/global.scss
+++ b/source/sass/global.scss
@@ -41,8 +41,20 @@ button:hover {
   }
 
   .cutout {
+    $grid-gutter-width: map-get($grid-gutter-widths, xs);
+    $padding-x: #{$grid-gutter-width / 2};
+
     margin-top: calc(#{$bg-pattern-height} - 40px);
     background: white;
+    padding-left: $padding-x;
+    padding-right: $padding-x;
+
+    @media screen and (min-width: $bp-md) {
+      $offset-left: 24px;
+
+      margin-left: -$offset-left;
+      padding-left: $offset-left;
+    }
   }
 }
 

From f00de414ce9bcbafb2ce9cc34f61ad5ce4039aa0 Mon Sep 17 00:00:00 2001
From: Mavis Ou <mmmavis@users.noreply.github.com>
Date: Tue, 16 Apr 2019 16:51:54 -0700
Subject: [PATCH 2/9] updated padding

---
 .../templates/wagtailpages/fragments/primary_heroguts.html      | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/network-api/networkapi/wagtailpages/templates/wagtailpages/fragments/primary_heroguts.html b/network-api/networkapi/wagtailpages/templates/wagtailpages/fragments/primary_heroguts.html
index 75ef8ee1b68..289191b6eca 100644
--- a/network-api/networkapi/wagtailpages/templates/wagtailpages/fragments/primary_heroguts.html
+++ b/network-api/networkapi/wagtailpages/templates/wagtailpages/fragments/primary_heroguts.html
@@ -22,7 +22,7 @@
 
   <div class="container">
     <div class="row no-gutters">
-      <div class="cutout col-12 col-md-8 py-3">
+      <div class="cutout col-12 col-md-8 py-4">
         <h1 class="h1-heading">{% if root.title %}{{ root.title }}{% elif page.header %}{{ page.header }}{% else %}{{ page.title }}{% endif %}</h1>
         {% if page.intro %}
         <p class="body-large mb-0">{{ page.intro }}</p>

From 9b3fd11969a71c1e3eae8a066a641a9689f95ff4 Mon Sep 17 00:00:00 2001
From: Mavis Ou <mmmavis@users.noreply.github.com>
Date: Wed, 17 Apr 2019 13:05:25 -0700
Subject: [PATCH 3/9] adjusted spacing between cutout area and secondary nav

---
 .../wagtailpages/fragments/primary_heroguts.html          | 8 ++++----
 1 file changed, 4 insertions(+), 4 deletions(-)

diff --git a/network-api/networkapi/wagtailpages/templates/wagtailpages/fragments/primary_heroguts.html b/network-api/networkapi/wagtailpages/templates/wagtailpages/fragments/primary_heroguts.html
index 289191b6eca..fe1826d62b7 100644
--- a/network-api/networkapi/wagtailpages/templates/wagtailpages/fragments/primary_heroguts.html
+++ b/network-api/networkapi/wagtailpages/templates/wagtailpages/fragments/primary_heroguts.html
@@ -1,6 +1,6 @@
 {% load wagtailcore_tags wagtailimages_tags %}
 
-<div id="hero" class="mb-md-3">
+<div id="hero" class="mb-md-5">
   <div class="banner">
     {% if page.banner %}
     <picture>
@@ -22,10 +22,10 @@
 
   <div class="container">
     <div class="row no-gutters">
-      <div class="cutout col-12 col-md-8 py-4">
-        <h1 class="h1-heading">{% if root.title %}{{ root.title }}{% elif page.header %}{{ page.header }}{% else %}{{ page.title }}{% endif %}</h1>
+      <div class="cutout col-12 col-md-8 pt-4">
+        <h1 class="h1-heading mb-0">{% if root.title %}{{ root.title }}{% elif page.header %}{{ page.header }}{% else %}{{ page.title }}{% endif %}</h1>
         {% if page.intro %}
-        <p class="body-large mb-0">{{ page.intro }}</p>
+        <p class="body-large mt-3 mb-0">{{ page.intro }}</p>
         {% endif %}
       </div>
     </div>

From b0c00e50cb13eeb5a9f48c5d53f3f2a21662045a Mon Sep 17 00:00:00 2001
From: Mavis Ou <mmmavis@users.noreply.github.com>
Date: Tue, 23 Apr 2019 15:11:00 -0700
Subject: [PATCH 4/9] fix merge conflict & get spacing in between intro and
 main content area to work

---
 .../partials/intro_and_content_divider.html     |  5 +++++
 .../partials/multipage-nav-mobile.html          |  8 +++++++-
 .../wagtailpages/bannered_campaign_page.html    |  8 +++++++-
 .../templates/wagtailpages/campaign_page.html   |  3 ++-
 .../fragments/primary_heroguts.html             |  2 +-
 .../wagtailpages/mini_site_name_space.html      |  3 +++
 .../templates/wagtailpages/primary_page.html    |  2 +-
 .../wagtailpages/static/initiatives_page.html   |  2 +-
 .../wagtailpages/tags/primary_page_menu.html    |  4 +++-
 .../multipage-nav-mobile.scss                   |  3 +++
 source/sass/components/multipage-nav.scss       | 17 +++++++++++++++--
 source/sass/global.scss                         | 13 +++++++++++++
 12 files changed, 61 insertions(+), 9 deletions(-)
 create mode 100644 network-api/networkapi/templates/partials/intro_and_content_divider.html

diff --git a/network-api/networkapi/templates/partials/intro_and_content_divider.html b/network-api/networkapi/templates/partials/intro_and_content_divider.html
new file mode 100644
index 00000000000..92b96a2ef35
--- /dev/null
+++ b/network-api/networkapi/templates/partials/intro_and_content_divider.html
@@ -0,0 +1,5 @@
+<div class="container {{wrapper_class}}">
+  <div class="row">
+    <div class="col-12"><hr class="intro-and-content-divider" style="border-color: red;" /></div>
+  </div>
+</div>
\ No newline at end of file
diff --git a/network-api/networkapi/templates/partials/multipage-nav-mobile.html b/network-api/networkapi/templates/partials/multipage-nav-mobile.html
index 02ef3ccd535..aedf371315c 100644
--- a/network-api/networkapi/templates/partials/multipage-nav-mobile.html
+++ b/network-api/networkapi/templates/partials/multipage-nav-mobile.html
@@ -1,9 +1,15 @@
+{% with hidden_class="hidden-md-up" %}
+
 {% if singleton_page == False or always_show_mobile_nav == True %}
-<div class="hidden-md-up {{wrapper_classes}}" id="multipage-nav-mobile">
+<div class="{{hidden_class}} {{wrapper_classes}}" id="multipage-nav-mobile">
   <div class="container">
     <div class="row px-3">
       <div class="col-12"></div>
     </div>
   </div>
 </div>
+{% else %}
+  {% include "./intro_and_content_divider.html" with wrapper_class=hidden_class %}
 {% endif %}
+
+{% endwith %}
diff --git a/network-api/networkapi/wagtailpages/templates/wagtailpages/bannered_campaign_page.html b/network-api/networkapi/wagtailpages/templates/wagtailpages/bannered_campaign_page.html
index 9c64abdcf76..a073cf0dda1 100644
--- a/network-api/networkapi/wagtailpages/templates/wagtailpages/bannered_campaign_page.html
+++ b/network-api/networkapi/wagtailpages/templates/wagtailpages/bannered_campaign_page.html
@@ -7,13 +7,15 @@
   {% include "./fragments/primary_heroguts.html" with root=root page=page %}
 {% endblock %}
 
+{% block content_wrapper_class %}{% endblock %}
+
 {% block campaign_page_header %}{% endblock %}
 {% block campaign_page_menu %}{% endblock %}
 
 Note: Wrapper HTML elements are copied from primary_page_menu.html as we want menu on BanneredCampaignPage to look exactly the same as PrimaryPage's.
 
 {% block minisite_title %}
-  <div id="multipage-nav-wrapper" class="hidden-sm-down full-width mb-4">
+  <div id="multipage-horizontal-nav-wrapper" class="hidden-sm-down full-width">
     <div class="container">
       <div class="row">
         <div class="col-12">
@@ -24,6 +26,10 @@
   </div>
 {% endblock %}
 
+{% block minisite_no_menu %}
+  {% include "partials/intro_and_content_divider.html" with wrapper_class="hidden-sm-down" %}
+{% endblock %}
+
 The following block has been borrowed from the templates/tags/cta/petition.html file,
 rather than using the `cta` tag from our mini_site_tags collection, because the cta
 tag was written in the assumption that models would only ever have a single CTA field
diff --git a/network-api/networkapi/wagtailpages/templates/wagtailpages/campaign_page.html b/network-api/networkapi/wagtailpages/templates/wagtailpages/campaign_page.html
index a02406c7361..5f73bedea0f 100644
--- a/network-api/networkapi/wagtailpages/templates/wagtailpages/campaign_page.html
+++ b/network-api/networkapi/wagtailpages/templates/wagtailpages/campaign_page.html
@@ -10,7 +10,8 @@
 {% block donate %}{% endblock %}
 
 {% block subcontent %}
-<div class="py-4 py-md-5
+<div class="
+  {% block content_wrapper_class %}py-4 py-md-5{% endblock %}
   {% if page.specific.narrowed_page_content %}
     offset-md-2
     col-md-8
diff --git a/network-api/networkapi/wagtailpages/templates/wagtailpages/fragments/primary_heroguts.html b/network-api/networkapi/wagtailpages/templates/wagtailpages/fragments/primary_heroguts.html
index fe1826d62b7..acf8c30339f 100644
--- a/network-api/networkapi/wagtailpages/templates/wagtailpages/fragments/primary_heroguts.html
+++ b/network-api/networkapi/wagtailpages/templates/wagtailpages/fragments/primary_heroguts.html
@@ -1,6 +1,6 @@
 {% load wagtailcore_tags wagtailimages_tags %}
 
-<div id="hero" class="mb-md-5">
+<div id="hero">
   <div class="banner">
     {% if page.banner %}
     <picture>
diff --git a/network-api/networkapi/wagtailpages/templates/wagtailpages/mini_site_name_space.html b/network-api/networkapi/wagtailpages/templates/wagtailpages/mini_site_name_space.html
index aa073e2677a..9155fdb2968 100644
--- a/network-api/networkapi/wagtailpages/templates/wagtailpages/mini_site_name_space.html
+++ b/network-api/networkapi/wagtailpages/templates/wagtailpages/mini_site_name_space.html
@@ -13,6 +13,9 @@
       </div>
     </div>
   </div>
+  {% else %}
+  {% block minisite_no_menu %}
+   {% endblock %}
   {% endif %}
 {% endblock %}
 
diff --git a/network-api/networkapi/wagtailpages/templates/wagtailpages/primary_page.html b/network-api/networkapi/wagtailpages/templates/wagtailpages/primary_page.html
index 9b8245dece7..e87224a1a60 100644
--- a/network-api/networkapi/wagtailpages/templates/wagtailpages/primary_page.html
+++ b/network-api/networkapi/wagtailpages/templates/wagtailpages/primary_page.html
@@ -12,7 +12,7 @@
 {% endblock %}
 
 {% block content %}
-  {% include "partials/multipage-nav-mobile.html" with wrapper_classes="mb-3 mb-md-5" %}
+  {% include "partials/multipage-nav-mobile.html" %}
 
   {% primary_page_menu page %}
 
diff --git a/network-api/networkapi/wagtailpages/templates/wagtailpages/static/initiatives_page.html b/network-api/networkapi/wagtailpages/templates/wagtailpages/static/initiatives_page.html
index 26d197e4ce4..886e7f0ff66 100644
--- a/network-api/networkapi/wagtailpages/templates/wagtailpages/static/initiatives_page.html
+++ b/network-api/networkapi/wagtailpages/templates/wagtailpages/static/initiatives_page.html
@@ -22,7 +22,7 @@ <h1 class="h1-heading">{{ page.header }}</h1>
 
 <div class="py-4">
   {% include "partials/multipage-nav-mobile.html" with always_show_mobile_nav=True %}
-  <div id="multipage-nav-wrapper" class="hidden-sm-down full-width">
+  <div id="multipage-horizontal-nav-wrapper" class="hidden-sm-down full-width my-0">
     <div class="container">
       <div class="row">
         <div class="col-12">
diff --git a/network-api/networkapi/wagtailpages/templates/wagtailpages/tags/primary_page_menu.html b/network-api/networkapi/wagtailpages/templates/wagtailpages/tags/primary_page_menu.html
index 1ef5d805194..0adfa11505c 100644
--- a/network-api/networkapi/wagtailpages/templates/wagtailpages/tags/primary_page_menu.html
+++ b/network-api/networkapi/wagtailpages/templates/wagtailpages/tags/primary_page_menu.html
@@ -1,7 +1,7 @@
 {% load wagtailcore_tags nav_tags %}
 
 {% if singleton_page == False %}
-<div id="multipage-nav-wrapper" class="hidden-sm-down full-width mb-4">
+<div id="multipage-horizontal-nav-wrapper" class="hidden-sm-down full-width">
   <div class="container">
     <div class="row">
       <div class="col-12">
@@ -10,4 +10,6 @@
     </div>
   </div>
 </div>
+{% else %}
+  {% include "partials/intro_and_content_divider.html" with wrapper_class="hidden-sm-down" %}
 {% endif %}
diff --git a/source/js/components/multipage-nav-mobile/multipage-nav-mobile.scss b/source/js/components/multipage-nav-mobile/multipage-nav-mobile.scss
index cd0e7a05cb6..d967abf9ae1 100644
--- a/source/js/components/multipage-nav-mobile/multipage-nav-mobile.scss
+++ b/source/js/components/multipage-nav-mobile/multipage-nav-mobile.scss
@@ -1,4 +1,7 @@
 #multipage-nav-mobile {
+  margin-top: 24px;
+  margin-bottom: 24px;
+
   .dropdown-nav {
     .expander {
       background: none;
diff --git a/source/sass/components/multipage-nav.scss b/source/sass/components/multipage-nav.scss
index f36bf91fbf4..380de45376c 100644
--- a/source/sass/components/multipage-nav.scss
+++ b/source/sass/components/multipage-nav.scss
@@ -1,4 +1,17 @@
-#multipage-nav-wrapper {
+#multipage-horizontal-nav-wrapper {
+  $margin-y: 24px;
+  $margin-y-md: 48px;
+
+  margin-top: $margin-y;
+  margin-bottom: $margin-y;
+
+  background: yellow;
+
+  @media (min-width: $bp-md) {
+    margin-top: $margin-y-md;
+    margin-bottom: $margin-y-md;
+  }
+
   &.full-width {
     @media (min-width: $bp-md) {
       border-bottom: 1px solid $gray-20;
@@ -13,7 +26,7 @@
     align-items: stretch;
     border-bottom: 1px $gray-20 solid;
 
-    @at-root #multipage-nav-wrapper.full-width #{&} {
+    @at-root #multipage-horizontal-nav-wrapper.full-width #{&} {
       border: none;
     }
 
diff --git a/source/sass/global.scss b/source/sass/global.scss
index c835f4718a7..4bb2f211328 100644
--- a/source/sass/global.scss
+++ b/source/sass/global.scss
@@ -86,3 +86,16 @@ footer.site-footer {
     }
   }
 }
+
+hr.intro-and-content-divider {
+  $margin-y: 24px;
+  $margin-y-md: 48px;
+
+  margin-top: $margin-y;
+  margin-bottom: $margin-y;
+
+  @media (min-width: $bp-md) {
+    margin-top: $margin-y-md;
+    margin-bottom: $margin-y-md;
+  }
+}
\ No newline at end of file

From 0375a5c5b50a155e9f4a91698fa30c6b2bfb9a80 Mon Sep 17 00:00:00 2001
From: Mavis Ou <mmmavis@users.noreply.github.com>
Date: Tue, 23 Apr 2019 16:48:22 -0700
Subject: [PATCH 5/9] styling cleanup

---
 .../partials/intro_and_content_divider.html         |  4 ++--
 .../templates/partials/multipage-nav-mobile.html    |  8 +-------
 .../wagtailpages/fragments/primary_heroguts.html    |  4 ++++
 source/sass/components/multipage-nav.scss           | 13 +------------
 source/sass/global.scss                             | 13 ++-----------
 source/sass/mixins.scss                             | 10 ++++++++++
 6 files changed, 20 insertions(+), 32 deletions(-)

diff --git a/network-api/networkapi/templates/partials/intro_and_content_divider.html b/network-api/networkapi/templates/partials/intro_and_content_divider.html
index 92b96a2ef35..d30328fc391 100644
--- a/network-api/networkapi/templates/partials/intro_and_content_divider.html
+++ b/network-api/networkapi/templates/partials/intro_and_content_divider.html
@@ -1,5 +1,5 @@
 <div class="container {{wrapper_class}}">
   <div class="row">
-    <div class="col-12"><hr class="intro-and-content-divider" style="border-color: red;" /></div>
+    <div class="col-12"><hr class="intro-and-content-divider" /></div>
   </div>
-</div>
\ No newline at end of file
+</div>
diff --git a/network-api/networkapi/templates/partials/multipage-nav-mobile.html b/network-api/networkapi/templates/partials/multipage-nav-mobile.html
index aedf371315c..02ef3ccd535 100644
--- a/network-api/networkapi/templates/partials/multipage-nav-mobile.html
+++ b/network-api/networkapi/templates/partials/multipage-nav-mobile.html
@@ -1,15 +1,9 @@
-{% with hidden_class="hidden-md-up" %}
-
 {% if singleton_page == False or always_show_mobile_nav == True %}
-<div class="{{hidden_class}} {{wrapper_classes}}" id="multipage-nav-mobile">
+<div class="hidden-md-up {{wrapper_classes}}" id="multipage-nav-mobile">
   <div class="container">
     <div class="row px-3">
       <div class="col-12"></div>
     </div>
   </div>
 </div>
-{% else %}
-  {% include "./intro_and_content_divider.html" with wrapper_class=hidden_class %}
 {% endif %}
-
-{% endwith %}
diff --git a/network-api/networkapi/wagtailpages/templates/wagtailpages/fragments/primary_heroguts.html b/network-api/networkapi/wagtailpages/templates/wagtailpages/fragments/primary_heroguts.html
index acf8c30339f..75454dd65e5 100644
--- a/network-api/networkapi/wagtailpages/templates/wagtailpages/fragments/primary_heroguts.html
+++ b/network-api/networkapi/wagtailpages/templates/wagtailpages/fragments/primary_heroguts.html
@@ -30,4 +30,8 @@ <h1 class="h1-heading mb-0">{% if root.title %}{{ root.title }}{% elif page.head
       </div>
     </div>
   </div>
+
+  {% if singleton_page == True %}
+    {% include "partials/intro_and_content_divider.html" with wrapper_class="hidden-md-up" %}
+  {% endif %}
 </div>
diff --git a/source/sass/components/multipage-nav.scss b/source/sass/components/multipage-nav.scss
index 380de45376c..5e1fe3d756e 100644
--- a/source/sass/components/multipage-nav.scss
+++ b/source/sass/components/multipage-nav.scss
@@ -1,16 +1,5 @@
 #multipage-horizontal-nav-wrapper {
-  $margin-y: 24px;
-  $margin-y-md: 48px;
-
-  margin-top: $margin-y;
-  margin-bottom: $margin-y;
-
-  background: yellow;
-
-  @media (min-width: $bp-md) {
-    margin-top: $margin-y-md;
-    margin-bottom: $margin-y-md;
-  }
+  @include intro-and-content-spacing();
 
   &.full-width {
     @media (min-width: $bp-md) {
diff --git a/source/sass/global.scss b/source/sass/global.scss
index 4bb2f211328..dd76c2a0248 100644
--- a/source/sass/global.scss
+++ b/source/sass/global.scss
@@ -88,14 +88,5 @@ footer.site-footer {
 }
 
 hr.intro-and-content-divider {
-  $margin-y: 24px;
-  $margin-y-md: 48px;
-
-  margin-top: $margin-y;
-  margin-bottom: $margin-y;
-
-  @media (min-width: $bp-md) {
-    margin-top: $margin-y-md;
-    margin-bottom: $margin-y-md;
-  }
-}
\ No newline at end of file
+  @include intro-and-content-spacing();
+}
diff --git a/source/sass/mixins.scss b/source/sass/mixins.scss
index ea77cf7ea0e..b70ecaf612e 100644
--- a/source/sass/mixins.scss
+++ b/source/sass/mixins.scss
@@ -76,3 +76,13 @@
     text-decoration: underline;
   }
 }
+
+@mixin intro-and-content-spacing() {
+  margin-top: 24px;
+  margin-bottom: 24px;
+
+  @media (min-width: $bp-md) {
+    margin-top: 48px;
+    margin-bottom: 48px;
+  }
+}

From d60e0609dd9d87a210d8f7fedadd79be87c607ca Mon Sep 17 00:00:00 2001
From: Mavis Ou <mmmavis@users.noreply.github.com>
Date: Tue, 23 Apr 2019 16:52:25 -0700
Subject: [PATCH 6/9] fixed whitespace

---
 .../templates/wagtailpages/mini_site_name_space.html           | 3 +--
 1 file changed, 1 insertion(+), 2 deletions(-)

diff --git a/network-api/networkapi/wagtailpages/templates/wagtailpages/mini_site_name_space.html b/network-api/networkapi/wagtailpages/templates/wagtailpages/mini_site_name_space.html
index 9155fdb2968..2772074d2cb 100644
--- a/network-api/networkapi/wagtailpages/templates/wagtailpages/mini_site_name_space.html
+++ b/network-api/networkapi/wagtailpages/templates/wagtailpages/mini_site_name_space.html
@@ -14,8 +14,7 @@
     </div>
   </div>
   {% else %}
-  {% block minisite_no_menu %}
-   {% endblock %}
+    {% block minisite_no_menu %}{% endblock %}
   {% endif %}
 {% endblock %}
 

From eb1d3b54b969aa55ddeaad291b51d255a12235fb Mon Sep 17 00:00:00 2001
From: Mavis Ou <mmmavis@users.noreply.github.com>
Date: Tue, 23 Apr 2019 17:22:17 -0700
Subject: [PATCH 7/9] scss improvement

---
 source/sass/global.scss |  2 +-
 source/sass/mixins.scss | 10 ++++++----
 2 files changed, 7 insertions(+), 5 deletions(-)

diff --git a/source/sass/global.scss b/source/sass/global.scss
index dd76c2a0248..a9d899409e0 100644
--- a/source/sass/global.scss
+++ b/source/sass/global.scss
@@ -88,5 +88,5 @@ footer.site-footer {
 }
 
 hr.intro-and-content-divider {
-  @include intro-and-content-spacing();
+  @include intro-and-content-spacing(true);
 }
diff --git a/source/sass/mixins.scss b/source/sass/mixins.scss
index b70ecaf612e..651a1fb85ad 100644
--- a/source/sass/mixins.scss
+++ b/source/sass/mixins.scss
@@ -77,12 +77,14 @@
   }
 }
 
-@mixin intro-and-content-spacing() {
+@mixin intro-and-content-spacing($adjust-spacing-for-md: null) {
   margin-top: 24px;
   margin-bottom: 24px;
 
-  @media (min-width: $bp-md) {
-    margin-top: 48px;
-    margin-bottom: 48px;
+  @if ($adjust-spacing-for-md) {
+    @media (min-width: $bp-md) {
+      margin-top: 48px;
+      margin-bottom: 48px;
+    }
   }
 }

From e64e6b7b09500940d7cef9bfbaae276be8b9c755 Mon Sep 17 00:00:00 2001
From: Mavis Ou <mmmavis@users.noreply.github.com>
Date: Tue, 23 Apr 2019 17:24:08 -0700
Subject: [PATCH 8/9] scss improvement

---
 .../components/multipage-nav-mobile/multipage-nav-mobile.scss  | 3 +--
 1 file changed, 1 insertion(+), 2 deletions(-)

diff --git a/source/js/components/multipage-nav-mobile/multipage-nav-mobile.scss b/source/js/components/multipage-nav-mobile/multipage-nav-mobile.scss
index d967abf9ae1..3476185fb7f 100644
--- a/source/js/components/multipage-nav-mobile/multipage-nav-mobile.scss
+++ b/source/js/components/multipage-nav-mobile/multipage-nav-mobile.scss
@@ -1,6 +1,5 @@
 #multipage-nav-mobile {
-  margin-top: 24px;
-  margin-bottom: 24px;
+  @include intro-and-content-spacing();
 
   .dropdown-nav {
     .expander {

From d52149d42bd5f27235ec12362fa2eb59e343a8eb Mon Sep 17 00:00:00 2001
From: Mavis Ou <mmmavis@users.noreply.github.com>
Date: Tue, 23 Apr 2019 18:00:38 -0700
Subject: [PATCH 9/9] adjusted spacing

---
 source/sass/components/multipage-nav.scss | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/source/sass/components/multipage-nav.scss b/source/sass/components/multipage-nav.scss
index 5e1fe3d756e..ad199b597ac 100644
--- a/source/sass/components/multipage-nav.scss
+++ b/source/sass/components/multipage-nav.scss
@@ -1,5 +1,5 @@
 #multipage-horizontal-nav-wrapper {
-  @include intro-and-content-spacing();
+  @include intro-and-content-spacing(true);
 
   &.full-width {
     @media (min-width: $bp-md) {