diff --git a/templates/base.html b/templates/base.html
index 38deec21..3d5b9b6b 100644
--- a/templates/base.html
+++ b/templates/base.html
@@ -40,6 +40,41 @@
     {% endblock %}
 
     {% block css %}{% endblock css %}
+    <style>
+      .toast-text {
+        display: flex;
+        font-size: .9rem;
+        font-weight: 600;
+        align-items: center;
+        justify-content: center;
+      }
+      .red-delete {
+        display: inline;
+        padding: .1rem .5rem;
+        margin: 0 1rem;
+        border: 2px solid #fff;
+        border-radius: .3rem;
+        color: #fff;
+        font-size: .8rem;
+      }
+      .red-delete:hover {
+        background-color: #fff;
+        color: #f00;
+      }
+      .red-cancel {
+        display:inline;
+        padding: .1rem .5rem;
+        margin-left: 2rem;
+        border: 2px solid #fff;
+        border-radius: .3rem;
+        background-color: #fff;
+        color: var(--text-color);
+        font-size: .8rem;
+      }
+      .red-cancel:hover {
+        color: #f00;
+      }
+    </style>
   </head>
 
   <body x-init="() => {const m = localStorage.getItem('colorMode');
@@ -61,19 +96,19 @@
       </div>
       {% if request.user.is_authenticated and request.user.delete_permanently_at %}
       <div id="messages" class="w-full text-center transition-opacity" x-data="{show: true}">
-        <div x-show="show" class="w-2/3 mx-auto text-left items-center text-slate dark:text-white rounded text-base px-3 py-2 bg-red-500 fade show">
+        <div x-show="show" class="mx-auto text-left items-center text-white rounded text-base px-3 py-2 bg-red-500 fade show">
           <button type="button"
                   class="float-right"
                   data-dismiss="alert"
                   aria-hidden="true"
                   x-on:click="show = ! show"
           ><i class="fas fa-times-circle"></i></button>
-          <p>
+          <div class="toast-text">
           Your account is scheduled for deletion at
           {{ request.user.delete_permanently_at|date:'N j, Y, P e' }}
-          </p>
-          <p><a href="{% url "profile-cancel-delete" %}">Cancel deletion</a></p>
-          <p><a href="{% url "profile-delete-immediately" %}">Delete now</a></p>
+          <button class="red-cancel"><a href="{% url "profile-cancel-delete" %}">Cancel Deletion</a></button>
+          <button class="red-delete"><a href="{% url "profile-delete-immediately" %}">Delete Now</a></button>
+          </div>
         </div>
       </div>
       {% endif %}
diff --git a/templates/includes/_form_input.html b/templates/includes/_form_input.html
index 02d5ce68..b92ac5b7 100644
--- a/templates/includes/_form_input.html
+++ b/templates/includes/_form_input.html
@@ -1,27 +1,23 @@
 {% load static %}
 {% load widget_tweaks %}
 
+<label class="font-semibold pb-4">
+  {{ field.label }}
 
-<label class="font-semibold">{{ field.label }}
+  {% if field.errors %}
+    {% for error in field.errors %}
+      <div class="py-1 px-3 text-white bg-red-600">{{ error }}</div>
+    {% endfor %}
+  {% endif %}
 
-{% if field.errors %}
-  {% for error in field.errors %}
-  <div class="py-1 px-3 text-white bg-red-600">
-    {{ error }}
-  </div>
-  {% endfor %}
-{% endif %}
-
-{% if field.field.widget.input_type == "file" %}
-  {% render_field field class="text-sm text-grey-500 !border-0 file:mr-5 file:py-2 file:px-6 file:rounded-lg file:border-0 file:text-sm file:font-medium file:bg-white file:text-slate hover:file:cursor-pointer hover:file:bg-orange hover:file:text-white"%}
-{% elif field.field.widget.input_type == "checkbox" %}
-  {% render_field field %}
-{% else %}
-  {% render_field field class="w-full bg-white rounded border-gray-300 dark:text-white text-slate dark:border-slate dark:bg-charcoal" placeholder="" %}
-{% endif %}
-{% if field.help_text %}
-<small>
-    {{ field.help_text }}
-</small>
-{% endif %}
+  {% if field.field.widget.input_type == 'file' %}
+    {% render_field field class='text-sm text-grey-500 !border-0 file:mr-5 file:py-2 file:px-6 file:rounded-lg file:border-0 file:text-sm file:font-medium file:bg-white file:text-slate hover:file:cursor-pointer hover:file:bg-orange hover:file:text-white' %}
+  {% elif field.field.widget.input_type == 'checkbox' %}
+    {% render_field field %}
+  {% else %}
+    {% render_field field class='w-full bg-white rounded border-gray-300 dark:text-white text-slate dark:border-slate dark:bg-charcoal' placeholder='' %}
+  {% endif %}
+  {% if field.help_text %}
+    <small>{{ field.help_text }}</small>
+  {% endif %}
 </label>
