:root {
    --cardinal: rgb(140,21,21);
    --digitalred: rgb(177,4,14);
    --digitalredlight: rgb(229,8,8);

    --white: rgb(255,255,255);
    --stanfordblack: rgb(46,45,41);
    --coolgrey: rgb(83,86,90);
    --black10: rgb(234,234,234);
    --black70: rgb(109,108,105);
    --black80: rgb(88,87,84);
    --black90: rgb(67,66,62);
    --trueblack: rgb(0,0,0);

    --lagunita: rgb(0,124,146);
    --paloverde: rgb(39,153,137);
    --bay: rgb(111,162,135);
    --lime: rgb(139,199,81);
    --purple: rgb(83,40,79);
    --clay: rgb(95,87,79);
    --sky: rgb(103,175,210);
    --paloalto: rgb(23,94,84);
    --lightsage: rgb(199,209,197);
    --illuminating: rgb(254,221,92);
    --lavender: rgb(118,94,153);
    --stone: rgb(146,139,129);
    --teal: rgb(0,80,92);
    --poppy: rgb(233,131,0);
    --spirited: rgb(224,79,57);
    --fog: rgb(218,215,203);
    --matblue: rgb(14,0,255);
    --matpink: rgb(170,4,249);
    --matgreen: rgb(2,128,9);

    /* Now come the docsify theme settings */
    --base-font-family: Lato, Merriweather, sans-serif;
    --base-background-color: var(--white);
    --heading-h2-border-color: var(--cardinal);
    --sidebar-background: var(--digitalred);
    --sidebar-border-color: var(--cardinal);
    --sidebar-nav-link-color: var(--white);
    --sidebar-nav-link-font-weight: bold;
    --sidebar-nav-link-background--active: var(--poppy);
    --sidebar-nav-link-background--hover: var(--spirited);
    --sidebar-nav-link-color--active: var(--white);
    --sidebar-nav-link-border-color--active: var(--digitalred);
    --sidebar-nav-link-text-decoration-color: var(--cardinal);
    --sidebar-nav-link-before-color--active: var(--cardinal);
    --sidebar-nav-pagelink-background-image: url("data:image/svg+xml,<svg xmlns='http://www.w3.org/2000/svg' width='7' height='11.2' viewBox='0 0 7 11.2'><path d='M1.5 1.5l4 4.1 -4 4.1' stroke-width='1.5' stroke='rgb(255,255,255)' fill='none' stroke-linecap='square' stroke-linejoin='miter' vector-effect='non-scaling-stroke'/></svg>");
    --sidebar-nav-pagelink-background-image--active: url("data:image/svg+xml,<svg xmlns='http://www.w3.org/2000/svg' width='11.2' height='7' viewBox='0 0 11.2 7'><path d='M1.5 1.5l4.1 4 4.1-4' stroke-width='1.5' stroke='rgb(255,255,255)' fill='none' stroke-linecap='square' stroke-linejoin='miter' vector-effect='non-scaling-stroke'/></svg>");
    --sidebar-nav-pagelink-background-image--loaded: url("data:image/svg+xml,<svg xmlns='http://www.w3.org/2000/svg' width='11.2' height='7' viewBox='0 0 11.2 7'><path d='M1.5 1.5l4.1 4 4.1-4' stroke-width='1.5' stroke='rgb(255,255,255)' fill='none' stroke-linecap='square' stroke-linejoin='miter' vector-effect='non-scaling-stroke'/></svg>");
    --sidebar-nav-pagelink-background-image--collapse: url("data:image/svg+xml,<svg xmlns='http://www.w3.org/2000/svg' width='7' height='11.2' viewBox='0 0 7 11.2'><path d='M1.5 1.5l4 4.1 -4 4.1' stroke-width='1.5' stroke='rgb(255,255,255)' fill='none' stroke-linecap='square' stroke-linejoin='miter' vector-effect='non-scaling-stroke'/></svg>");
    --sidebar-nav-pagelink-background: var(--digitalred) no-repeat left var(--sidebar-nav-pagelink-background-image);
    --sidebar-nav-pagelink-background--active: var(--poppy) no-repeat left var(--sidebar-nav-pagelink-background-image--active);
    --sidebar-nav-pagelink-background--collapse: var(--poppy) no-repeat left var(--sidebar-nav-pagelink-background-image--collapse);
    --sidebar-nav-pagelink-background--loaded: var(--digitalred) no-repeat left var(--sidebar-nav-pagelink-background-image--loaded);
    --sidebar-toggle-background: var(--digitalred);
    --sidebar-toggle-icon-color: var(--poppy);
    --search-result-heading-color: var(--poppy);
    --search-result-item-color: var(--white);
    --search-result-keyword-background: var(--poppy);
    --search-result-keyword-color: var(--trueblack);
    --code-theme-background: var(--black10);
    --code-inline-background: var(--black10);
    --code-theme-comment: var(--matgreen);
    --code-theme-function: var(--trueblack);
    --code-theme-keyword: var(--matblue);
    --code-theme-operator: var(--trueblack);
    --code-theme-punctuation: var(--trueblack);
    --code-theme-selection: var(--trueblack);
    --code-theme-selector: var(--matpink);
    --code-theme-tag: var(--trueblack);
    --code-theme-text: var(--trueblack); 
    --code-theme-variable: var(--trueblack);
  }

  footer .partner {
    float: right;
  }


