:root {
    color-scheme: dark;
    --bg: #000;
    --accent-bg: #2b2b2b;
    --text: #dcdcdc;
    --text-light: #ababab;
    --accent: #f06292;
    --accent-hover: #ffe099;
    --accent-text: var(--bg);
    --code: #f06292;
    --preformatted: #ccc;
    --disabled: #111;
}

@keyframes twinkle {
    from {background-position:0 0;}
    to {background-position:-10000px 5000px;}
}

body {
    background: #000 url(/assets/images/stars.png) repeat top center;
    position: relative;
}

body::before {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background: transparent url(/assets/images/twinkling.png) repeat top center;
    animation: twinkle 600s linear infinite;
    z-index: -1;
}

body > header {
    background-color: transparent;
}

header nav {
    background: var(--bg);
}

.default_header {
    display: flex;
    justify-content: center;
    align-items: center;
    gap: 24px;
}

.default_header img {
    height: 100px;
    width: 100px;
    border-radius: 50px;
}

a {
    text-decoration: none;
}

/* Needed for HR to appear in the body */
hr {
    width: 100%;
}