git subrepo commit mailcow/src/mailcow-dockerized

subrepo: subdir:   "mailcow/src/mailcow-dockerized"
  merged:   "308860af"
upstream: origin:   "https://github.com/mailcow/mailcow-dockerized.git"
  branch:   "master"
  commit:   "3f1a5af8"
git-subrepo: version:  "0.4.5"
  origin:   "???"
  commit:   "???"
Change-Id: I5d51c14b45db54fe706be40a591ddbfcea50d4b0
diff --git a/mailcow/src/mailcow-dockerized/data/web/templates/user/AppPasswds.twig b/mailcow/src/mailcow-dockerized/data/web/templates/user/AppPasswds.twig
index d8d125e..4e70f10 100644
--- a/mailcow/src/mailcow-dockerized/data/web/templates/user/AppPasswds.twig
+++ b/mailcow/src/mailcow-dockerized/data/web/templates/user/AppPasswds.twig
@@ -1,23 +1,53 @@
-<div role="tabpanel" class="tab-pane" id="AppPasswds">
-  <p>{{ lang.user.app_hint|raw }}</p>
-  <div class="table-responsive">
-    <table class="table table-striped" id="app_passwd_table"></table>
-  </div>
-  <div class="mass-actions-user">
-    <div class="btn-group" data-acl="{{ acl.app_passwds }}">
-      <div class="btn-group">
-        <a class="btn btn-sm btn-xs-half visible-xs-block visible-sm-inline visible-md-inline visible-lg-inline btn-default" id="toggle_multi_select_all" data-id="apppasswd" href="#"><i class="bi bi-check-all"></i> {{ lang.mailbox.toggle_all }}</a>
-        <a class="btn btn-sm btn-xs-half visible-xs-block visible-sm-inline visible-md-inline visible-lg-inline btn-default dropdown-toggle" data-toggle="dropdown" href="#">{{ lang.mailbox.quick_actions }} <span class="caret"></span></a>
-        <ul class="dropdown-menu">
-          <li><a data-action="edit_selected" data-id="apppasswd" data-api-url='edit/app-passwd' data-api-attr='{"active":"1"}' href="#">{{ lang.mailbox.activate }}</a></li>
-          <li><a data-action="edit_selected" data-id="apppasswd" data-api-url='edit/app-passwd' data-api-attr='{"active":"0"}' href="#">{{ lang.mailbox.deactivate }}</a></li>
-          <li role="separator" class="divider"></li>
-          <li><a data-action="delete_selected" data-id="apppasswd" data-api-url='delete/app-passwd' href="#">{{ lang.mailbox.remove }}</a></li>
-        </ul>
-        <div class="clearfix visible-xs"></div>
+<div role="tabpanel" class="tab-pane fade" id="AppPasswds" role="tabpanel" aria-labelledby="AppPasswds">
+  <div class="card mb-4">
+    <div class="card-header d-flex fs-5">
+      <button class="btn d-md-none flex-grow-1 text-start" data-bs-target="#collapse-tab-AppPasswds" data-bs-toggle="collapse" aria-controls="collapse-tab-AppPasswds">
+        {{ lang.user.app_passwds }}
+      </button>
+      <span class="d-none d-md-block">{{ lang.user.app_passwds }}
+    </div>
+    <div id="collapse-tab-AppPasswds" class="card-body collapse" data-bs-parent="#user-content">
+      <div class="mass-actions-user mb-4">
+        <div class="btn-group" data-acl="{{ acl.app_passwds }}">
+          <div class="btn-group">
+            <a class="btn btn-sm btn-xs-half d-block d-sm-inline btn-secondary" id="toggle_multi_select_all" data-id="apppasswd" href="#"><i class="bi bi-check-all"></i> {{ lang.mailbox.toggle_all }}</a>
+            <a class="btn btn-sm btn-xs-half d-block d-sm-inline btn-secondary dropdown-toggle" data-bs-toggle="dropdown" href="#">{{ lang.mailbox.quick_actions }}</a>
+            <ul class="dropdown-menu">
+              <li><a class="dropdown-item" data-action="edit_selected" data-id="apppasswd" data-api-url='edit/app-passwd' data-api-attr='{"active":"1"}' href="#">{{ lang.mailbox.activate }}</a></li>
+              <li><a class="dropdown-item" data-action="edit_selected" data-id="apppasswd" data-api-url='edit/app-passwd' data-api-attr='{"active":"0"}' href="#">{{ lang.mailbox.deactivate }}</a></li>
+              <li><hr class="dropdown-divider"></li>
+              <li><a class="dropdown-item" data-datatables-expand="app_passwd_table" data-table="app_passwd_table" href="#">{{ lang.datatables.expand_all }}</a></li>
+              <li><a class="dropdown-item" data-datatables-collapse="app_passwd_table" data-table="app_passwd_table" href="#">{{ lang.datatables.collapse_all }}</a></li>
+              <li><hr class="dropdown-divider"></li>
+              <li><a class="dropdown-item" data-action="delete_selected" data-id="apppasswd" data-api-url='delete/app-passwd' href="#">{{ lang.mailbox.remove }}</a></li>
+            </ul>
+          </div>
+          <div class="btn-group">
+            <a class="btn btn-sm d-block d-sm-inline btn-success" href="#" data-bs-toggle="modal" data-bs-target="#addAppPasswdModal"><i class="bi bi-plus-lg"></i> {{ lang.user.create_app_passwd }}</a>
+          </div>
+        </div>
       </div>
-      <div class="btn-group">
-        <a class="btn btn-sm visible-xs-block visible-sm-inline visible-md-inline visible-lg-inline btn-success" href="#" data-toggle="modal" data-target="#addAppPasswdModal"><i class="bi bi-plus-lg"></i> {{ lang.user.create_app_passwd }}</a>
+      <p>{{ lang.user.app_hint|raw }}</p>
+      <table id="app_passwd_table" class="table table-striped dt-responsive w-100"></table>
+      <div class="mass-actions-user mt-4">
+        <div class="btn-group" data-acl="{{ acl.app_passwds }}">
+          <div class="btn-group">
+            <a class="btn btn-sm btn-xs-half d-block d-sm-inline btn-secondary" id="toggle_multi_select_all" data-id="apppasswd" href="#"><i class="bi bi-check-all"></i> {{ lang.mailbox.toggle_all }}</a>
+            <a class="btn btn-sm btn-xs-half d-block d-sm-inline btn-secondary dropdown-toggle" data-bs-toggle="dropdown" href="#">{{ lang.mailbox.quick_actions }}</a>
+            <ul class="dropdown-menu">
+              <li><a class="dropdown-item" data-action="edit_selected" data-id="apppasswd" data-api-url='edit/app-passwd' data-api-attr='{"active":"1"}' href="#">{{ lang.mailbox.activate }}</a></li>
+              <li><a class="dropdown-item" data-action="edit_selected" data-id="apppasswd" data-api-url='edit/app-passwd' data-api-attr='{"active":"0"}' href="#">{{ lang.mailbox.deactivate }}</a></li>
+              <li><hr class="dropdown-divider"></li>
+              <li><a class="dropdown-item" data-datatables-expand="app_passwd_table" data-table="app_passwd_table" href="#">{{ lang.datatables.expand_all }}</a></li>
+              <li><a class="dropdown-item" data-datatables-collapse="app_passwd_table" data-table="app_passwd_table" href="#">{{ lang.datatables.collapse_all }}</a></li>
+              <li><hr class="dropdown-divider"></li>
+              <li><a class="dropdown-item" data-action="delete_selected" data-id="apppasswd" data-api-url='delete/app-passwd' href="#">{{ lang.mailbox.remove }}</a></li>
+            </ul>
+          </div>
+          <div class="btn-group">
+            <a class="btn btn-sm d-block d-sm-inline btn-success" href="#" data-bs-toggle="modal" data-bs-target="#addAppPasswdModal"><i class="bi bi-plus-lg"></i> {{ lang.user.create_app_passwd }}</a>
+          </div>
+        </div>
       </div>
     </div>
   </div>
diff --git a/mailcow/src/mailcow-dockerized/data/web/templates/user/Pushover.twig b/mailcow/src/mailcow-dockerized/data/web/templates/user/Pushover.twig
index c7abe16..d3304db 100644
--- a/mailcow/src/mailcow-dockerized/data/web/templates/user/Pushover.twig
+++ b/mailcow/src/mailcow-dockerized/data/web/templates/user/Pushover.twig
@@ -1,80 +1,118 @@
-<div role="tabpanel" class="tab-pane" id="Pushover">
-  <form data-id="pushover" class="form well" method="post">
-    <input type="hidden" value="0" name="evaluate_x_prio">
-    <input type="hidden" value="0" name="only_x_prio">
-    <input type="hidden" value="0" name="active">
-    <div class="row">
-      <div class="col-sm-1">
-        <p class="help-block"><a href="https://pushover.net" target="_blank"><img src="data:image/png;base64,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" class="img img-fluid"></a></p>
-      </div>
-      <div class="col-sm-10">
-        <p class="help-block">{{ lang.user.pushover_info|format(mailcow_cc_username)|raw }}</p>
-        <p class="help-block">{{ lang.user.pushover_vars|raw }}: <code>{SUBJECT}</code>, <code>{SENDER}</code></p>
-        <div class="form-group">
-          <div class="row">
-            <div class="col-sm-6">
-              <div class="form-group">
-                <label for="token">API Token/Key (Application)</label>
-                <input type="text" class="form-control" name="token" maxlength="30" value="{{ pushover_data.token }}" required>
-              </div>
-            </div>
-            <div class="col-sm-6">
-              <div class="form-group">
-                <label for="key">User/Group Key</label>
-                <input type="text" class="form-control" name="key" maxlength="30" value="{{ pushover_data.key }}" required>
-              </div>
-            </div>
-            <div class="col-sm-6">
-              <div class="form-group">
-                <label for="title">{{ lang.user.pushover_title }}</label>
-                <input type="text" class="form-control" name="title" value="{{ pushover_data.title }}" placeholder="Mail">
-              </div>
-            </div>
-            <div class="col-sm-6">
-              <div class="form-group">
-                <label for="text">{{ lang.user.pushover_text }}</label>
-                <input type="text" class="form-control" name="text" value="{{ pushover_data.text }}" placeholder="You've got mail 📧">
-              </div>
-            </div>
-            <div class="col-sm-12">
-              <div class="form-group">
-                <label for="text">{{ lang.user.pushover_sender_array|raw }}</label>
-                <input type="text" class="form-control" name="senders" value="{{ pushover_data.token }}" placeholder="sender1@example.com, sender2@example.com">
-              </div>
-            </div>
-            <div class="col-sm-12">
-              <div class="checkbox">
-                <label><input type="checkbox" value="1" name="active"{% if pushover_data.active == '1' %} checked{% endif %}> {{ lang.user.active }}</label>
-              </div>
-            </div>
-            <div class="col-sm-12">
-              <legend style="cursor:pointer;margin-top:10px" data-target="#po_advanced" unselectable="on" data-toggle="collapse">
-                <i style="font-size:10pt;" class="bi bi-plus-square"></i> {{ lang.user.advanced_settings }}
-              </legend>
-            </div>
-            <div class="col-sm-12">
-              <div id="po_advanced" class="collapse">
+<div role="tabpanel" class="tab-pane fade" id="Pushover" role="tabpanel" aria-labelledby="Pushover">
+  <div class="card mb-4">
+    <div class="card-header d-flex fs-5">
+      <button class="btn d-md-none flex-grow-1 text-start" data-bs-target="#collapse-tab-Pushover" data-bs-toggle="collapse" aria-controls="collapse-tab-Pushover">
+        Pushover API
+      </button>
+      <span class="d-none d-md-block">Pushover API
+    </div>
+    <div id="collapse-tab-Pushover" class="card-body collapse" data-bs-parent="#user-content">
+      <form data-id="pushover" class="form well" method="post">
+        <input type="hidden" value="0" name="evaluate_x_prio">
+        <input type="hidden" value="0" name="only_x_prio">
+        <input type="hidden" value="0" name="active">
+        <div class="row">
+          <div class="col-sm-1">
+            <p class="text-muted"><a href="https://pushover.net" target="_blank"><img src="data:image/png;base64,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" class="img img-fluid"></a></p>
+          </div>
+          <div class="col-sm-10">
+            <p class="text-muted">{{ lang.user.pushover_info|format(mailcow_cc_username)|raw }}</p>
+            <p class="text-muted">{{ lang.edit.pushover_vars|raw }}: <code>{SUBJECT}</code>, <code>{SENDER}</code>, <code>{SENDER_ADDRESS}</code>, <code>{SENDER_NAME}</code>, <code>{TO_NAME}</code>, <code>{TO_ADDRESS}</code>, <code>{MSG_ID}</code></p>
+            <div class="row">
+              <div class="col-sm-6 mb-2">
                 <div class="form-group">