/* Required for browsers w/o shadow DOM support */
iframe[src*="buttons.github.io"] {
    margin: 0;
}

.markdown-section strong code {
    font-weight: normal;
}

/* Theme Toggles */
label[data-class-target="label + .docsify-tabs"] {
    margin-right: 0.8em;
}


/* Custom Styles */
/* ========================================================================== */
/* Icon Only */
.docsify-tabs__tab[data-tab="icon only"] {
    letter-spacing: -100vw;
    color: transparent;
}
.docsify-tabs__tab[data-tab="icon only"]:before {
    content: url(https://icongr.am/feather/image.svg?size=18&color=999999);
    vertical-align: middle;
}

/* Icon + Label */
[data-tab="icon + label"]:before {
    content: url(https://icongr.am/feather/image.svg?size=18&color=999999);
    height: 16px;
    margin-right: 0.5em;
    vertical-align: middle;
}

/* Active State */
.docsify-tabs__tab--active[data-tab="active state"] {
    box-shadow: none;
    background: #13547a;
    color: white;
}
.docsify-tabs__content[data-tab-content="active state"] {
    background-image: linear-gradient(0deg, #80d0c7 0%, #13547a 100%);
}
.docsify-tabs__content[data-tab-content="active state"] p strong {
    color: white;
}

/* CodePen */
[data-tab-content="codepen"] .cp_embed_wrapper {
    position: relative;
    top: calc(0px - var(--docsifytabs-content-padding));
    left: calc(0px - var(--docsifytabs-content-padding));
    width: calc(100% + calc(var(--docsifytabs-content-padding) * 2));
    margin-bottom: calc(0px - var(--docsifytabs-content-padding));
}

/* Badge */
[data-tab="badge"]:after {
    content: 'New!';
    position: absolute;
    top: 0;
    right: 0;
    min-height: 1em;
    min-width: 1em;
    padding: 0.325em 0.5em 0.3em 0.5em;
    border-radius: 3px;
    background: red;
    color: #fff;
    font-family: sans-serif;
    font-weight: bold;
    font-size: 11px;
    line-height: 1;
    transform: translate(35%, -45%);
}

.sidebar>h1 img {
    max-width: 50%;
}

aside.toc-nav {
    background-color: var(--sidebar-background);
    color: var(--white);
    font-weight: bold;
}

aside.toc-nav a:hover {
    background-color: var(--sidebar-nav-link-background--hover);
}

aside.toc-nav > div.page_toc > div.active {
    background-color: var(--sidebar-nav-link-background--active);
}

@media only screen and (max-width: 1299px) {
  aside.toc-nav {
    background-color: var(--sidebar-background) !important;
    color: var(--white);
    opacity: 0.6;
  }
}