body {
    background-color: #1e1e2e;
    color: #cdd6f4;
    font-family: Iosevka, monospace;
}

#header {
    display: flex;
    float: left;
}

#links {
    float: right;
}

#articles {
    height: 100%;
    width: 100%;
    overflow-y: auto;
}

.article {
    background-color: #181825;
    border: 2px solid;
    border-color: #f38ba8;
    margin: 8px;
    padding: 4px;
}

.article_a {
    color: inherit;
    text-decoration: none;
}

.article .row {
    display: flex;
    flex-direction: row;
}

.article h2 {
    flex-grow: 1;
    text-decoration: underline;
}

.article .date,
.article h2 {
    margin-top: 2px;
    margin-bottom: 4px;
}

a {
    color: #cba6f7;
}

.tags {
    color: #a6adc8;
    font-style: italic;
}

#filterdiv {
    display: flex;
    flex-direction: row;
}

#filterdiv * {
    margin: 2px;
}

#filterbar {
    flex-grow: 1;
}

#filterbar,
#filterbtn {
    color: #cdd6f4;
    background-color: #313244;
    border: 1px solid;
    border-color: #94e2d5;
}

#filterbtn:hover {
    background-color: #585b70;
    cursor: pointer;
}