-                  <label for="text">{{ lang.user.pushover_sender_regex }}</label>
-                  <input type="text" class="form-control" name="senders_regex" value="{{ pushover_data.senders_regex }}" placeholder="/(.*@example\.org$|^foo@example\.com$)/i" regex="true">
-                  <div class="checkbox">
-                    <label><input type="checkbox" value="1" name="evaluate_x_prio"{% if pushover_data.attributes.evaluate_x_prio == '1' %} checked{% endif %}> {{ lang.user.pushover_evaluate_x_prio|raw }}</label>
-                  </div>
-                  <div class="checkbox">
-                    <label><input type="checkbox" value="1" name="only_x_prio"{% if pushover_data.attributes.only_x_prio == '1' %} checked{% endif %}> {{ lang.user.pushover_only_x_prio|raw }}</label>
+                  <label for="token">API Token/Key (Application)</label>
+                  <input type="text" class="form-control" name="token" maxlength="30" value="{{ pushover_data.token }}" required>
+                </div>
+              </div>
+              <div class="col-sm-6 mb-2">
+                <div class="form-group">
+                  <label for="key">User/Group Key</label>
+                  <input type="text" class="form-control" name="key" maxlength="30" value="{{ pushover_data.key }}" required>
+                </div>
+              </div>
+              <div class="col-sm-6 mb-2">
+                <div class="form-group">
+                  <label for="title">{{ lang.user.pushover_title }}</label>
+                  <input type="text" class="form-control" name="title" value="{{ pushover_data.title }}" placeholder="Mail">
+                </div>
+              </div>
+              <div class="col-sm-6 mb-2">
+                <div class="form-group">
+                  <label for="text">{{ lang.user.pushover_text }}</label>
+                  <input type="text" class="form-control" name="text" value="{{ pushover_data.text }}" placeholder="You've got mail 📧">
+                </div>
+              </div>
+              <div class="col-sm-12 mb-4">
+                <div class="form-group">
+                  <label for="text">{{ lang.user.pushover_sender_array|raw }}</label>
+                  <input type="text" class="form-control" name="senders" value="{{ pushover_data.senders }}" placeholder="sender1@example.com, sender2@example.com">
+                </div>
+              </div>
+              <div class="col-sm-12 mb-2">
+              <div class="form-group">
+                <label for="sound">{{ lang.edit.pushover_sound }}</label><br>
+                <select name="sound" class="form-control">
+                  <option value="pushover"{% if pushover_data.attributes.sound == 'pushover' %} selected{% endif %}>Pushover (default)</option>
+                  <option value="bike"{% if pushover_data.attributes.sound == 'bike' %} selected{% endif %}>Bike</option>
+                  <option value="bugle"{% if pushover_data.attributes.sound == 'bugle' %} selected{% endif %}>Bugle</option>
+                  <option value="cashregister"{% if pushover_data.attributes.sound == 'cashregister' %} selected{% endif %}>Cash Register</option>
+                  <option value="classical"{% if pushover_data.attributes.sound == 'classical' %} selected{% endif %}>Classical</option>
+                  <option value="cosmic"{% if pushover_data.attributes.sound == 'cosmic' %} selected{% endif %}>Cosmic</option>
+                  <option value="falling"{% if pushover_data.attributes.sound == 'falling' %} selected{% endif %}>Falling</option>
+                  <option value="gamelan"{% if pushover_data.attributes.sound == 'gamelan' %} selected{% endif %}>Gamelan</option>
+                  <option value="incoming"{% if pushover_data.attributes.sound == 'incoming' %} selected{% endif %}>Incoming</option>
+                  <option value="intermission"{% if pushover_data.attributes.sound == 'intermission' %} selected{% endif %}>Intermission</option>
+                  <option value="magic"{% if pushover_data.attributes.sound == 'magic' %} selected{% endif %}>Magic</option>
+                  <option value="mechanical"{% if pushover_data.attributes.sound == 'mechanical' %} selected{% endif %}>Mechanical</option>
+                  <option value="pianobar"{% if pushover_data.attributes.sound == 'pianobar' %} selected{% endif %}>Piano Bar</option>
+                  <option value="siren"{% if pushover_data.attributes.sound == 'siren' %} selected{% endif %}>Siren</option>
+                  <option value="spacealarm"{% if pushover_data.attributes.sound == 'spacealarm' %} selected{% endif %}>Space Alarm</option>
+                  <option value="tugboat"{% if pushover_data.attributes.sound == 'tugboat' %} selected{% endif %}>Tug Boat</option>
+                  <option value="alien"{% if pushover_data.attributes.sound == 'alien' %} selected{% endif %}>Alien Alarm (long)</option>
+                  <option value="climb"{% if pushover_data.attributes.sound == 'climb' %} selected{% endif %}>Climb (long)</option>
+                  <option value="persistent"{% if pushover_data.attributes.sound == 'persistent' %} selected{% endif %}>Persistent (long)</option>
+                  <option value="echo"{% if pushover_data.attributes.sound == 'echo' %} selected{% endif %}>Pushover Echo (long)</option>
+                  <option value="updown"{% if pushover_data.attributes.sound == 'updown' %} selected{% endif %}>Up Down (long)</option>
+                  <option value="vibrate"{% if pushover_data.attributes.sound == 'vibrate' %} selected{% endif %}>Vibrate Only</option>
+                  <option value="none"{% if pushover_data.attributes.sound == 'none' %} selected{% endif %}> None (silent) </option>
+                </select>
+              </div>
+            </div>
+            <div class="col-sm-12">
+                <div class="checkbox">
+                  <label><input type="checkbox" value="1" name="active"{% if pushover_data.active == '1' %} checked{% endif %}> {{ lang.user.active }}</label>
+                </div>
+              </div>
+              <div class="col-sm-12">
+                <legend style="cursor:pointer;margin-top:10px" data-bs-target="#po_advanced" unselectable="on" data-bs-toggle="collapse">
+                  <i style="font-size:10pt;" class="bi bi-plus-square"></i> {{ lang.user.advanced_settings }}
+                </legend>
+                <hr />
+              </div>
+              <div class="col-sm-12 mb-4">
+                <div id="po_advanced" class="collapse">
+                  <div class="form-group">
+                    <label for="text">{{ lang.user.pushover_sender_regex }}</label>
+                    <input type="text" class="form-control mb-4" name="senders_regex" value="{{ pushover_data.senders_regex }}" placeholder="/(.*@example\.org$|^foo@example\.com$)/i" regex="true">
+                    <div class="checkbox">
+                      <label><input type="checkbox" value="1" name="evaluate_x_prio"{% if pushover_data.attributes.evaluate_x_prio == '1' %} checked{% endif %}> {{ lang.user.pushover_evaluate_x_prio|raw }}</label>
+                    </div>
+                    <div class="checkbox">
+                      <label><input type="checkbox" value="1" name="only_x_prio"{% if pushover_data.attributes.only_x_prio == '1' %} checked{% endif %}> {{ lang.user.pushover_only_x_prio|raw }}</label>
+                    </div>
                   </div>
                 </div>
               </div>
             </div>
+            <div class="btn-group mass-actions-user mb-2" data-acl="{{ acl.pushover }}">
+              <a class="btn btn-sm btn-xs-half d-block d-sm-inline btn-success" data-action="edit_selected" data-id="pushover" data-item="{{ mailcow_cc_username }}" data-api-url='edit/pushover' data-api-attr='{}' href="#">{{ lang.user.save }}</a>
+              <a class="btn btn-sm btn-xs-half d-block d-sm-inline btn-secondary" data-action="edit_selected" data-id="pushover-test" data-item="{{ mailcow_cc_username }}" data-api-url='edit/pushover-test' data-api-attr='{}' href="#"><i class="bi bi-check-all"></i> {{ lang.user.pushover_verify }}</a>
+              <a id="pushover_delete" class="btn btn-sm d-block d-sm-inline btn-danger" data-action="edit_selected" data-id="pushover-delete" data-item="{{ mailcow_cc_username }}" data-api-url='edit/pushover' data-api-attr='{"delete":"true"}' href="#"><i class="bi bi-trash"></i> {{ lang.user.remove }}</a>
+            </div>
           </div>
         </div>
-        <div class="btn-group mass-actions-user" data-acl="{{ acl.pushover }}">
-          <a class="btn btn-sm btn-xs-half visible-xs-block visible-sm-inline visible-md-inline visible-lg-inline btn-success" data-action="edit_selected" data-id="pushover" data-item="{{ mailcow_cc_username }}" data-api-url='edit/pushover' data-api-attr='{}' href="#">{{ lang.user.save }}</a>
-          <a class="btn btn-sm btn-xs-half visible-xs-block visible-sm-inline visible-md-inline visible-lg-inline btn-default" data-action="edit_selected" data-id="pushover-test" data-item="{{ mailcow_cc_username }}" data-api-url='edit/pushover-test' data-api-attr='{}' href="#"><i class="bi bi-check-all"></i> {{ lang.user.pushover_verify }}</a>
-          <div class="clearfix visible-xs"></div>
-          <a id="pushover_delete" class="btn btn-sm visible-xs-block visible-sm-inline visible-md-inline visible-lg-inline btn-danger" data-action="edit_selected" data-id="pushover-delete" data-item="{{ mailcow_cc_username }}" data-api-url='edit/pushover' data-api-attr='{"delete":"true"}' href="#"><i class="bi bi-trash"></i> {{ lang.user.remove }}</a>
-        </div>
-      </div>
+      </form>
     </div>
