a.article {
    text-decoration: none;
    color: black;
}

article {
    display: grid;
/*
    grid-template-columns: 15em auto 20em;
    grid-template-rows: 1em 1em auto 1em;

    grid-template-areas:
        "image-key . ."
        "image title title"
        "image body body"
        "image . info";
*/
    grid-gap: 3px;
    grid-template-columns: 1fr 20em;
    grid-template-rows: auto 1fr auto;
    grid-template-areas:
        "title title"
            "body body"
            ". info";
}

/*
article > span:first-child {
    grid-area: image-key;
    margin: 0;
}
article figure {
    grid-area: image;
}

article figure img {
    max-height: 10em;
    max-width: 10em;
    min-height: 10em;
    min-width: 10em;
}
*/

.article-title {
    font-size: 20px;
    grid-area: title;
    margin-bottom: 0;
}

.article-body {
    font-size: 16px;
    grid-area: body;
    margin: 0;
}

.article-info {
    font-size: 16px;
    grid-area: info;
    text-align: right;
}

div.pagination {
    margin-top: 50px;
    width: auto;
    height: 3em;
    text-align: center;
}

div.pagination a {
    color: black;
    text-decoration: none;
}