html, body {
  background-color: #292929;
}
.side-nav ul::-webkit-scrollbar-track {
  background: #303030;
}
.nav, .side-nav .current-project {
  background-color: #212121;
}
.side-nav,
.side-nav .search-bar input,
.side-nav .projects {
  background-color: #303030;
}
.side-nav li.spacer,
.side-nav .search-bar button,
.side-nav .projects h4 {
  color: rgba(255, 255, 255, 0.7);
}
.side-nav li ul li a {
  color: rgba(255, 255, 255, 0.7) !important;
}
.side-nav li a,
.side-nav .search-bar input,
.side-nav .projects .list a {
  color: rgba(255, 255, 255, 1);
}
.side-nav li a.active {
  color: #5c6bc0;
}
.side-nav .search-bar {
  border-bottom-color: rgba(255, 255, 255, 0.1);
}
.pre-loader, .main-content .content-loader {
  background-color: #292929;
}
.nav-account {
  background-color: #424242;
}
.nav-account h2 {
  color: #fff;
}

.main-content .error-alert i, .main-content .error-alert h4 {
  color: rgba(255, 255, 255, 0.7);
}
.main-content .error-alert h2 {
  color: #fff;
}

.sidebar {
  background-color: #303030;
  border-left-color: rgba(255, 255, 255, 0.1);
}
.sidebar .sidebar-loader {
  background-color: #303030;
}
.sidebar button.close {
  color: rgba(255, 255, 255, 0.7);
}
.sidebar h2 {
  color: #fff;
  background-color: #292929;
  border-bottom-color: rgba(255, 255, 255, 0.1);
}
.sidebar .sidebar-content .choose-element {
  color: rgba(255, 255, 255, 0.7);
  border-color: rgba(255, 255, 255, 0.25);
}
.sidebar .sidebar-content .choose-element.error {
  color: #cf6679;
  border-color: #cf6679;
}

.main-content .tabs {
  background-color: #303030;
  width: calc(100% - 40px);
  padding: 12px 20px 0 20px;
  border-bottom: 1px solid rgba(255, 255, 255, 0.1);
}
.main-content .tabs h2 {
  font-size: 24px;
  margin: 0 0 10px 0;
  padding: 0;
}
.main-content .tabs li {
  padding: 8px 0;
  margin: 0 32px 0 0;
}
.main-content .tabs li.active {
  border-bottom-color: #5c6bc0;
}
.main-content .tabs li.active a {
  color: #5c6bc0 !important;
}
.empty-alert i {
  color: rgba(255, 255, 255, 0.5);
}
.empty-alert h3 {
  color: rgba(255, 255, 255, 0.7);
}
.empty-alert p {
  color: rgba(255, 255, 255, 0.5);
}
.sections .sections-header span {
  color: rgba(255, 255, 255, 0.5);
}
.sections .section {
  background-color: #424242;
  border-bottom-color: rgba(255, 255, 255, 0.1);
}
.sections .section:first-child {
  border-top-left-radius: 5px;
  border-top-right-radius: 5px;
}
.sections .section:last-child {
  border-bottom: none;
  border-bottom-left-radius: 5px;
  border-bottom-right-radius: 5px;
}
.sections .section .header span {
  color: rgba(255, 255, 255, 0.7);
}

/* CONTENT HOLDER */
.overlay .content-holder {
  background-color: #424242;
}

/**POPUP**/
.popup .wrapper, .popup-loader {
  background-color: #424242;
}
.popup .content h2 {
  color: #fff;
}
.popup button.close {
  color: #fff;
}
.popup .content .buttons .m-button-flat, .popup .content .buttons .m2-button.flat {
  color: rgba(255, 255, 255, 0.7) !important;
}
.popup .content .buttons .m2-button.flat:hover {
  background-color: rgba(255, 255, 255, 0.1) !important;
}
.popup .content .info {
  background-color: #5c5959;
  color: rgba(255, 255, 255, 0.7);
}
.popup .content .info p {
  color: #fff;
}
.popup .content .alert {
  background-color: #cf6679;
}
.popup .content .alert p, .popup .content .alert i {
  color: #000;
}
.popup .content h3 {
  color: rgba(255, 255, 255, 0.5);
}
.popup .content h4 {
  color: rgba(255, 255, 255, 0.7);
}

