/* Extra small devices (phones, less than 768px) */
/* No media query since this is the default in Bootstrap */
.c-thumb-container {
    width:340px;

}

@media (max-width: 767px) { .c-thumb-placeholder { height:229px; width:305px;} }
/* Small devices (tablets, 768px and up) */
@media (min-width: 768px) { .c-thumb-placeholder { height:248px; width:330px;} }

/* Medium devices (desktops, 992px and up) */
@media (min-width: 992px) { .c-thumb-placeholder { height:205px; width:274px;} }

/* Large devices (large desktops, 1200px and up) */
@media (min-width: 1200px) { .c-thumb-placeholder { height:255px; width:340px;} }

.c-thumb-placeholder {
    position: relative;
    overflow: hidden;
    height: 0;
    width:100%;
    padding-bottom: 75%;
}
.c-thumb-placeholder img {
    position: absolute !important;
    left: 50%;
    top: 50%;
    -webkit-transform: translate(-50%,-50%);
    -ms-transform: translate(-50%,-50%);
    transform: translate(-50%,-50%);
}
.c-thumb-placeholder img.portrait {
    width: 100% !important;
    height: auto !important;
}

.news-content {
    height: 280px;
    max-height:280px;
    overflow: hidden;
}
.fadeout {
    position: relative;
    bottom: 4em;
    height: 4em;
    margin-bottom:-3em;
    background: -webkit-linear-gradient(
            rgba(255, 255, 255, 0) 0%,
            rgba(255, 255, 255, 1) 100%
    );
    background-image: -moz-linear-gradient(
            rgba(255, 255, 255, 0) 0%,
            rgba(255, 255, 255, 1) 100%
    );
    background-image: -o-linear-gradient(
            rgba(255, 255, 255, 0) 0%,
            rgba(255, 255, 255, 1) 100%
    );
    background-image: linear-gradient(
            rgba(255, 255, 255, 0) 0%,
            rgba(255, 255, 255, 1) 100%
    );
    background-image: -ms-linear-gradient(
            rgba(255, 255, 255, 0) 0%,
            rgba(255, 255, 255, 1) 100%
    );
}

.c-content-blog-post-card-1 > .c-body > .c-footer  {
    text-align: center;
}