:root {
  --ctn-background: rgb(19 19 19);
  --ctn-body: rgb(213 213 213);
  --ctn-heading: rgb(235 235 235);
  --ctn-subtitle: rgb(147 147 147);

  --md-primary-fg-color: var(--ctn-background);
  --md-primary-fg-color--light: var(--ctn-background);
  --md-primary-fg-color--dark: var(--ctn-background);
  --md-primary-bg-color: var(--ctn-heading);
  --md-primary-bg-color--light: var(--ctn-body);
  --md-default-bg-color: var(--ctn-background);
  --md-default-fg-color: var(--ctn-body);
  --md-default-fg-color--light: var(--ctn-subtitle);
  --md-default-fg-color--lighter: var(--ctn-subtitle);
  --md-default-fg-color--lightest: rgb(95 95 95);
  --md-typeset-color: var(--ctn-body);
  --md-typeset-a-color: rgb(157 188 255);
  --md-code-bg-color: rgb(30 30 30);
  --md-code-fg-color: var(--ctn-body);
  --md-footer-bg-color: var(--ctn-background);
  --md-footer-bg-color--dark: rgb(12 12 12);
}

html,
body,
.md-container,
.md-main,
.md-content,
.md-content__inner {
  background: var(--ctn-background);
  color: var(--ctn-body);
}

.md-header,
.md-tabs {
  background: var(--ctn-background);
  color: var(--ctn-heading);
}

.md-header[data-md-state="shadow"] {
  box-shadow: 0 1px 0 rgb(38 38 38);
}

.md-search__form {
  background: rgb(30 30 30);
  color: var(--ctn-body);
}

.md-search__input,
.md-search__input::placeholder,
.md-search__icon {
  color: var(--ctn-subtitle);
}

.md-typeset,
.md-typeset p,
.md-typeset li,
.md-typeset td,
.md-typeset th {
  color: var(--ctn-body);
}

.md-typeset h1,
.md-typeset h2,
.md-typeset h3,
.md-typeset h4,
.md-typeset h5,
.md-typeset h6,
.md-header__title,
.md-tabs__link,
.md-nav__title {
  color: var(--ctn-heading);
}

.md-typeset h1 + p,
.md-typeset .subtitle,
.md-typeset .lead,
.md-typeset figcaption,
.md-typeset caption,
.md-nav__link,
.md-nav__link:link,
.md-nav__link:visited,
.md-sidebar,
.md-footer,
.md-source,
.md-search-result__article {
  color: var(--ctn-subtitle);
}

.md-nav__link--active,
.md-nav__link--active:link,
.md-nav__link--active:visited,
.md-nav__link:hover,
.md-tabs__link--active,
.md-tabs__link:hover {
  color: var(--ctn-heading);
}
