diff --git a/amplipi/updater/static/css/styles.css b/amplipi/updater/static/css/styles.css
index ed5b3c5e1..df5043703 100644
--- a/amplipi/updater/static/css/styles.css
+++ b/amplipi/updater/static/css/styles.css
@@ -9,6 +9,7 @@
 }
 
 .column-item {
+  float: left;  /* Used to prevent elements from above hanging over the top of the next section */
   display: flex;
   flex-direction: column;
   justify-content: space-around;
@@ -118,34 +119,40 @@ hr {
 }
 
 
-.set-password-dialog {
+.description-color {
   color: #aaaaaa !important;
 }
 
-/* lifted from https://www.w3schools.com/css/css_tooltip.asp */
+.indent {
+  padding-left: 35px;
+}
 
-.hover-label {
-  position: relative;
-  display: inline-block;
-  border-bottom: 1px dotted black;
+@media (min-width: 768px) {
+  .pseudo-column {
+    width: 250px;
+    margin-right: 55%;
+    float: right;
+  }
 }
 
-.hover-label .hover-tooltip{
-  top: 100%;
-  left: 50%;
-  visibility: hidden;
-  width: 750px;
-  max-width: 70vw;
-  background-color: rgba(100, 100, 100, 1);
-  color: #ffffff;
-  text-align: center;
-  padding: 5px 0;
-  border-radius: 6px;
+.wide-button{
+  width: 100%;
+}
 
-  position: absolute;
-  z-index: 1;
+/*
+The following classes have a :hover counterpart to counter the buttons they're used
+on having a default :hover that sets them back to the default blue when not overridden
+*/
+.error{
+  background-color: #DD0000;
+}
+.error:hover{
+  background-color: #DD0000;
 }
 
-.hover-label:hover .hover-tooltip{
-  visibility: visible;
+.success{
+  background-color: #00AA00;
+}
+.success:hover{
+  background-color: #00AA00;
 }
diff --git a/amplipi/updater/static/index.html b/amplipi/updater/static/index.html
index 3412bd7f6..afa7dfc9a 100644
--- a/amplipi/updater/static/index.html
+++ b/amplipi/updater/static/index.html
@@ -102,8 +102,8 @@ <h1><span class="text-white">Ampli</span><span class="text-danger">Pi</span></h1
             <div class="tab-pane fade text-left column-container" id="admin-settings" role="tabpanel" aria-labelledby="admin-settings-tab">
               <script>
                 function setVisibility(visible, ...others){
-                  // Sets visibility of the first element to inline, the rest to none
-                  visible.style.display = 'inline';
+                  // Sets visibility of the first element to block, the rest to none
+                  visible.style.display = 'block';
                   for(i=0; i < others.length; i++){
                     others[i].style.display = 'none';
                   }
@@ -198,49 +198,49 @@ <h1><span class="text-white">Ampli</span><span class="text-danger">Pi</span></h1
               </div>
 
               <!-- Password -->
-              <div id="set-password column-item">
-                <h6 class="hover-label">
-                  Set Password
-                  <span class="hover-tooltip">
-                    This form lets you set a web interface password, which will make it so that you must input the same password to access the system's controls. Leaving the fields empty will remove password protection. Note that this only affects the web interface, not the system password, and will log out any active sessions.
-                  </span>
+              <div style="background-color: inherit; box-shadow: none; width: 100%;" class="card set-password column-item">
+                <h6 class="card-header">
+                  Set Password:
                 </h6>
-                <div class="set-password form-group">
+                <div class="set-password form-group indent">
+                  <div class="description-color">
+                    Set Password allows you set to a web interface password, which will make it so that you must input the same password to access the app
+                    <br />
+                    Leaving the fields empty will remove password protection
+                  </div>
                   <div>
                     <label for="password">
                       Password:
                     </label>
-                    <input id="password" type="password">
+                    <input id="password" type="password" class="pseudo-column">
                   </div>
                   <div>
                     <label for="confirm-password" >Confirm Password:</label>
-                    <input id="confirm-password" type="password">
+                    <input id="confirm-password" type="password" class="pseudo-column">
                   </div>
-                  <div>
-                    <a id="password-submit" role="button" class="btn btn-primary btn-sm text-center" onClick="set_password();">Update Password</a>
-                    <a id="password-success" role="button" class="btn btn-primary btn-sm text-center" style="display: none; background-color: #00AA00;">Success!</a>
-                    <a id="password-fail" role="button" class="btn btn-primary btn-sm text-center" style="display: none; background-color: #DD0000;">Failure...</a>
-                    <a id="password-no-match" role="button" class="btn btn-primary btn-sm text-center" style="display: none; background-color: #DD0000;">Passwords do not match!</a>
+                  <div class="pseudo-column">
+                    <a id="password-submit" role="button" class="btn btn-primary btn-sm text-center wide-button" onClick="set_password();">Update Password</a>
+                    <a id="password-success" role="button" class="btn btn-primary btn-sm text-center wide-button success" style="display: none;">Success!</a>
+                    <a id="password-fail" role="button" class="btn btn-primary btn-sm text-center wide-button error" style="display: none;">Failure...</a>
+                    <a id="password-no-match" role="button" class="btn btn-primary btn-sm text-center wide-button error" style="display: none;">Passwords do not match!</a>
                     <div id="password-spinner" style="display: none;">
                       <i class="fa fa-circle-o-notch fa-spin" style="font-size:24px"></i>
                     </div>
                   </div>
-                  <div>
-                  </div>
                 </div>
               </div>
 
               <!-- Log Persistence -->
-              <div id="log-persistence column-item">
-                <h6 class="hover-label">
-                  Persist Logs
-                  <span class="hover-tooltip">
-                    By default, logs are stored in memory to preserve the limited read/write cycles of the system's EMMC flash storage; this has the effect of deleting all logs on system reboot
-                    <br>
-                    By enabling log persistence, you can save logs to storage instead to persist them between reboots. Over time this may wear out your device; to avoid this, there is also an "auto off delay" that will turn off persistance after X days. Input 0 to not automatically disable log persistance (this is not recommended)
-                  </span>
+              <div style="background-color: inherit; box-shadow: none; width: 100%;" class="card log-persistence column-item">
+                <h6 class="card-header">
+                  Persist Logs:
                 </h6>
-                <div class="log-persistence form-group">
+                <div class="log-persistence form-group indent">
+                  <div class="description-color">
+                    Persist Logs saves logs to system storage instead of deleting them on reboot
+                    <br/>
+                    To prevent wear on the eMMC flash storage, you can set an "auto-off delay" to disable persistence after X days (enter 0 to keep it on indefinitely, at risk of shortening system lifespan).
+                  </div>
                   <div>
                     <input id="persist-checkbox" type="checkbox"/>
                     <label for="persist-checkbox">Enable</label>
@@ -249,20 +249,17 @@ <h6 class="hover-label">
                     <label for="persist-input">
                       Auto Off Delay:
                     </label>
-                    <input id="persist-input" />
+                    <input id="persist-input" class="pseudo-column"/>
                   </div>
-                  <div>
-                    <a id="persist-submit" role="button" class="btn btn-primary btn-sm text-center" onClick="setPersist()">Save Persistence & Delay</a>
-                    <a id="persist-success" role="button" class="btn btn-primary btn-sm text-center" style="display: none; background-color: #00AA00;">Success!</a>
-                    <a id="persist-fail" role="button" class="btn btn-primary btn-sm text-center" style="display: none; background-color: #DD0000;">Failure...</a>
+                  <div class="pseudo-column">
+                    <a id="persist-submit" role="button" class="btn btn-primary btn-sm text-center wide-button" onClick="setPersist()">Save Persistence & Delay</a>
+                    <a id="persist-success" role="button" class="btn btn-primary btn-sm text-center wide-button success" style="display: none;">Success!</a>
+                    <a id="persist-fail" role="button" class="btn btn-primary btn-sm text-center wide-button error" style="display: none;">Failure...</a>
                     <div id="persist-spinner" style="display: none;">
                       <i class="fa fa-circle-o-notch fa-spin" style="font-size:24px"></i>
                     </div>
                   </div>
                 </div>
-                <div class="set-password-dialog">
-                  WARNING: Leaving log persistence on for extended periods can damage your system.
-                </div>
               </div> <!-- log-persistence -->
 
             </div>