.news {
    margin-bottom: 30px;
}

    .news > div > div {
        position: absolute;
        top: 5px;
        bottom: 5px;
        left: 5px;
        right: 5px;
        overflow: hidden;
    }

    .news a {
        position: absolute;
        top: 0;
        left: 0;
        bottom: 0;
        right: 0;
    }

    .news > div > div > img {
        width: 100%;
        height: 100%;
        -webkit-backface-visibility: hidden;
        transform: translateZ(0) scale(1.1, 1.1);
        -webkit-transform: translateZ(0) scale(1.1, 1.1);
        transition: all ease .5s;
    }

    .news > div > div:hover > img {
        transform: translateZ(0) scale(1, 1);
        -webkit-transform: translateZ(0) scale(1, 1);
    }

    .news > div > div > h2 {
        position: absolute;
        bottom: 0;
        margin: 0;
        padding: 10px;
        color: white;
        background-color: rgba(0, 0, 0, 0.75);
        font-size: 22px;
        text-align: left;
        font-weight: 500;
        width: 100%;
        transition: all ease .5s;
        -webkit-transform: translateY(100%);
        transform: translateY(100%);
    }

    .news > div > div:hover > h2 {
        -webkit-transform: translateY(0);
        transform: translateY(0);
    }

.news_1x1, .news_1x2, .news_2x1 {
    position: relative;
    float: left;
}

.news_1x1 {
    width: 33.33333333%;
}

    .news_1x1:after {
        padding-top: 100%;
        display: block;
        content: '';
    }

/*.news_1x2 {
    width: 33.33333333%;
}

    .news_1x2:nth-child(7) {
        float: right;
    }

    .news_1x2:after {
        padding-top: 200%;
        display: block;
        content: '';
    }*/

/*.news_2x1 {
    width: 66.66666667%;
}

    .news_2x1:after {
        padding-top: 50%;
        display: block;
        content: '';
    }*/

.facebook > div {
    background-color: #3a589e;
}

    .facebook > div:before {
        content: "\f09a";
        top: calc(50% - 60px);
        left: calc(50% - 50px);
    }

.twitter > div {
    background-color: #5ea9dd;
}

    .twitter > div:before {
        content: "\f099";
        top: calc(50% - 70px);
        left: calc(50% - 65px);
    }

.instagram > div {
    background-color: #325c86;
}

    .instagram > div:before {
        content: "\f16d";
        top: calc(50% - 70px);
        left: calc(50% - 65px);
    }

    .facebook > div:before, .twitter > div:before, .instagram > div:before {
        position: absolute;
        font: normal normal normal 150px/1 FontAwesome;
        color: rgba(0, 0, 0, 0.4);
        transition: all ease .3s;
    }

.facebook:hover > div:before, .twitter:hover > div:before, .instagram:hover > div:before {
    color: rgba(255, 255, 255, 1);
}

.video {
    position: relative;
    padding-bottom: 56.25%;
    /*padding-top: 25px;*/
    height: 0;
}

    .video iframe {
        position: absolute;
        top: 0;
        left: 0;
        width: 100%;
        height: 100%;
    }

@media screen and (max-width: 1100px) {

    .news > div > div > h2 {
        -webkit-transform: translateY(0);
        transform: translateY(0);
        font-size: 14px;
    }
}
@media screen and (max-width: 767px) {
    .news_1x1, .news_1x2, .news_2x1 {
    width:100%;
    }
    .facebook:after, .twitter:after, .instagram:after {
    padding-top:50%;
    }
    .facebook > div:before, .twitter > div:before, .instagram > div:before {
    font: normal normal normal 90px/1 FontAwesome;
    color: white;
        top: calc(50% - 45px);

}
    .facebook > div:before {
         left: calc(50% - 30px);
    }
    .twitter > div:before, .instagram > div:before {
         left: calc(50% - 40px);
    }
    .content h3 {
    font-size: 16px;
}
}

.top-5{

}