diff --git a/client/src/views/footer/index.js b/client/src/views/layout/footer/index.js
similarity index 65%
rename from client/src/views/footer/index.js
rename to client/src/views/layout/footer/index.js
index 5a55f3110..23006ca4c 100644
--- a/client/src/views/footer/index.js
+++ b/client/src/views/layout/footer/index.js
@@ -6,7 +6,6 @@ import { NavLink, Link } from 'react-router-dom'
 import { withStyles } from '@material-ui/core/styles'
 import withWidth from '@material-ui/core/withWidth'
 import { connect } from 'react-redux'
-import lightGreen from '@material-ui/core/colors/lightGreen'
 
 import Typography from '@material-ui/core/Typography'
 import Grid from '@material-ui/core/Grid'
@@ -14,117 +13,9 @@ import Button from '@material-ui/core/Button'
 import InputBase from '@material-ui/core/InputBase'
 import { FontAwesomeIcon } from '@fortawesome/react-fontawesome'
 import { faFacebookF, faTelegramPlane, faTwitter } from '@fortawesome/free-brands-svg-icons'
+import styles from './styles'
 
-import aalogo from '../../assets/advanced-algos/aa-logo-horiz-dark.svg'
-
-const styles = theme => ({
-  textLight: {
-    color: theme.palette.primary.light
-  },
-  textWhite: {
-    color: theme.palette.common.white
-  },
-  textSuccess: {
-    color: lightGreen[400]
-  },
-  linkLight: {
-    color: theme.palette.secondary.main,
-    textDecoration: 'none'
-  },
-  descriptionLeft: {
-    marginLeft: theme.spacing.unit * 8,
-    [theme.breakpoints.down('sm')]: {
-      marginLeft: 0
-    },
-    [theme.breakpoints.down('xs')]: {
-      textAlign: 'center'
-    }
-  },
-  signupRight: {
-    marginTop: theme.spacing.unit * 2,
-    [theme.breakpoints.down('xs')]: {
-      textAlign: 'center'
-    }
-  },
-  signupContainer: {
-    marginBottom: theme.spacing.unit * 2,
-    [theme.breakpoints.down('xs')]: {
-      textAlign: 'center'
-    }
-  },
-  footer: {
-    borderTop: `4px solid ${theme.palette.secondary.light}`,
-    padding: `${theme.spacing.unit * 6}px 0`,
-    marginTop: '-42px',
-    backgroundColor: '#19191C', /* #29292c */
-    color: theme.palette.primary.light
-  },
-  footerContainer: {
-    width: 'auto',
-    marginLeft: theme.spacing.unit * 3,
-    marginRight: theme.spacing.unit * 3,
-    [theme.breakpoints.up(1200 + theme.spacing.unit * 3 * 2)]: {
-      width: 1200,
-      marginLeft: 'auto',
-      marginRight: 'auto'
-    }
-  },
-  footerLink: {
-    textDecoration: 'none',
-    '&:hover': {
-      color: theme.palette.secondary.light
-    }
-  },
-  footerInputRoot: {
-    'label + &': {
-      marginTop: theme.spacing.unit * 3
-    },
-    [theme.breakpoints.down('xs')]: {
-      textAlign: 'center'
-    }
-  },
-  footerInput: {
-    borderRadius: 4,
-    backgroundColor: theme.palette.common.white,
-    border: '1px solid #ced4da',
-    fontSize: 16,
-    padding: '10px 12px',
-    transition: theme.transitions.create(['border-color', 'box-shadow']),
-    marginRight: theme.spacing.unit * 1
-  },
-  footerInputSubmit: {
-    boxShadow: 'none',
-    textTransform: 'none',
-    fontSize: 16,
-    lineHeight: '1.1875em',
-    color: theme.palette.common.white,
-    padding: '10px 12px',
-    backgroundColor: '#5bc0de',
-    borderColor: '#46b8da',
-    '&:hover': {
-      backgroundColor: '#31b0d5',
-      borderColor: '#269abc'
-    },
-    '&:active': {
-      boxShadow: 'none',
-      backgroundColor: '#0062cc',
-      borderColor: '#005cbf'
-    },
-    '&:focus': {
-      boxShadow: '0 0 0 0.2rem rgba(0,123,255,.5)'
-    }
-  },
-  icon: {
-    margin: theme.spacing.unit * 1,
-    fontSize: 24
-  },
-  iconHover: {
-    margin: theme.spacing.unit * 1,
-    '&:hover': {
-      color: theme.palette.secondary.light
-    }
-  }
-})
+import aalogo from '../../../assets/advanced-algos/aa-logo-horiz-dark.svg'
 
 class Footer extends Component {
   render () {
diff --git a/client/src/views/layout/footer/styles.js b/client/src/views/layout/footer/styles.js
new file mode 100644
index 000000000..092a34e62
--- /dev/null
+++ b/client/src/views/layout/footer/styles.js
@@ -0,0 +1,112 @@
+import lightGreen from '@material-ui/core/colors/lightGreen'
+
+const styles = theme => ({
+  textLight: {
+    color: theme.palette.primary.light
+  },
+  textWhite: {
+    color: theme.palette.common.white
+  },
+  textSuccess: {
+    color: lightGreen[400]
+  },
+  linkLight: {
+    color: theme.palette.secondary.main,
+    textDecoration: 'none'
+  },
+  descriptionLeft: {
+    marginLeft: theme.spacing.unit * 8,
+    [theme.breakpoints.down('sm')]: {
+      marginLeft: 0
+    },
+    [theme.breakpoints.down('xs')]: {
+      textAlign: 'center'
+    }
+  },
+  signupRight: {
+    marginTop: theme.spacing.unit * 2,
+    [theme.breakpoints.down('xs')]: {
+      textAlign: 'center'
+    }
+  },
+  signupContainer: {
+    marginBottom: theme.spacing.unit * 2,
+    [theme.breakpoints.down('xs')]: {
+      textAlign: 'center'
+    }
+  },
+  footer: {
+    borderTop: `4px solid ${theme.palette.secondary.light}`,
+    padding: `${theme.spacing.unit * 6}px 0`,
+    marginTop: '-42px',
+    backgroundColor: '#19191C', /* #29292c */
+    color: theme.palette.primary.light
+  },
+  footerContainer: {
+    width: 'auto',
+    marginLeft: theme.spacing.unit * 3,
+    marginRight: theme.spacing.unit * 3,
+    [theme.breakpoints.up(1200 + theme.spacing.unit * 3 * 2)]: {
+      width: 1200,
+      marginLeft: 'auto',
+      marginRight: 'auto'
+    }
+  },
+  footerLink: {
+    textDecoration: 'none',
+    '&:hover': {
+      color: theme.palette.secondary.light
+    }
+  },
+  footerInputRoot: {
+    'label + &': {
+      marginTop: theme.spacing.unit * 3
+    },
+    [theme.breakpoints.down('xs')]: {
+      textAlign: 'center'
+    }
+  },
+  footerInput: {
+    borderRadius: 4,
+    backgroundColor: theme.palette.common.white,
+    border: '1px solid #ced4da',
+    fontSize: 16,
+    padding: '10px 12px',
+    transition: theme.transitions.create(['border-color', 'box-shadow']),
+    marginRight: theme.spacing.unit * 1
+  },
+  footerInputSubmit: {
+    boxShadow: 'none',
+    textTransform: 'none',
+    fontSize: 16,
+    lineHeight: '1.1875em',
+    color: theme.palette.common.white,
+    padding: '10px 12px',
+    backgroundColor: '#5bc0de',
+    borderColor: '#46b8da',
+    '&:hover': {
+      backgroundColor: '#31b0d5',
+      borderColor: '#269abc'
+    },
+    '&:active': {
+      boxShadow: 'none',
+      backgroundColor: '#0062cc',
+      borderColor: '#005cbf'
+    },
+    '&:focus': {
+      boxShadow: '0 0 0 0.2rem rgba(0,123,255,.5)'
+    }
+  },
+  icon: {
+    margin: theme.spacing.unit * 1,
+    fontSize: 24
+  },
+  iconHover: {
+    margin: theme.spacing.unit * 1,
+    '&:hover': {
+      color: theme.palette.secondary.light
+    }
+  }
+})
+
+export default styles
diff --git a/client/src/views/header/LoggedIn.js b/client/src/views/layout/header/LoggedIn.js
similarity index 93%
rename from client/src/views/header/LoggedIn.js
rename to client/src/views/layout/header/LoggedIn.js
index 81e99682f..6d3f8a6a5 100644
--- a/client/src/views/header/LoggedIn.js
+++ b/client/src/views/layout/header/LoggedIn.js
@@ -4,7 +4,7 @@ import PropTypes from 'prop-types'
 
 import LoggedInMenu from './LoggedInMenu'
 
-import { isDefined } from '../../utils/js-helpers'
+import { isDefined } from '../../../utils/js-helpers'
 
 export const LoggedIn = props => {
   let { user, auth } = props
diff --git a/client/src/views/header/LoggedInMenu.js b/client/src/views/layout/header/LoggedInMenu.js
similarity index 100%
rename from client/src/views/header/LoggedInMenu.js
rename to client/src/views/layout/header/LoggedInMenu.js
diff --git a/client/src/views/header/LoggedOut.js b/client/src/views/layout/header/LoggedOut.js
similarity index 100%
rename from client/src/views/header/LoggedOut.js
rename to client/src/views/layout/header/LoggedOut.js
diff --git a/client/src/views/header/imports.js b/client/src/views/layout/header/imports.js
similarity index 100%
rename from client/src/views/header/imports.js
rename to client/src/views/layout/header/imports.js
diff --git a/client/src/views/header/index.js b/client/src/views/layout/header/index.js
similarity index 98%
rename from client/src/views/header/index.js
rename to client/src/views/layout/header/index.js
index f649aafbc..8d88111d6 100644
--- a/client/src/views/header/index.js
+++ b/client/src/views/layout/header/index.js
@@ -24,7 +24,7 @@ import { LoggedIn } from './LoggedIn'
 import { LoggedOut } from './LoggedOut'
 
 import allMenus from './imports'
-import AALogo from '../../assets/advanced-algos/aa-logo-dark.svg'
+import AALogo from '../../../assets/advanced-algos/aa-logo-dark.svg'
 
 class Header extends Component {
   constructor (props) {
diff --git a/client/src/views/header/styles.js b/client/src/views/layout/header/styles.js
similarity index 100%
rename from client/src/views/header/styles.js
rename to client/src/views/layout/header/styles.js
diff --git a/client/src/views/layout/index.js b/client/src/views/layout/index.js
index 66b333eed..742f73946 100644
--- a/client/src/views/layout/index.js
+++ b/client/src/views/layout/index.js
@@ -1,7 +1,7 @@
 import React from 'react'
 import { withStyles } from '@material-ui/core/styles'
-import Footer from '../footer'
-import Header from '../header'
+import Footer from './footer'
+import Header from './header'
 
 // styles
 import styles from './styles'