.dark {
  color: #ccc;
  background-color: #222;
}

.dark.header {
  border-bottom: 1px solid #555;
}

.dark .nav-menu-item {
  background-color: #222;
}

.dark .nav-menu-children {
  border: 1px solid #444;
}

.dark .nav-menu-item.selected {
  background-color: #1c1c1c;
}

.dark .nav-menu-item a:hover {
  background-color: #1e1e1e;
}

.dark .main-content {
  background-color: #222;
}

.dark .filter-component-search .search-field {
  border: 1px solid #555;
}

.dark input {
  color: #ccc;
  background-color: #222;
  border-color: #444;
  outline-color: #555;
}

.dark input[type="radio"] {
  border-color: #000;
}

.dark .ui-component > .ui-component-header {
  background-color: #333;
  border: 1px solid #444;
  border-bottom: 0;
}

.dark .ui-component > .content {
  background-color: #222;
  border: 1px solid #444;
}

.dark .button {
  color: rgba(255, 255, 255, 0.8);
  border: none rgba(255, 255, 255, 0);
  background-color: #555;
}

.dark .button.primary {
  background-color: #359db7;
  color: #fff;
}

.dark .ui-hover-menu .ui-menu {
  color: #ccc;
  background-color: #222;
  border: 1px solid #444;
}

.dark li.ui-menu-header {
  color: #ccc;
  border-bottom: 1px solid #444;
}

.dark .ui-menu-item:hover {
  background-color: #000;
}

.dark .ui-tree .node-name.unselectable {
  color: #ccc;
}

.dark .disabled-item {
  color: #555;
}

.dark #void > .light {
  fill: #444;
}

.dark #void > .dark {
  fill: #222;
}

.dark .modal.dialog {
  border: 1px solid #444;
  background-color: #222;
  box-shadow: 3px 3px 10px 5px #222;
}

.dark .modal > .modal-header {
  background-color: #222;
  border-bottom: 1px solid #444;
}

.dark .auto-complete-box {
  border: 1px solid #444;
}

.dark .auto-complete-box .auto-complete-suggestion {
  background-color: #222;
}

.dark .auto-complete-box .auto-complete-suggestion .hint {
  color: #ccc;
}

.dark .auto-complete-box .auto-complete-suggestion:hover {
  background-color: #111;
  color: #fff;
}

.dark .auto-complete-box .auto-complete-suggestion:hover .hint {
  color: #eee;
}

.dark .filter-result-card {
  background-color: #222;
  filter: drop-shadow(#888 0px 0px 5px);
}

.dark .small .filter-result-card {
  background-color: #222;
  filter: none;
}

.dark table {
  color: #ccc;
}

.dark a,
.dark a:hover,
.dark a:focus,
.dark a:active,
.dark a:visited {
  color: #5ba6d0 !important;
}

.dark .ui-tree .node-name {
  color: #5ba6d0;
}

.dark .ui-tree .selected {
  color: #5ba6d0;
}

.dark .history-buttons i {
  color: #5ba6d0;
}

.dark .history-buttons i.disabled {
  color: #555;
}

.dark .blazon-example {
  color: #5ba6d0 !important;
}

.dark text.arms-title, .dark text.collection-title {
  fill: #eee;
}

.dark .charge-colours .selected {
  background-color: #444;
}

.dark .node-drop-insert {
  border-top: 2px solid #fff;
}