#articlecontainer {
    display: block;
    max-width:1200px;
    margin:auto;
    font-size: 14pt;
}

#articleheader{

}

#articlebody{
}

    #articlebody h1 {
        font-size: 20pt;
    }

    #articlebody p {
        text-indent: 30px;
    }

.floatleft {
    display: block;
    float: left;
}

.floatright {
    display: block;
    float: right;
    margin-right:0px;
}

.imagedefault {
    max-width: 600px;
    width: calc(100vw-40px);
    margin: 5px;
    padding: 0px;
}

    .imagedefault a{
        text-decoration:none;        
    }


    .imagedefault img {
        border-radius: 15px;
        max-width: 100%;
    }

    .imagedefault figure {
        margin: 0px;
        max-width: 100%;
        display: table;
    }

    .imagedefault figcaption {
        display: table-caption;
        caption-side: bottom;

        font-size: 10pt;
        color: #333333;
        text-align:center;
    }


/*    -----------------------*/

.article_preview {
    border: solid #6c3c00;
    background-color: #f2f1ef;
    border-radius: 15px;
    width:600px;
    display:block;
    padding-left:5px;
}

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

    .article_preview h1 {
        font-size: 20pt;
        margin: 0px 0px 10px 0px;
    }

.article_preview_imglogo {
    display: block;
    margin: 5px 5px 5px 5px;
    float: right;
    border-radius: 15px;
}

#article_index_container {
    width: 100%;
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(600px, 1fr)); /* auto-fill или auto-fit размер колонки */
    grid-column-gap: 10px;
    grid-row-gap: 10px;
    grid-auto-flow: row dense;
}