Fixed z-ordering issue

public/components/navigation/Menu.jsx

@@ -87,10 +87,10 @@ class Menu extends React.Component {
       for(var x = 0; x < sKeys.length; x++) {
         let sKey = sKeys[x];
         console.log(sKey);
-        menuItems.push(<MenuItem to={MenuItems[k][sKey]} onClick={this.closeMenu.bind(this)}>{Language.get(sKey)}</MenuItem>)
+        menuItems.push(<MenuItem to={MenuItems[k][sKey]} onClick={this.closeMenu.bind(this)} key={x+"-"+i}>{Language.get(sKey)}</MenuItem>)
       }
       menu.push(
-        <MenuGroup title={Language.get(k)}>
+        <MenuGroup title={Language.get(k)} key={i}>
           {menuItems}
         </MenuGroup>
       );

public/components/pages/TestAboutPage.jsx

@@ -25,7 +25,7 @@ class TestAboutPage extends React.Component {
 
   render() {
     return (
-      <Page>
+      <Page className="c-page--style-about">
         About
       </Page>
     )

public/styles/components/_page--style-about.scss

@@ -10,6 +10,11 @@
  *  Version:
  *    1.0.0 - 2018/03/11
  */
+.c-page--style-about {
+  background: url('./../images/dotted_bg_yellow.png');
+  background-size: 16px 16px;
+}
+
 .c-page--style-about__profile-container {
   margin-bottom: 5em;
 }

public/styles/components/_section--style-three.scss

@@ -11,7 +11,7 @@
 .c-section--style-three {
   height: 60vmin;
   position: relative;
-  z-index: -1;
+  z-index: 0;
   overflow-y: visible;
 }
 

public/styles/components/_section.scss

@@ -13,6 +13,8 @@
   width: 100%;
   display: block;
   max-width: $s-layout--page-max;
+  z-index: 1;
+  position:relative;
 }
 
 .c-section--full-width {