-  </form>
+  </div>
 </div>
diff --git a/mailcow/src/mailcow-dockerized/data/web/templates/user/SpamAliases.twig b/mailcow/src/mailcow-dockerized/data/web/templates/user/SpamAliases.twig
index 49153c0..54c7686 100644
--- a/mailcow/src/mailcow-dockerized/data/web/templates/user/SpamAliases.twig
+++ b/mailcow/src/mailcow-dockerized/data/web/templates/user/SpamAliases.twig
@@ -1,39 +1,46 @@
-<div role="tabpanel" class="tab-pane" id="SpamAliases">
-  <div class="row">
-    <div class="col-md-12 col-sm-12 col-xs-12">
-      <div class="table-responsive">
-        <table class="table table-striped" id="tla_table"></table>
-      </div>
+<div role="tabpanel" class="tab-pane fade" id="SpamAliases" role="tabpanel" aria-labelledby="SpamAliases">
+  <div class="card mb-4">
+    <div class="card-header d-flex fs-5">
+      <button class="btn d-md-none flex-grow-1 text-start" data-bs-target="#collapse-tab-SpamAliases" data-bs-toggle="collapse" aria-controls="collapse-tab-SpamAliases">
+        {{ lang.user.spam_aliases }}
+      </button>
+      <span class="d-none d-md-block">{{ lang.user.spam_aliases }}
     </div>
-  </div>
-  <div class="mass-actions-user">
-    <div class="btn-group" data-acl="{{ acl.spam_alias }}">
-      <div class="btn-group">
-        <a class="btn btn-sm btn-xs-half visible-xs-block visible-sm-inline visible-md-inline visible-lg-inline btn-default" id="toggle_multi_select_all" data-id="tla" href="#"><i class="bi bi-check-all"></i> {{ lang.mailbox.toggle_all }}</a>
-        <a class="btn btn-sm btn-xs-half visible-xs-block visible-sm-inline visible-md-inline visible-lg-inline btn-default dropdown-toggle" data-toggle="dropdown" href="#">{{ lang.mailbox.quick_actions }} <span class="caret"></span></a>
-        <ul class="dropdown-menu">
-          <li><a data-action="edit_selected" data-id="tla" data-api-url='edit/time_limited_alias' data-api-attr='{"validity":"1"}' href="#">{{ lang.user.expire_in }} 1 {{ lang.user.hour }}</a></li>
-          <li><a data-action="edit_selected" data-id="tla" data-api-url='edit/time_limited_alias' data-api-attr='{"validity":"24"}' href="#">{{ lang.user.expire_in }} 1 {{ lang.user.day }}</a></li>
-          <li><a data-action="edit_selected" data-id="tla" data-api-url='edit/time_limited_alias' data-api-attr='{"validity":"168"}' href="#">{{ lang.user.expire_in }} 1 {{ lang.user.week }}</a></li>
-          <li><a data-action="edit_selected" data-id="tla" data-api-url='edit/time_limited_alias' data-api-attr='{"validity":"744"}' href="#">{{ lang.user.expire_in }} 1 {{ lang.user.month }}</a></li>
-          <li><a data-action="edit_selected" data-id="tla" data-api-url='edit/time_limited_alias' data-api-attr='{"validity":"8760"}' href="#">{{ lang.user.expire_in }} 1 {{ lang.user.year }}</a></li>
-          <li><a data-action="edit_selected" data-id="tla" data-api-url='edit/time_limited_alias' data-api-attr='{"validity":"87600"}' href="#">{{ lang.user.expire_in }} 10 {{ lang.user.years }}</a></li>
-          <li role="separator" class="divider"></li>
-          <li><a data-action="delete_selected" data-id="tla" data-api-url='delete/time_limited_alias' href="#">{{ lang.mailbox.remove }}</a></li>
-        </ul>
-        <div class="clearfix visible-xs-block"></div>
+    <div id="collapse-tab-SpamAliases" class="card-body collapse" data-bs-parent="#user-content">
+      <div class="row">
+        <div class="col-md-12 col-sm-12 col-12">
+          <table id="tla_table" class="table table-striped dt-responsive w-100"></table>
+        </div>
       </div>
-      <div class="btn-group">
-        <a class="btn btn-sm visible-xs-block visible-sm-inline visible-md-inline visible-lg-inline btn-success dropdown-toggle" data-toggle="dropdown" href="#"><i class="bi bi-plus-lg"></i> {{ lang.user.alias_create_random }}, 1 {{ lang.user.year }} <span class="caret"></span></a>
-        <ul class="dropdown-menu">
-          {% for domain in user_domains %}
-            <li>
-              <a data-action="add_item" data-api-url='add/time_limited_alias' data-api-attr='{"domain":"{{ domain }}"}' href="#">
-                @ {{ domain }}
-              </a>
-            </li>
-          {% endfor %}
-        </ul>
+      <div class="mass-actions-user">
+        <div class="btn-group" data-acl="{{ acl.spam_alias }}">
+          <div class="btn-group">
+            <a class="btn btn-sm btn-xs-half d-block d-sm-inline btn-secondary" id="toggle_multi_select_all" data-id="tla" href="#"><i class="bi bi-check-all"></i> {{ lang.mailbox.toggle_all }}</a>
+            <a class="btn btn-sm btn-xs-half d-block d-sm-inline btn-secondary dropdown-toggle" data-bs-toggle="dropdown" href="#">{{ lang.mailbox.quick_actions }}</a>
+            <ul class="dropdown-menu">
+              <li><a class="dropdown-item" data-action="edit_selected" data-id="tla" data-api-url='edit/time_limited_alias' data-api-attr='{"validity":"1"}' href="#">{{ lang.user.expire_in }} 1 {{ lang.user.hour }}</a></li>
+              <li><a class="dropdown-item" data-action="edit_selected" data-id="tla" data-api-url='edit/time_limited_alias' data-api-attr='{"validity":"24"}' href="#">{{ lang.user.expire_in }} 1 {{ lang.user.day }}</a></li>
+              <li><a class="dropdown-item" data-action="edit_selected" data-id="tla" data-api-url='edit/time_limited_alias' data-api-attr='{"validity":"168"}' href="#">{{ lang.user.expire_in }} 1 {{ lang.user.week }}</a></li>
+              <li><a class="dropdown-item" data-action="edit_selected" data-id="tla" data-api-url='edit/time_limited_alias' data-api-attr='{"validity":"744"}' href="#">{{ lang.user.expire_in }} 1 {{ lang.user.month }}</a></li>
+              <li><a class="dropdown-item" data-action="edit_selected" data-id="tla" data-api-url='edit/time_limited_alias' data-api-attr='{"validity":"8760"}' href="#">{{ lang.user.expire_in }} 1 {{ lang.user.year }}</a></li>
+              <li><a class="dropdown-item" data-action="edit_selected" data-id="tla" data-api-url='edit/time_limited_alias' data-api-attr='{"validity":"87600"}' href="#">{{ lang.user.expire_in }} 10 {{ lang.user.years }}</a></li>
+              <li><hr class="dropdown-divider"></li>
+              <li><a class="dropdown-item" data-action="delete_selected" data-id="tla" data-api-url='delete/time_limited_alias' href="#">{{ lang.mailbox.remove }}</a></li>
+            </ul>
+          </div>
+          <div class="btn-group">
+            <a class="btn btn-sm d-block d-sm-inline btn-success dropdown-toggle" data-bs-toggle="dropdown" href="#"><i class="bi bi-plus-lg"></i> {{ lang.user.alias_create_random }}, 1 {{ lang.user.year }}</a>
+            <ul class="dropdown-menu">
+              {% for domain in user_domains %}
+                <li>
+                  <a class="dropdown-item" data-action="add_item" data-api-url='add/time_limited_alias' data-api-attr='{"domain":"{{ domain }}"}' href="#">
+                    @ {{ domain }}
+                  </a>
+                </li>
+              {% endfor %}
+            </ul>
+          </div>
+        </div>
       </div>
     </div>
   </div>
