* {
  --page-background: #36393e;
  --text-color: #ececec;
  --primary-text-color: #ececec;
  --markdown-link-color: #f6a7ba;
  --primary-color: #f6a7ba;
}

.icon {
  color: var(--text-color);
}

#quickstart- {
  text-align: center;
}

#graph {
  margin-top: 100px;
  margin-bottom: 40px;
  max-width: 80%;
  margin-left: auto;
  margin-right: auto;
}

header {
  background: #2e3236;
  box-shadow: rgba(0, 0, 0, 0.5) 0px 2px 5px 0px!important;
}

.markdown-body p code {
  color: var(--primary-color)!important;
}

.markdown-body li code {
  color: var(--primary-color)!important;
}

code[class='language-bash'], pre[class='language-bash'] {
  text-align: center;
}

body[layout='home'] pre {
  width: 70%;
  margin-left: auto;
  margin-right: auto;
}

@media(max-width: 700px) {
  body[layout='home'] pre {
    width: 100%;
    margin-left: auto;
    margin-right: auto;
  }
}

.markdown-body blockquote {
  border-top-right-radius: 3px;
  border-bottom-right-radius: 3px;
  color: #e4edf5;
  background: rgb(64, 68, 73);
}

.markdown-body blockquote p {
  padding-top: 5px;
  padding-bottom: 5px;
}

wcd-snippet.landing-page {
  width: 70%;
  margin-left: auto;
  margin-right: auto;
}

wcd-snippet.landing-page pre {
  width: 100%;
}

wcd-snippet::part(button) {
  background: #2d3339;
}

wcd-snippet::part(button):hover {
  color: rgb(246 167 186);
}

@media(max-width: 480px) {
  wcd-snippet.landing-page {
    width: 100%;
  }
}

.markdown-body .call-to-action, .markdown-body .call-to-action {
  background: rgb(246 167 186 / 0.10);
  border: solid 2px var(--primary-color);
  text-shadow: none;
}

.markdown-body .call-to-action:hover, .markdown-body .call-to-action:focus {
  background: rgb(246 167 186 / 0.25);
  border: solid 2px var(--primary-color);
  text-shadow: none;
}

body[layout='home'] .reasons {
  display: flex;
  flex-direction: column;
}

.markdown-body h1 .octicon-link, .markdown-body h2 .octicon-link, .markdown-body h3 .octicon-link, .markdown-body h4 .octicon-link, .markdown-body h5 .octicon-link, .markdown-body h6 .octicon-link {
  color: var(--primary-color)!important;
}

.content-footer {
  display: none;
}

.markdown-body h1,.markdown-body h2, .markdown-body h3, .markdown-body h4 {
  border-bottom: none;
}

footer {
  border-top: none;
}

html {
  /* syntax */
  --markdown-syntax-color: #f8f8f2;
  --markdown-syntax-background-color: #2e3440;
  --markdown-syntax-atrule-color: #88c0d0;
  --markdown-syntax-attr-name-color: #a3be8c;
  --markdown-syntax-attr-value-color: #88c0d0;
  --markdown-syntax-builtin-color: #a3be8c;
  --markdown-syntax-boolean-color: #81a1c1;
  --markdown-syntax-class-name-color: #88c0d0;
  --markdown-syntax-constant-color: #81a1c1;
  --markdown-syntax-char-color: #a3be8c;
  --markdown-syntax-deleted-color: #81a1c1;
  --markdown-syntax-entity-color: #81a1c1;
  --markdown-syntax-function-color: #88c0d0;
  --markdown-syntax-inserted-color: #a3be8c;
  --markdown-syntax-keyword-color: #81a1c1;
  --markdown-syntax-number-color: #b48ead;
  --markdown-syntax-operator-color: #81a1c1;
  --markdown-syntax-property-color: #81a1c1;
  --markdown-syntax-punctuation-color: #81a1c1;
  --markdown-syntax-regex-color: #81a1c1;
  --markdown-syntax-important-color: #81a1c1;
  --markdown-syntax-selector-color: #a3be8c;
  --markdown-syntax-symbol-color: #81a1c1;
  --markdown-syntax-string-color: #a3be8c;
  --markdown-syntax-tag-color: #81a1c1;
  --markdown-syntax-url-color: #81a1c1;
  --markdown-syntax-variable-color: #81a1c1;
  --markdown-syntax-hotkey-selector-color: #d73a49;
  --markdown-syntax-keyword-color: #22863a;
  --markdown-table-background-color: #212121;
  --markdown-table-row-odd-background-color: #515151;
  --markdown-table-border-color: #8e8e8e;

  --markdown-syntax-background-color: rgb(27, 29, 35);
  --markdown-syntax-atrule-color: rgb(246 167 186);
  --markdown-syntax-attr-name-color: rgb(246 167 186);
  --markdown-syntax-boolean-color: rgb(209, 154, 102);
  --markdown-syntax-class-name-color: rgb(97, 175, 239);
  --markdown-syntax-constant-color: rgb(220, 220, 170);
  --markdown-syntax-entity-color: rgb(220, 220, 170);
  --markdown-syntax-function-color: rgb(97, 175, 239);
  --markdown-syntax-inserted-color: rgb(220, 220, 170);
  --markdown-syntax-keyword-color: rgb(246 167 186);
  --markdown-syntax-number-color: rgb(220, 220, 170);
  --markdown-syntax-operator-color: rgb(220, 220, 170);
  --markdown-syntax-property-color: rgb(220, 220, 170);
  --markdown-syntax-punctuation-color: white;
  --markdown-syntax-regex-color: rgb(209, 154, 102);
  --markdown-syntax-selector-color: rgb(86, 156, 214);
  --markdown-syntax-symbol-color: rgb(220, 220, 170);
  --markdown-syntax-tag-color: rgb(86, 156, 214);
  --markdown-syntax-url-color: rgb(220, 220, 170);
  --markdown-syntax-variable-color: rgb(220, 220, 170);
  --markdown-syntax-keyword-color: rgb(246 167 186);
}

.string {
  color: rgb(152, 195, 121);
}

.comment {
  color: #7d7d7d;
}

.language-css {
  --markdown-syntax-string-color: #81a1c1;
}
