/*Grid 2 - auch interessant*/
.home-interest{
    /*var*/
    --tile-space: 20px;


    display: flex;
    justify-content: space-between;
    flex-wrap: wrap;
}

    /*layout*/

    .home-interest .interest-block-1{
        width: calc( 66.666% - var(--tile-space)*0.5);
        display: flex;
        justify-content: space-between;
        flex-wrap: wrap;
    }
    .home-interest .interest-block-2{
        width: calc( 33.333% - var(--tile-space)*0.5);
    }
        @media only screen and (max-width: 1299px){
            .home-interest .interest-block-1,
            .home-interest .interest-block-2{
                width: 100%;
            }
        }


    .home-interest .interest-block > div{
        border-radius: 20px;
        background-size: cover;
        background-position: center;
        background-repeat: no-repeat;
        background-color: rgba(0,0,0,0.4);
        background-blend-mode: overlay;
        position: relative;
    }
    .home-interest .interest-block > .interest-item{
        height: 345px;
    }
    .home-interest .interest-block > div > a{
        position: absolute;
        left: 0;
        top: 0;
        right: 0;
        bottom: 0;
        text-decoration: none;
    }

    .home-interest .interest-block .item-text{
        color: #fff;
        position: absolute;
        bottom: var(--tile-space);
        left: var(--tile-space);
        right: var(--tile-space);
    }
    .home-interest .interest-block .item-title{
        display: block;
        font-size: 25px;
        line-height: 32px;
    }
    .home-interest .interest-block .item-date{
        display: block;
        font-size: 16px;
        line-height: 25px;
    }

    /*left side*/
    .home-interest .interest-block-1 .main-item {
        width: 100%;
        height: 610px;
    }
        @media only screen and (max-width: 767px){
            .home-interest .interest-block-1 .main-item {
                height: 400px;
            }
        }
    .home-interest .interest-block-1 .interest-item {
        width: calc( 50% - var(--tile-space)*0.5);
        margin-top: var(--tile-space);
    }

    /*right side*/
    .home-interest .interest-block-2 > div:not(:first-of-type){
        margin-top: var(--tile-space);
    }
    .home-interest .interest-block-2 .all-items{
        height: 245px;
    }
    .home-interest .interest-block-2 .all-items a{
        display: flex;
        justify-content: center;
        align-items: center;
    }
    .home-interest .interest-block-2 .all-items .item-text{
        position: static;
    }
        @media only screen and (max-width: 1299px){
            .home-interest .interest-block-2{
                display: flex;
                justify-content: space-between;
                flex-wrap: wrap;
            }
            .home-interest .interest-block-2 .interest-item{
                width: calc( (100% - 2 * var(--tile-space)) * 0.4 );
                margin-top: var(--tile-space);
            }
            .home-interest .interest-block-2 .all-items{
                width: calc( (100% - 2 * var(--tile-space)) * 0.2 );
                height: 345px;
            }
        }
        @media only screen and (max-width: 1024px){
            .home-interest .interest-block-2 .interest-item{
                width: calc( (100% - var(--tile-space)) * 0.5 );
            }
            .home-interest .interest-block-2 .all-items{
                width: 100%;
                height: 100px;
            }
        }





        @media only screen and (max-width: 767px){
            .home-interest .interest-block-1>.interest-item,
            .home-interest .interest-block-2>.interest-item{
                height: 285px;
                width: 100%;
            }
        }