diff --git a/index.html b/index.html
index 5aa3114b729226fd7dba7c33f8b4d767ba116d15..6fc6b648310ab2e8553bf6a1ff4b59c37c7cef31 100644
--- a/index.html
+++ b/index.html
@@ -1,17 +1,65 @@
+<!DOCTYPE html>
<html>
+ <head>
+ <meta charset="UTF-8">
+ <style>
+ .container{
+ display: flex;
+ }
+ </style>
+ <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css">
+ <script src="https://unpkg.com/sweetalert/dist/sweetalert.min.js"></script>
+ <script src="./index.js"></script>
+
+ </head>
-<script src="index.js"></script>
+ <body>
+ <div class="container">
+
+ <div class="jumbotron">
+ <h2>CS498: IoT -- Lab 2</h2>
-<body>
- <h1>My First Website</h1>
- <p>Hello IoT!</p>
+ <!-- <video class="center" width="600" height="400" controls>
+ <source src="samplevid.mp4" type="video/mp4">
+ Your browser does not support the video tag.
+ </video> -->
+ <img src="./media/default_background.png" id='pics'>
+ </div>
+
+ </div>
- My name is: <input id="myName" type="text" placeholder="name" />
- <button class="btn btn-success" onclick="greeting()">Submit</button>
- <br>
- <span id="greet"> </span>
- <br>
- <span id="greet_from_server"></span>
-</body>
+ <div class="row">
+ <div class="container">
+ <div class="jumbotron text-center col-md-6">
+ <span> </span>
+ <span id="upArrow" style='font-size:50px; color:grey;'>⇧</span>
+ <br>
+ <span id="leftArrow" style='font-size:45px; color:grey;'>⇦</span>
+ <span> </span>
+ <span id="rightArrow" style='font-size:45px; color:grey;'>⇨</span>
+ <br>
+ <span> </span>
+ <span id="downArrow" style='font-size:50px; color:grey;'>⇩</span>
+ </div>
+
+ <div class="jumbotron text-left col-md-6">
+ <input id="message" type="text" placeholder="message to Pi"/>
+ <button class="btn btn-success" onclick="update_data()">Sumbit</button>
+ <p>
+ <span id="direction_dot" style="color:Green">•</span> Car Direction: <span id="direction"> </span>
+ <br>
+ <span id="speed_dot" style="color:green">•</span> Speed: <span id="speed">0.0</span>
+ <br>
+ <span id="distance_dot" style="color:green">•</span> Distance Traveled: <span id="distance">0.0</span>
+ <br>
+ <span id="temprature_dot" style="color:green">•</span> Temperature of the Pi: <span id="temperature">0.0</span>
+ <br>
+ Bluetooth return value: <span id="bluetooth"> </span>
+ </p>
+ </div>
+ </div>
+</div>
+
+ </body>
+</html>
-</html>
\ No newline at end of file