diff --git a/css/master.css b/css/master.css
index b5f5446..6f17f36 100644
--- a/css/master.css
+++ b/css/master.css
@@ -27,63 +27,12 @@ i.fa {
   font-weight: 600;
 }
 
-.nav-tabs {
-  display: inline-block;
-	border: none;
-  width: 100%;
+.input-spacing {
+  margin: 5%;
 }
 
-.nav-tabs>li {
-  margin-right: 5%;
-}
-
-.nav-tabs>li>a {
-  font-size: 1.2em;
-  color: #000000;
-  border: none;
-  margin-right: 99px;
-  border-radius: 100%;
-  height: 40px;
-  width: 40px;
-  margin-bottom: 5%;
-  margin: 0 auto;
-  background-color: #ccc;
-}
-
-.nav-tabs>li.active>a {
-  border: none;
-  color: #000000;
-  background-color: rgb(30, 115, 190);
-  border-radius: 100%;
-  height: 40px;
-  width: 40px;
-  margin-bottom: 5%;
-  margin: 0 auto;
-}
-
-.nav-tabs>li.active>a:link {
-  border: none;
-}
-
-.nav-tabs>li.active>a:hover {
-  background-color: rgb(30, 115, 190);
-  border-radius: 100%;
-  height: 40px;
-  width: 40px;
-  margin-bottom: 5%;
-}
-
-.nav-tabs>li>a:hover {
-  background-color: #ccc;
-  border-radius: 100%;
-  height: 40px;
-  width: 40px;
-  margin-bottom: 5%;
-  margin: 0 auto;
-}
-
-.nav-tabs>li>a:active {
-  background-color: rgb(30, 115, 190);
+.progress {
+  margin-top: 2%;
 }
 
 .proposalBlock {
diff --git a/index.html b/index.html
index 503734b..4b15596 100755
--- a/index.html
+++ b/index.html
@@ -73,6 +73,8 @@
 
                 if (validProposal) {
                     document.getElementById('step_two').click();
+                    document.getElementsByClassName('progress-bar')[0].style.width = "50%";
+                    document.getElementsByClassName('progress-bar')[0].innerText = "Generated wallet commands";
 
                     proposal.walletCommands();
 
@@ -114,16 +116,18 @@
   </div>
 
   <div class="row">
-    <div class="col-xs-10 col-xs-offset-2">
-      <ul class="nav nav-tabs">
-        <li class="active"><a id="step_one" data-toggle="tab" href="#step1"></a>Initial proposal form</li>
-
-        <li><a id="step_two" data-toggle="tab" href="#step2"></a>Generated wallet commands</li>
-
-        <li><a id="step_three" data-toggle="tab" href="#step3"></a>Awaiting confirmations...</li>
-
-        <li><a id="step_four" data-toggle="tab" href="#step4"></a>Completed proposal code</li>
-
+    <div class="col-xs-12">
+      <div class="progress">
+        <div class="progress-bar" role="progressbar" aria-valuenow="25"
+        aria-valuemin="0" aria-valuemax="100" style="width:25%">
+          Create proposal
+        </div>
+      </div>
+      <ul class="nav nav-pills">
+        <li class="active"><a id="step_one" data-toggle="tab" href="#step1">Form</a></li>
+        <li><a id="step_two" data-toggle="tab" href="#step2">Commands</a></li>
+        <li><a id="step_three" data-toggle="tab" href="#step3">Progress</a></li>
+        <li><a id="step_four" data-toggle="tab" href="#step4">Complete</a></li>
       </ul>
     </div>
   </div>
@@ -208,8 +212,12 @@
                     </div>
                     <div class="col-xs-4">
                       <input type="submit" class="btn btn-success" id="btnPrepare" value="Create Proposal">
-                      <input type="submit" class="btn btn-primary hidden" id="btnEdit" value="Edit Proposal">
-                      <input type="submit" class="btn btn-primary hidden" id="btnNew" value="New Proposal">
+                      <div class="input-spacing">
+                        <input type="submit" class="btn btn-primary hidden" id="btnEdit" value="Edit Proposal">
+                      </div>
+                      <div class="input-spacing">
+                        <input type="submit" class="btn btn-primary hidden" id="btnNew" value="New Proposal">
+                      </div>
                     </div>
                   </div>
 
diff --git a/js/transactionListener.js b/js/transactionListener.js
index 405b2c1..32daf79 100755
--- a/js/transactionListener.js
+++ b/js/transactionListener.js
@@ -29,6 +29,8 @@ function transactionListener(proposal) {
                         txidfield.attr("disabled", true);
                         $('.walletCommands#walletCommandsProgress').removeClass('hidden');
                         document.getElementById('step_three').click();
+                        document.getElementsByClassName('progress-bar')[0].style.width = "75%";
+                        document.getElementsByClassName('progress-bar')[0].innerText = "Awaiting network confirmations...";
                         var txid = data.tx;
                         var confirmations = data.confirmations;
                         var conftxt;
@@ -128,6 +130,8 @@ function transactionListener(proposal) {
                                         $("#progresstxt").text("Your transaction has " + confirmations + " confirmations. You can now submit the proposal.");
                                         $('.walletCommands#walletCommandsSubmit').removeClass('hidden');
                                         document.getElementById('step_four').click();
+                                        document.getElementsByClassName('progress-bar')[0].style.width = "100%";
+                                        document.getElementsByClassName('progress-bar')[0].innerText = "Success";
                                     }
                                     $("#progressbar").progressbar({value: progbarval})
                                         .children('.ui-progressbar-value')