.blog {
    animation-name: fly-in-soft;
    animation-duration: 0.4s;
    /*padding: 50px;*/
    /*overflow: auto;*/
}

    .blog .blog-category, .blog .blog-mainpage, .blog .flex-article {
        padding: 50px;
        background: white;
        border: 1px solid #e7e6e7;
    }

    .blog .blog-container {
        display: flex;
        flex-wrap: wrap;
    }

.flex-content-container .blog-container .content {
    width: auto;
    margin: 0;
}


.blog .blog-container > div:first-child {
    display: flex;
    width: 808px;
    flex-wrap: wrap;
    justify-content: space-between;
}

.blog .blog-homepage .blog-container > div:first-child {
    width: 100%;
}

.blog .article {
    padding-bottom: 15px;
    width: 100%;
}

.blog .blog-homepage .article {
    margin: 10px 0;
}

.blog .article:first-of-type {
    padding-top: 15px;
}

.blog .blog-homepage .article {
    background: white;
    border: 1px solid #e7e6e7;
}
/*GENERAL*/

.blog h1 {
    padding: 0 0 10px 0;
}

.blog a {
    color: #2766d9;
    text-decoration: none;
}

    .blog a:hover {
        text-decoration: underline;
    }

.blog h2 a {
    color: #2766d9;
    font-size: 14pt;
    font-weight: 600;
    text-decoration: none;
}

    .blog h2 a:hover {
        text-decoration: underline;
    }

.blog p {
    margin: 0px;
}

.blog .info {
    margin: 0 0 20px 0;
}

.blog .date {
    display: inline-block;
    font-size: 10pt;
    font-weight: 600;
}

.blog .sep {
    display: inline-block;
    font-size: 10pt;
}

.blog .author {
    display: inline-block;
    font-size: 10pt;
    font-weight: 600;
    color: #000;
}

    .blog .author a {
        text-decoration: none;
        color: #2766d9;
    }

        .blog .author a:hover {
            text-decoration: underline;
        }
        .blog .author-box{
            display:flex;
            flex-direction:column;
            margin-top:60px;
        }
            .blog .author-box .header {
                display: flex;
                flex: 0 0 100%;
            }
            .blog .author-box .title {
                flex: 0 0 auto;
                margin-top: 4px;
            }
.blog .author-box img {
    border-radius: 100%;
    height: 64px;
    width: 64px;
    flex: 0 0 63px;
    margin: 0 16px 23px 0;
}
            .blog .author-box.without-description img {
            margin-bottom:0px;
            }
            .blog .author-box span {
                font-size: 9pt;
                text-transform: uppercase;
                color: #909090;
                font-weight: 900;
            }
            .blog .author-box h5 {
                font-size: 14pt;
                text-transform: uppercase;
                margin: 4px 0 0 0;
            }
.blog .author-description {
    color: #909090;
    flex: 0 0 100%;
}

.blog .blog-homepage .blog-read-all-articles a {
    font-size: 16pt;
}
/*END*/

/*CATALOG VIEW*/
.blog .catalog .image {
    display: inline-block;
    height: 300px;
    width: 100%;
    position: relative;
    vertical-align: top;
    overflow: hidden;
    margin-bottom: 10px;
}

    .blog .catalog .image img {
        width: calc(100% + 1px);
        max-width: auto;
        height: auto;
        position: absolute;
        top: calc(50% + 1px);
        left: calc(50% + 1px);
        transform: translate(-50%,-50%);
    }

.blog .blog-homepage .catalog .article {
    width: 49%;
}
/*END*/
.blog .blog-homepage .list .article
/*LIST VIEW*/
.blog .list .article {
    flex: 0 0 100%;
}

.blog .list .image {
    display: none;
}

.blog .blog-homepage .list .article {
    flex: 0 0 1208px;
}
/*END*/
/*CATALOG LIST VIEW*/
.blog .catalog-list .image {
    display: inline-block;
    width: 200px;
    margin-right: 10px;
    vertical-align: top;
}

.blog .catalog-list .content {
    display: inline-block;
    width: 594px;
}

.blog .catalog-list .image img {
    max-width: 200px;
    max-height: 200px;
}


.blog .blog-homepage .catalog-list .content {
    width: 970px;
}

/*END*/

/*TILES VIEW*/

.blog .tiles .article {
    width: 45%;
}

    .blog .tiles .article:first-of-type {
        padding-top: 0px;
    }

