diff --git a/brassgoggled/index.html b/brassgoggled/index.html
index a6fff0a..236df69 100644
--- a/brassgoggled/index.html
+++ b/brassgoggled/index.html
@@ -2,8 +2,8 @@
 <html lang="en">
 
 <head>
-    <link href='css/main.css' rel='stylesheet'>
-    <link rel="stylesheet" href="css/animate.min.css">
+    <link href='../css/main.css' rel='stylesheet'>
+    <link rel="stylesheet" href="../css/animate.min.css">
 
     <!--Import Google Icon Font-->
     <link href="http://fonts.googleapis.com/icon?family=Material+Icons" rel="stylesheet">
@@ -22,12 +22,6 @@
     <style>
         body {
             background-image: url(https://upload.wikimedia.org/wikipedia/commons/1/1a/Code.jpg);
-            background-attachment: fixed;
-            background-size: cover;
-        }
-        
-        div {
-            padding: inherit;
         }
     </style>
 
@@ -47,7 +41,7 @@ padding-bottom: 50px;">
                             <h1 style="margin-top: -5px;">The Brass Goggled Coders</h1>
                             <h3 style="font-weight: 400; margin-top: 0px; margin-bottom: -5px;">International team of hobbyist developers</h3>
                             <br>
-                            <div class="divider"></div>
+                            <hr>
                         </div>
                         <div class="grey darken-4">
 
diff --git a/css/main.css b/css/main.css
index bbc7a2b..b53bbf4 100644
--- a/css/main.css
+++ b/css/main.css
@@ -2,38 +2,23 @@ body {
     color: white;
     padding: 0px;
     margin: 0px;
+    background-attachment: fixed;
+    background-size: cover;
 }
 
 hr {
     border: 0;
     height: 1px;
-    background-image: linear-gradient(to right, rgba(0, 0, 0, 0), rgba(0, 0, 0, 0.75), rgba(0, 0, 0, 0));
+    background-color: white;
     margin-top: 35px;
     margin-bottom: 35px;
 }
 
-.center {
-    margin-left: auto;
-    margin-right: auto;
-}
-
-.shadowed {
-    -webkit-box-shadow: 10px 10px 5px 0px rgba(0, 0, 0, 0.75);
-    -moz-box-shadow: 10px 10px 5px 0px rgba(0, 0, 0, 0.75);
-    box-shadow: 10px 10px 5px 0px rgba(0, 0, 0, 0.75);
-}
-
 .container {
     padding: 25px;
 }
 
-.dark {
-    background-color: #121314;
-    padding: inherit;
-}
-
-.light {
-    background-color: #1c1c1f;
+div {
     padding: inherit;
 }
 
diff --git a/enl/index.html b/enl/index.html
index 111d87e..03041c4 100644
--- a/enl/index.html
+++ b/enl/index.html
@@ -2,8 +2,8 @@
 <html lang="en">
 
 <head>
-    <link href='css/main.css' rel='stylesheet'>
-    <link rel="stylesheet" href="/css/animate.min.css">
+    <link href='../css/main.css' rel='stylesheet'>
+    <link rel="stylesheet" href="../css/animate.min.css">
 
     <!--Import Google Icon Font-->
     <link href="http://fonts.googleapis.com/icon?family=Material+Icons" rel="stylesheet">
@@ -25,26 +25,10 @@
     <style>
         body {
             background-image: url(http://orig08.deviantart.net/19de/f/2008/260/d/1/matrix_by_el_sobreviviente.jpg);
-            background-attachment: fixed;
-            background-size: cover;
             font-family: 'Arvo', serif !important;
             color: limegreen !important;
         }
         
-        .dark {
-            background-color: #121314;
-            padding: inherit;
-        }
-        
-        .light {
-            background-color: #1c1c1f;
-            padding: inherit;
-        }
-        
-        .container {
-            padding: 25px;
-        }
-        
         h4 {
             text-align: left;
             text-decoration: underline;
@@ -54,10 +38,6 @@
             text-align: left;
         }
         
-        p {
-            text-align: justify;
-        }
-        
         ol {
             text-align: left;
             font-size: 15px;
@@ -118,16 +98,16 @@ padding-top: 50px;
 padding-bottom: 50px;">
                     <div class="container">
                         <!--TODO switch to margins rather than <br> tags--->
-                        <div class="light">
+                        <div class="grey darken-3">
                             <br>
                             <img src="/images/enl/logo.png" style="height: 150px;" class="animated zoomIn">
                             <br>
                             <h3 style="margin-top: -5px;" class="animated fadeIn">Enlightened East Hertfordshire</h3>
-                            <div class="divider"></div>
+                            <hr>
                             <br>
                         </div>
                         <!---TODO Animated code intro--->
-                        <div class="dark">
+                        <div class="grey darken-4">
                             <h4>Information: </h4>
                             <p>For too long, the Resistance have considered this area a stronghold, standing unopposed. But they have grown complacent. Soft and arrogant. A storm is coming. A viridescent, emerald storm. Be prepared.
                                 <br>
@@ -136,7 +116,7 @@ padding-bottom: 50px;">
                                 <br> Ensuring the skies stay green, for your protection.</p>
 
                         </div>
-                        <div class="light">
+                        <div class="grey darken-3">
                             <h4>Nemeses:</h4>
                             <h5>Most Wanted:</h5>
                             <h5 style="text-align: left;"> <span id="smurf" style="text-align: left;">mormor1971</span></h5>
@@ -155,15 +135,15 @@ padding-bottom: 50px;">
                                 </li>
                             </ol>
                         </div>
-                        <div class="dark">
+                        <div class="grey darken-4">
                             <h4>Target Area:</h4>
                             <h5 style="color: red" class="animated flash">&lt;ACCESS DENIED. USER UNAUTHORISED.&gt;</h5>
                         </div>
-                        <div class="light">
+                        <div class="grey darken-3">
                             <h4>Comms:</h4>
                             <h5 style="color: red" class="animated flash">&lt;ACCESS DENIED. USER UNAUTHORISED.&gt;</h5>
                         </div>
-                        <div class="dark">
+                        <div class="grey darken-4">
                             <h4>Dossier:</h4>
                             <ul>
                                 <li>
@@ -182,7 +162,7 @@ padding-bottom: 50px;">
                                     <h5 style="text-align: left;"><a href="https://plus.google.com/113100485564146114272">- Enlightened G+</a></h5></li>
                             </ul>
                         </div>
-                        <div class="light">
+                        <div class="grey darken-3">
                             <br>
                             <div class="center">
                                 <a href="http://materializecss.com/">Materialize CSS by Google</a>
diff --git a/index.html b/index.html
index d07775f..261de01 100644
--- a/index.html
+++ b/index.html
@@ -2,9 +2,6 @@
 <html lang="en">
 
 <head>
-    <link href='css/main.css' rel='stylesheet'>
-    <link rel="stylesheet" href="css/animate.min.css">
-
     <!--Import Google Icon Font-->
     <link href="http://fonts.googleapis.com/icon?family=Material+Icons" rel="stylesheet">
 
@@ -14,18 +11,17 @@
     <!-- Compiled and minified JavaScript -->
     <script src="https://cdnjs.cloudflare.com/ajax/libs/materialize/0.97.5/js/materialize.min.js"></script>
 
+    <link rel='stylesheet' href='/css/main.css'>
+    <link rel="stylesheet" href="/css/animate.min.css">
+
     <script src="http://code.jquery.com/jquery-2.2.1.min.js" integrity="sha256-gvQgAFzTH6trSrAWoH1iPo9Xc96QxSZ3feW6kem+O00=" crossorigin="anonymous"></script>
 
     <!--Let browser know website is optimized for mobile-->
     <meta name="viewport" content="width=device-width, initial-scale=1.0" />
 
-    <title>Arona Jones' Site - Master Page</title>
-
     <style>
         body {
             background-image: url(https://www.nasa.gov/sites/default/files/styles/full_width_feature/public/flame.jpg?itok=pPD--dxy);
-            background-attachment: fixed;
-            background-size: cover;
         }
     </style>
 
@@ -33,43 +29,41 @@
 </head>
 
 <body>
-    <main>
-        <div id="overlay">
-            <div class="center" style="width: 100%; text-align: center;">
-                <div class="center" style="height: 100%;
+    <div id="overlay">
+        <div class="center" style="width: 100%; text-align: center;">
+            <div class="center" style="height: 100%;
 padding-top: 50px;
 padding-bottom: 50px;">
-                    <div class="container">
-                        <div class="light">
-                            <img src="images/logo.png" style="height: 150px;" class="animated fadeInDown">
-                            <h1 style="margin-top: -5px;">Arona Jones</h1>
-                            <h3 style="font-weight: 400; margin-top: 0px; margin-bottom: -5px;">
+                <div class="container">
+                    <div class="grey darken-3">
+                        <img src="images/logo.png" style="height: 150px;" class="animated fadeInDown" alt="shield and top hat logo">
+                        <h1 style="margin-top: -5px;">Arona Jones</h1>
+                        <h3 style="font-weight: 400; margin-top: 0px; margin-bottom: -5px;">
                 <!---TODO This is a horrible mess!! --> 
                 <span style="padding: 8px;">Developer</span>•<span style="padding: 8px;">Science Enthusiast</span>•<span style="padding: 8px;">Writer</span></h3>
-                            <br>
-                            <div class="divider"></div>
-                        </div>
-                        <div class="dark">
-                            <h4>About Me</h4>
-                            <p class="flow-text">Self-styled Eccentric Gentleman. I'm passionate about science and writing, especially writing about science.</p>
-                        </div>
-                        <div class="light">
-                        </div>
-                        <div class="dark">
-                            <div class="center">
-                                <a href="http://materializecss.com/">Materialize CSS by Google </a>|
-                                <a href="https://daneden.github.io/animate.css/"> Animate.css </a>|
-                                <a href="https://www.nasa.gov/sites/default/files/styles/full_width_feature/public/flame.jpg?itok=pPD--dxy"> Background Image from NASA IOTD </a>|
-                                <a href="htt://game-icons.net"> Icons from Game-Icons.net</a>
-                            </div>
-                            Handcoded by Arona Jones. Kindly hosted by Github.
+                        <br>
+                        <hr>
+                    </div>
+                    <div class="grey darken-4">
+                        <h4>About Me</h4>
+                        <p class="flow-text">Self-styled Eccentric Gentleman. I'm passionate about science and writing, especially writing about science.</p>
+                    </div>
+                    <div class="grey darken-3">
+                    </div>
+                    <div class="grey darken-4">
+                        <div class="center">
+                            <a href="http://materializecss.com/">Materialize CSS by Google </a>|
+                            <a href="https://daneden.github.io/animate.css/"> Animate.css </a>|
+                            <a href="https://www.nasa.gov/sites/default/files/styles/full_width_feature/public/flame.jpg?itok=pPD--dxy"> Background Image from NASA IOTD </a>|
+                            <a href="htt://game-icons.net"> Icons from Game-Icons.net</a>
                         </div>
+                        Handcoded by Arona Jones. Kindly hosted by Github.
                     </div>
                 </div>
             </div>
-            <br>
         </div>
-    </main>
+        <br>
+    </div>
 </body>
 
 </html>
\ No newline at end of file
