diff --git a/moonlight/gfx/ui/hud.png b/moonlight/gfx/ui/hud.png
new file mode 100644
index 0000000..668f5e5
Binary files /dev/null and b/moonlight/gfx/ui/hud.png differ
diff --git a/moonlight/index.html b/moonlight/index.html
index dbe81b8..872cc1b 100644
--- a/moonlight/index.html
+++ b/moonlight/index.html
@@ -19,26 +19,28 @@
   <script type="text/javascript" src="src/SoundSprite.js"></script>
   <script type="text/javascript" src="src/GameStates.js"></script>
   <script type="text/javascript" src="src/main.js"></script>
-  <div id="uiGameContainer">
-    <table>
-      <tr>
-	<td>
-	  <img src="gfx/ui/uiGameDisplayBorder.png">
-	  <div id="uiGameDisplay">
-	  </div>
-	</td>
-	<td>
-	  <div align="center">
+  <center>
+      <div id="uiGameDisplay">
+      </div>
+      <table>
+	<tr>
+	  <td>
 	    <br/>Audio Volume
+	  </td>
+	  <td>
 	    <br/><input type="range" id="uiMusicVolume" min="1" max="100" value="75"/>
+	  </td>
+	</tr>
+	<tr>
+	  <td>
 	    <br/>Brightness
+	  </td>
+	  <td>
 	    <br/><input type="range" id="uiGamma" min="1" max="30" value="0"/>
-	  </div>
-	</td>
-      </tr>
-    </table>
-    </div>
-  </div>
+	  </td>
+	</tr>
+      </table>
+  </center>
   <div id="__stringSize">
   </div>
 </body>
diff --git a/moonlight/moonlight.css b/moonlight/moonlight.css
index f0e718a..2618b1f 100644
--- a/moonlight/moonlight.css
+++ b/moonlight/moonlight.css
@@ -3,7 +3,6 @@ body {
     background-color: #000000;
     color: #c8c8c8;
     text-align: center;
-    width: 800px;
     align: center;
 }
 
@@ -12,7 +11,6 @@ body {
 }
 
 #uiGameDisplay {
-    position: absolute;
-    top: 60px;
-    left: 55px;
+    position: relative;
+    align: center;
 }
\ No newline at end of file
diff --git a/moonlight/src/Constants.js b/moonlight/src/Constants.js
index 48bb7e8..e9cc552 100644
--- a/moonlight/src/Constants.js
+++ b/moonlight/src/Constants.js
@@ -1,7 +1,7 @@
 SCREEN_WIDTH = 640;
 SCREEN_HEIGHT = 480;
 
-SCREEN_OFFSET_RECENTLYSTOLEN = new Phaser.Point(400, SCREEN_HEIGHT - 40);
+SCREEN_OFFSET_RECENTLYSTOLEN = new Phaser.Point(240, SCREEN_HEIGHT - 32);
 RECENTLYSTOLEN_MAX = 5;
 
 SPEED_WALKING = 8;
diff --git a/moonlight/src/GameStates.js b/moonlight/src/GameStates.js
index 1aeec40..678ef28 100644
--- a/moonlight/src/GameStates.js
+++ b/moonlight/src/GameStates.js
@@ -118,9 +118,6 @@ GameState.prototype.create = function()
     this.recentlyStolenGroup = game.add.group();
     this.game.time.advancedTiming = true;
 
-    this.clockText = this.game.add.text(
-	20, SCREEN_HEIGHT - 40, '', { font : '16px Arial', fill: '#ffffff' }, this.uigroup
-    );
     this.clock = new Date();
     this.clock.setHours(20, 50, 0, 0);
     this.clockTimer = game.time.create(true);
@@ -129,25 +126,31 @@ GameState.prototype.create = function()
 			   this.updateClock,
 			   this);
     this.clockTimer.start();
+
+    this.hud = this.game.add.image(0, game.camera.height - 68, 'hud', 0, this.uigroup);
     this.fpsText = this.game.add.text(
         20, 20, '', { font: '16px Arial', fill: '#ffffff' }, this.uigroup
     );
 
+    this.clockText = this.game.add.text(
+	20, SCREEN_HEIGHT - 40, '', { font : '16px Arial', fill: '#ffffff' }, this.uigroup
+    );
+
     this.scoreText = this.game.add.text(
-        SCREEN_WIDTH - 80, SCREEN_HEIGHT - 40, '', 
+        SCREEN_WIDTH - 80, SCREEN_HEIGHT - 30, '', 
 	{ font: '16px Arial', fill: '#ffffff' }, this.uigroup
     );
 
-    this.lightbox = this.game.add.image(game.camera.width / 2 - 50,
-					game.camera.height - 40,
-					'lightbox',
-					0,
-					this.uigroup);
-    this.lightbar = this.game.add.image(this.lightbox.x + 3,
-					this.lightbox.y + 3,
-					'lightbar',
-					0,
-					this.uigroup);
+    // this.lightbox = this.game.add.image(game.camera.width / 2 - 50,
+    // 					game.camera.height - 40,
+    // 					'lightbox',
+    // 					0,
+    // 					this.uigroup);
+    // this.lightbar = this.game.add.image(this.lightbox.x + 3,
+    // 					this.lightbox.y + 3,
+    // 					'lightbar',
+    // 					0,
+    // 					this.uigroup);
     this.lightbar_image = game.cache.getImage('lightbar');
     this.lightbar_crop = positiveRectangle(0,
 					   0,
@@ -281,7 +284,7 @@ GameState.prototype.update_player_lightmeter = function() {
     player.lightmeter += lightValue;
     player.lightmeter = Math.min(player.lightmeter, 1.0);
     this.lightbar_crop.width = ((this.lightbar_image.width) * player.lightmeter);
-    this.lightbar.crop(this.lightbar_crop);
+    //this.lightbar.crop(this.lightbar_crop);
 }
 
 GameState.prototype.update = function()
@@ -371,7 +374,7 @@ GameState.prototype.update = function()
 			this.recentlyStolenGroup.getBottom(),
 			true);
 		}
-		this.recentlyStolenGroup.addAll('cameraOffset.x', 24);
+		this.recentlyStolenGroup.addAll('cameraOffset.x', 36);
 		var rs = game.add.sprite(
 		    SCREEN_OFFSET_RECENTLYSTOLEN.x + 12,
 		    SCREEN_OFFSET_RECENTLYSTOLEN.y + 12,
diff --git a/moonlight/src/Settings.js b/moonlight/src/Settings.js
index 620f87d..bc689c3 100644
--- a/moonlight/src/Settings.js
+++ b/moonlight/src/Settings.js
@@ -151,6 +151,10 @@ var moonlightSettings = {
 	    'name': 'lightbox',
 	    'path': 'gfx/ui/lightbox.png'
 	},
+	{
+	    'name': 'hud',
+	    'path': 'gfx/ui/hud.png'
+	},
 	{
 	    'name': 'lightbar',
 	    'path': 'gfx/ui/lightbar.png'