diff --git a/mailcow/src/mailcow-dockerized/data/web/templates/user/Spamfilter.twig b/mailcow/src/mailcow-dockerized/data/web/templates/user/Spamfilter.twig
index ccd7e7d..7a3baf3 100644
--- a/mailcow/src/mailcow-dockerized/data/web/templates/user/Spamfilter.twig
+++ b/mailcow/src/mailcow-dockerized/data/web/templates/user/Spamfilter.twig
@@ -1,77 +1,91 @@
-<div role="tabpanel" class="tab-pane" id="Spamfilter">
-  <h4>{{ lang.user.spamfilter_behavior }}</h4>
-  <div class="row">
-    <div class="col-sm-12">
-      <form class="form-horizontal" role="form" data-id="spam_score" method="post">
-        <div class="form-group">
-          <div class="col-lg-8 col-sm-12">
-            <div id="spam_score" data-provide="slider" data-acl="{{ acl.spam_score }}"></div>
-            <input id="spam_score_value" name="spam_score" type="hidden" value="{{ user_spam_score }}">
-            <ul class="list-group list-group-flush">
-              <li class="list-group-item"><span class="label label-ham spam-ham-score"></span> {{ lang.user.spamfilter_green }}</li>
-              <li class="list-group-item"><span class="label label-spam spam-spam-score"></span> {{ lang.user.spamfilter_yellow }}</li>
-              <li class="list-group-item"><span class="label label-reject spam-reject-score"></span> {{ lang.user.spamfilter_red }}</li>
-            </ul>
+<div role="tabpanel" class="tab-pane fade" id="Spamfilter" role="tabpanel" aria-labelledby="Spamfilter">
+  <div class="card mb-4">
+    <div class="card-header d-flex fs-5">
+      <button class="btn d-md-none flex-grow-1 text-start" data-bs-target="#collapse-tab-Spamfilter" data-bs-toggle="collapse" aria-controls="collapse-tab-Spamfilter">
+        {{ lang.user.spamfilter }}
+      </button>
+      <span class="d-none d-md-block">{{ lang.user.spamfilter }}
+    </div>
+    <div id="collapse-tab-Spamfilter" class="card-body collapse" data-bs-parent="#user-content">
+      <h4>{{ lang.user.spamfilter_behavior }}</h4>
+      <div class="row">
+        <div class="col-sm-12">
+          <form class="form-horizontal" role="form" data-id="spam_score" method="post">
+            <div class="row">
+              <div class="col-sm-12">
+                <div id="spam_score" data-provide="slider" data-acl="{{ acl.spam_score }}"></div>
+                <input id="spam_score_value" name="spam_score" type="hidden" value="{{ user_spam_score }}">
+                <ul class="list-group list-group-flush">
+                  <li class="list-group-item"><span class="label label-ham spam-ham-score"></span> {{ lang.user.spamfilter_green }}</li>
+                  <li class="list-group-item"><span class="label label-spam spam-spam-score"></span> {{ lang.user.spamfilter_yellow }}</li>
+                  <li class="list-group-item"><span class="label label-reject spam-reject-score"></span> {{ lang.user.spamfilter_red }}</li>
+                </ul>
+              </div>
+            </div>
+            <div class="btn-group mt-4" data-acl="{{ acl.spam_score }}">
+              <a type="button" class="btn btn-sm btn-xs-half d-block d-sm-inline btn-success" data-action="edit_selected"
+                data-item="{{ mailcow_cc_username }}"
+                data-id="spam_score"
+                data-api-url='edit/spam-score'
+                data-api-attr='{}'><i class="bi bi-save"></i> {{ lang.user.save_changes }}</a>
+              <a type="button" class="btn btn-sm btn-xs-half d-block d-sm-inline btn-secondary" data-action="edit_selected"
+                data-item="{{ mailcow_cc_username }}"
+                data-id="spam_score_reset"
+                data-api-url='edit/spam-score'
+                data-api-attr='{"spam_score":"default"}'>{{ lang.user.spam_score_reset }}</a>
+            </div>
+          </form>
+        </div>
+      </div>
+      <hr>
+      <div class="row">
+        <div class="col-lg-6 my-3">
+          <h4>{{ lang.user.spamfilter_wl }}</h4>
+          <p>{{ lang.user.spamfilter_wl_desc|raw }}</p>
+          <form class="form-inline mb-4" data-id="add_wl_policy_mailbox">
+            <div class="input-group" data-acl="{{ acl.spam_policy }}">
+              <input type="text" class="form-control" name="object_from" placeholder="*@example.org" required>
+              <span class="input-group-btn">
+                <button class="btn btn-secondary" data-action="add_item" data-id="add_wl_policy_mailbox" data-api-url='add/mailbox-policy' data-api-attr='{"username": {{ mailcow_cc_username|json_encode|raw }},"object_list":"wl"}' href="#"><i class="bi bi-plus-lg"></i> {{ lang.user.spamfilter_table_add }}</button>
+              </span>
+            </div>
+          </form>
+          <table id="wl_policy_mailbox_table" class="table table-striped dt-responsive w-100"></table>
+          <div class="mass-actions-user">
+            <div class="btn-group" data-acl="{{ acl.spam_policy }}">
+              <a class="btn btn-sm btn-xs-half d-block d-sm-inline btn-secondary" id="toggle_multi_select_all" data-id="policy_wl_mailbox" href="#"><i class="bi bi-check-all"></i> {{ lang.mailbox.toggle_all }}</a>
+              <a class="btn btn-sm btn-xs-half d-block d-sm-inline btn-secondary dropdown-toggle" data-bs-toggle="dropdown" href="#">{{ lang.mailbox.quick_actions }}</a>
+              <ul class="dropdown-menu">
+                <li><a class="dropdown-item" data-datatables-expand="wl_policy_mailbox_table" data-table="wl_policy_mailbox_table" href="#">{{ lang.datatables.expand_all }}</a></li>
+                <li><a class="dropdown-item" data-datatables-collapse="wl_policy_mailbox_table" data-table="wl_policy_mailbox_table" href="#">{{ lang.datatables.collapse_all }}</a></li>
+              </ul>
+              <a class="btn btn-sm btn-xs-half d-block d-sm-inline btn-danger" data-action="delete_selected" data-id="policy_wl_mailbox" data-api-url='delete/mailbox-policy' href="#">{{ lang.mailbox.remove }}</a>
+            </div>
           </div>
         </div>
-        <div class="btn-group" data-acl="{{ acl.spam_score }}">
-          <a type="button" class="btn btn-sm btn-xs-half visible-xs-block visible-sm-inline visible-md-inline visible-lg-inline btn-success" data-action="edit_selected"
-             data-item="{{ mailcow_cc_username }}"
-             data-id="spam_score"
-             data-api-url='edit/spam-score'
-             data-api-attr='{}'><i class="bi bi-save"></i> {{ lang.user.save_changes }}</a>
-          <a type="button" class="btn btn-sm btn-xs-half visible-xs-block visible-sm-inline visible-md-inline visible-lg-inline btn-default" data-action="edit_selected"
-             data-item="{{ mailcow_cc_username }}"
-             data-id="spam_score_reset"
-             data-api-url='edit/spam-score'
-             data-api-attr='{"spam_score":"default"}'>{{ lang.user.spam_score_reset }}</a>
-        </div>
-      </form>
-    </div>
-  </div>
-  <hr>
-  <div class="row">
-    <div class="col-sm-6">
-      <h4>{{ lang.user.spamfilter_wl }}</h4>
-      <p>{{ lang.user.spamfilter_wl_desc|raw }}</p>
-      <form class="form-inline space20" data-id="add_wl_policy_mailbox">
-        <div class="input-group" data-acl="{{ acl.spam_policy }}">
-          <input type="text" class="form-control" name="object_from" placeholder="*@example.org" required>
-          <span class="input-group-btn">
-            <button class="btn btn-default" data-action="add_item" data-id="add_wl_policy_mailbox" data-api-url='add/mailbox-policy' data-api-attr='{"username": {{ mailcow_cc_username|json_encode|raw }},"object_list":"wl"}' href="#"><i class="bi bi-plus-lg"></i> {{ lang.user.spamfilter_table_add }}</button>
-          </span>
-        </div>
-      </form>
-      <div class="table-responsive">
-        <table class="table table-striped table-condensed" id="wl_policy_mailbox_table"></table>
-      </div>
-      <div class="mass-actions-user">
-        <div class="btn-group" data-acl="{{ acl.spam_policy }}">
-          <a class="btn btn-sm btn-xs-half visible-xs-block visible-sm-inline visible-md-inline visible-lg-inline btn-default" id="toggle_multi_select_all" data-id="policy_wl_mailbox" href="#"><i class="bi bi-check-all"></i> {{ lang.mailbox.toggle_all }}</a>
-          <a class="btn btn-sm btn-xs-half visible-xs-block visible-sm-inline visible-md-inline visible-lg-inline btn-danger" data-action="delete_selected" data-id="policy_wl_mailbox" data-api-url='delete/mailbox-policy' href="#">{{ lang.mailbox.remove }}</a>
-          <div class="clearfix visible-xs-block"></div>
-        </div>
-      </div>
-    </div>
-    <div class="col-sm-6">
-      <h4>{{ lang.user.spamfilter_bl }}</h4>
-      <p>{{ lang.user.spamfilter_bl_desc|raw }}</p>
-      <form class="form-inline space20" data-id="add_bl_policy_mailbox">
-        <div class="input-group" data-acl="{{ acl.spam_policy }}">
-          <input type="text" class="form-control" name="object_from" placeholder="*@example.org" required>
-          <span class="input-group-btn">
-            <button class="btn btn-default" data-action="add_item" data-id="add_bl_policy_mailbox" data-api-url='add/mailbox-policy' data-api-attr='{"username": {{ mailcow_cc_username|json_encode|raw }},"object_list":"bl"}' href="#"><i class="bi bi-plus-lg"></i> {{ lang.user.spamfilter_table_add }}</button>
-          </span>
-        </div>
-      </form>
-      <div class="table-responsive">
-        <table class="table table-striped table-condensed" id="bl_policy_mailbox_table"></table>
-      </div>
-      <div class="mass-actions-user">
-        <div class="btn-group" data-acl="{{ acl.spam_policy }}">
-          <a class="btn btn-sm btn-xs-half visible-xs-block visible-sm-inline visible-md-inline visible-lg-inline btn-default" id="toggle_multi_select_all" data-id="policy_bl_mailbox" href="#"><i class="bi bi-check-all"></i> {{ lang.mailbox.toggle_all }}</a>
-          <a class="btn btn-sm btn-xs-half visible-xs-block visible-sm-inline visible-md-inline visible-lg-inline btn-danger" data-action="delete_selected" data-id="policy_bl_mailbox" data-api-url='delete/mailbox-policy' href="#">{{ lang.mailbox.remove }}</a>
-          <div class="clearfix visible-xs-block"></div>
+        <div class="col-lg-6 my-3">
+          <h4>{{ lang.user.spamfilter_bl }}</h4>
+          <p>{{ lang.user.spamfilter_bl_desc|raw }}</p>
+          <form class="form-inline mb-4" data-id="add_bl_policy_mailbox">
+            <div class="input-group" data-acl="{{ acl.spam_policy }}">
+              <input type="text" class="form-control" name="object_from" placeholder="*@example.org" required>
+              <span class="input-group-btn">
+                <button class="btn btn-secondary" data-action="add_item" data-id="add_bl_policy_mailbox" data-api-url='add/mailbox-policy' data-api-attr='{"username": {{ mailcow_cc_username|json_encode|raw }},"object_list":"bl"}' href="#"><i class="bi bi-plus-lg"></i> {{ lang.user.spamfilter_table_add }}</button>
+              </span>
+            </div>
+          </form>
+          <table id="bl_policy_mailbox_table" class="table table-striped dt-responsive w-100"></table>
+          <div class="mass-actions-user">
+            <div class="btn-group" data-acl="{{ acl.spam_policy }}">
+              <a class="btn btn-sm btn-xs-half d-block d-sm-inline btn-secondary" id="toggle_multi_select_all" data-id="policy_bl_mailbox" href="#"><i class="bi bi-check-all"></i> {{ lang.mailbox.toggle_all }}</a>
+              <a class="btn btn-sm btn-xs-half d-block d-sm-inline btn-secondary dropdown-toggle" data-bs-toggle="dropdown" href="#">{{ lang.mailbox.quick_actions }}</a>
+              <ul class="dropdown-menu">
+                <li><a class="dropdown-item" data-datatables-expand="bl_policy_mailbox_table" data-table="bl_policy_mailbox_table" href="#">{{ lang.datatables.expand_all }}</a></li>
+                <li><a class="dropdown-item" data-datatables-collapse="bl_policy_mailbox_table" data-table="bl_policy_mailbox_table" href="#">{{ lang.datatables.collapse_all }}</a></li>
+              </ul>
+              <a class="btn btn-sm btn-xs-half d-block d-sm-inline btn-danger" data-action="delete_selected" data-id="policy_bl_mailbox" data-api-url='delete/mailbox-policy' href="#">{{ lang.mailbox.remove }}</a>
+            </div>
+          </div>
         </div>
       </div>
     </div>
