core/themes/bartik/css/colors.css           |  6 +-
 core/themes/bartik/css/layout.css           |  6 +-
 core/themes/bartik/css/style.css            | 92 ++++++++++++++---------------
 core/themes/bartik/templates/page.html.twig | 13 +---
 4 files changed, 54 insertions(+), 63 deletions(-)

diff --git a/core/themes/bartik/css/colors.css b/core/themes/bartik/css/colors.css
index 5e73a26..f8314a5 100644
--- a/core/themes/bartik/css/colors.css
+++ b/core/themes/bartik/css/colors.css
@@ -8,8 +8,8 @@ body {
 }
 #page,
 #main-wrapper,
-.menu--primary li a.active,
-.menu--primary li.active-trail a {
+.region-primary-menu .block-menu li a.active,
+.region-primary-menu .block-menu li.active-trail a {
   background: #ffffff;
 }
 .tabs ul.primary li a.active {
@@ -53,6 +53,6 @@ a:active,
 .site-branding-block,
 #name-and-slogan a,
 .site-branding-block a,
-.menu--secondary li a {
+.region-secondary-menu .block-menu li a {
   color: #fffeff;
 }
diff --git a/core/themes/bartik/css/layout.css b/core/themes/bartik/css/layout.css
index 06c9433..db22b0a 100644
--- a/core/themes/bartik/css/layout.css
+++ b/core/themes/bartik/css/layout.css
@@ -24,15 +24,15 @@ body,
 #header div.section {
   position: relative;
 }
-.menu--secondary {
+.region-secondary-menu {
   float: right; /* LTR */
   margin: .5em 5px .75em;
   border: 1px solid #ccc;
 }
-[dir="rtl"] .menu--secondary {
+[dir="rtl"] .region-secondary-menu {
   float: left;
 }
-.menu--secondary .block-menu {
+.region-secondary-menu .block-menu {
   width: 100%;
   margin: 0 auto;
   overflow: hidden;
diff --git a/core/themes/bartik/css/style.css b/core/themes/bartik/css/style.css
index 9846895..74f0716 100644
--- a/core/themes/bartik/css/style.css
+++ b/core/themes/bartik/css/style.css
@@ -527,27 +527,27 @@ h1.site-name {
 /* --------------- Menu Regions ------------ */
 
 /* Treat menu blocks in the menu regions as a special case. */
-.menu--primary .block-menu,
-.menu--secondary .block-menu {
+.region-primary-menu .block-menu,
+.region-secondary-menu .block-menu {
     float: none;
     margin: 0;
     font-size: inherit;
 }
 
 /* --------------- Primary Menu ------------ */
-.menu--primary {
+.region-primary-menu {
   clear: both;
 }
-.menu--primary .block-menu {
+.region-primary-menu .block-menu {
   font-size: 0.929em;
   margin: 0 5px;
   padding: 0;
   text-align: left; /* LTR */
 }
-[dir="rtl"] .menu--primary .block-menu{
+[dir="rtl"] .region-primary-menu .block-menu{
   text-align: right;
 }
-.menu--primary .block-menu li {
+.region-primary-menu .block-menu li {
   float: none;
   list-style: none;
   margin: 0;
@@ -555,7 +555,7 @@ h1.site-name {
   height: auto;
   width: 100%;
 }
-.menu--primary .block-menu a {
+.region-primary-menu .block-menu a {
   color: #333;
   background: #ccc;
   background: rgba(255, 255, 255, 0.7);
@@ -567,19 +567,19 @@ h1.site-name {
   margin: 4px 0;
   padding: 0.9em 0 0.9em 10px; /* LTR */
 }
-[dir="rtl"] .menu--primary .block-menu a {
+[dir="rtl"] .region-primary-menu .block-menu a {
   padding: 0.9em 10px 0.9em 0;
 }
-.menu--primary .block-menu a:hover,
-.menu--primary .block-menu a:focus {
+.region-primary-menu .block-menu a:hover,
+.region-primary-menu .block-menu a:focus {
   background: #f6f6f2;
   background: rgba(255, 255, 255, 0.95);
 }
-.menu--primary .block-menu a:active {
+.region-primary-menu .block-menu a:active {
   background: #b3b3b3;
   background: rgba(255, 255, 255, 1);
 }
-.menu--primary .block-menu li a.active {
+.region-primary-menu .block-menu li a.active {
   border-bottom: none;
 }
 
@@ -589,15 +589,15 @@ h1.site-name {
   display: none;
 }
 /* Unhide it for the primary menu. */
-.menu--primary .menu-toggle-target {
+.region-primary-menu .menu-toggle-target {
   display: inherit;
   position: fixed;
   top: 0;
 }
-.menu--primary .menu-toggle {
+.region-primary-menu .menu-toggle {
   display: none;
 }
-body:not(:target) .menu--primary .menu-toggle {
+body:not(:target) .region-primary-menu .menu-toggle {
   color: #333;
   background: #ccc;
   background: rgba(255, 255, 255, 0.7);
@@ -609,7 +609,7 @@ body:not(:target) .menu--primary .menu-toggle {
   padding: 0.9em 10px 0.9em 10px;
   z-index: 1000;
 }
-body:not(:target) .menu--primary .menu-toggle:after {
+body:not(:target) .region-primary-menu .menu-toggle:after {
   content:"";
   background: url(../../../misc/icons/ffffff/hamburger.svg) no-repeat;
   background-size: contain;
@@ -619,18 +619,18 @@ body:not(:target) .menu--primary .menu-toggle:after {
   position: absolute;
   right: 10px; /* LTR */
 }
-body:not(:target) .menu--primary .menu-toggle-target-show:target ~ .menu-toggle,
-body:not(:target) .menu--primary .menu-toggle--hide {
+body:not(:target) .region-primary-menu .menu-toggle-target-show:target ~ .menu-toggle,
+body:not(:target) .region-primary-menu .menu-toggle--hide {
   display: none;
 }
-body:not(:target) .menu--primary .menu-toggle-target-show:target ~ .menu-toggle--hide {
+body:not(:target) .region-primary-menu .menu-toggle-target-show:target ~ .menu-toggle--hide {
   display: block;
 }
 
-.menu--primary .block-menu .menu-hide a {
+.region-primary-menu .block-menu .menu-hide a {
   display: none;
 }
-body:not(:target) .menu--primary .menu-toggle-target-show:target ~ .menu .menu-hide a {
+body:not(:target) .region-primary-menu .menu-toggle-target-show:target ~ .menu .menu-hide a {
   background-color: transparent;
   border: none;
   display: block;
@@ -643,39 +643,39 @@ body:not(:target) .menu--primary .menu-toggle-target-show:target ~ .menu .menu-h
   text-indent: -999em;
   z-index: 1001;
 }
-body:not(:target) .menu--primary .block-menu li {
+body:not(:target) .region-primary-menu .block-menu li {
   height: 0;
   overflow: hidden;
 }
-body:not(:target) .menu--primary .menu-toggle-target-show:target ~ .menu li {
+body:not(:target) .region-primary-menu .menu-toggle-target-show:target ~ .menu li {
   height: auto;
   overflow: visible;
 }
 
 /* --------------- Secondary Menu ------------ */
 
-.menu--secondary .block-menu {
+.region-secondary-menu .block-menu {
   float: right; /* LTR */
   font-size: 0.929em;
   margin: 0 10px;
 }
 
-[dir="rtl"] .menu--secondary .block-menu {
+[dir="rtl"] .region-secondary-menu .block-menu {
     float: left;
     left: 10px;
     right: auto;
 }
 
-.menu--secondary .block-menu li{
+.region-secondary-menu .block-menu li{
   margin: 0;
   padding: 0;
 }
-.menu--secondary .block-menu a {
+.region-secondary-menu .block-menu a {
   display: inline-block;
   padding:  0.8em;
 }
-.menu--secondary .block-menu a:hover,
-.menu--secondary .block-menu a:focus {
+.region-secondary-menu .block-menu a:hover,
+.region-secondary-menu .block-menu a:focus {
   text-decoration: underline;
 }
 
@@ -1884,13 +1884,13 @@ div.admin-panel .description {
   .site-branding-text {
     padding: 10px 10px 8px;
   }
-  .menu--primary .block-menu {
+  .region-primary-menu .block-menu {
     margin: 0 5px;
     padding: 0;
     text-align: center;
   }
-  .menu--primary .block-menu li,
-  body:not(:target) .menu--primary .block-menu li {
+  .region-primary-menu .block-menu li,
+  body:not(:target) .region-primary-menu .block-menu li {
     float: left; /* LTR */
     margin-right: 5px; /* LTR */
     padding: 0;
@@ -1899,26 +1899,26 @@ div.admin-panel .description {
     height: auto;
     overflow: visible;
   }
-  [dir="rtl"] .menu--primary .block-menu li {
+  [dir="rtl"] .region-primary-menu .block-menu li {
     float: right;
     margin-left: 5px;
     margin-right: 0;
   }
-  .menu--primary .block-menu li:nth-child(3n) {
+    .region-primary-menu .block-menu li:nth-child(3n) {
     margin-right: -5px; /* LTR */
   }
-  [dir="rtl"] .menu--primary .block-menu li:nth-child(3n) {
+  [dir="rtl"] .region-primary-menu .block-menu li:nth-child(3n) {
     margin-left: -5px;
     margin-right: 0;
   }
-  .menu--primary .block-menu a {
+  .region-primary-menu .block-menu a {
     float: none;
     display: block;
     border-radius: 8px;
     margin-bottom: 5px;
     padding: 0.9em 5px;
   }
-  body:not(:target) .menu--primary .menu-toggle {
+  body:not(:target) .region-primary-menu .menu-toggle {
     display: none;
   }
 }
@@ -1949,13 +1949,13 @@ div.admin-panel .description {
   .site-name {
     font-size: 1.821em;
   }
-  .menu--primary .block-menu {
+  .region-primary-menu .block-menu {
     font-size: 0.929em;
     margin: 0;
     padding: 0 15px;
   }
-  .menu--primary .block-menus li,
-  body:not(:target) .menu--primary .block-menu li {
+  .region-primary-menu .block-menus li,
+  body:not(:target) .region-primary-menu .block-menu li {
     float: left; /* LTR */
     list-style: none;
     padding: 0 1px;
@@ -1964,26 +1964,26 @@ div.admin-panel .description {
     height: auto;
     overflow: visible;
   }
-  [dir="rtl"] .menu--primary .block-menu li {
+  [dir="rtl"] .region-primary-menu .block-menu li {
     float: right;
   }
-  .menu--primary .block-menu a {
+  .region-primary-menu .block-menu a {
     float: left; /* LTR */
     padding: 0.7em 0.8em;
     margin-bottom: 0;
     border-bottom-left-radius: 0;
     border-bottom-right-radius: 0;
   }
-  [dir="rtl"] .menu--primary .block-menu a {
+  [dir="rtl"] .region-primary-menu .block-menu a {
     float: right;
     padding: 0.7em 0.8em;
   }
-  .featured .menu--primary .block-menu li a:active,
-  .featured .menu--primary .block-menu li a.active {
+  .featured .region-primary-menu .block-menu li a:active,
+  .featured .region-primary-menu .block-menu li a.active {
     background: #f0f0f0;
     background: rgba(240, 240, 240, 1.0);
   }
-  body:not(:target) .menu--primary .menu-toggle {
+  body:not(:target) .region-primary-menu .menu-toggle {
     display: none;
   }
 }
diff --git a/core/themes/bartik/templates/page.html.twig b/core/themes/bartik/templates/page.html.twig
index a74283b..d52d3db 100644
--- a/core/themes/bartik/templates/page.html.twig
+++ b/core/themes/bartik/templates/page.html.twig
@@ -80,11 +80,7 @@
 
   <header id="header" role="banner" aria-label="{{ 'Site header'|t}}"><div class="section clearfix">
 
-    {% if page.secondary_menu %}
-      <div class="menu--secondary">
-        {{ page.secondary_menu }}
-      </div>
-    {% endif %}
+    {{ page.secondary_menu }}
 
     {% if logo %}
       <a href="{{ front_page }}" title="{{ 'Home'|t }}" rel="home" id="logo">
@@ -118,12 +114,7 @@
     {% endif %}
 
     {{ page.header }}
-
-    {% if page.primary_menu %}
-      <div class="menu--primary">
-        {{ page.primary_menu }}
-      </div>
-    {% endif %}
+    {{ page.primary_menu }}
 
   </div></header> <!-- /.section, /#header-->