diff --git a/powerdnsadmin/templates/admin_server_configuration.html b/powerdnsadmin/templates/admin_server_configuration.html
index a56bd12..e45bf71 100644
--- a/powerdnsadmin/templates/admin_server_configuration.html
+++ b/powerdnsadmin/templates/admin_server_configuration.html
@@ -27,7 +27,7 @@
         <div class="container-fluid">
             <div class="row">
                 <div class="col-12">
-                    <div class="card shadow">
+                    <div class="card card-outline card-primary shadow">
                         <div class="card-header">
                             <h3 class="card-title">Server Configuration</h3>
                         </div>
diff --git a/powerdnsadmin/templates/admin_server_statistics.html b/powerdnsadmin/templates/admin_server_statistics.html
index 16ff7d0..78fe746 100644
--- a/powerdnsadmin/templates/admin_server_statistics.html
+++ b/powerdnsadmin/templates/admin_server_statistics.html
@@ -27,7 +27,7 @@
         <div class="container-fluid">
             <div class="row">
                 <div class="col-12">
-                    <div class="card shadow">
+                    <div class="card card-outline card-primary shadow">
                         <div class="card-header">
                             <h3 class="card-title">Server Statistics</h3>
                         </div>
diff --git a/powerdnsadmin/templates/base.html b/powerdnsadmin/templates/base.html
index d23d6b3..abd1a15 100644
--- a/powerdnsadmin/templates/base.html
+++ b/powerdnsadmin/templates/base.html
@@ -26,9 +26,9 @@
         /* Global Styles */
         table.records thead th, table.records tbody td { text-align: center; vertical-align: middle; }
         table.records thead th:last-of-type { width: 50px; }
-        div.table-responsive > div.dataTables_wrapper > div.row:first-of-type { margin: 0 0.5em 0 0.5em; }
-        div.table-responsive > div.dataTables_wrapper > div.row:last-of-type { margin: 0.4em 0.5em 0.4em 0.5em; }
-        div.table-responsive > div.dataTables_wrapper table.dataTable { margin: 0 !important; }
+        div.records > div.dataTables_wrapper > div.row:first-of-type { margin: 0 0.5em 0 0.5em; }
+        div.records > div.dataTables_wrapper > div.row:last-of-type { margin: 0.4em 0.5em 0.4em 0.5em; }
+        div.records > div.dataTables_wrapper table.dataTable { margin: 0 !important; }
         </style>
         {% block head_styles %}{% endblock %}
     {% endblock %}
diff --git a/powerdnsadmin/templates/dashboard.html b/powerdnsadmin/templates/dashboard.html
index 993d196..3ed9ee5 100755
--- a/powerdnsadmin/templates/dashboard.html
+++ b/powerdnsadmin/templates/dashboard.html
@@ -29,7 +29,7 @@
 
             <div class="row">
                 <div class="col-lg-12">
-                    <div class="card card-outline card-secondary">
+                    <div class="card card-outline card-secondary shadow">
                         <div class="card-header">
                             <h3 class="card-title">Statistics</h3>
                         </div>
@@ -76,7 +76,7 @@
                                         </a>
                                     </div>
                                     <div class="col-6 col-sm-3">
-                                        <a href="{{ url_for('admin.pdns_stats') }}">
+                                        <a href="{{ url_for('admin.server_statistics') }}">
                                             <div class="small-box bg-green">
                                                 <div class="inner">
                                                     <h3><span
@@ -105,12 +105,12 @@
             {% if current_user.role.name in ['Administrator', 'Operator'] or SETTING.get('allow_user_view_history') %}
                 <div class="row">
                     <div class="col-12">
-                        <div class="card card-outline card-secondary">
+                        <div class="card card-outline card-secondary shadow">
                             <div class="card-header">
                                 <h3 class="card-title">Recent History</h3>
                             </div>
                             <!-- /.card-header -->
-                            <div class="card-body table-responsive p-0">
+                            <div class="card-body table-responsive records p-0">
                                 <table class="table table-striped table-hover table-sm records">
                                     <thead>
                                     <tr>
@@ -161,7 +161,7 @@
 
             <div class="row">
                 <div class="col-12">
-                    <div class="card card-outline card-primary">
+                    <div class="card card-outline card-primary shadow">
                         <div class="card-header">
                             <h3 class="card-title">
                                 Zones
@@ -199,7 +199,7 @@
                             <div class="tab-content">
                                 {% for boxId in custom_boxes.order %}
                                     <div class="tab-pane show" id='tab_{{ boxId }}'>
-                                        <div class="card-body table-responsive p-0 pt-2">
+                                        <div class="card-body table-responsive records p-0 pt-2">
                                             <table id='tbl_domain_list_{{ boxId }}'
                                                    class="table table-striped table-hover table-sm records">
                                                 <thead>
