Note: After publishing, you may have to bypass your browser's cache to see the changes.

  • Firefox / Safari: Hold Shift while clicking Reload, or press either Ctrl-F5 or Ctrl-R (⌘-R on a Mac)
  • Google Chrome: Press Ctrl-Shift-R (⌘-Shift-R on a Mac)
  • Internet Explorer / Edge: Hold Ctrl while clicking Refresh, or press Ctrl-F5
  • Opera: Press Ctrl-F5.
/* Dark Mode Styles */
.dark-mode {
    background-color: #121212;
    color: #e0e0e0;
}

.dark-mode .tab-content .content-card p {
    font-size: 16px;
	color: #b4b87b;
    text-align: right;
}

.dark-mode .tab-header {
    background: #333;
    color: #ddd;
    border-bottom: 2px solid #444;
}

.dark-mode .tab-header div.active {
    background: #444;
    color: #ffd700;
}

.dark-mode .tab-content {
    background: #1e1e1e;
    color: #e0e0e0;
    border: 1px solid #333;
}

.dark-mode .tab-content .content-card {
    background: #2c2c2c;
    border-color: #444;
}

.dark-mode .font-button {
    color: white;
    background-color: #444;
}

.dark-mode .font-button:hover {
    background-color: #555;
}

.dark-mode .aya-num {
    color: #29312d;
}

.dark-mode .increase-button {
    background-color: #4CAF50;
}

.dark-mode .decrease-button {
    background-color: #f44336;
}

.dark-mode .reset-button {
    background-color: #2196F3;
}

.dark-mode .tab-content .responsive-table {
    border-collapse: inherit;
}

.dark-mode .tab-content .responsive-table .table-row {
    background: #2c2c2c;
	color: #b4b87b;
}

.dark-mode .tab-content .responsive-table .table-row .right-cell {
	color: #b4b87b
}

.dark-mode .tab-content .responsive-table .table-row .table-cell {
    border: 1px solid #444;
}