diff --git a/templates/users/cancel_deletion.html b/templates/users/cancel_deletion.html
index b3549f96..a5e65ee8 100644
--- a/templates/users/cancel_deletion.html
+++ b/templates/users/cancel_deletion.html
@@ -1,20 +1,18 @@
-{% extends "users/profile_base.html" %}
+{% extends 'users/profile_base.html' %}
 
 {% load i18n %}
 
 {% block content %}
-  <div class="container">
-    <h2>{% trans "Cancel scheduled account deletion" %}</h2>
+  <div class="container flex justify-center flex-col items-center rounded bg-white dark:bg-charcoal p-4 mt-6 w-1/2 m-auto mb-4">
+    <h3 class="py-4">{% trans 'Cancel scheduled account deletion' %}</h3>
     <form method="POST">
       {% csrf_token %}
       {% for field in form %}
-      <div>
-        {% include "includes/_form_input.html" %}
-      </div>
+        <div>
+          {% include 'includes/_form_input.html' %}
+        </div>
       {% endfor %}
-      <button class="py-2 px-3 text-sm text-white rounded bg-orange" type="submit">
-        {% trans 'Confirm' %}
-      </button>
+      <button class="py-2 px-3 text-sm text-white rounded bg-orange" type="submit">{% trans 'Confirm' %}</button>
     </form>
   </div>
-{% endblock content %}
+{% endblock %}
diff --git a/templates/users/delete_immediately.html b/templates/users/delete_immediately.html
index c5d8b20a..7bf409af 100644
--- a/templates/users/delete_immediately.html
+++ b/templates/users/delete_immediately.html
@@ -1,21 +1,19 @@
-{% extends "users/profile_base.html" %}
+{% extends 'users/profile_base.html' %}
 
 {% load i18n %}
 
 {% block content %}
-  <div class="container">
-    <h2>{% trans "Delete Account Immediately" %}</h2>
+  <div class="container flex justify-center flex-col items-center rounded bg-white dark:bg-charcoal p-4 mt-6 w-1/2 m-auto mb-4">
+    <h3>{% trans 'Delete Account Immediately' %}</h3>
     <form method="POST">
       {% csrf_token %}
       {% for field in form %}
-      <div>
-        {% include "includes/_form_input.html" %}
-      </div>
+        <div class="mb-4">
+          {% include 'includes/_form_input.html' %}
+        </div>
       {% endfor %}
-      <button class="py-2 px-3 text-sm text-white rounded bg-orange" type="submit">
-        {% trans 'Confirm' %}
-      </button>
+      <button class="py-2 px-3 mr-4 text-sm text-white rounded bg-orange" type="submit">{% trans 'Confirm' %}</button>
       <a href="{% url 'profile-account' %}">{% trans 'Cancel' %}</a>
     </form>
   </div>
-{% endblock content %}
+{% endblock %}
diff --git a/templates/users/profile.html b/templates/users/profile.html
index 9ab1b540..edc34cb3 100644
--- a/templates/users/profile.html
+++ b/templates/users/profile.html
@@ -1,81 +1,98 @@
-{% extends "users/profile_base.html" %}
+{% extends 'users/profile_base.html' %}
 
 {% load static i18n widget_tweaks %}
 
 {% block content %}
+  <style>
+    .profile-delete {
+      display: inline;
+      padding: 0.5rem 1rem;
+      border: 2px solid #f00;
+      background-color: #fff;
+      border-radius: 0.3rem;
+      color: #f00;
+      font-size: 0.9rem;
+    }
+    .profile-delete:hover {
+      background-color: #fff;
+      color: #f00;
+    }
+    .profile-cancel {
+      display: inline;
+      padding: 0.5rem 1rem;
+      border: 2px solid #f00;
+      border-radius: 0.3rem;
+      background-color: #f00;
+      color: #fff;
+      font-size: 0.9rem;
+    }
+    .profile-cancel:hover {
+      color: #f00;
+    }
+  </style>
   <div class="container">
     <div class="md:flex md:space-x-6 mt-6">
       <div class="md:w-1/2 space-y-3">
         <div class="rounded bg-white dark:bg-charcoal p-4">
