scrapbook.css

@import url('https://fonts.googleapis.com/css2?family=Rubik:wght@400;700&display=swap');

:root {
    --fonts-body: "Rubik", system-ui, sans-serif;

    --colors-black: #839496;
    --colors-yellow: #073642;
    --colors-blue: #839496;
    --colors-text: #839496;
    --colors-background: #002b36;
    --colors-sheet: #073642;
    --colors-elevated: #073642;
    --colors-sunken: #002b36;

    --colors-one: #586e75;
    --colors-two: #657b83;
    --colors-three: #839496;
    --colors-four: #93a1a1;
}

.header-streak {
    margin-left: -8px;
    background: none;
    width: 100%;
}

.posts {
    border-radius: 0;
    grid-gap: 16px;
    overflow: visible;
}

.post {
    border-radius: 6px;
}

.header-content {
    flex-wrap: wrap;
}

.header-col-1 > div {
    position: relative;
}

.header-title-name {
    color: #eee8d5;
    position: absolute;
    top: -64px;
    left: 84px;
}

.header-title-avatar {
    max-width: 64px;
}

@media (max-width: 32em) {
    .header-title-name {
        position: relative;
        left: initial;
        top: initial;
    }
}