diff --git a/mailcow/src/mailcow-dockerized/data/web/templates/user/Syncjobs.twig b/mailcow/src/mailcow-dockerized/data/web/templates/user/Syncjobs.twig
index 1b6cda2..322e853 100644
--- a/mailcow/src/mailcow-dockerized/data/web/templates/user/Syncjobs.twig
+++ b/mailcow/src/mailcow-dockerized/data/web/templates/user/Syncjobs.twig
@@ -1,22 +1,52 @@
-<div role="tabpanel" class="tab-pane" id="Syncjobs">
-  <div class="table-responsive">
-    <table class="table table-striped" id="sync_job_table"></table>
-  </div>
-  <div class="mass-actions-user">
-    <div class="btn-group" data-acl="{{ acl.syncjobs }}">
-      <div class="btn-group">
-        <a class="btn btn-sm btn-xs-half visible-xs-block visible-sm-inline visible-md-inline visible-lg-inline btn-default" id="toggle_multi_select_all" data-id="syncjob" href="#"><i class="bi bi-check-all"></i> {{ lang.mailbox.toggle_all }}</a>
-        <a class="btn btn-sm btn-xs-half visible-xs-block visible-sm-inline visible-md-inline visible-lg-inline btn-default dropdown-toggle" data-toggle="dropdown" href="#">{{ lang.mailbox.quick_actions }} <span class="caret"></span></a>
-        <ul class="dropdown-menu">
-          <li><a data-action="edit_selected" data-id="syncjob" data-api-url='edit/syncjob' data-api-attr='{"active":"1"}' href="#">{{ lang.mailbox.activate }}</a></li>
-          <li><a data-action="edit_selected" data-id="syncjob" data-api-url='edit/syncjob' data-api-attr='{"active":"0"}' href="#">{{ lang.mailbox.deactivate }}</a></li>
-          <li role="separator" class="divider"></li>
-          <li><a data-action="delete_selected" data-id="syncjob" data-api-url='delete/syncjob' href="#">{{ lang.mailbox.remove }}</a></li>
-        </ul>
-        <div class="clearfix visible-xs"></div>
+<div role="tabpanel" class="tab-pane fade" id="Syncjobs" role="tabpanel" aria-labelledby="Syncjobs">
+  <div class="card mb-4">
+    <div class="card-header d-flex fs-5">
+      <button class="btn d-md-none flex-grow-1 text-start" data-bs-target="#collapse-tab-Syncjobs" data-bs-toggle="collapse" aria-controls="collapse-tab-Syncjobs">
+        {{ lang.user.sync_jobs }}
+      </button>
+      <span class="d-none d-md-block">{{ lang.user.sync_jobs }}
+    </div>
+    <div id="collapse-tab-Syncjobs" class="card-body collapse" data-bs-parent="#user-content">      
+      <div class="mass-actions-user mb-4">
+        <div class="btn-group" data-acl="{{ acl.syncjobs }}">
+          <div class="btn-group">
+            <a class="btn btn-sm btn-xs-half d-block d-sm-inline btn-secondary" id="toggle_multi_select_all" data-id="syncjob" href="#"><i class="bi bi-check-all"></i> {{ lang.mailbox.toggle_all }}</a>
+            <a class="btn btn-sm btn-xs-half d-block d-sm-inline btn-secondary dropdown-toggle" data-bs-toggle="dropdown" href="#">{{ lang.mailbox.quick_actions }}</a>
+            <ul class="dropdown-menu">
+              <li><a class="dropdown-item" data-action="edit_selected" data-id="syncjob" data-api-url='edit/syncjob' data-api-attr='{"active":"1"}' href="#">{{ lang.mailbox.activate }}</a></li>
+              <li><a class="dropdown-item" data-action="edit_selected" data-id="syncjob" data-api-url='edit/syncjob' data-api-attr='{"active":"0"}' href="#">{{ lang.mailbox.deactivate }}</a></li>
+              <li><hr class="dropdown-divider"></li>
+              <li><a class="dropdown-item" data-datatables-expand="sync_job_table" data-table="sync_job_table" href="#">{{ lang.datatables.expand_all }}</a></li>
+              <li><a class="dropdown-item" data-datatables-collapse="sync_job_table" data-table="sync_job_table" href="#">{{ lang.datatables.collapse_all }}</a></li>
+              <li><hr class="dropdown-divider"></li>
+              <li><a class="dropdown-item" data-action="delete_selected" data-id="syncjob" data-api-url='delete/syncjob' href="#">{{ lang.mailbox.remove }}</a></li>
+            </ul>
+          </div>
+          <div class="btn-group">
+            <a class="btn btn-sm d-block d-sm-inline btn-success" href="#" data-bs-toggle="modal" data-bs-target="#addSyncJobModal"><i class="bi bi-plus-lg"></i> {{ lang.user.create_syncjob }}</a>
+          </div>
+        </div>
       </div>
-      <div class="btn-group">
-        <a class="btn btn-sm visible-xs-block visible-sm-inline visible-md-inline visible-lg-inline btn-success" href="#" data-toggle="modal" data-target="#addSyncJobModal"><i class="bi bi-plus-lg"></i> {{ lang.user.create_syncjob }}</a>
+      <table id="sync_job_table" class="table table-striped dt-responsive w-100"></table>
+      <div class="mass-actions-user mt-4">
+        <div class="btn-group" data-acl="{{ acl.syncjobs }}">
+          <div class="btn-group">
+            <a class="btn btn-sm btn-xs-half d-block d-sm-inline btn-secondary" id="toggle_multi_select_all" data-id="syncjob" href="#"><i class="bi bi-check-all"></i> {{ lang.mailbox.toggle_all }}</a>
+            <a class="btn btn-sm btn-xs-half d-block d-sm-inline btn-secondary dropdown-toggle" data-bs-toggle="dropdown" href="#">{{ lang.mailbox.quick_actions }}</a>
+            <ul class="dropdown-menu">
+              <li><a class="dropdown-item" data-action="edit_selected" data-id="syncjob" data-api-url='edit/syncjob' data-api-attr='{"active":"1"}' href="#">{{ lang.mailbox.activate }}</a></li>
+              <li><a class="dropdown-item" data-action="edit_selected" data-id="syncjob" data-api-url='edit/syncjob' data-api-attr='{"active":"0"}' href="#">{{ lang.mailbox.deactivate }}</a></li>
+              <li><hr class="dropdown-divider"></li>
+              <li><a class="dropdown-item" data-datatables-expand="sync_job_table" data-table="sync_job_table" href="#">{{ lang.datatables.expand_all }}</a></li>
+              <li><a class="dropdown-item" data-datatables-collapse="sync_job_table" data-table="sync_job_table" href="#">{{ lang.datatables.collapse_all }}</a></li>
+              <li><hr class="dropdown-divider"></li>
+              <li><a class="dropdown-item" data-action="delete_selected" data-id="syncjob" data-api-url='delete/syncjob' href="#">{{ lang.mailbox.remove }}</a></li>
+            </ul>
+          </div>
+          <div class="btn-group">
+            <a class="btn btn-sm d-block d-sm-inline btn-success" href="#" data-bs-toggle="modal" data-bs-target="#addSyncJobModal"><i class="bi bi-plus-lg"></i> {{ lang.user.create_syncjob }}</a>
+          </div>
+        </div>
       </div>
     </div>
   </div>
diff --git a/mailcow/src/mailcow-dockerized/data/web/templates/user/tab-user-auth.twig b/mailcow/src/mailcow-dockerized/data/web/templates/user/tab-user-auth.twig
index c35eee3..646c791 100644
--- a/mailcow/src/mailcow-dockerized/data/web/templates/user/tab-user-auth.twig
+++ b/mailcow/src/mailcow-dockerized/data/web/templates/user/tab-user-auth.twig
@@ -1,17 +1,25 @@
-<div role="tabpanel" class="tab-pane active" id="tab-user-auth">
-  <div class="panel panel-default">
-    <div class="panel-heading">{{ lang.user.mailbox_general }}</div>
-    <div class="panel-body">
+<div role="tabpanel" class="tab-pane fade in active show" id="tab-user-auth" role="tabpanel" aria-labelledby="tab-user-auth">
+  <div class="card mb-4">
+    <div class="card-header d-flex fs-5">
+      <button class="btn d-md-none flex-grow-1 text-start" data-bs-target="#collapse-tab-user-auth" data-bs-toggle="collapse" aria-controls="collapse-tab-user-auth">
+        {{ lang.user.mailbox_general }}
+      </button>
+      <span class="d-none d-md-block">{{ lang.user.mailbox_general }}
+    </div>
+    <div id="collapse-tab-user-auth" class="card-body collapse" data-bs-parent="#user-content">
+      {% if mailboxdata.attributes.force_pw_update == '1' %}
+          <div class="alert alert-danger">{{ lang.user.force_pw_update|raw }}</div>
+      {% endif %}
       {% if not skip_sogo %}
       <div class="row">
         <div class="hidden-xs col-md-3 col-xs-5 text-right"></div>
         <div class="col-md-3 col-xs-12">
-          {% if dual_login and allow_admin_email_login == 'n' %}
-            <button disabled class="btn btn-default btn-block btn-xs-lg">
+          {% if dual_login and allow_admin_email_login == 'n' or mailboxdata.attributes.force_pw_update == '1' %}
+            <button disabled class="btn btn-secondary btn-block btn-xs-lg">
               <i class="bi bi-inbox-fill"></i> {{ lang.user.open_webmail_sso }}
             </button>
           {% else %}
-            <a target="_blank" href="/sogo-auth.php?login={{ mailcow_cc_username }}" role="button" class="btn btn-default btn-block btn-xs-lg">
+            <a target="_blank" href="/sogo-auth.php?login={{ mailcow_cc_username }}" role="button" class="btn btn-secondary btn-block btn-xs-lg">
               <i class="bi bi-inbox-fill"></i> {{ lang.user.open_webmail_sso }}
             </a>
           {% endif %}
@@ -19,43 +27,64 @@
       </div>
       <hr>
       <div class="row">
-        <div class="hidden-xs col-md-3 col-xs-5 text-right"></div>
-        <div class="col-md-9 col-xs-12">
-          <p class="help-block help-block-mt-0">{{ lang.user.direct_protocol_access|raw }}</p>
-          {% if mailboxdata.attributes.imap_access == 1 %}<div class="label label-success label-protocol-access">IMAP <i class="bi bi-check-lg"></i></div>{% else %}<div class="label label-danger label-protocol-access">IMAP <i class="bi bi-x-lg"></i></div>{% endif %}
-          {% if mailboxdata.attributes.smtp_access == 1 %}<div class="label label-success label-protocol-access">SMTP <i class="bi bi-check-lg"></i></div>{% else %}<div class="label label-danger label-protocol-access">SMTP <i class="bi bi-x-lg"></i></div>{% endif %}
-          {% if mailboxdata.attributes.sieve_access == 1 %}<div class="label label-success label-protocol-access">Sieve <i class="bi bi-check-lg"></i></div>{% else %}<div class="label label-danger label-protocol-access">Sieve <i class="bi bi-x-lg"></i></div>{% endif %}
-          {% if mailboxdata.attributes.pop3_access == 1 %}<div class="label label-success label-protocol-access">POP3 <i class="bi bi-check-lg"></i></div>{% else %}<div class="label label-danger label-protocol-access">POP3 <i class="bi bi-x-lg"></i></div>{% endif %}
-          {% if mailboxdata.attributes.sogo_access == 1 %}<div class="label label-success label-protocol-access">SOGo <i class="bi bi-check-lg"></i></div>{% else %}<div class="label label-danger label-protocol-access">SOGo <i class="bi bi-x-lg"></i></div>{% endif %}
+        <div class="d-none d-sm-flex col-md-3 col-5 text-end"></div>
+        <div class="col-md-9 col-12">
+          <p class="text-muted text-muted-mt-0">{{ lang.user.direct_protocol_access|raw }}</p>
+          {% if mailboxdata.attributes.imap_access == 1 %}<div class="badge fs-6 bg-success mb-2">IMAP <i class="bi bi-check-lg"></i></div>{% else %}<div class="badge fs-6 bg-danger">IMAP <i class="bi bi-x-lg"></i></div>{% endif %}
+          {% if mailboxdata.attributes.smtp_access == 1 %}<div class="badge fs-6 bg-success mb-2">SMTP <i class="bi bi-check-lg"></i></div>{% else %}<div class="badge fs-6 bg-danger">SMTP <i class="bi bi-x-lg"></i></div>{% endif %}
+          {% if mailboxdata.attributes.sieve_access == 1 %}<div class="badge fs-6 bg-success mb-2">Sieve <i class="bi bi-check-lg"></i></div>{% else %}<div class="badge fs-6 bg-danger">Sieve <i class="bi bi-x-lg"></i></div>{% endif %}
+          {% if mailboxdata.attributes.pop3_access == 1 %}<div class="badge fs-6 bg-success mb-2">POP3 <i class="bi bi-check-lg"></i></div>{% else %}<div class="badge fs-6 bg-danger">POP3 <i class="bi bi-x-lg"></i></div>{% endif %}
+          {% if mailboxdata.attributes.sogo_access == 1 %}<div class="badge fs-6 bg-success mb-2">SOGo <i class="bi bi-check-lg"></i></div>{% else %}<div class="badge fs-6 bg-danger">SOGo <i class="bi bi-x-lg"></i></div>{% endif %}
         </div>
       </div>
       <hr>
       {% endif %}
       <div class="row">
