@font-face {
    font-family: "Atkinson Hyperlegible";
    font-style: normal;
    font-weight: 400;
    font-display: swap;
    src: url("/static/fonts/Atkinson-Hyperlegible-Regular-102a.woff2") format("woff2"),
    url("/static/fonts/Atkinson-Hyperlegible-Regular-102.woff") format("woff");
}

@font-face {
    font-family: "Atkinson Hyperlegible";
    font-style: italic;
    font-weight: 400;
    font-display: swap;
    src: url("/static/fonts/Atkinson-Hyperlegible-Italic-102a.woff2") format("woff2"),
    url("/static/fonts/Atkinson-Hyperlegible-Italic-102.woff") format("woff");
}

@font-face {
    font-family: "Atkinson Hyperlegible";
    font-style: normal;
    font-weight: 700;
    font-display: swap;
    src: url("/static/fonts/Atkinson-Hyperlegible-Bold-102a.woff2") format("woff2"),
    url("/static/fonts/Atkinson-Hyperlegible-Bold-102.woff") format("woff");
}

@font-face {
    font-family: "Atkinson Hyperlegible";
    font-style: italic;
    font-weight: 700;
    font-display: swap;
    src: url("/static/fonts/Atkinson-Hyperlegible-BoldItalic-102a.woff2") format("woff2"),
    url("/static/fonts/Atkinson-Hyperlegible-BoldItalic-102.woff") format("woff");
}

body {
    font-family: "Atkinson Hyperlegible", "Roboto", sans-serif;
    margin: 40px auto;
    padding: 10px;
    max-width: 650px;
    line-height: 1.6;
    font-size: 18px;
    background-color: #fff;
    color: #444;
    padding: 0
}

.search {
    text-align: center;
}

.searchBox {
    min-width: 50%;
    max-width: 500px;
}

.searchButton {
    max-width: 100px;
    background-color: #01b0f4;
    border: 1px solid #2666d6;
    border-radius: 5px;
    padding: 10px 20px;
}

.content {
    margin: 10px;
}

.created {
    font-size: 75%;
}

a:link {
    color: #01b0f4;
    text-decoration: none;
}

a:hover {
    color: #01b0f4;
    text-decoration: underline;
}

a:active {
    color: #01b0f4;
    text-decoration: underline;
}

a:visited {
    color: #01b0f4;
    text-decoration: underline;
}