/**STEPPER**/
.stepper .step h1 {
  color: #fff;
}
.stepper .step p,
.stepper .back {
  color: rgba(255, 255, 255, .7);
}
.stepper .step .step-buttons-description {
  color: rgba(255, 255, 255, 0.7);
}

/**MATERIAL DESIGN**/
.m-input-field span, .m2-input-field span {
  color: rgba(255, 255, 255, 0.5);
}
.m2-input-field span {
  background-color: #424242;
  background: linear-gradient(transparent 65%, #424242 35%);
}
.m-input-field.active span, .m-input-field.filled span,
.m2-input-field.active span, .m2-input-field.filled span {
  color: #5c6bc0;
}
.m2-input-field.error span, .m2-input-field h5 {
  color: #cf6679 !important;
}
.m-input-field input, .m-input-field textarea, .m-input-field p.input[contenteditable="true"] {
  color: #fff;
  border-bottom-color: rgba(255, 255, 255, 0.25);
}
.m2-input-field input, .m2-input-field textarea, .m2-input-field p.input[contenteditable="true"] {
  background-color: #424242;
  border-color: rgba(255, 255, 255, 0.25);
  color: #fff;
}
.m2-input-field.active input, .m2-input-field.active textarea {
  border-color: #5c6bc0;
}
.m2-input-field.error input, .m2-input-field.error textarea {
  border-color: #cf6679;
}
.m2-input-field input:disabled {
  cursor: default;
  background-color: #292929;
}
.m-input-field div {
  background-color: #5c6bc0;
}
.m-check-field.error div {
  border-color: #cf6679;
}
.m-check-field h5 {
  color: #cf6679;
}
.m-check-field label p {
  color: rgba(255, 255, 255, 0.7);
}
.m-check-field input:disabled + label div i {
  background-color: #676767;
}
.m-input-select select {
  border-bottom-color: rgba(255, 255, 255, 0.25);
  color: #fff;
  background-color: #424242;
}
.m2-button {
  color: #5c6bc0;
  border-color: #5c6bc0;
}
.m2-button:hover {
  background-color: rgba(138, 150, 222, .25);
}
.m2-button.full {
  background-color: #5c6bc0;
  border-color: #5c6bc0;
}
.m2-button.full:hover {
  color: #5c6bc0;
  background-color: rgba(138, 150, 222, .25);
}
.m2-button.full:disabled {
  background-color: #676767;
  border-color: #676767;
}
.m2-button.full:disabled:hover {
  background-color: #676767;
  border-color: #676767;
}
.m-switch label {
  background-color: #7A7A7A;
}
.m-switch input + label div {
  background-color: #A0A0A0;
}
.m-switch input:checked + label div {
  background-color: #5c6bc0;
}
.m-switch input:disabled + label {
  cursor: not-allowed;
}
.m-switch input:disabled + label div {
  background-color: #676767;
}
.m-table-extra-head {
  background-color: #424242;
  border-bottom-color: rgba(255, 255, 255, 0.1);
}
.m-table thead {
  color: rgba(255, 255, 255, 0.7);
  background-color: #424242;
  border-top-left-radius: 5px;
  border-top-right-radius: 5px;
}
.m-table tbody {
  background-color: #4e4e4e;
  border-top-color: rgba(255, 255, 255, 0.1);
}
.m-table tbody tr {
  border-bottom-color: rgba(255, 255, 255, 0.1);
}
.m-table tbody tr:hover {
  background-color: #5c5c5c;
}
.m-table tbody td {
  color: #fff;
}
.m-table tfoot, .m-table tfoot td {
  background-color: #424242;
  color: rgba(255, 255, 255, 0.7);
  border-bottom-left-radius: 5px;
  border-bottom-right-radius: 5px;
}
.m-radio-field label p {
  color: rgba(255, 255, 255, 0.7);
}

.toast {
  background-color: #fff;
  color: rgba(0, 0, 0, 0.82);
}
.toast .toast-error {
  color: #cf6679;
}
.toast .toast-done {
  color: #00bd8b;
}

.m-progress {
  background-color: #424242;
}

/**PRETTY PRINT JSON**/
.json-key     { color: #fae1c0; }
.json-string  { color: #dbf69c; }
.json-number  { color: #b8d6fe; }
.json-boolean { color: #c6fff1; }
.json-null    { color: #d6d6d6; }