diff --git a/powerdnsadmin/templates/domain_add.html b/powerdnsadmin/templates/domain_add.html
index 6d2be08..cb76be1 100644
--- a/powerdnsadmin/templates/domain_add.html
+++ b/powerdnsadmin/templates/domain_add.html
@@ -29,7 +29,7 @@
                 <div class="col-12 col-sm-6 col-lg-4">
                     <form role="form" method="post" action="{{ url_for('domain.add') }}">
                         <input type="hidden" name="_csrf_token" value="{{ csrf_token() }}">
-                        <div class="card">
+                        <div class="card card-outline card-primary shadow">
                             <div class="card-header">
                                 <h3 class="card-title">Zone Editor</h3>
                             </div>
@@ -143,7 +143,7 @@
                 </div>
                 <!-- /.col -->
                 <div class="col-12 col-sm-6 col-lg-8">
-                    <div class="card">
+                    <div class="card card-outline card-secondary shadow">
                         <div class="card-header">
                             <h3 class="card-title">Zone Editor Help</h3>
                         </div>
diff --git a/powerdnsadmin/templates/domain_remove.html b/powerdnsadmin/templates/domain_remove.html
index 7435168..75c3e26 100644
--- a/powerdnsadmin/templates/domain_remove.html
+++ b/powerdnsadmin/templates/domain_remove.html
@@ -27,7 +27,7 @@
         <div class="container-fluid">
             <div class="row">
                 <div class="col-12 col-sm-6 col-lg-4">
-                    <div class="card">
+                    <div class="card card-outline card-primary shadow">
                         <div class="card-header">
                             <h3 class="card-title">Zone Selector</h3>
                         </div>
@@ -58,7 +58,7 @@
                     </div>
                 </div>
                 <div class="col-12 col-sm-6 col-lg-8">
-                    <div class="card">
+                    <div class="card card-outline card-secondary shadow">
                         <div class="card-header">
                             <h3 class="card-title">Zone Selector Help</h3>
                         </div>
diff --git a/powerdnsadmin/templates/domain_setting.html b/powerdnsadmin/templates/domain_setting.html
index 50bda95..0a17204 100644
--- a/powerdnsadmin/templates/domain_setting.html
+++ b/powerdnsadmin/templates/domain_setting.html
@@ -48,7 +48,7 @@
                     <form method="post"
                           action="{{ url_for('domain.change_account', domain_name=domain.name) }}">
                         <input type="hidden" name="_csrf_token" value="{{ csrf_token() }}">
-                        <div class="card">
+                        <div class="card card-outline card-secondary shadow">
                             <div class="card-header">
                                 <h3 class="card-title">Change Zone Account</h3>
                             </div>
@@ -82,7 +82,7 @@
                 <!-- /.col -->
 
                 <div class="col-12 col-sm-4">
-                    <div class="card">
+                    <div class="card card-outline card-secondary shadow">
                         <div class="card-header">
                             <h3 class="card-title">Auto PTR creation</h3>
                         </div>
@@ -108,7 +108,7 @@
                 <!-- /.col -->
 
                 <div class="col-12 col-sm-4">
-                    <div class="card">
+                    <div class="card card-outline card-secondary shadow">
                         <div class="card-header">
                             <h3 class="card-title">DynDNS 2 Settings</h3>
                         </div>
@@ -136,7 +136,7 @@
                 <div class="col-12 col-sm-4">
                     <form method="post" action="{{ url_for('domain.setting', domain_name=domain.name) }}">
                         <input type="hidden" name="_csrf_token" value="{{ csrf_token() }}">
-                        <div class="card">
+                        <div class="card card-outline card-secondary shadow">
                             <div class="card-header">
                                 <h3 class="card-title">Zone Access Control</h3>
                             </div>
@@ -188,7 +188,7 @@
 
             <div class="row">
                 <div class="col-12">
-                    <div class="card">
+                    <div class="card card-outline card-secondary shadow">
                         <div class="card-header">
                             <h3 class="card-title">Change Zone Type</h3>
                         </div>
@@ -240,7 +240,7 @@
 
             <div class="row">
                 <div class="col-12">
-                    <div class="card">
+                    <div class="card card-outline card-secondary shadow">
                         <div class="card-header">
                             <h3 class="card-title">Change SOA-EDIT-API</h3>
                         </div>
@@ -293,7 +293,7 @@
 
             <div class="row">
                 <div class="col-12">
-                    <div class="card">
+                    <div class="card card-outline card-danger shadow">
                         <div class="card-header">
                             <h3 class="card-title">Remove Zone</h3>
                         </div>