-        <div class="col-md-3 col-xs-12 text-right text-xs-left space20">{{ lang.user.in_use }}:</div>
-        <div class="col-md-5 col-xs-12">
+        <div class="col-md-3 col-12 text-sm-end text-start mb-4">{{ lang.user.in_use }}:</div>
+        <div class="col-md-5 col-12">
           <div class="progress">
-            <div class="progress-bar progress-bar-{{ mailboxdata.percent_class }}" role="progressbar" aria-valuenow="{{ mailboxdata.percent_in_use }}" aria-valuemin="0" aria-valuemax="100" style="min-width:2em;width: {{ mailboxdata.percent_in_use }}%;">
+            <div class="progress-bar bg-{{ mailboxdata.percent_class }}" role="progressbar" aria-valuenow="{{ mailboxdata.percent_in_use }}" aria-valuemin="0" aria-valuemax="100" style="min-width:2em;width: {{ mailboxdata.percent_in_use }}%;">
               {{ mailboxdata.percent_in_use }}%
             </div>
           </div>
           <p>{{ mailboxdata.quota_used|formatBytes(2) }} / {% if mailboxdata.quota == 0 %}∞{% else %}{{ mailboxdata.quota|formatBytes(2) }}{% endif %}<br>{{ mailboxdata.messages }} {{ lang.user.messages }}</p>
           <hr>
