diff --git a/scripts/pi-hole/js/db_graph.js b/scripts/pi-hole/js/db_graph.js
index c395e2ce47..1c02748aae 100644
--- a/scripts/pi-hole/js/db_graph.js
+++ b/scripts/pi-hole/js/db_graph.js
@@ -208,10 +208,10 @@ function updateQueriesOverTime() {
 
 $(function () {
   var ctx = document.getElementById("queryOverTimeChart").getContext("2d");
-  var blockedColor = utils.getCSSval("queries-blocked","background-color");
-  var permittedColor = utils.getCSSval("queries-permitted","background-color");
-  var gridColor = utils.getCSSval("graphs-grid","background-color");
-  var ticksColor = utils.getCSSval("graphs-ticks","color");
+  var blockedColor = utils.getCSSval("queries-blocked", "background-color");
+  var permittedColor = utils.getCSSval("queries-permitted", "background-color");
+  var gridColor = utils.getCSSval("graphs-grid", "background-color");
+  var ticksColor = utils.getCSSval("graphs-ticks", "color");
 
   timeLineChart = new Chart(ctx, {
     type: utils.getGraphType(),
diff --git a/scripts/pi-hole/js/index.js b/scripts/pi-hole/js/index.js
index 2fa8bc7697..a1b84e6051 100644
--- a/scripts/pi-hole/js/index.js
+++ b/scripts/pi-hole/js/index.js
@@ -232,8 +232,8 @@ function updateQueriesOverTime() {
     timeLineChart.data.datasets = [];
 
     var labels = ["Blocked DNS Queries", "Permitted DNS Queries"];
-    var blockedColor = utils.getCSSval("queries-blocked","background-color");
-    var permittedColor = utils.getCSSval("queries-permitted","background-color");
+    var blockedColor = utils.getCSSval("queries-blocked", "background-color");
+    var permittedColor = utils.getCSSval("queries-permitted", "background-color");
     var colors = [blockedColor, permittedColor];
 
     // Collect values and colors, and labels
@@ -862,8 +862,8 @@ $(function () {
   getMaxlogage();
   updateSummaryData();
 
-  var gridColor = utils.getCSSval("graphs-grid","background-color");
-  var ticksColor = utils.getCSSval("graphs-ticks","color");
+  var gridColor = utils.getCSSval("graphs-grid", "background-color");
+  var ticksColor = utils.getCSSval("graphs-ticks", "color");
   var ctx = document.getElementById("queryOverTimeChart").getContext("2d");
   timeLineChart = new Chart(ctx, {
     type: utils.getGraphType(),
diff --git a/scripts/pi-hole/js/utils.js b/scripts/pi-hole/js/utils.js
index 4e194516f6..9d84116a1a 100644
--- a/scripts/pi-hole/js/utils.js
+++ b/scripts/pi-hole/js/utils.js
@@ -410,9 +410,9 @@ function changeBulkDeleteStates(table) {
 
 function getCSSval(cssclass, cssproperty) {
   var elem = $("<div class='" + cssclass + "'></div>"),
-    val = elem.appendTo('body').css(cssproperty);
-    elem.remove();
-    return val;
+    val = elem.appendTo("body").css(cssproperty);
+  elem.remove();
+  return val;
 }
 
 window.utils = (function () {
diff --git a/scripts/pi-hole/php/theme.php b/scripts/pi-hole/php/theme.php
index 5b25bc9ec5..4525ea3326 100644
--- a/scripts/pi-hole/php/theme.php
+++ b/scripts/pi-hole/php/theme.php
@@ -19,6 +19,7 @@
 $available_themes['default-dark'] = array('Pi-hole midnight theme (dark)', true, 'default-dark', '#272c30');
 $available_themes['default-darker'] = array('Pi-hole deep-midnight theme (dark)', true, 'default-darker', '#2e6786');
 $available_themes['high-contrast'] = array('High contrast theme (light)', false, 'high-contrast', '#0078a0');
+$available_themes['high-contrast-dark'] = array('High contrast dark theme (dark)', false, 'high-contrast-dark', '#0077c7');
 // Option to have the theme go with the device dark mode setting, always set the background to black to avoid flashing
 $available_themes['default-auto'] = array('Pi-hole auto theme (light/dark)', true, 'default-auto', '#367fa9');
 $available_themes['lcars'] = array('Star Trek LCARS theme (dark)', true, 'lcars', '#4488FF');
diff --git a/style/themes/high-contrast-dark.css b/style/themes/high-contrast-dark.css
new file mode 100644
index 0000000000..9ee3dcc614
--- /dev/null
+++ b/style/themes/high-contrast-dark.css
@@ -0,0 +1,906 @@
+/* Pi-hole: A black hole for Internet advertisements
+*  (c) 2020 Pi-hole, LLC (https://pi-hole.net)
+*  Network-wide ad blocking via your own hardware.
+*
+*  This file is copyright under the latest version of the EUPL.
+*  Please see LICENSE file for your rights under this license. */
+
+:root {
+  --primary-color: #0077c7;
+  --primary-color-darker: #101820;
+  --darker-bgcolor: #101c20;
+
+  --main-text-color: #d2dde1;
+
+  --info-color: var(--primary-color);
+  --danger-color: #a83333;
+  --warning-color: #a86600;
+  --success-color: #027744;
+
+  --menu-hover-bgcolor: var(--primary-color-darker);
+  --submenu-hover-bgcolor: #2d363f;
+
+  --network-recent: #184050;
+  --network-old: #183440;
+  --network-older: #182840;
+  --network-never: #182028;
+
+  --allowed-color: #3c7;
+  --blocked-color: var(--danger-color);
+
+  --datatable-bgcolor: rgba(18, 44, 68, 0.3);
+}
+
+/* removing transition for every element, to avoid unnecessary movement */
+* {
+  transition: none !important;
+}
+
+body {
+  font-size: 15px;
+  color: var(--main-text-color);
+}
+.layout-boxed {
+  background: #181c20;
+}
+
+a {
+  color: #92bed6;
+}
+a:hover,
+a:active {
+  color: #60a6cc;
+  text-decoration: underline;
+}
+
+h4 {
+  color: #44def1;
+}
+
+.page-header {
+  border-color: #202830;
+}
+.page-header small {
+  color: currentColor;
+}
+
+.content-header > .breadcrumb > li > a {
+  color: var(--main-text-color);
+}
+
+.table > thead > tr > th,
+.table > tbody > tr > th,
+.table > tfoot > tr > th,
+.table > thead > tr > td,
+.table > tbody > tr > td,
+.table > tfoot > tr > td {
+  border-top: 0;
+}
+.table > thead > tr.odd,
+.table > tbody > tr.odd,
+.table > tfoot > tr.odd {
+  background-color: #1d252d;
+}
+.table > thead > tr.odd:hover,
+.table > tbody > tr.odd:hover,
+.table > tfoot > tr.odd:hover,
+.table > thead > tr.even:hover,
+.table > tbody > tr.even:hover,
+.table > tfoot > tr.even:hover {
+  background-color: #1a2026;
+}
+.table-bordered,
+.table-bordered > thead > tr > th,
+.table-bordered > tbody > tr > th,
+.table-bordered > tfoot > tr > th,
+.table-bordered > thead > tr > td,
+.table-bordered > tbody > tr > td,
+.table-bordered > tfoot > tr > td {
+  border: 1px solid #000;
+}
+
+.dataTables_wrapper input[type="search"] {
+  border-radius: 4px;
+  background-color: #3c4652;
+  border: 0;
+  color: var(--main-text-color);
+}
+
+.pagination li > a {
+  color: var(--main-text-color);
+  background-color: #3c4652;
+  border-color: #202830;
+}
+.pagination > .disabled > a,
+.pagination > .disabled > a:focus,
+.pagination > .disabled > a:hover,
+.pagination > .disabled > span,
+.pagination > .disabled > span:focus,
+.pagination > .disabled > span:hover {
+  cursor: not-allowed;
+  color: #9ab;
+  background-color: #3c4652;
+  border-color: #202830;
+}
+.pagination > li > a:focus,
+.pagination > li > a:hover,
+.pagination > li > span:focus,
+.pagination > li > span:hover {
+  z-index: 2;
+  color: #fff;
+  background-color: #54606b;
+  border-color: #202830;
+}
+.pagination > .active > a,
+.pagination > .active > a:focus,
+.pagination > .active > a:hover,
+.pagination > .active > span,
+.pagination > .active > span:focus,
+.pagination > .active > span:hover {
+  background-color: var(--primary-color);
+  border-color: #202830;
+  color: #fff;
+}
+
+.wrapper,
+.main-sidebar,
+.left-side {
+  background-color: #202830;
+}
+.user-panel > .info,
+.user-panel > .info > a {
+  color: #fff;
+}
+
+.logo-img,
+.loginpage-logo {
+  filter: saturate(0) brightness(4.6) contrast(0.9);
+}
+
+.sidebar-menu > li.header {
+  color: #808a90;
+  background-color: var(--menu-hover-bgcolor);
+}
+.sidebar-menu > li > a {
+  border-left: 3px solid transparent;
+}
+.sidebar-menu > li:hover > a,
+.sidebar-menu > li > a:focus,
+.sidebar-menu > li.active > a {
+  color: #fff;
+  background-color: var(--menu-hover-bgcolor);
+  border-left-color: #fff;
+}
+.sidebar-menu > li > .treeview-menu {
+  margin: 0 3px;
+  background-color: var(--submenu-hover-bgcolor);
+}
+
+.sidebar a {
+  color: var(--main-text-color);
+}
+.sidebar a:hover {
+  text-decoration: none;
+}
+
+.treeview-menu {
+  padding: 0;
+}
+.treeview-menu > li > a {
+  padding: 5px 5px 5px 17px;
+}
+.treeview-menu > li.active > a,
+.treeview-menu > li > a:hover,
+.treeview-menu > li > a:focus {
+  color: #fff;
+  background: var(--menu-hover-bgcolor);
+}
+
+/* "Donate" sidebar button */
+.sidebar-menu > li.menu-donate:hover > a,
+.sidebar-menu > li.menu-donate > a:focus {
+  color: #fff;
+  background-color: #a03333;
+}
+
+.box,
+.box-footer,
+.info-box,
+.box-comment,
+.comment-text,
+.comment-text .username {
+  color: var(--main-text-color);
+  background-color: #202830;
+}
+.box-comments .box-comment {
+  border-bottom-color: #3c4652;
+}
+.box-footer {
+  border-top: 1px solid #3c4652;
+}
+.box-header.with-border {
+  border-bottom: 1px solid #3c4652;
+}
+.box-solid,
+.box {
+  border: 1px solid #202830;
+}
+
+.box > .box-header,
+.box > .box-header .btn,
+.box-solid > .box-header,
+.box-solid > .box-header .btn {
+  color: var(--main-text-color);
+}
+
+.box.box-info,
+.box.box-primary,
+.box.box-success,
+.box.box-warning,
+.box.box-danger {
+  border-top-width: 3px;
+}
+.box.box-info {
+  border-top-color: #00c0ef;
+}
+.box.box-primary {
+  border-top-color: #075383;
+}
+.box.box-success {
+  border-top-color: #00a65a;
+}
+.box.box-warning {
+  border-top-color: #ff851b;
+}
+.box.box-danger {
+  border-top-color: #dd4b39;
+}
+
+.main-header .navbar {
+  background-color: #202830;
+}
+.main-header .navbar .nav > li > a,
+.main-header .navbar .nav > li > .navbar-text {
+  color: #fff;
+  max-height: 50px;
+}
+.main-header .navbar .nav > li > a:hover,
+.main-header .navbar .nav > li > a:active,
+.main-header .navbar .nav > li > a:focus,
+.main-header .navbar .nav .open > a,
+.main-header .navbar .nav .open > a:hover,
+.main-header .navbar .nav .open > a:focus {
+  background-color: var(--menu-hover-bgcolor);
+  color: #f6f6f6;
+}
+
+.main-header .navbar .sidebar-toggle {
+  color: #fff;
+}
+.main-header .navbar .sidebar-toggle:hover {
+  color: #f6f6f6;
+  background-color: var(--menu-hover-bgcolor);
+}
+.sidebar-toggle-svg:hover {
+  color: #fff;
+  background: var(--menu-hover-bgcolor);
+}
+
+.timeline li .timeline-item {
+  color: var(--main-text-color);
+  background-color: #202830;
+  border-color: #3c4652;
+}
+.timeline li .timeline-header {
+  border-bottom-color: #3c4652;
+}
+
+.nav-stacked > li > a {
+  color: var(--main-text-color);
+}
+.nav-stacked > li > a:hover {
+  color: white;
+  background-color: #1a2026;
+}
+
+.content-wrapper,
+.right-side {
+  background-color: #3c4652;
+}
+
+.main-footer,
+.nav-tabs-custom {
+  background-color: #202830;
+  border-top-color: #3c4652;
+  color: var(--main-text-color);
+}
+.main-footer .nav-tabs,
+.nav-tabs-custom .nav-tabs {
+  background-color: var(--submenu-hover-bgcolor);
+  border-bottom-color: #2f363b;
+}
+.main-footer .tab-content,
+.nav-tabs-custom .tab-content {
+  background-color: var(--submenu-hover-bgcolor);
+}
+
+.nav-tabs-custom > .nav-tabs {
+  background: var(--primary-color-darker);
+}
+.nav-tabs-custom > .nav-tabs > li {
+  margin-right: 1px;
+  color: var(--main-text-color);
+}
+.nav-tabs-custom > .nav-tabs > li.active {
+  border-top-color: var(--primary-color);
+}
+.nav-tabs-custom > .nav-tabs > li:hover > a,
+.nav-tabs-custom > .nav-tabs > li.active > a,
+.nav-tabs-custom > .nav-tabs > li.active:hover > a {
+  border-left-color: var(--submenu-hover-bgcolor);
+  border-right-color: var(--submenu-hover-bgcolor);
+  background-color: var(--submenu-hover-bgcolor);
+  color: #fff;
+}
+.nav-tabs-custom > .nav-tabs > li:not(.active):hover {
+  border-top-color: #9ab;
+  background-color: transparent;
+}
+.nav-tabs-custom > .nav-tabs > li > a {
+  color: #9ab;
+}
+.nav-tabs-custom > .nav-tabs > li > a:focus {
+  color: #cde;
+  border-top-color: var(--primary-color-darker);
+}
+
+input,
+select,
+select.form-control,
+.form-group .input-group-addon,
+.input-group .input-group-addon,
+.form-group input,
+.input-group input,
+.form-group textarea,
+.input-group textarea,
+.daterangepicker select.hourselect,
+.daterangepicker select.minuteselect,
+.daterangepicker select.secondselect,
+.daterangepicker select.ampmselect,
+.form-control,
+div.dataTables_wrapper div.dataTables_length select {
+  background-color: #2d363f;
+  color: var(--main-text-color);
+  border: 1px solid #3c4652;
+}
+
+.list-group {
+  color: var(--main-text-color);
+  background-color: #202830;
+}
+.list-group .list-group-item {
+  border-color: #3c4652;
+  background-color: #202830;
+}
+.input-group .input-group-addon {
+  background: #3c4652;
+}
+
+.select2 .select2-selection {
+  background-color: #3c4652;
+  color: var(--main-text-color);
+  border: 1px solid #3c4652;
+}
+.select2 .select2-selection .select2-container--default,
+.select2 .select2-selection .select2-selection--single,
+.select2 .select2-selection .select2-selection--multiple,
+.select2 .select2-selection .select2-selection__rendered {
+  color: var(--main-text-color);
+}
+.select2-dropdown {
+  background-color: #3c4652;
+  color: var(--main-text-color);
+  border: 1px solid #3c4652;
+}
+.select2-dropdown .select2-search__field {
+  background-color: #202830;
+  color: var(--main-text-color);
+  border: 1px solid #3c4652;
+}
+.select2-container--default.select2-container--open {
+  background-color: #202830;
+}
+
+.not-used {
+  background-color: #eee;
+}
+.not-used:hover {
+  background-color: #c5c5c5;
+}
+.used {
+  background-color: #fff;
+}
+.used:hover {
+  background-color: #ddd;
+}
+
+.graphs-grid {
+  background-color: rgba(255, 255, 255, 0.1);
+}
+.graphs-ticks {
+  color: #fff;
+}
+
+.progress {
+  background-color: #181c20;
+}
+
+.queries-permitted {
+  background-color: var(--allowed-color);
+}
+.queries-blocked {
+  background-color: var(--blocked-color);
+}
+
+code,
+pre {
+  padding: 2px 4px;
+  font-size: 90%;
+  color: var(--main-text-color);
+  background-color: #3c4652;
+  border-radius: 4px;
+}
+
+kbd {
+  background-color: #3c4652;
+}
+
+/* Used in the Query Log table */
+.text-green-light {
+  color: #8fa !important;
+}
+.text-green {
+  color: #17cc7c !important;
+}
+.text-orange {
+  color: #f80 !important;
+}
+.text-red {
+  color: #f65 !important;
+}
+.text-vivid-blue {
+  color: #39f !important;
+}
+.text-muted {
+  color: #808890;
+}
+
+.sidebar .svg-inline--fa.text-red {
+  color: #c00 !important;
+}
+
+.btn-default {
+  box-shadow: none;
+  background-color: #3c4652;
+  color: #bec5cb;
+  border: 1px solid #3c4652;
+}
+
+.btn-default:hover,
+.btn-default:active,
+.btn-default.hover {
+  background: #fff;
+}
+
+.btn-primary {
+  background-color: var(--primary-color);
+  border-color: var(--primary-color);
+  color: #fff;
+}
+.btn-primary:active,
+.btn-primary.hover {
+  background-color: var(--primary-color-darker);
+}
+.btn-primary:hover {
+  color: var(--primary-color);
+  background-color: #fff;
+  border-color: var(--primary-color);
+}
+
+.btn-info {
+  background: var(--info-color) !important;
+  border-color: var(--info-color) !important;
+}
+.btn-danger {
+  background: var(--danger-color) !important;
+  border-color: var(--danger-color) !important;
+}
+.btn-warning {
+  background: var(--warning-color) !important;
+  border-color: var(--warning-color) !important;
+}
+.btn-success {
+  background: var(--success-color) !important;
+  border-color: var(--success-color) !important;
+}
+
+.datatable-bt:hover,
+.datatable-bt:active:hover {
+  background: var(--primary-color);
+  border-color: var(--primary-color);
+  color: #fff;
+}
+
+/* Used in debug log page */
+.log-red {
+  color: #f76;
+}
+.log-green {
+  color: #4c4;
+}
+.log-yellow {
+  color: #fb0;
+}
+.log-blue {
+  color: #48f;
+}
+.log-purple {
+  color: #b8e;
+}
+.log-cyan {
+  color: #0df;
+}
+.log-gray {
+  color: #999;
+}
+
+#output {
+  border-color: #505458;
+  background: #181c20;
+  font-size: 14px;
+}
+#output b.log-red {
+  background: #c00;
+  color: #fff;
+}
+
+/* Used by the long-term pages */
+.daterangepicker {
+  border-radius: 4px;
+  border: 1px solid #fff;
+  color: var(--primary-color-darker);
+}
+.daterangepicker .ranges {
+  border-radius: 3px;
+  overflow: hidden;
+}
+.daterangepicker .ranges li:hover {
+  background-color: var(--primary-color-darker);
+  color: #fff;
+}
+.daterangepicker .ranges li.active {
+  background-color: var(--primary-color); /* Color also used in table pagination */
+}
+.daterangepicker .calendar-table {
+  background-color: #3e464c;
+  border-radius: 4px;
+  border: 1px solid #3c4652;
+}
+.daterangepicker td.off,
+.daterangepicker td.off.in-range,
+.daterangepicker td.off.start-date,
+.daterangepicker td.off.end-date {
+  background-color: #485158;
+}
+.daterangepicker td.available:hover,
+.daterangepicker th.available:hover {
+  background-color: #1a2026;
+}
+.daterangepicker td.active,
+.daterangepicker td.active:hover,
+.daterangepicker td.in-range:hover {
+  background-color: #225e92;
+}
+.daterangepicker td.in-range {
+  background-color: #1a2026;
+  color: var(--main-text-color);
+}
+
+/*** Overwrite chrome's input field auto-filling ***/
+input:-webkit-autofill,
+input:-webkit-autofill:focus,
+textarea:-webkit-autofill,
+select:-webkit-autofill {
+  -webkit-text-fill-color: var(--main-text-color) !important;
+  -webkit-box-shadow: 0 0 0px 1000px #3c4652 inset;
+  transition: background-color 1s ease-in-out 0s;
+}
+
+.form-control[disabled],
+.form-control[readonly],
+fieldset[disabled] .form-control {
+  background-color: #3c4652;
+  opacity: 1;
+  -moz-appearance: textfield;
+  appearance: textfield;
+}
+
+.dropdown-menu {
+  background-color: #22282d;
+  color: var(--main-text-color);
+  border: 1px solid #4c5761;
+}
+
+.navbar-custom-menu > .navbar-nav > li > .dropdown-menu {
+  background-color: var(--primary-color-darker);
+  border: 1px solid #fff;
+  box-shadow: none;
+}
+
+.navbar-nav > .user-menu > .dropdown-menu {
+  margin: 0;
+  border: 1px solid var(--primary-color);
+}
+.navbar-nav > .user-menu > .dropdown-menu > .user-body {
+  border-color: var(--main-text-color);
+}
+.navbar-nav > .user-menu > .dropdown-menu > .user-body a {
+  color: var(--main-text-color) !important;
+}
+.navbar-nav > .user-menu > .dropdown-menu > .user-footer {
+  padding: 0;
+  color: var(--primary-color-darker);
+}
+.navbar-nav > .user-menu > .dropdown-menu > .user-footer a {
+  color: var(--primary-color-darker) !important;
+  padding: 8px 12px;
+}
+.navbar-nav > .user-menu > .dropdown-menu > .user-footer a:hover {
+  background-color: var(--primary-color) !important;
+  color: #fff !important;
+}
+
+.user-menu hr {
+  margin: 0;
+  opacity: 1;
+  border-color: var(--primary-color-darker);
+}
+
+@media (max-width: 767px) {
+  .main-header .navbar .dropdown-menu li.divider {
+    background-color: rgba(255, 255, 255, 0.1);
+  }
+  .main-header .navbar .dropdown-menu li a:hover {
+    background-color: var(--menu-hover-bgcolor);
+  }
+}
+
+.table-striped > tbody > tr:nth-of-type(2n + 1) {
+  background-color: #1d252d;
+}
+
+.panel,
+.panel-body,
+.panel-default > .panel-heading {
+  background-color: #3e464c;
+  border-radius: 4px;
+  border: 1px solid #3c4652;
+  color: var(--main-text-color);
+}
+
+.box.box-solid.box-info,
+.box.box-solid.box-info > .box-header {
+  color: var(--main-text-color);
+  background-color: #367fa9 !important;
+  border: 1px solid #367fa9;
+}
+
+input[type="password"]::-webkit-caps-lock-indicator {
+  filter: invert(100%);
+}
+
+.network-never {
+  background-color: var(--network-never);
+}
+.network-recent {
+  background-color: var(--network-recent);
+}
+.network-old {
+  background-color: var(--network-old);
+}
+.network-older {
+  background-color: var(--network-older);
+}
+.network-gradient {
+  background-image: linear-gradient(to right, var(--network-recent) 0%, var(--network-old) 100%);
+}
+
+.icheckbox_polaris,
+.icheckbox_futurico,
+.icheckbox_minimal-blue {
+  margin-right: 10px;
+}
+.iradio_polaris,
+.iradio_futurico,
+.iradio_minimal-blue {
+  margin-right: 8px;
+}
+
+/* Overlay box with spinners as shown during data collection for graphs */
+.box .overlay,
+.overlay-wrapper .overlay {
+  z-index: 50;
+  background-color: rgba(53, 60, 66, 0.733);
+  border-radius: 3px;
+}
+.box .overlay > .fa,
+.overlay-wrapper .overlay > .fa {
+  color: var(--main-text-color) !important;
+}
+
+.modal-content {
+  background: #202830;
+}
+.modal-header {
+  border-bottom-color: #3c4652;
+}
+.modal-footer {
+  border-top-color: #3c4652;
+}
+
+.close {
+  color: #383838;
+}
+
+.login-page {
+  background: #181c20;
+}
+
+/*** Fix login input visual misalignment ***/
+.login-options input,
+.login-options [class*="icheck-"] > input:first-child + input[type="hidden"] + label::before,
+.login-options [class*="icheck-"] > input:first-child + label::before {
+  background: none;
+  border-color: currentColor;
+}
+
+.form-group.has-error label {
+  color: #f65;
+}
+
+.main-header .logo {
+  background-color: var(--menu-hover-bgcolor);
+  color: #fff;
+  border-bottom: 0 solid transparent;
+}
+.main-header .logo:hover {
+  background-color: var(--menu-hover-bgcolor);
+}
+
+.main-header li.user-header {
+  background-color: var(--primary-color-darker);
+}
+
+.content-header {
+  background-color: transparent;
+}
+
+.form-control::placeholder {
+  color: #9ab;
+}
+.form-control::-webkit-input-placeholder {
+  color: #9ab;
+}
+.form-control:focus::placeholder,
+.form-control:focus::-webkit-input-placeholder {
+  color: transparent;
+}
+
+/* Small box and alert colors */
+.bg-aqua,
+.callout.callout-info,
+.alert-info,
+.label-info,
+.modal-info .modal-body {
+  background: var(--info-color) !important;
+  border-color: var(--info-color) !important;
+}
+.bg-red,
+.callout.callout-danger,
+.alert-danger,
+.alert-error,
+.label-danger,
+.modal-danger .modal-body {
+  background: var(--danger-color) !important;
+  border-color: var(--danger-color) !important;
+}
+.bg-yellow,
+.callout.callout-warning,
+.alert-warning,
+.label-warning,
+.modal-warning .modal-body {
+  background: var(--warning-color) !important;
+  border-color: var(--warning-color) !important;
+}
+.bg-green,
+.callout.callout-success,
+.alert-success,
+.label-success,
+.modal-success .modal-body {
+  background: var(--success-color) !important;
+  border-color: var(--success-color) !important;
+}
+
+.alert .close {
+  color: currentColor;
+  opacity: 0.5;
+  filter: none;
+}
+.alert .close:hover {
+  opacity: 1;
+  filter: none;
+}
+
+.small-box > .small-box-footer {
+  color: #fff;
+  background: rgba(0, 0, 0, 0.3);
+}
+
+/* Tables and Datatables */
+.blocked-row td {
+  background-color: rgba(56, 0, 40, 0.35);
+}
+.allowed-row td {
+  background-color: rgba(0, 64, 64, 0.35);
+}
+
+table.dataTable thead .sorting::after,
+table.dataTable thead .sorting_asc::after,
+table.dataTable thead .sorting_desc::after,
+table.dataTable thead .sorting_asc_disabled::after,
+table.dataTable thead .sorting_desc_disabled::after {
+  opacity: 1;
+  width: 20px;
+  padding: 0 1px;
+  border-radius: 4px;
+  text-align: center;
+}
+
+table.dataTable thead .sorting::after {
+  opacity: 0.6;
+}
+
+table.dataTable thead th:hover.sorting::after,
+table.dataTable thead th:hover.sorting_asc::after,
+table.dataTable thead th:hover.sorting_desc::after,
+table.dataTable thead th:hover.sorting_asc_disabled::after,
+table.dataTable thead th:hover.sorting_desc_disabled::after {
+  color: #fff;
+  background: #000;
+}
+
+td.highlight {
+  background-color: rgba(255, 204, 0, 0.15);
+}
+
+#domain-frequency .table-responsive table tr th:nth-child(3),
+#domain-frequency .table-responsive table tr td:nth-child(3),
+#ad-frequency .table-responsive table tr th:nth-child(3),
+#ad-frequency .table-responsive table tr td:nth-child(3) {
+  width: 146px;
+  text-align: center;
+}
+
+.lookatme {
+  color: #000 !important;
+  z-index: 1;
+}
+.lookatme::after {
+  background: #ff851b;
+  text-shadow: none;
+  content: "";
+  inset: -2px -4px;
+  z-index: -100;
+  animation: none;
+  border-radius: 6px;
+}