*, ::before, ::after {
    box-sizing: inherit;
    padding: 0rem;
    margin: 0rem;
}

:root {
    --theme: crimson;
}

html {
    box-sizing: border-box;
    font-size: 1rem;
    max-height: 100vh;
    max-width: 100vw;
    background-color: rgb(10, 10, 10);
    font-family: monospace;
    overflow: hidden;
}

html, 
body,
main {
    width: 100%;
    height: 100%;
}

body, main {
    display: grid;
    place-content: center;
    place-items: center;
    grid-template-columns: 100%;
}

body {
    grid-template-rows: auto 1fr;
}

main {
    & h1 {
        font-size: 10rem;
        width: 100%;
        text-align: center;
    }
}

p, a, h1 {
    color: var(--theme);
}

a {
    font-size: 2rem;
    text-transform: uppercase;
    padding-inline: 0.5rem;
    padding-block: 0.25rem;
    height: inherit;
}

header {
    width: 100%;
    height: min-content;
    
    & nav {
        width: 100%;
        display: grid;
        place-items: center;
        height: inherit;

            & ul {
                display: flex;
                flex-direction: row;
                gap: 1rem;
                list-style: none;
                height: inherit;
                                        
                & li {
                    height: min-content;
                    display: grid;
                }
            }
    }
}