-          <p><a href="#pwChangeModal" data-toggle="modal"><i class="bi bi-pencil-fill"></i> {{ lang.user.change_password }}</a></p>
+          <p><a href="#pwChangeModal" data-bs-toggle="modal"><i class="bi bi-pencil-fill"></i> {{ lang.user.change_password }}</a></p>
+        </div>
+      </div>
+      <hr>
+      {# TFA #}
+      <div class="row">
+        <div class="col-sm-3 col-xs-5 text-right">{{ lang.tfa.tfa }}:</div>
+        <div class="col-sm-9 col-xs-7">
+          <p id="tfa_pretty">{{ tfa_data.pretty }}</p>
+          {% include 'tfa_keys.twig' %}
+          <br>
+        </div>
+      </div>
+      <div class="row">
+        <div class="col-sm-3 col-xs-5 text-right">{{ lang.tfa.set_tfa }}:</div>
+        <div class="col-sm-9 col-xs-7">
+          <select data-style="btn btn-sm dropdown-toggle bs-placeholder btn-secondary" data-width="fit" id="selectTFA" class="selectpicker" title="{{ lang.tfa.select }}">
+            <option value="yubi_otp">{{ lang.tfa.yubi_otp }}</option>
+            <option value="webauthn">{{ lang.tfa.webauthn }}</option>
+            <option value="totp">{{ lang.tfa.totp }}</option>
+            <option value="none">{{ lang.tfa.none }}</option>
+          </select>
         </div>
       </div>
       <hr>
       {# FIDO2 #}
       <div class="row">
-        <div class="col-sm-3 col-xs-12 text-right text-xs-left">
+        <div class="col-sm-3 col-12 text-sm-end text-start">
           <p><i class="bi bi-shield-fill-check"></i> {{ lang.fido2.fido2_auth }}</p>
         </div>
       </div>
       <div class="row">
-        <div class="col-sm-3 col-xs-12 text-right text-xs-left space20">
+        <div class="col-sm-3 col-12 text-sm-end text-start mb-4">
           {{ lang.fido2.known_ids }}:
         </div>
-        <div class="col-sm-9 col-xs-12">
+        <div class="col-sm-9 col-12">
           <div class="table-responsive">
             <table class="table table-striped table-hover table-condensed" id="fido2_keys">
               <tr>
@@ -69,71 +98,65 @@
         </div>
       </div>
       <div class="row">
-        <div class="col-sm-offset-3 col-sm-9">
+        <div class="offset-sm-3 col-sm-9">
           <div class="btn-group nowrap">
-            <button class="btn btn-sm btn-primary visible-xs-block visible-sm-inline visible-md-inline visible-lg-inline" id="register-fido2">{{ lang.fido2.set_fido2 }}</button>
-            <button type="button" class="btn btn-sm btn-xs-lg btn-primary dropdown-toggle" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false">
-              <span class="caret"></span>
-            </button>
+            <button class="btn btn-sm btn-primary d-block d-sm-inline" id="register-fido2">{{ lang.fido2.set_fido2 }}</button>
+            <button type="button" class="btn btn-sm btn-xs-lg btn-primary dropdown-toggle" data-bs-toggle="dropdown" aria-haspopup="true" aria-expanded="false"></button>
             <ul class="dropdown-menu">
-              <li><a href="#" id="register-fido2-touchid" style="line-height:1.4;"><i class="bi bi-apple"></i> {{ lang.fido2.set_fido2_touchid }}</a></li>
+              <li><a class="dropdown-item" href="#" id="register-fido2-touchid"><i class="bi bi-apple"></i> {{ lang.fido2.set_fido2_touchid }}</a></li>
             </ul>
           </div>
         </div>
       </div>
       <br>
       <div class="row" id="status-fido2">
-        <div class="col-sm-3 col-xs-5 text-right">{{ lang.fido2.register_status }}:</div>
-        <div class="col-sm-9 col-xs-7">
+        <div class="col-sm-3 col-5 text-end">{{ lang.fido2.register_status }}:</div>
+        <div class="col-sm-9 col-7">
           <div id="fido2-alerts">-</div>
         </div>
         <br>
       </div>
       <hr>
       <div class="row">
-        <div class="col-md-3 col-xs-12 text-right text-xs-left space20"><i class="bi bi-file-earmark-text"></i> {{ lang.user.apple_connection_profile }}:</div>
-        <div class="col-md-9 col-xs-12">
+        <div class="col-md-3 col-12 text-sm-end text-start mb-4"><i class="bi bi-file-earmark-text"></i> {{ lang.user.apple_connection_profile }}:</div>
+        <div class="col-md-9 col-12">
           <p><i class="bi bi-file-earmark-post"></i> <a href="/mobileconfig.php?only_email">{{ lang.user.email }}</a> <small>IMAP, SMTP</small></p>
-          <p class="help-block">{{ lang.user.apple_connection_profile_mailonly }}</p>
+          <p class="text-muted">{{ lang.user.apple_connection_profile_mailonly }}</p>
           {% if not skip_sogo %}
           <p><i class="bi bi-file-earmark-post"></i> <a href="/mobileconfig.php">{{ lang.user.email_and_dav }}</a> <small>IMAP, SMTP, Cal/CardDAV</small></p>
-          <p class="help-block">{{ lang.user.apple_connection_profile_complete }}</p>
+          <p class="text-muted">{{ lang.user.apple_connection_profile_complete }}</p>
           {% endif %}
         </div>
       </div>
       <div class="row">
-        <div class="col-md-3 col-xs-12 text-right text-xs-left space20"><i class="bi bi-file-earmark-text"></i> {{ lang.user.apple_connection_profile }}<br />{{ lang.user.with_app_password }}:</div>
-        <div class="col-md-9 col-xs-12">
+        <div class="col-md-3 col-12 text-sm-end text-start mb-4"><i class="bi bi-file-earmark-text"></i> {{ lang.user.apple_connection_profile }}<br />{{ lang.user.with_app_password }}:</div>
+        <div class="col-md-9 col-12">
           <p><i class="bi bi-file-earmark-post"></i> <a href="/mobileconfig.php?only_email&amp;app_password">{{ lang.user.email }}</a> <small>IMAP, SMTP</small></p>
-          <p class="help-block">{{ lang.user.apple_connection_profile_mailonly }} {{ lang.user.apple_connection_profile_with_app_password }}</p>
+          <p class="text-muted">{{ lang.user.apple_connection_profile_mailonly }} {{ lang.user.apple_connection_profile_with_app_password }}</p>
           {% if not skip_sogo %}
           <p><i class="bi bi-file-earmark-post"></i> <a href="/mobileconfig.php?app_password">{{ lang.user.email_and_dav }}</a> <small>IMAP, SMTP, Cal/CardDAV</small></p>
-          <p class="help-block">{{ lang.user.apple_connection_profile_complete }} {{ lang.user.apple_connection_profile_with_app_password }}</p>
+          <p class="text-muted">{{ lang.user.apple_connection_profile_complete }} {{ lang.user.apple_connection_profile_with_app_password }}</p>
           {% endif %}
         </div>
       </div>
       <hr>
       <div class="row">
-        <div class="col-sm-offset-3 col-sm-9">
-          {% if mailboxdata.attributes.force_pw_update == '1' %}
-          <div class="alert alert-danger">{{ lang.user.force_pw_update|raw }}</div>
-          {% endif %}
-          <p><a target="_blank" href="https://mailcow.github.io/mailcow-dockerized-docs/client/#{{ clientconfigstr }}">[{{ lang.user.client_configuration }}]</a></p>
-          <p><a href="#userFilterModal" data-toggle="modal">[{{ lang.user.show_sieve_filters }}]</a></p>
+        <div class="offset-sm-3 col-sm-9">
+          <p><a target="_blank" href="https://mailcow.github.io/mailcow-dockerized-docs/client/client/#{{ clientconfigstr }}">[{{ lang.user.client_configuration }}]</a></p>
+          <p><a href="#userFilterModal" data-bs-toggle="modal">[{{ lang.user.show_sieve_filters }}]</a></p>
           <hr>
-          <h4 class="recent-login-success pull-left">{{ lang.user.recent_successful_connections }}</h4>
-          <div class="dropdown pull-left pull-xs-right">
-            <button class="btn btn-default btn-xs btn-xs-lg dropdown-toggle" type="button" id="history_sasl_days" data-toggle="dropdown">{{ lang.user.login_history }} <span class="caret"></span></button>
+          <h4 class="recent-login-success">{{ lang.user.recent_successful_connections }}</h4>
+          <div class="dropdown mt-2">
+            <button class="btn btn-secondary btn-xs btn-xs-lg dropdown-toggle" type="button" id="history_sasl_days" data-bs-toggle="dropdown">{{ lang.user.login_history }}</button>
             <ul class="dropdown-menu">
-              <li class="login-history" data-days="1"><a href="#">1 {{ lang.user.day }}</a></li>
-              <li class="login-history active" data-days="7"><a href="#">1 {{ lang.user.week }}</a></li>
-              <li class="login-history" data-days="14"><a href="#">2 {{ lang.user.weeks }}</a></li>
-              <li class="login-history" data-days="31"><a href="#">1 {{ lang.user.month }}</a></li>
+              <li class="login-history" data-days="1"><a class="dropdown-item" href="#">1 {{ lang.user.day }}</a></li>
+              <li class="login-history" data-days="7"><a class="dropdown-item active" href="#">1 {{ lang.user.week }}</a></li>
+              <li class="login-history" data-days="14"><a class="dropdown-item" href="#">2 {{ lang.user.weeks }}</a></li>
+              <li class="login-history" data-days="31"><a class="dropdown-item" href="#">1 {{ lang.user.month }}</a></li>
             </ul>
           </div>
-          <div class="clearfix"></div>
-          <div class="last-login"></div>
-          <span class="clear-last-logins">
+          <div class="last-login mt-4"></div>
+          <span class="clear-last-logins mt-2">
             {{ lang.user.clear_recent_successful_connections }}
           </span>
         </div>
diff --git a/mailcow/src/mailcow-dockerized/data/web/templates/user/tab-user-details.twig b/mailcow/src/mailcow-dockerized/data/web/templates/user/tab-user-details.twig
index c024af1..573cd49 100644
--- a/mailcow/src/mailcow-dockerized/data/web/templates/user/tab-user-details.twig
+++ b/mailcow/src/mailcow-dockerized/data/web/templates/user/tab-user-details.twig
@@ -1,12 +1,17 @@
-<div role="tabpanel" class="tab-pane" id="tab-user-details">
-  <div class="panel panel-default">
-    <div class="panel-heading">{{ lang.user.mailbox_details }}</div>
-    <div class="panel-body">
+<div role="tabpanel" class="tab-pane fade" id="tab-user-details" role="tabpanel" aria-labelledby="tab-user-details">
+  <div class="card mb-4">
+    <div class="card-header d-flex fs-5">
+      <button class="btn d-md-none flex-grow-1 text-start" data-bs-target="#collapse-tab-user-details" data-bs-toggle="collapse" aria-controls="collapse-tab-user-details">
+        {{ lang.user.mailbox_details }}
+      </button>
+      <span class="d-none d-md-block">{{ lang.user.mailbox_details }}
+    </div>
+    <div id="collapse-tab-user-details" class="card-body collapse" data-bs-parent="#user-content">
       <div class="row">
-        <div class="col-sm-4 col-md-3 col-xs-12 text-right text-xs-left"><i class="bi bi-pin-angle"></i> {{ lang.user.direct_aliases }}:
+        <div class="col-sm-4 col-md-3 col-12 text-sm-end text-start"><i class="bi bi-pin-angle"></i> {{ lang.user.direct_aliases }}:
           <p class="small">{{ lang.user.direct_aliases_desc }}</p>
         </div>
-        <div class="col-sm-8 col-md-9 col-xs-12">
+        <div class="col-sm-8 col-md-9 col-12">
           {% for direct_alias, direct_alias_meta in user_get_alias_details.direct_aliases %}
             {% if direct_alias_meta.public_comment %}
               {{ direct_alias }} &mdash; <i class="bi bi-chat-left"></i> {{ direct_alias_meta.public_comment }}<br>
@@ -20,10 +25,10 @@
       </div>
       <br>
       <div class="row">
-        <div class="col-sm-4 col-md-3 col-xs-12 text-right text-xs-left"><i class="bi bi-share"></i> {{ lang.user.shared_aliases }}:
+        <div class="col-sm-4 col-md-3 col-12 text-sm-end text-start"><i class="bi bi-share"></i> {{ lang.user.shared_aliases }}:
           <p class="small">{{ lang.user.shared_aliases_desc }}</p>
         </div>
-        <div class="col-sm-8 col-md-9 col-xs-12">
+        <div class="col-sm-8 col-md-9 col-12">
           {% for shared_alias, shared_alias_meta in user_get_alias_details.shared_aliases %}
             {% if shared_alias_meta.public_comment %}
               {{ shared_alias }} &mdash; <i class="bi bi-chat-left"></i> {{ shared_alias_meta.public_comment }}<br>
@@ -37,8 +42,8 @@
       </div>
       <hr>
       <div class="row">
-        <div class="col-sm-4 col-md-3 col-xs-12 text-right text-xs-left space20">{{ lang.user.aliases_also_send_as }}:</div>
-        <div class="col-sm-8 col-md-9 col-xs-12">
+        <div class="col-sm-4 col-md-3 col-12 text-sm-end text-start mb-4">{{ lang.user.aliases_also_send_as }}:</div>
+        <div class="col-sm-8 col-md-9 col-12">
           <p>
             {% if user_get_alias_details.aliases_also_send_as == '*' %}
               {{ lang.user.sender_acl_disabled }}
@@ -51,14 +56,14 @@
         </div>
       </div>
       <div class="row">
-        <div class="col-sm-4 col-md-3 col-xs-12 text-right text-xs-left space20">{{ lang.user.aliases_send_as_all }}:</div>
-        <div class="col-sm-8 col-md-9 col-xs-12">
+        <div class="col-sm-4 col-md-3 col-12 text-sm-end text-start mb-4">{{ lang.user.aliases_send_as_all }}:</div>
+        <div class="col-sm-8 col-md-9 col-12">
           <p>{% if not user_get_alias_details.aliases_send_as_all %}<i class="bi bi-x-lg"></i>{% endif %}</p>
         </div>
       </div>
       <div class="row">
-        <div class="col-sm-4 col-md-3 col-xs-12 text-right text-xs-left space20">{{ lang.user.is_catch_all }}:</div>
-        <div class="col-sm-8 col-md-9 col-xs-12">
+        <div class="col-sm-4 col-md-3 col-12 text-sm-end text-start mb-4">{{ lang.user.is_catch_all }}:</div>
+        <div class="col-sm-8 col-md-9 col-12">
           <p>{% if not user_get_alias_details.is_catch_all %}<i class="bi bi-x-lg"></i>{% endif %}</p>
         </div>
       </div>
diff --git a/mailcow/src/mailcow-dockerized/data/web/templates/user/tab-user-settings.twig b/mailcow/src/mailcow-dockerized/data/web/templates/user/tab-user-settings.twig
index f59ba39..a1426fa 100644
--- a/mailcow/src/mailcow-dockerized/data/web/templates/user/tab-user-settings.twig
+++ b/mailcow/src/mailcow-dockerized/data/web/templates/user/tab-user-settings.twig
@@ -1,133 +1,134 @@
-<div role="tabpanel" class="tab-pane" id="tab-user-settings">
-  <div class="panel panel-default">
-    <div class="panel-heading">{{ lang.user.mailbox_settings }}</div>
-    <div class="panel-body">
+<div role="tabpanel" class="tab-pane fade" id="tab-user-settings" role="tabpanel" aria-labelledby="tab-user-settings">
+  <div class="card mb-4">
+    <div class="card-header d-flex fs-5">
+      <button class="btn d-md-none flex-grow-1 text-start" data-bs-target="#collapse-tab-user-settings" data-bs-toggle="collapse" aria-controls="collapse-tab-user-settings">
+        {{ lang.user.mailbox_settings }}
+      </button>
+      <span class="d-none d-md-block">{{ lang.user.mailbox_settings }}
+    </div>
+    <div id="collapse-tab-user-settings" class="card-body collapse" data-bs-parent="#user-content">
       {# Show tagging options #}
       <div class="row">
-        <div class="col-sm-3 col-xs-12 text-right text-xs-left text-xs-bold space20">{{ lang.user.tag_handling }}:</div>
-        <div class="col-sm-9 col-xs-12">
+        <div class="col-sm-3 col-12 text-sm-end text-start text-xs-bold mb-4">{{ lang.user.tag_handling }}:</div>
+        <div class="col-sm-9 col-12">
           <div class="btn-group" data-acl="{{ acl.delimiter_action }}">
-            <button type="button" class="btn btn-sm btn-xs-third visible-xs-block visible-sm-inline visible-md-inline visible-lg-inline btn-default{% if get_tagging_options == 'subfolder' %} active{% endif %}"
+            <button type="button" class="btn btn-sm btn-xs-third d-block d-sm-inline btn-secondary{% if get_tagging_options == 'subfolder' %} active{% endif %}"
             data-action="edit_selected"
             data-item="{{ mailcow_cc_username }}"
             data-id="delimiter_action"
             data-api-url='edit/delimiter_action'
             data-api-attr='{"tagged_mail_handler":"subfolder"}'>{{ lang.user.tag_in_subfolder }}</button>
-            <button type="button" class="btn btn-sm btn-xs-third visible-xs-block visible-sm-inline visible-md-inline visible-lg-inline btn-default{% if get_tagging_options == 'subject' %} active{% endif %}"
+            <button type="button" class="btn btn-sm btn-xs-third d-block d-sm-inline btn-secondary{% if get_tagging_options == 'subject' %} active{% endif %}"
             data-action="edit_selected"
             data-item="{{ mailcow_cc_username }}"
             data-id="delimiter_action"
             data-api-url='edit/delimiter_action'
             data-api-attr='{"tagged_mail_handler":"subject"}'>{{ lang.user.tag_in_subject }}</button>
-            <button type="button" class="btn btn-sm btn-xs-third visible-xs-block visible-sm-inline visible-md-inline visible-lg-inline btn-default{% if get_tagging_options == 'none' %} active{% endif %}"
+            <button type="button" class="btn btn-sm btn-xs-third d-block d-sm-inline btn-secondary{% if get_tagging_options == 'none' %} active{% endif %}"
             data-action="edit_selected"
             data-item="{{ mailcow_cc_username }}"
             data-id="delimiter_action"
             data-api-url='edit/delimiter_action'
             data-api-attr='{"tagged_mail_handler":"none"}'>{{ lang.user.tag_in_none }}</button>
-            <div class="clearfix visible-xs"></div>
           </div>
-          <p class="help-block">{{ lang.user.tag_help_explain|raw }}</p>
-          <p class="help-block">{{ lang.user.tag_help_example|raw }}</p>
+          <p class="text-muted">{{ lang.user.tag_help_explain|raw }}</p>
+          <p class="text-muted">{{ lang.user.tag_help_example|raw }}</p>
         </div>
       </div>
       {# Show TLS policy options #}
       <div class="row">
-        <div class="col-sm-3 col-xs-12 text-right text-xs-left text-xs-bold space20">{{ lang.user.tls_policy }}:</div>
-        <div class="col-sm-9 col-xs-12">
+        <div class="col-sm-3 col-12 text-sm-end text-start text-xs-bold mb-4">{{ lang.user.tls_policy }}:</div>
+        <div class="col-sm-9 col-12">
           <div class="btn-group" data-acl="{{ acl.tls_policy }}">
-            <button type="button" class="btn btn-sm btn-xs-half visible-xs-block visible-sm-inline visible-md-inline visible-lg-inline btn-default{% if get_tls_policy.tls_enforce_in == '1' %} active"{% endif %}"
+            <button type="button" class="btn btn-sm btn-xs-half d-block d-sm-inline btn-secondary{% if get_tls_policy.tls_enforce_in == '1' %} active"{% endif %}"
             data-action="edit_selected"
             data-item="{{ mailcow_cc_username }}"
             data-id="tls_policy"
             data-api-url='edit/tls_policy'
             data-api-attr='{"tls_enforce_in": {% if get_tls_policy.tls_enforce_in == '1' %}0{% else %}1{% endif %} }'>{{ lang.user.tls_enforce_in }}</button>
-            <button type="button" class="btn btn-sm btn-xs-half visible-xs-block visible-sm-inline visible-md-inline visible-lg-inline btn-default{% if get_tls_policy.tls_enforce_out == '1' %} active"{% endif %}"
+            <button type="button" class="btn btn-sm btn-xs-half d-block d-sm-inline btn-secondary{% if get_tls_policy.tls_enforce_out == '1' %} active"{% endif %}"
             data-action="edit_selected"
             data-item="{{ mailcow_cc_username }}"
             data-id="tls_policy"
             data-api-url='edit/tls_policy'
             data-api-attr='{"tls_enforce_out": {% if get_tls_policy.tls_enforce_out == '1' %}0{% else %}1{% endif %} }'>{{ lang.user.tls_enforce_out }}</button>
-            <div class="clearfix visible-xs"></div>
           </div>
-          <p class="help-block">{{ lang.user.tls_policy_warning|raw }}</p>
+          <p class="text-muted">{{ lang.user.tls_policy_warning|raw }}</p>
         </div>
       </div>
       {# Show quarantine_notification options #}
       <div class="row">
-        <div class="col-sm-3 col-xs-12 text-right text-xs-left text-xs-bold space20">{{ lang.user.quarantine_notification }}:</div>
-        <div class="col-sm-9 col-xs-12">
+        <div class="col-sm-3 col-12 text-sm-end text-start text-xs-bold mb-4">{{ lang.user.quarantine_notification }}:</div>
+        <div class="col-sm-9 col-12">
           <div class="btn-group" data-acl="{{ acl.quarantine_notification }}">
-            <button type="button" class="btn btn-sm btn-xs-quart visible-xs-block visible-sm-inline visible-md-inline visible-lg-inline btn-default{% if quarantine_notification == 'never' %} active{% endif %}"
+            <button type="button" class="btn btn-sm btn-xs-quart d-block d-sm-inline btn-secondary{% if quarantine_notification == 'never' %} active{% endif %}"
             data-action="edit_selected"
             data-item="{{ mailcow_cc_username }}"
             data-id="quarantine_notification"
             data-api-url='edit/quarantine_notification'
             data-api-attr='{"quarantine_notification":"never"}'>{{ lang.user.never }}</button>
-            <button type="button" class="btn btn-sm btn-xs-quart visible-xs-block visible-sm-inline visible-md-inline visible-lg-inline btn-default{% if quarantine_notification == 'hourly' %} active{% endif %}"
+            <button type="button" class="btn btn-sm btn-xs-quart d-block d-sm-inline btn-secondary{% if quarantine_notification == 'hourly' %} active{% endif %}"
             data-action="edit_selected"
             data-item="{{ mailcow_cc_username }}"
             data-id="quarantine_notification"
             data-api-url='edit/quarantine_notification'
             data-api-attr='{"quarantine_notification":"hourly"}'>{{ lang.user.hourly }}</button>
-            <button type="button" class="btn btn-sm btn-xs-quart visible-xs-block visible-sm-inline visible-md-inline visible-lg-inline btn-default{% if quarantine_notification == 'daily' %} active{% endif %}"
+            <button type="button" class="btn btn-sm btn-xs-quart d-block d-sm-inline btn-secondary{% if quarantine_notification == 'daily' %} active{% endif %}"
             data-action="edit_selected"
             data-item="{{ mailcow_cc_username }}"
             data-id="quarantine_notification"
             data-api-url='edit/quarantine_notification'
             data-api-attr='{"quarantine_notification":"daily"}'>{{ lang.user.daily }}</button>
-            <button type="button" class="btn btn-sm btn-xs-quart visible-xs-block visible-sm-inline visible-md-inline visible-lg-inline btn-default{% if quarantine_notification == 'weekly' %} active{% endif %}"
+            <button type="button" class="btn btn-sm btn-xs-quart d-block d-sm-inline btn-secondary{% if quarantine_notification == 'weekly' %} active{% endif %}"
             data-action="edit_selected"
             data-item="{{ mailcow_cc_username }}"
             data-id="quarantine_notification"
             data-api-url='edit/quarantine_notification'
             data-api-attr='{"quarantine_notification":"weekly"}'>{{ lang.user.weekly }}</button>
-            <div class="clearfix visible-xs"></div>
           </div>
-          <p class="help-block">{{ lang.user.quarantine_notification_info }}</p>
+          <p class="text-muted">{{ lang.user.quarantine_notification_info }}</p>
         </div>
       </div>
       <div class="row">
-        <div class="col-sm-3 col-xs-12 text-right text-xs-left text-xs-bold space20">{{ lang.user.quarantine_category }}:</div>
-        <div class="col-sm-9 col-xs-12">
+        <div class="col-sm-3 col-12 text-sm-end text-start text-xs-bold mb-4">{{ lang.user.quarantine_category }}:</div>
+        <div class="col-sm-9 col-12">
           <div class="btn-group" data-acl="{{ acl.quarantine_category }}">
-            <button type="button" class="btn btn-sm btn-xs-third visible-xs-block visible-sm-inline visible-md-inline visible-lg-inline btn-default{% if quarantine_category == 'reject' %} active{% endif %}"
+            <button type="button" class="btn btn-sm btn-xs-third d-block d-sm-inline btn-secondary{% if quarantine_category == 'reject' %} active{% endif %}"
             data-action="edit_selected"
             data-item="{{ mailcow_cc_username }}"
             data-id="quarantine_category"
             data-api-url='edit/quarantine_category'
             data-api-attr='{"quarantine_category":"reject"}'>{{ lang.user.q_reject }}</button>
-            <button type="button" class="btn btn-sm btn-xs-third visible-xs-block visible-sm-inline visible-md-inline visible-lg-inline btn-default{% if quarantine_category == 'add_header' %} active{% endif %}"
+            <button type="button" class="btn btn-sm btn-xs-third d-block d-sm-inline btn-secondary{% if quarantine_category == 'add_header' %} active{% endif %}"
             data-action="edit_selected"
             data-item="{{ mailcow_cc_username }}"
             data-id="quarantine_category"
             data-api-url='edit/quarantine_category'
             data-api-attr='{"quarantine_category":"add_header"}'>{{ lang.user.q_add_header }}</button>
-            <button type="button" class="btn btn-sm btn-xs-third visible-xs-block visible-sm-inline visible-md-inline visible-lg-inline btn-default{% if quarantine_category == 'all' %} active{% endif %}"
+            <button type="button" class="btn btn-sm btn-xs-third d-block d-sm-inline btn-secondary{% if quarantine_category == 'all' %} active{% endif %}"
             data-action="edit_selected"
             data-item="{{ mailcow_cc_username }}"
             data-id="quarantine_category"
             data-api-url='edit/quarantine_category'
             data-api-attr='{"quarantine_category":"all"}'>{{ lang.user.q_all }}</button>
-            <div class="clearfix visible-xs"></div>
           </div>
-          <p class="help-block">{{ lang.user.quarantine_category_info }}</p>
+          <p class="text-muted">{{ lang.user.quarantine_category_info }}</p>
         </div>
       </div>
       {% if not skip_sogo %}
       <hr>
       <div class="row">
-        <div class="col-sm-3 col-xs-12 text-right text-xs-left text-xs-bold space20">{{ lang.user.eas_reset }}:</div>
-        <div class="col-sm-9 col-xs-12">
-          <button class="btn btn-sm visible-xs-block visible-sm-inline visible-md-inline visible-lg-inline btn-default" data-acl="{{ acl.eas_reset }}" data-action="delete_selected" data-text="{{ lang.user.eas_reset }}?" data-item="{{ mailcow_cc_username }}" data-id="eas_cache" data-api-url='delete/eas_cache' href="#">{{ lang.user.eas_reset_now }}</button>
-          <p class="help-block">{{ lang.user.eas_reset_help|raw }}</p>
+        <div class="col-sm-3 col-12 text-sm-end text-start text-xs-bold mb-4">{{ lang.user.eas_reset }}:</div>
+        <div class="col-sm-9 col-12">
+          <button class="btn btn-sm d-block d-sm-inline btn-secondary" data-acl="{{ acl.eas_reset }}" data-action="delete_selected" data-text="{{ lang.user.eas_reset }}?" data-item="{{ mailcow_cc_username }}" data-id="eas_cache" data-api-url='delete/eas_cache' href="#">{{ lang.user.eas_reset_now }}</button>
+          <p class="text-muted">{{ lang.user.eas_reset_help|raw }}</p>
         </div>
       </div>
       <div class="row">
-        <div class="col-sm-3 col-xs-12 text-right text-xs-left text-xs-bold space20">{{ lang.user.sogo_profile_reset }}:</div>
-        <div class="col-sm-9 col-xs-12">
-          <button class="btn btn-sm visible-xs-block visible-sm-inline visible-md-inline visible-lg-inline btn-default" data-acl="{{ acl.sogo_profile_reset }}" data-action="delete_selected" data-text="{{ lang.user.sogo_profile_reset }}?" data-item="{{ mailcow_cc_username }}" data-id="sogo_profile" data-api-url='delete/sogo_profile' href="#">{{ lang.user.sogo_profile_reset_now }}</button>
-          <p class="help-block">{{ lang.user.sogo_profile_reset_help|raw }}</p>
+        <div class="col-sm-3 col-12 text-sm-end text-start text-xs-bold mb-4">{{ lang.user.sogo_profile_reset }}:</div>
+        <div class="col-sm-9 col-12">
+          <button class="btn btn-sm d-block d-sm-inline btn-secondary" data-acl="{{ acl.sogo_profile_reset }}" data-action="delete_selected" data-text="{{ lang.user.sogo_profile_reset }}?" data-item="{{ mailcow_cc_username }}" data-id="sogo_profile" data-api-url='delete/sogo_profile' href="#">{{ lang.user.sogo_profile_reset_now }}</button>
+          <p class="text-muted">{{ lang.user.sogo_profile_reset_help|raw }}</p>
         </div>
       </div>
       {% endif %}