diff --git a/wax-prosemirror-components/src/mainMenuBar/MainMenuBar.js b/wax-prosemirror-components/src/mainMenuBar/MainMenuBar.js
index 6bc776470bc944e0815eef9dc1f6064dccbd2f50..cb6a88d028a70113d3c4bb92b56620de37ae7685 100644
--- a/wax-prosemirror-components/src/mainMenuBar/MainMenuBar.js
+++ b/wax-prosemirror-components/src/mainMenuBar/MainMenuBar.js
@@ -1,7 +1,35 @@
 import React from "react";
+import styled from "styled-components";
+
 import { forEach, map } from "lodash";
 import MainMenuBarItems from "./MainMenuBarItems";
 
+const MainMenuContainer = styled.div`
+  background: #fff;
+  height: 52px;
+  line-height: 32px;
+  position: relative;
+  user-select: none;
+`;
+const MainMenuInner = styled.div`
+  display: flex;
+  align-items: center;
+  justify-content: center;
+  flex-direction: column;
+  left: 0;
+  position: absolute;
+  right: 0;
+  top: 0;
+  background: transparent;
+  z-index: 9999;
+`;
+const MainMenu = styled.div`
+  background: #fff;
+  padding: 2px 2px 2px 0;
+  position: relative;
+  background: transparent;
+`;
+
 const filtered = (menu, menuItems) =>
   Object.keys(menu)
     .filter(key => menuItems.includes(key))
@@ -27,9 +55,9 @@ const MainMenuBar = ({
   className,
   fileUpload
 }) => (
-  <div>
-    <div>
-      <div>
+  <MainMenuContainer>
+    <MainMenuInner>
+      <MainMenu>
         {
           <span>
             {map(setMenuItems(MainMenuBarItems, menuItems), item =>
@@ -37,9 +65,9 @@ const MainMenuBar = ({
             )}
           </span>
         }
-      </div>
-    </div>
-  </div>
+      </MainMenu>
+    </MainMenuInner>
+  </MainMenuContainer>
 );
 
 export default MainMenuBar;
diff --git a/wax-prosemirror-components/src/sideMenuBar/SideMenuBar.js b/wax-prosemirror-components/src/sideMenuBar/SideMenuBar.js
index 7e2acf749e1688a79de18d6deec0015b884f0058..225c310b01aa5a3fe4887d1df5dd3ef37e3e32ef 100644
--- a/wax-prosemirror-components/src/sideMenuBar/SideMenuBar.js
+++ b/wax-prosemirror-components/src/sideMenuBar/SideMenuBar.js
@@ -1,7 +1,34 @@
 import React from "react";
+import styled from "styled-components";
 import { forEach, map } from "lodash";
 import SideMenuItems from "./SideMenuItems";
 
+const SideMenuContainer = styled.div`
+  display: flex;
+  width: 12%;
+  height: 98%;
+`;
+
+const SideMenuInner = styled.div`
+  display: flex;
+  width: 100%;
+`;
+
+const SideMenu = styled.div`
+  flex: 1;
+  display: flex;
+  flex-direction: column;
+  justify-content: flex-start;
+  margin-top: 15px;
+  button {
+    display: flex;
+    margin-left: 5%;
+    flex-direction: column;
+    width: 90%;
+    background: transparent;
+  }
+`;
+
 const filtered = (menu, menuItems) =>
   Object.keys(menu)
     .filter(key => menuItems.includes(key))
@@ -27,9 +54,9 @@ const SideMenuBar = ({
   className,
   fileUpload
 }) => (
-  <div>
-    <div>
-      <div>
+  <SideMenuContainer>
+    <SideMenuInner>
+      <SideMenu>
         {
           <span>
             {map(setMenuItems(SideMenuItems, menuItems), item =>
@@ -37,9 +64,9 @@ const SideMenuBar = ({
             )}
           </span>
         }
-      </div>
-    </div>
-  </div>
+      </SideMenu>
+    </SideMenuInner>
+  </SideMenuContainer>
 );
 
 export default SideMenuBar;
diff --git a/wax-prosemirror-layouts/src/layouts/EditoriaLayout.js b/wax-prosemirror-layouts/src/layouts/EditoriaLayout.js
index 1391398c83db937419dac022c5b1c1d590b6ecfd..4efef0f265202ce053426708b9969785f33164a8 100644
--- a/wax-prosemirror-layouts/src/layouts/EditoriaLayout.js
+++ b/wax-prosemirror-layouts/src/layouts/EditoriaLayout.js
@@ -2,6 +2,12 @@ import styled from "styled-components";
 import React, { Fragment } from "react";
 import { MainMenuBar, SideMenuBar } from "wax-prosemirror-components";
 
+const LayoutWrapper = styled.div`
+  display: flex;
+  flex-direction: column;
+  height: 100%;
+`;
+
 const WaxSurfaceContainer = styled.div`
   flex: 1;
   position: relative;
@@ -9,13 +15,13 @@ const WaxSurfaceContainer = styled.div`
 `;
 
 const EditoriaLayout = ({ editor, view, ...props }) => (
-  <Fragment>
+  <LayoutWrapper>
     <MainMenuBar view={view} {...props} />
     <WaxSurfaceContainer>
       <SideMenuBar view={view} {...props} />
       {editor}
     </WaxSurfaceContainer>
-  </Fragment>
+  </LayoutWrapper>
 );
 
 export default EditoriaLayout;