:root {
    color-scheme: light dark;
}

@media (prefers-color-scheme: light) {
    /* NOTE: use default values. */
}

@media (prefers-color-scheme: dark) {
    /* NOTE: use default values. */
}

html {
    box-sizing: border-box;
}

*,
*:before,
*:after {
    box-sizing: inherit;
}

details>* {
    /* NOTE: the details element seems to reset to content-box, without any obvious reason why. Tested using the inspector in chrome 94. */
    box-sizing: border-box;
}

html,
body {
    margin: 0;
    padding: 0;
    background-color: revert;
    color: revert;
}

body {
    font-family: system-ui, sans-serif;
    font-size: 100%;
}

div#wrapper {
    margin-top: 2em;
    margin-bottom: 2em;
    margin-left: 10%;
    margin-right: 10%;
}

img,
svg {
    max-width: 100%;
}

svg#logo {
    display: block;
    margin-left: auto;
    margin-right: auto;
}

@media (prefers-color-scheme: light) {
    svg#logo path:nth-of-type(2) {
        /* NOTE: use default values. */
    }
}

@media (prefers-color-scheme: dark) {
    svg#logo path:nth-of-type(2) {
        outline: 0.1px solid rgba(127, 127, 127, 0.5);
    }
}

.on-white-background img {
    box-sizing: initial;
    background-color: #ffffff;
    border-radius: 0.3em;
    padding: 2em;
}

h1,
h2,
h3,
h4,
h5 {
    margin-top: 2em;
}

h1 {
    margin-top: 0.5em;
    text-align: center;
}

h2 {
    border-bottom-color: rgba(127, 127, 127, 0.5);
    border-bottom-width: 1px;
    border-bottom-style: solid;
}

footer {
    margin-top: 2em;
    margin-bottom: 1em;
    padding-top: 1em;
    padding-bottom: 1em;
    border-top-color: rgba(127, 127, 127, 0.5);
    border-top-width: 1px;
    border-top-style: solid;
}

ul li {
    margin-bottom: 0.5em;
}

dl dt {
    margin-top: 1em;
    font-weight: bold;
}

code,
kbd {
    padding-bottom: 0.1em;
    padding-left: 0.3em;
    padding-right: 0.3em;
    padding-top: 0.1em;
    background-color: rgba(127, 127, 127, 0.1);
    border-color: rgba(127, 127, 127, 0.4);
    border-style: solid;
    border-width: 1px;
    margin: 0;
}

code {
    border-radius: 0.1em;
}

kbd {
    border-radius: 0.3em;
}

table thead tr th,
table tbody tr th,
table tbody tr td,
table tfoot tr th,
table tfoot tr td {
    text-align: center;
    vertical-align: top;
    padding: 0.5em;
}

table thead tr th,
table tbody tr th,
table tfoot tr th {
    background-color: rgba(127, 127, 127, 0.2);
}

table tbody tr {
    background-color: rgba(127, 127, 127, 0.3);
}

table tbody tr:nth-of-type(2n) {
    background-color: rgba(127, 127, 127, 0.4);
}

table thead tr th:empty,
table tbody tr th:empty,
table thead tr td:empty,
table tfoot tr th,
table tfoot tr td {
    background-color: transparent;
}

table tbody tr th,
table tfoot tr th {
    text-align: left;
    vertical-align: top;
}

table tfoot tr:first-of-type th,
table tfoot tr:first-of-type td {
    border-top: 2px solid rgba(127, 127, 127, 0.5);
}

#download-latest-wrapper a.button {
    margin-top: 0;
    margin-bottom: 0.3em;
    margin-left: 0;
    margin-right: 0.3em;
    background-image: linear-gradient(rgba(127, 127, 127, 0.3), rgba(127, 127, 127, 0.1));
    border-color: rgba(127, 127, 127, 0.5);
    border-radius: 0.3em;
    border-style: solid;
    border-width: 0.1em;
}

#download-latest-wrapper a.button:hover {
    border-color: rgba(127, 127, 127, 0.6);

}

#download-latest-wrapper a.button:active {
    border-color: rgba(127, 127, 127, 0.8);
}

#download-latest-wrapper {
    text-align: center;
}

#download-latest-wrapper>a {
    display: inline-block;
    text-align: center;
    font-size: 2em;
    padding: 0.75em;
    border-radius: 10px;
}

#download-latest-wrapper span {
    display: block;
}

.note {
    background-color: rgba(127, 127, 127, 0.1);
    border: 1px solid rgba(127, 127, 127, 0.4);
    border-radius: 0.3em;
    margin-bottom: 0;
    margin-left: -1em;
    margin-right: -1em;
    margin-top: 0;
    padding-bottom: 1em;
    padding-left: 1em;
    padding-right: 1em;
    padding-top: 1em;
}

pre.block-with-overflow-y-scroll {
    background-color: rgba(127, 127, 127, 0.2);
    border-radius: 0.2em;
    padding: 1em;
    overflow-y: scroll;
}