body {
    --main: rgb(233, 59, 56);
    --main-dark: rgb(158, 35, 33);
    --grey: rgb(192, 192, 192);
    --code-string-blue: #183691;
    font-family: Roboto, sans-serif;
}

h1, h2, h3, h4, h5, h6, th {
    font-family: Lato;
}

button {
    font-family: Lato;
    background: white;
    border-color: var(--grey);
    border-radius: 2px;
    border-width: 1px;
    border-style: solid;
    box-shadow: 0px 0px 4px -1px var(--grey);
    padding: 4px 8px;
    transition: cubic-bezier(0.215, 0.610, 0.355, 1) all 300ms;
}

button:active {
    background: var(--grey);
}

/* anchors in markdown */
.markdown-body a,
.markdown-body .markdown-heading:focus {
    color: var(--main);
}

/* highlight string */
.token.string {
    color: var(--code-string-blue);
}

/* navbar */
.nav-list .nav-item >a.router-link-active, .nav-list .nav-item >div.router-link-active {
    color: var(--main);
    border-bottom-color: var(--main);
}

.nav-list .nav-item-dropdown .dropdown-list .dropdown-item .router-link:hover, .nav-list .nav-item-dropdown .dropdown-list .dropdown-item .router-link-active {
    color: var(--main);
}

/* headings in markdown */
.sidebar-headings .sidebar-heading .sidebar-heading-anchor.active, .sidebar-headings .sidebar-heading .sidebar-heading-anchor:hover {
    color: var(--main);
}

/* nprogress */
#nprogress .bar {
    background: var(--main);
}
#nprogress .spinner-icon {
    border-top-color: var(--main);
    border-left-color: var(--main);
}

/* search icon */
.search-form .svg-icon.do-search:hover {
    color: var(--main);
}

/* color for anchors */
.link:hover {
    color: var(--main);
}

a.big::before {
    content: "➔";
    background: var(--main-dark);
    border-radius: 4px 0 0 4px;
    display: inline-block;
    padding: 0.3em 0.5em;
    margin: 0 0.5em 0 0;
    color: white;
    font-size: 16pt;
    text-align: center;
}

a.big {
    background: var(--main);
    border-radius: 4px;
    display: inline-block;
    padding: 0 0.5em 0 0;
    color: white;
    font-size: 16pt;
    text-align: center;
}
