@font-face {
    font-family: "Source Sans 3";
    src: url("./fonts/SourceSans3-VariableFont_wght.ttf");
}

:root {
    --border: 0.4rem solid red;
}

body {
    background-color: black;
    color: white;

    margin: 0 auto;
    max-width: 60rem;
    border: var(--border);

    font-family: "Source Sans 3", sans-serif;
    font-size: 2rem;
}

h1, h2 {
    border-bottom: 0.2rem solid red;
}

header {
    text-align: center;
    font-size: 4rem;
}

hr {
    border: var(--border);
    border-bottom: 0;
    margin: 0;
}

main {
    padding: 0 1rem;
}

.download {
    display: flex;
    justify-content: space-around;
}

a {
    padding: 0.2rem 0.4rem;
    border: var(--border);
    border-width: 0.2rem;

    color: inherit;
}

a:hover {
    background-color: rgb(255, 255, 255, 25%);
}

small {
    color: rgb(255, 255, 255, 50%);
}

.screenshots {
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
}

.screenshots figure img {
    max-width: 100%;
}

.screenshots figcaption {
    text-align: center;
    font-size: 1rem;
}

blockquote {
    border-left: var(--border);
    padding-left: 1rem;
}

figure blockquote {
    margin: 0;
}