diff --git a/html/ListingBootstrap.html b/html/ListingBootstrap.html
new file mode 100644
index 0000000..f5b937b
--- /dev/null
+++ b/html/ListingBootstrap.html
@@ -0,0 +1,88 @@
+<html lang="en"><head>
+    <meta charset="utf-8">
+    <meta http-equiv="X-UA-Compatible" content="IE=edge">
+    <meta name="viewport" content="width=device-width, initial-scale=1">
+    <!-- The above 3 meta tags *must* come first in the head; any other head content must come *after* these tags -->
+    <meta name="description" content="">
+    <meta name="author" content="">
+
+    <title>Synchrony Financial</title>
+
+    <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css">
+      <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.12.4/jquery.min.js"></script>
+      <script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/js/bootstrap.min.js"></script>
+      <style>body { padding-top: 80px; }</style>
+      <style>
+    table {
+      border-collapse: collapse;
+    }
+    tr:nth-child(even) {background-color: #f2f2f2}
+    th, td {
+      text-align: center;
+      width: 100px;
+    }
+  </style>
+      </head>
+
+  <body>
+
+    <nav class="navbar navbar-inverse navbar-fixed-top" style = "height: 80px;">
+      <div class="container-fluid">
+        <div class="navbar-header">
+          <button type="button" class="navbar-toggle collapsed" data-toggle="collapse" data-target="#navbar" aria-expanded="false" aria-controls="navbar" style="line-height: 48px;">
+            <span class="sr-only">Toggle navigation</span>
+            <span class="icon-bar"></span>
+            <span class="icon-bar"></span>
+            <span class="icon-bar"></span>
+          </button>
+          <a class="navbar-brand" href="#"><img src="imgs/synchrony-financial-logo-dlpx.png"></a>
+        </div>
+        <div id="navbar" class="navbar-collapse collapse" aria-expanded="false" style="height: 0.8px;">
+          <ul class="nav navbar-nav navbar-right">
+            <li><a href="#" style="line-height: 48px;">Home</a></li>
+            <li><a href="#" style="line-height: 48px;">Request Device</a></li>
+            <li><a href="#" style="line-height: 48px;">Return Device</a></li>
+            <li><a href="#" style="line-height: 48px;">Device Listing</a></li>
+            <li><a href="#" style="line-height: 48px;">User Information</a></li>
+          </ul>
+        </div>
+      </div>
+    </nav>
+    <div class="col-sm-3 col-md-2 sidebar" style = "display: inline-block; border-right-style: solid; height: 100%; width: 200px;">
+          <ul class="nav nav-sidebar" style = "padding: 0px;">
+            <h4>Device Options</h4>
+            <li><a href="#">Phones</a></li>
+            <li><a href="#">Tablets</a></li>
+            <li><a href="#">PCs</a></li>
+          </ul>
+          <br>
+          <ul class="nav nav-sidebar" style = "padding: 0px;">
+            <h4>Operating Systems</h4>
+            <li><a href="#">Linux</a></li>
+            <li><a href="#">Windows</a></li>
+            <li><a href="#">OSX</a></li>
+          </ul>
+    </div>
+
+    <div style = "display: inline-block; position: absolute; padding-left: 30px;">
+        <h2>Available Devices</h2>
+        <div style="border: solid; border-width: thin; padding: 15px;">
+          <div style = "display: inline-block; text-align: center;">
+          <img src="imgs/iphone.png" style="display: block; height: 20%;">
+          George
+          </div>
+          <div style="display: inline-block; width: 200px; text-align: center; vertical-align: center;"><p>George is probably the coolest iPhone to exist. Ever. Point blank, period.</p><button type="button" style="display: block; margin: auto;">Order device</button>
+          </div>          
+        </div>
+        <br>
+        <div style="border: solid; border-width: thin; padding: 15px;">
+          <div style = "display: inline-block; text-align: center;">
+          <img src="imgs/ipad.png" style="display: block; height: 20%;">
+          Linkin Park
+          </div>
+          <div style="display: inline-block; width: 200px; text-align: center; vertical-align: center;"><p>"The hardest part of ending is starting again."</p><button type="button" style="display: block; margin: auto;">Order device</button>
+          </div>          
+        </div>
+    </div>
+</body>
+</html>
\ No newline at end of file
diff --git a/html/header.html b/html/header.html
deleted file mode 100644
index 160f0e7..0000000
--- a/html/header.html
+++ /dev/null
@@ -1,62 +0,0 @@
-<!DOCTYPE html>
-<head>
-
-    <meta charset="utf-8">
-    <meta http-equiv="X-UA-Compatible" content="IE=edge">
-    <meta name="viewport" content="width=device-width, initial-scale=1">
-    <!-- The above 3 meta tags *must* come first in the head; any other head content must come *after* these tags -->
-    <meta name="description" content="">
-    <meta name="author" content="">
-    <link rel="icon" href="../../favicon.ico">
-
-    <title>Synchrony Financial</title>
-
-    <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css">
-  		<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.12.4/jquery.min.js"></script>
-  		<script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/js/bootstrap.min.js"></script>
-  	<style>.navbar-default .navbar-collapse, .navbar-default .navbar-form {
-    border-color: transparent;
-    box-shadow: none;
-}</style>
-  </head>
-  <body>
-
-    <!-- Fixed navbar -->
-    <nav class="navbar navbar-default navbar-fixed-top" style="background: black; height: 80px;">
-      <div class="container">
-        <div class="navbar-header">
-          <button type="button" class="navbar-toggle collapsed" data-toggle="collapse" data-target="#navbar" aria-expanded="false" aria-controls="navbar" style="line-height: 48px;">
-            <span class="sr-only">Toggle navigation</span>
-            <span class="icon-bar"></span>
-            <span class="icon-bar"></span>
-            <span class="icon-bar"></span>
-          </button>
-          <a class="navbar-brand" href="#"><img src="synchrony-financial-logo-dlpx.png"></a>
-        </div>
-        <div id="navbar" class="navbar-collapse collapse">
-          <ul class="nav navbar-nav">
-          	<li><a href="#" style="line-height: 48px;">Home</a></li>
-            <li><a href="#about" style="line-height: 48px;">Request Device</a></li>
-            <li><a href="#contact" style="line-height: 48px;">Return Device</a></li>
-            <li><a href="#" style="line-height: 48px;">Device Specs</a></li>
-          </ul>
-          <ul class="nav navbar-nav navbar-right">
-            <li><a href="./" style="line-height: 48px;">User Information<span class="sr-only">(current)</span></a></li>
-          </ul>
-        </div><!--/.nav-collapse -->
-      </div>
-    </nav>
-
-
-    <!-- Bootstrap core JavaScript
-    ================================================== -->
-    <!-- Placed at the end of the document so the pages load faster -->
-    <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.12.4/jquery.min.js"></script>
-    <script>window.jQuery || document.write('<script src="../../assets/js/vendor/jquery.min.js"><\/script>')</script>
-    <script src="../../dist/js/bootstrap.min.js"></script>
-    <!-- IE10 viewport hack for Surface/desktop Windows 8 bug -->
-    <script src="../../assets/js/ie10-viewport-bug-workaround.js"></script>
-  
-
-</body>
-</html>
\ No newline at end of file
diff --git a/html/imgs/ipad.png b/html/imgs/ipad.png
new file mode 100644
index 0000000..c199c51
Binary files /dev/null and b/html/imgs/ipad.png differ
diff --git a/html/imgs/iphone.png b/html/imgs/iphone.png
new file mode 100644
index 0000000..79f5582
Binary files /dev/null and b/html/imgs/iphone.png differ
diff --git a/html/synchrony-financial-logo-dlpx.png b/html/imgs/synchrony-financial-logo-dlpx.png
similarity index 100%
rename from html/synchrony-financial-logo-dlpx.png
rename to html/imgs/synchrony-financial-logo-dlpx.png
diff --git a/html/user_icon.png b/html/imgs/user_icon.png
similarity index 100%
rename from html/user_icon.png
rename to html/imgs/user_icon.png
diff --git a/html/orderPage.html b/html/orderPage.html
deleted file mode 100644
index e40df7c..0000000
--- a/html/orderPage.html
+++ /dev/null
@@ -1,66 +0,0 @@
-<head>
-	<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css">
-</head>
-<body>
-	<style>
-		table {
-			margin-left: 10;
-			margin-right: 10;
-		}
-	</style>
-	<div class="row">
-		<div class="col-xs-12">
-			<h3 class="text-center">
-				Devices
-			</h3>
-		</div>
-	</div>
-	<div class="row">
-		<div class="col-xs-3">
-			<h4 class = "text-center">
-				<a href="deviceListing.html">Phones</a>
-			</h4>
-			<h6 class = "text-center">Android</h6>		
-			<h6 class = "text-center">Apple</h6>
-			<h6 class = "text-center">Windows</h6>
-		</div>
-		<div class="col-xs-3">
-			<h4 class = "text-center">
-				<a href="deviceListing.html">Tablets</a>
-			</h4>
-			<h6 class = "text-center">Apple</h6>
-			<h6 class = "text-center">Android</h6>
-			<h6 class = "text-center">Windows</h6>
-		</div>
-		<div class="col-xs-3">
-			<h4 class = "text-center">
-				<a href="deviceListing.html">Computers</a>
-			</h4>
-			<h6 class = "text-center">Windows</h6>
-			<h6 class = "text-center">Apple</h6>
-			<h6 class = "text-center">Linux</h6>
-		</div>
-		<div class="col-xs-3">
-			<h4 class = "text-center">
-				<a href="deviceListing.html">Other devices</a>
-			</h4>
-			<h6 class = "text-center">Android</h6>
-			<h6 class = "text-center">Windows</h6>
-			<h6 class = "text-center">Linux</h6>
-			<h6 class = "text-center">Apple</h6>
-			<table class="table table-condensed">
-			</table>
-		</div>
-	</div>
-	<div class="row">
-		<div class="col-xs-12">
-			<h3 class="text-center">
-				<a href="deviceListing.html"> Or, click here for a list of all devices </a>
-			</h3>
-		</div>
-	</div>
-
-	<!-- bootstrap  -->
-	<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.12.4/jquery.min.js"></script>
-	<script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/js/bootstrap.min.js"></script>
-</body>
\ No newline at end of file