-          <h3>{% trans "Update Profile" %}</h3>
+          <h3>{% trans 'Update Profile' %}</h3>
 
           <form method="POST" action="." class="space-y-3">
             {% csrf_token %}
             {% for field in profile_form.visible_fields %}
               <div>
-                {% include "includes/_form_input.html" with form=profile_form field=field %}
+                {% include 'includes/_form_input.html' with form=profile_form field=field %}
               </div>
             {% endfor %}
             <div class="mb-4">
-              <button name="update_profile" class="py-2 px-3 text-sm text-white rounded bg-orange" type="submit">
-                Update Profile
-              </button>
+              <button name="update_profile" class="py-2 px-3 text-sm text-white rounded bg-orange" type="submit">Update Profile</button>
             </div>
           </form>
         </div>
 
         <div class="rounded bg-white dark:bg-charcoal p-4">
-          <h3>{% trans "Update Preferences" %}</h3>
+          <h3>{% trans 'Update Preferences' %}</h3>
           <form method="POST" action="." class="space-y-3">
             {% csrf_token %}
             <h5 class="font-bold mt-4">Notify me via email when:</h5>
             {{ profile_preferences_form.errors }}
             {% for field in profile_preferences_form.visible_fields %}
               <div>
-                {% include "includes/_form_input.html" with form=profile_preferences_form field=field %}
+                {% include 'includes/_form_input.html' with form=profile_preferences_form field=field %}
               </div>
             {% endfor %}
             <div class="mt-4">
-              <button name="update_preferences" class="py-2 px-3 text-sm text-white rounded bg-orange" type="submit">
-                Update Preferences
-              </button>
+              <button name="update_preferences" class="py-2 px-3 text-sm text-white rounded bg-orange" type="submit">Update Preferences</button>
             </div>
           </form>
         </div>
       </div>
 
       <div class="md:w-1/2 space-y-3">
-
         <div class="rounded bg-white dark:bg-charcoal p-4">
-          <h3>{% trans "Update Profile Photo" %}</h3>
+          <h3>{% trans 'Update Profile Photo' %}</h3>
           {% if can_update_image %}
             {% if user.github_username %}
               <form method="POST" action="." class="space-y-3 border-b border-slate py-3">
                 {% csrf_token %}
-                <button name="update_github_photo" class="py-2 px-3 text-sm text-white rounded bg-orange" type="submit">
-                Use My GitHub Photo
-                </button>
+                <button name="update_github_photo" class="py-2 px-3 text-sm text-white rounded bg-orange" type="submit">Use My GitHub Photo</button>
               </form>
             {% endif %}
 
             <form method="POST" enctype="multipart/form-data" action="." class="space-y-3 py-3">
               {% csrf_token %}
               {% for field in profile_photo_form.visible_fields %}
-              <div>
-                {% if field.errors %}
-                {% for error in field.errors %}
-                <div class="py-1 px-3 text-white bg-red-600">
-                  {{ error }}
-                </div>
-                {% endfor %}
-                {% endif %}
+                <div>
+                  {% if field.errors %}
+                    {% for error in field.errors %}
+                      <div class="py-1 px-3 text-white bg-red-600">{{ error }}</div>
+                    {% endfor %}
+                  {% endif %}
 
-                {% if user.image %}
-                <img src="{{ user.image.url }}" alt="user" class="ml-4 inline -mt-1 rounded bg-white dark:bg-slate w-[30px] mr-2" />
-                {% endif %}
-
-                {% render_field field class="text-sm text-grey-500 !border-0 file:mr-5 file:py-2 file:px-6 file:rounded-lg file:border-0 file:text-sm file:font-medium file:bg-white file:text-slate hover:file:cursor-pointer hover:file:bg-orange hover:file:text-white"%}
+                  {% if user.image %}
+                    <img src="{{ user.image.url }}" alt="user" class="ml-4 inline -mt-1 rounded bg-white dark:bg-slate w-[30px] mr-2" />
+                  {% endif %}
 
+                  {% render_field field class='text-sm text-grey-500 !border-0 file:mr-5 file:py-2 file:px-6 file:rounded-lg file:border-0 file:text-sm file:font-medium file:bg-white file:text-slate hover:file:cursor-pointer hover:file:bg-orange hover:file:text-white' %}
                 </div>
               {% endfor %}
               <div class="mt-4">
@@ -88,42 +105,43 @@
         </div>
 
         {% if not social_accounts %}