.blog .tiles .image {
    display: inline-block;
    height: 200px;
    width: 100%;
    position: relative;
    vertical-align: top;
    overflow: hidden;
    margin-bottom: 10px;
}

    .blog .tiles .image img {
        width: calc(100% + 1px);
        max-width: auto;
        height: auto;
        position: absolute;
        top: calc(50% + 1px);
        left: calc(50% + 1px);
        transform: translate(-50%,-50%);
    }

.blog .blog-homepage .tiles .article {
    width: 32%;
}

.blog .blog-homepage .content {
    margin: 10px 10px 0 10px;
    width: auto;
}
/*END*/
.blog-category .blog-category .list {
    width: 100%;
}
/*CATEGORY LIST*/
.blog .category-list {
    display: table-cell;
    width: 300px;
}

    .blog .category-list h3 {
        padding: 15px 0 0 40px;
    }

    .blog .category-list ul {
        margin-left: 20px;
    }

    .blog .category-list li.selected a {
        font-weight: 900;
    }
/*END*/

.blog .category {
    display: inline-block;
    font-size: 10pt;
}

    .blog .category a {
        color: #fff;
        font-size: 8pt;
        text-decoration: none;
        background: #2766d9;
        border-radius: 3px;
        margin-left: 5px;
        padding: 3px 8px;
    }

.blog .post-category a:hover {
    text-decoration: underline;
}

.blog .article .category {
    display: inline-block;
    font-size: 10pt;
}

    .blog .article .category a {
        color: #fff;
        font-size: 8pt;
        text-decoration: none;
        background: #2766d9;
        border-radius: 3px;
        margin-left: 5px;
        padding: 3px 8px;
    }

        .blog .article .category a:hover {
            text-decoration: underline;
        }


.blog a.read-more {
    color: #2766d9;
    font-size: 10pt;
    font-weight: 400;
    text-decoration: none;
    text-transform: uppercase;
    margin: 4px 0;
}

    .blog a.read-more:hover {
        text-decoration: underline;
    }

.blog .category-list li {
    font-size: 12pt;
    font-weight: 400;
}

    .blog .category-list li a {
        color: #2766d9;
        text-decoration: none;
    }

        .blog .category-list li a:hover {
            text-decoration: underline;
        }
/*PAGINATION*/

.blog .pagination {
    display: table-row;
    flex: 0 0 100%;
}

    .blog .pagination ul {
        list-style: none;
        display: table-row;
        list-style-type: none;
    }

    .blog .pagination .selected a {
        font-weight: 900;
    }

    .blog .pagination li {
        display: inline-block;
        padding: 10px 15px;
    }

        .blog .pagination li:first-child {
            margin-left: 0px;
            padding-left: 0px;
        }

        .blog .pagination li a {
            color: #2766d9;
            font-weight: 400;
            font-size: 14pt;
            text-decoration: none;
        }

            .blog .pagination li a:hover {
                font-weight: 900;
                text-decoration: underline;
            }
/*END*/
@media only screen and (max-width: 989px) {


    .blog {
        padding: 10px;
    }

        .blog .blog-category, .blog .blog-mainpage, .blog .flex-article {
            padding: 10px;
        }

        .blog .blog-container > div:first-child {
            width: 100%;
        }

        .blog .list .post-category {
            display: block;
            margin-top: 5px;
        }

        .blog .post-content {
            width: auto;
        }

        .blog .image, .blog .catalog-list .image {
            width: 100%;
        }

            .blog .image img, .blog .catalog-list .image img {
                max-width: 100%;
                max-height: 100%;
            }

        .blog .catalog-list .content {
            width: 100%;
        }

        .blog .article .post-category {
            display: block;
            margin-top: 5px;
        }

        .blog .category-list {
            padding: 0px;
        }

            .blog .category-list h3 {
                padding-left: 0px;
            }

            .blog .category-list ul {
                list-style-type: none;
                padding-left: 0px;
                margin-left: 0px;
            }

            .blog .category-list li {
                line-height: 2em;
            }

        .blog .tiles .article {
            width: 100%;
        }

        .blog .blog-homepage .tiles .article {
            width: 100%;
        }

        .blog .blog-homepage .catalog .article {
            width: 100%;
        }

        .blog .blog-homepage .catalog-list .content {
            width: 100%;
        }

        .blog .blog-homepage .list .article {
            flex: 0 0 100%;
        }
        .blog .article-content img{
            width: 100%;
        }
}