.news-container {
    max-width: 1330px;
    margin: 0 auto;
}

.News {
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    -webkit-justify-content: space-around;
    -ms-flex-pack: distribute;
    justify-content: space-around;
    -webkit-flex-flow: row wrap;
    -ms-flex-flow: row wrap;
    flex-flow: row wrap;

    box-sizing: border-box;
}

.News__article {
    margin-top: 10px;
    background-size: cover;
    /*background: no-repeat center;*/ /*seems to be bugged*/
    background-blend-mode: overlay;

    box-shadow: rgba(0, 0, 0, 0.19) 0 0 8px 0;
}

.Card {
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    -webkit-flex-direction: column;
    -ms-flex-direction: column;
    flex-direction: column;
    background: rgba(255,255,255,0);
    position: relative;
    min-height: 300px;
    min-width: 320px;
    overflow: hidden;
}

.Card__title {
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    min-height: 60px;

    background: rgba(240,125,4,0.85);
    padding: 0 5px;

    /*font-size: 1.17em;*/
    -webkit-align-items: center;
    -ms-flex-align: center;
    align-items: center;
    color: white;
    text-transform: uppercase;
}

.Card__title h3 {
    margin: 0;
}

.Card__body {
    background: #f0f0f0;
    color: #404040;
    padding: 5px;
}

.Card__button {
    margin-top: 10px;
    color: #F07D04;
}

.Card__content {
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    -webkit-flex-direction: column;
    -ms-flex-direction: column;
    flex-direction: column;

    max-height: 60px;
    width: 100%;
    position: absolute;
    bottom: 0;

    transition-property: max-height;
    transition-duration: 0.4s;
    transition-timing-function: ease-in-out;
}

/* white-out background-image */
.Card:hover, .Card:focus {
    background: rgba(255,255,255,0.25);
}
/* pop-out short-text */
.Card:hover .Card__content, .Card:focus .Card__content {
    max-height: 100%;
}
/* adjust title color */
.Card:hover .Card__title, .Card:focus .Card__title {
    background: rgba(240,125,4,0.95);
}
/* adjust box shadow */
.News__article:hover, .News__article:focus {
    box-shadow: rgba(0, 0, 0, 0.45) 0px 0px 20px 0px;
}

/* transformation */
.News__article, .Card, .Card .Card__title {
    transition-property: background-color, border-color, box-shadow, color, opacity, text-shadow, -webkit-transform;
    transition-property: background-color, border-color, box-shadow, color, opacity, text-shadow, transform;
    transition-property: background-color, border-color, box-shadow, color, opacity, text-shadow, transform, -webkit-transform;
    transition-duration: 0.2s;
    transition-timing-function: linear;
}

/* @media */
/* single column */
@media (max-width: 1200px) {
    .News__article {
        width: 100%;
    }
}
/* two columns */
@media (min-width: 1200px) {
    .News__article {
        max-width: 320px;
        margin-right: 20px;
        margin-bottom: 20px;
    }
    .News__article:nth-child(even) {
        margin-right: 0;
    }
}

/* three columns */
@media (min-width: 1445px) {
    .News__article:nth-child(even) {
        margin-right: 20px;
        
    }
    .News__article:nth-child(3n) {
        margin-right: 0;
    }
}

/* four columns */
@media (min-width: 1880px) {
    .news-container {
        max-width: 1400px;
    }
    .News__article:nth-child(3n) {
        margin-right: 20px;
    }
    .News__article:nth-child(4n) {
        margin-right: 0;
    }
}