.article {
    width: 100%;
    /*margin: 20px;*/
    padding: 20px;
    white-space:normal;
}

    .article .article-header {
        border-bottom: solid 1px rgba(255, 255, 255, 0.3);
        line-height: 40px;
        display: flex;
    }

        .article .article-header .date {
            display: inline-flex;
            font-size: 12px;
        }

        .article .article-header author {
            display: inline-flex;
            font-size: 12px;
        }

    .article .article-footer {
        border-top: solid 1px rgba(255, 255, 255, 0.3);
    }

        .article .article-footer .references {
            display:flex;
        }

            .article .article-footer .references .ref {
                display:block;
                line-height: 16px;
                font-size: 12px;
            }

                .article.article-footer.references.ref a {
                    text-decoration:none;
                }

    .article .article-content {
    }

        .article .article-content h1 {
            font-size: 32px;
            text-transform: uppercase;
        }
        .article .article-content h2 {
            font-size: 20px;
        }
        .article .article-content h3 {
            font-size: 16px;
        }
        .article .article-content .text {
            font-size: 14px;
        }
        .article .article-content .text img {
            display: block;
            margin-top: 8px;
            margin-bottom: 8px;
            width: 100%;
        }
        .article .article-content img {
            max-width: 100%;
        }