diff --git a/flatclient/index.html b/flatclient/index.html
index 46495cc..f8bc345 100755
--- a/flatclient/index.html
+++ b/flatclient/index.html
@@ -90,7 +90,7 @@
         </li>
         <li id="" data-icon="false">
             <div><!-- slider for volume -->
-                <a href="#" onclick="doMute(); return false;"><img id="mutebt" src="images/icons/volume_16x12.png" alt=""/></a>
+                <a href="#" onclick="doMute(); return false;"><i class="fa fa-volume-up" id="mutebt"></i></a>
                 <label for="volumeslider" class="ui-hidden-accessible">Volume</label>
                 <input id="volumeslider" data-highlight="true" name="volumeslider" data-mini="true" type="range" min="0"
                        value="0" max="100" onchange="doVolume(this.value);"/>
@@ -356,15 +356,15 @@
     <!--id="shufflebt" alt=""/></a>-->
 
     <p id="buttons"' style="float:right; margin-top: 20px; margin-right: 5px;">
-            <a href="#" onclick="doRandom(); return false"><img src="images/icons/loop_alt2_16x14.png" alt="" id="randombt" /></a>
-            &nbsp; <a href="#" onclick="doRepeat(); return false"><img src="images/icons/reload_12x14.png" id="repeatbt" alt="" /></a>
-            &nbsp; <a href="#" onclick="doShuffle(); return false" title="Shuffle"><img src="images/icons/fork_21x24.png" id="shufflebt" alt="" /></a>
+            <a href="#" onclick="doRandom(); return false"><i class="fa fa-random" id="randombt"></i></a>
+            &nbsp; <a href="#" onclick="doRepeat(); return false"><i class="fa fa-repeat" id="repeatbt"></i></a>
+            &nbsp; <a href="#" onclick="doShuffle(); return false" title="Shuffle"><i class="fa fa-code-fork" id="shufflebt"></i></a>
     </p>
 
         <div class="nowPlayingControls" style="float:left; margin-left: 5px;">
             <a href="#" onclick="doPrevious(); return false"><span id="btprev"><i class="fa fa-fast-backward"></i></span></a>
-            <a href="#" onclick="doPlay(); return false"><span id="btplayNowPlaying"><i class="fa fa-play"></i></span></a>
-            <a href="#" onclick="doNext(); return false"><span id="btnext"><i class="fa fa-fast-forward"></i></span></a>
+            &nbsp; <a href="#" onclick="doPlay(); return false"><span id="btplayNowPlaying"><i class="fa fa-play"></i></span></a>
+            &nbsp; <a href="#" onclick="doNext(); return false"><span id="btnext"><i class="fa fa-fast-forward"></i></span></a>
         </div>
 </div>
 <!-- /footer -->
diff --git a/flatclient/js/controls.js b/flatclient/js/controls.js
index 6662bb1..c7dc3a7 100755
--- a/flatclient/js/controls.js
+++ b/flatclient/js/controls.js
@@ -543,13 +543,13 @@ function saveRadioStations() {
 }
 
 function haltSystem() {
-    window.history.back();
     $.post("/haltSystem");
-    toast('Stopping system...', 3000);
+    toast('Stopping system...', 10000);
+    setTimeout(function(){window.history.back();}, 10000);
 }
 
 function rebootSystem() {
-    window.history.back();
     $.post("/rebootSystem");
-    toast('Rebooting...', 3000);
-}
\ No newline at end of file
+    toast('Rebooting...', 10000);
+    setTimeout(function(){window.history.back();}, 10000);
+}
diff --git a/flatclient/settings/index.html b/flatclient/settings/index.html
index 367e4fc..21e1d53 100644
--- a/flatclient/settings/index.html
+++ b/flatclient/settings/index.html
@@ -12,16 +12,16 @@
       <p>Please provide your username, password to enable playing music from Spotify.</p>
       <form action="/updateSettings" method="post">
       <p>Username</p>
-        <input type="text" name="SPOTIFY_USERNAME" value="" size="15" maxlength="40"/>
+        <input type="text" name="SPOTIFY_USERNAME" value="{SPOTIFY_USERNAME}" size="15" maxlength="40"/>
       <p>Password</p>
-        <input type="password" name="SPOTIFY_PASSWORD" value="" size="10" maxlength="40"/>
+        <input type="password" name="SPOTIFY_PASSWORD" value="{SPOTIFY_PASSWORD}" size="10" maxlength="40"/>
       <h2>Last.FM</h2>
 
       <p>Please provide the username, password to enable scrobbling via Last.FM.</p>
       <p>Username</p>
-        <input type="text" name="LASTFM_USERNAME" value="" size="15" maxlength="40"/>
+        <input type="text" name="LASTFM_USERNAME" value="{LASTFM_USERNAME}" size="15" maxlength="40"/>
       <p>Password</p>
-        <input type="password" name="LASTFM_PASSWORD" value="" size="10" maxlength="40"/>
+        <input type="password" name="LASTFM_PASSWORD" value="{LASTFM_PASSWORD}" size="10" maxlength="40"/>
         <p><input type="submit" value="Update"/></p>
       </form>
     </div>
diff --git a/flatclient/system.html b/flatclient/system.html
index ad78bf0..d7715b8 100755
--- a/flatclient/system.html
+++ b/flatclient/system.html
@@ -8,13 +8,15 @@
     <script src="js/jquery.mobile-1.3.2.min.js"></script>
     <script src="js/controls.js"></script>
     <script src="js/functionsvars.js"></script>
+    <link href="css/webclient.css" rel="stylesheet">
+    <link rel="stylesheet" href="css/font-awesome.min.css">
 </head>
 
 <body>
 <div data-role="page" class="dialog-actionsheet">
 
-    <div data-role="content" data-theme="c">
-	<h2>System</h2>
+    <div data-role="content" data-theme="b">
+	<h3>System</h3>
 	<a href="#" onclick="haltSystem(); return false;" data-role="button" data-rel="dialog" data-transition="slidedown" data-theme="b">Shutdown</a>
 	<a href="#" onclick="rebootSystem(); return false;" data-role="button" data-rel="dialog" data-transition="slidedown" data-theme="b">Reboot</a>
 	<a href="index.html" data-role="button" data-rel="back" data-theme="a">Cancel</a>