html, body {
    width: 100%;
    margin: 0;
    padding: 0;
    font-size: 16px;
    display: flex;
    flex-direction: column;
    min-height: 100vh;
    font-family: 'roboto', 'open-sans', sans-serif;
}

.flex {
    display: flex;
}

.flex-grow {
    flex-grow: 1;
}

.container {
    width: 70%;
    max-width: 1080px;
    margin: auto;
}

footer {
    padding: 8px 0;
}

/* specific styles */

html {
    background: rgb(35, 36, 37);
    color: #fff;
}

nav {
    background: rgb(22, 22, 22);
    margin-bottom: 32px;
    font-size: 24px;
}

nav h1 {
    padding: 0px;
    margin: 0px;
    font-size: inherit;
}

nav h1 span {
    font-weight: 400;
}

nav .container div {
    padding: 16px 0;
}

nav .container .username {
    padding: 16px;
    font-weight: 300;
}

a {
    color: rgb(85, 150, 255);
    text-decoration: none;
}

a:hover {
    text-decoration: underline;
}


.wrapper {
    padding: 8px 0 8px 32px;
    margin: 8px 0;
    border-left: 8px solid #868686;
}