:root {
    --theme-color: #1FC5BF;
    --theme-color-light: #99EBE2;
    --theme-color-dark: #00B3AC;
    --theme-color-secondary: #6A5096;
    --theme-color-secondary-dark: #3F1C77;
    --theme-color-secondary-light: #C4B2E1;

    --text-color-base: #2E2E46;
    --text-color-secondary: #646473;
    --text-color-tertiary: #81818E;
  }


  ::selection {
    background: var(--theme-color-light);
  }

  body {
    font-size: 100%;
    line-height: 1.5;
    font-family: 'Source Sans Pro','Open Sans','Helvetica Neue',Arial,sans-serif;
    color: var(--text-color-base);
  }

  * {
    text-decoration: none !important;
  }

  a {
    transition: all 0.3s linear;
  }

  div.search {
    border-bottom: 2px solid #787881;
    border: none;
    background-color: var(--theme-color-secondary-light);
    padding: 0;
  }

  .sidebar .search input {
    background: none;
    background-color: rgba(255,255,255,0.5);
    padding: 1rem;
    transition: background-color 0.3s ease;
  }

  .sidebar .search input:focus {
    background-color: rgba(255,255,255,1);
  }

  aside.sidebar {
    border: none;
    background-color: var(--theme-color-secondary);
    color: #fff;
  }

  .sidebar ul li a {
    color: rgba(255,255,255,0.8);
    color: var(--theme-color-light);
    font-size: 1rem;
  }

  .sidebar ul li.active>a {
    border-width: 0.1rem;
  }

  .sidebar ul li a:hover {
    text-decoration: none;
    color: rgba(255,255,255,1);
  }

  .sidebar .sidebar-nav ul li.active>a {
    color: #fff;
    border-right: 0.2rem solid var(--theme-color-secondary-light,#29D0CA);
  }

  .search .results-panel.show {
    background-color: #05827E;
    background-color: #fff;
    color: #000;
  }

  .sidebar .search .matching-post {
    padding: 0;
    border-bottom: 0.2rem solid #E4E4E6;
  }

  .sidebar .search .matching-post:first-child {
    border-top: 0.2rem solid #E4E4E6;
  }

  .search a {
    padding: 1rem;
    display: block;
    transition: background-color 0.3s ease;
  }

  .search a:hover {
    color: var(--theme-color-dark);
  }

  .search p.empty {
    margin: 0;
    padding: 1rem;
    background-color: #F1F1F2;
  }

  .sidebar > h1 {
    font-size: 2rem;
  }

  .sidebar-logo {
    display: block;
    width: 4rem;
    vertical-align: bottom;
    line-height: 1.6;
    height: 4rem;
    margin: 0 auto;
  }

  body .sidebar-toggle {
    background: none;
    bottom: 0;
    left: 0;
    cursor: pointer;
    padding: 1rem;
  }

  body .sidebar-toggle-button {
    position: relative;
    width: 1.5rem;
    height: 1.5rem;
  }

  body .sidebar-toggle span {
    transition: all 0.3s linear;
    background-color: var(--theme-color);
    height: 0.25rem;
    width: 1.5rem;
    position: absolute;
    left: 0;
    margin: 0;
    transform-origin: 0;
  }

  body.close .sidebar-toggle span {
    transform-origin: center;
  }

  body .sidebar-toggle span:nth-child(1) { top:0; }
  body .sidebar-toggle span:nth-child(2) { top:0.65rem; }
  body .sidebar-toggle span:nth-child(3) { top:1.25rem; }

  .sidebar-toggle .sidebar-toggle-button:hover { opacity: 1; }

  .sidebar-toggle:hover span:nth-child(1) { transform: rotate(45deg); width: 1.75rem; }
  .sidebar-toggle:hover span:nth-child(2) { opacity: 0; }
  .sidebar-toggle:hover span:nth-child(3) { transform: rotate(-45deg); width: 1.75rem; }

  .close .sidebar-toggle:hover span:nth-child(1) { transform:rotate(0); width:1.5rem; top:0.65rem; }
  .close .sidebar-toggle:hover span:nth-child(2) { opacity: 1; transform:rotate(90deg); }
  .close .sidebar-toggle:hover span:nth-child(3) { transform:rotate(0); width:1.5rem; top:0.65rem; }

  th {
    text-align: left;
  }

  .markdown-section blockquote {
    margin: 1em 0;
  }

  .markdown-section em,
  .markdown-section blockquote {
    color: var(--text-color-tertiary);
  }

  .cover-main img {
    max-width: 10rem;
    max-height: 10rem;
  }

  section.cover p {
    line-height: inherit;
  }

  section.cover .cover-main a {
    font-weight: 600;
  }

  section.cover .cover-main a::before {
    display: none;
  }

  section.cover .cover-main blockquote {
    font-style: italic;
    color: #868C91;
  }

  section.cover.show div.cover-main > p a {
    border-style: solid;
    border-radius: 2rem;
    box-sizing: border-box;
    display: inline-block;
    font-size: 1.05rem;
    letter-spacing: .1rem;
    margin: .5rem 1rem;
    padding: .75em 2rem;
    text-decoration: none;
    transition: all .15s ease;

    border-width: 0.2rem;
    color: var(--theme-color-secondary);
    border-color: var(--theme-color-secondary);
  }

  section.cover.show div.cover-main>p a:last-child {
    background-color: var(--theme-color-secondary);
    border-color: var(--theme-color-secondary);
    color: #fff;
  }

  section.cover.show div.cover-main>p a:hover {
    color: var(--theme-color-secondary-dark);
    border-color: var(--theme-color-secondary-dark);
    opacity: 1;
  }

  section.cover.show div.cover-main>p a:last-child:hover {
    background-color: var(--theme-color-secondary-dark);
    border-color: var(--theme-color-secondary-dark);
    color: #fff;
    opacity: 1;
  }

  .anchor {
    position: relative;
  }

  .anchor::before {
    content: '\1F449';
    position: absolute;
    top: 0;
    left: -1.25em;
    opacity: 0;
    font-size: 0.875em;
  }

  .anchor:hover::before {
    opacity: 1;
  }

  section.cover .cover-main {
    margin: 20vh 20vw;
  }

  .app-name-link {
    white-space: nowrap;
  }

  .app-sub-sidebar li:before {
    display: none;
  }

  .markdown-section pre,
  .markdown-section pre > code {
    background-color: #2E2E46;
    color: rgba(255,255,255,0.75);
    font-size: 1em;
    line-height: 1.5;
  }

  .markdown-section code {
    display: inline-block;
    font-family: 'Source Code Pro', monospace;
  }

  .markdown-section pre {
    padding: 2rem;
  }

  .markdown-section pre > code {
    padding: 0;
  }

  .markdown-section hr {
    width: 25%;
    border-bottom: 5px solid #F1F1F2;
  }

  .token.punctuation {
    color: #585967;
  }

  .token.comment,
  .token.block-comment,
  .token.prolog,
  .token.doctype,
  .token.cdata{color:#999999;}
  .token.property,
  .token.number,
  .token.function-name,
  .token.constant,
  .token.symbol,
  .token.deleted{color:#5a9bcf;}.token.boolean{color:#ff8b50;}.token.tag{color:#fc929e;}.token.string{color:#8dc891;}.token.punctuation{color:#5FB3B3;}
  .token.selector,
  .token.char,
  .token.builtin,
  .token.inserted{color:#D8DEE9;}.token.function{color:#79b6f2;}
  .token.operator,
  .token.entity,
  .token.url,
  .token.variable{color:#d7deea;}.token.attr-value{color:#8dc891;}.token.keyword{color:#c5a5c5;}

  .lang-scss .token.variable {
    color: #8dc891;
  }

  .markdown-section ol, .markdown-section p, .markdown-section ul {
    line-height: inherit;
  }

  .markdown-section code {
    color: inherit;
    border-radius: 0;
    font-size: 0.9em;
    padding: 6px 10px;
    /* color: #111; */
  }

  .markdown-section table {
    display: table;
  }

  .markdown-section table tr {
    border-width: 0.2rem 0;
    border-style: solid;
    border-color: #F1F1F2;
  }

  .markdown-section table tr:nth-child(2n) {
    background-color: transparent;
  }

  .markdown-section table td,
  .markdown-section table th {
    border: none;
    padding: 1.5rem 0.5rem;
    text-align: left;
  }

  .markdown-section table td p {
    margin: 0;
  }

  .markdown-section a {
    text-decoration: none;
    border-bottom: 0.1rem solid var(--theme-color-light);
    transition: all 0.3s ease;
  }

  .markdown-section a:hover {
    border-color: var(--theme-color);
    color: var(--theme-color-dark);
  }

  .alert {
    padding: 2rem;
    border: 0.1rem solid var(--theme-color-secondary-light);
  }


  /* Badges */
  .markdown-section > p:first-child > a {
    border: none;
  }

  .docsify-copy-code-button {
    background: var(--theme-color);
  }

  .sidebar::-webkit-scrollbar {
    width:0;
  }

  @media screen and (max-width: 768px) {
    section.cover {
      height: auto;
    }
    section.cover .cover-main {
      margin: 0 5vw;
    }
    .cover-main img {
      max-width: 100px;
      max-height: 100px;
    }

    body .sidebar-toggle { background-color: #fff; }
    body.close .sidebar-toggle {
      background-color: transparent;
      padding: 1rem;
    }

    .sidebar-toggle:hover span:nth-child(1) { transform:rotate(0); width:1.5rem; top:0.65rem; }
    .sidebar-toggle:hover span:nth-child(2) { opacity: 1; transform:rotate(90deg); transform-origin: center; }
    .sidebar-toggle:hover span:nth-child(3) { transform:rotate(0); width:1.5rem; top:0.65rem; }

    .close .sidebar-toggle:hover span:nth-child(1) { transform: rotate(45deg); width: 1.75rem; }
    .close .sidebar-toggle:hover span:nth-child(2) { opacity: 0; }
    .close .sidebar-toggle:hover span:nth-child(3) { transform: rotate(-45deg); width: 1.75rem; }
  }

  @media screen and (min-width: 769px) {
    .markdown-section {
      max-width: 75rem;
      padding: 1rem 3rem;
    }
  }

  @media (min-width: 1200px) {
    body {
      font-size: 112.5%;
    }
  }

  @media (min-width: 1400px) {
    body {
      font-size: 125%;
    }
  }
