/* Gemini.css
 * Author: Paul Wilde
 * Source: https://codeberg.org/pswilde/geminicss
 * Website: https://geminicss.paulwilde.uk
 * */
:root {
    --bg: #111122;
    --text: #eeeedd;
    --text-dark: #ccccbb;
    --accent: #d0c010;
    --accent-2: #228822;
    --accent-2-dark: #006600;
    --accent-3: #ffaa44;
}
* {
    color: var(--text);
}
body {
    background-color: var(--bg);
    max-width: 80%;
    margin:auto;
    margin-top: 2em;
    font-size: 1.1em;
}
p, a, label, h1, h2, h3, h4, h5, ul, li {
    color: var(--text);
}
h1:before, h2:before, h3:before, a:before {
    transition: left 0.5s;
}
h1:before, h2:before, h3:before, a:before {
    position:absolute;
    left: 100px;
}
a {
    transition: color 0.3s, background 0.3s;
}
a:before {
    content: "=> "
}
a:hover {
    color: var(--accent);
}
a[id]:before {
    content: "";
}
h1 a:before, h2 a:before, h3 a:before {
    content: "";
}
a.button {
    display:inline-block;
    padding: 1em;
    margin: 0.4em;
    margin-left:0;
    background-color: var(--accent-2);
    border-radius: 15px;
    text-decoration:none;
}
a.button:before {
    content: "";
    position:relative;
}
a.button:hover {
    color: var(--text-dark);
    background-color: var(--accent-2-dark);
}
h1 a, h2 a, h3 a {
    text-decoration:0;
}
h1 {
    font-size: 1.8em;
    color: var(--accent);
}
h1:before {
    content: "# ";
}
h2 {
    font-size: 1.6em;
    color: var(--accent-2);
}
h2:before {
    content: "## ";
}
h3 {
    font-size: 1.4em;
    color: var(--accent-3);
}
h3:before {
    content: "### ";
}
blockquote {
    border-left: 3px solid var(--accent-2);
    padding: 0.4em;
    font-style: italic;
    padding-left: 2em;
    margin-left: 0;
}
blockquote pre {
    padding: 1em;
}
ul li ul {
    margin:0;
    padding:0;
}
ul li ul {
    list-style-type:none;
}

@media only screen and (max-width: 1600px) {
    h1:before, h2:before, h3:before, a:before {
        left: 60px;
    }
}
@media only screen and (max-width: 1200px) {
    h1:before, h2:before, h3:before, a:before {
        left: 20px;
    }
}
@media only screen and (max-width: 700px) {
    body {
        max-width: 70%;
    }
    h1:before, h2:before, h3:before, a:before {
        left: 4px;
    }

}