-        <div class="rounded bg-white dark:bg-charcoal p-4">
-          <h3>{% trans "Set Password" %}</h3>
-          <form method="POST" action="." class="password_set space-y-3">
-            {% csrf_token %}
-            {% for field in change_password_form.visible_fields %}
-              <div>
-                {% include "includes/_form_input.html" with form=change_password_form field=field %}
+          <div class="rounded bg-white dark:bg-charcoal p-4">
+            <h3>{% trans 'Set Password' %}</h3>
+            <form method="POST" action="." class="password_set space-y-3">
+              {% csrf_token %}
+              {% for field in change_password_form.visible_fields %}
+                <div>
+                  {% include 'includes/_form_input.html' with form=change_password_form field=field %}
+                </div>
+              {% endfor %}
+              <div class="mt-4">
+                <button name="change_password" class="py-2 px-3 text-sm text-white rounded bg-orange" type="submit">Set Password</button>
               </div>
-            {% endfor %}
-            <div class="mt-4">
-              <button name="change_password" class="py-2 px-3 text-sm text-white rounded bg-orange" type="submit">Set
-                Password
-              </button>
-            </div>
-          </form>
-        </div>
-        {% else %}
-        <div class="rounded bg-white dark:bg-charcoal p-4">
-          <h3>{% trans "Account Connections" %}</h3>
-          <div class="mt-4">
-            <a href="{% url 'socialaccount_connections' %}"><button class="py-2 px-3 text-sm text-white rounded bg-orange">{% trans 'Manage Account Connections' %}</button></a>
+            </form>
+          </div>
+        {% else %}
+          <div class="rounded bg-white dark:bg-charcoal p-4">
+            <h3>{% trans 'Account Connections' %}</h3>
+            <div class="mt-4">
+              <a href="{% url 'socialaccount_connections' %}"><button class="py-2 px-3 text-sm text-white rounded bg-orange">{% trans 'Manage Account Connections' %}</button></a>
+            </div>
           </div>
-        </div>
         {% endif %}
         <div class="rounded bg-white dark:bg-charcoal p-4">
-          <h3>{% trans "Delete Account" %}</h3>
+          <h3>{% trans 'Delete Account' %}</h3>
           {% if user.delete_permanently_at %}
-          <p>
-          {% blocktrans with at=request.user.delete_permanently_at|date:'N j, Y, P e' trimmed %}
-          Your account is scheduled for deletion at {{ at }}
-          {% endblocktrans %}
-          </p>
-          <p><a href="{% url "profile-cancel-delete" %}">{% trans 'Cancel deletion' %}</a></p>
-          <p><a href="{% url "profile-delete-immediately" %}">{% trans 'Delete now' %}</a></p>
+            <p>
+              {% blocktrans with at=request.user.delete_permanently_at|date:'N j, Y, P e' trimmed %}Your account is scheduled for deletion at {{ at }}
+              {% endblocktrans %}
+            </p>
+            <p>
+              <button class="profile-cancel"><a href="{% url 'profile-cancel-delete' %}">Cancel Deletion</a></button>
+            </p>
+            <p>
+              <button class="profile-delete"><a href="{% url 'profile-delete-immediately' %}">Delete Now</a></button>
+            </p>
           {% else %}
-          <a href="{% url "profile-delete" %}">{% trans 'Delete account' %}</a>
+            <a href="{% url 'profile-delete' %}">{% trans 'Delete account' %}</a>
           {% endif %}
         </div>
       </div>
diff --git a/templates/users/profile_base.html b/templates/users/profile_base.html
index 1c9f46ed..026b42bb 100644
--- a/templates/users/profile_base.html
+++ b/templates/users/profile_base.html
@@ -1,13 +1,13 @@
-{% extends "base.html" %}
+{% extends 'base.html' %}
 
 {% load static avatar_tags %}
 
 {% block subnav %}
-  <div class="flex items-center py-3 px-4 border-b md:px-0 md:border-0 border-slate">
-    {% avatar user=user image_size="h-[80px] w-[80px]" icon_size="text-7xl" %}
+  <div class="flex items-center pt-6 px-4 border-b md:px-0 md:border-0 border-slate">
+    {% avatar user=user image_size='h-[80px] w-[80px]' icon_size='text-7xl' %}
     <div class="ml-4 text-base">
       <span class="block">{{ user.get_full_name }}</span>
-      <span class="text-xs text-slate dark:text-white/60  ">Joined {{ user.date_joined }}</span>
+      <span class="text-xs text-slate dark:text-white/60">Joined {{ user.date_joined }}</span>
     </div>
   </div>
 {% endblock %}
