.news-item {
    position: relative;
}
.news-item img {
    width: 100%; -webkit-filter: grayscale(100%);
  -moz-filter: grayscale(100%);
  -ms-filter: grayscale(100%);
  -o-filter: grayscale(100%);
  filter: grayscale(100%);
  filter: gray; /* IE 6-9 */
}
.news-hover {
    position: absolute;
    left: 0;
    top: 0;
    width: 100%;
    height: 100%;
    padding: 2.7rem;
    color: #fff;
    -webkit-transition: all 0.3s;
    -o-transition: all 0.3s;
    transition: all 0.3s;
}
.hover-border {
    position: absolute;
    left: 0;
    top: 0;
    width: 100%;
    height: 100%;
    overflow: hidden;
}
.hover-border div {
    position: absolute;
    left: 0;
    top: 0;
    width: 100%;
    height: 100%;
}
.hover-border div::before {
    position: absolute;
    content: "";
    background: #337ab7;
    height: 2px;
    width: 100%;
    left: 0;
    top: 0;
    -webkit-transform: translateX(-100%);
    -ms-transform: translateX(-100%);
    -o-transform: translateX(-100%);
    transform: translateX(-100%);
    -webkit-transition: 0.2s;
    -o-transition: 0.2s;
    transition: 0.2s;
}
.hover-border::after {
    position: absolute;
    content: "";
    background: #337ab7;
    width: 2px;
    height: 100%;
    right: 0;
    bottom: 0;
    -webkit-transform: translateY(-100%);
    -ms-transform: translateY(-100%);
    -o-transform: translateY(-100%);
    transform: translateY(-100%);
    -webkit-transition: 0.2s 0.2s;
    -o-transition: 0.2s 0.2s;
    transition: 0.2s 0.2s;
}
.hover-border div::after {
    position: absolute;
    content: "";
    background: #337ab7;
    width: 100%;
    height: 2px;
    right: 0;
    bottom: 0;
    -webkit-transform: translateX(100%);
    -ms-transform: translateX(100%);
    -o-transform: translateX(100%);
    transform: translateX(100%);
    -webkit-transition: 0.2s 0.4s;
    -o-transition: 0.2s 0.4s;
    transition: 0.2s 0.4s;
}
.hover-border::before {
    position: absolute;
    content: "";
    background: #337ab7;
    width: 2px;
    height: 100%;
    left: 0;
    top: 0;
    -webkit-transform: translateY(100%);
    -ms-transform: translateY(100%);
    -o-transform: translateY(100%);
    transform: translateY(100%);
    -webkit-transition: 0.2s 0.8s;
    -o-transition: 0.2s 0.8s;
    transition: 0.2s 0.8s;
}
.news-hover .content {
    opacity: 0;
    position: relative;
    -webkit-transition: 0.3s;
    -o-transition: 0.3s;
    transition: 0.3s;
}
.news-hover .time {
    margin-bottom: 0.6rem;
}
.news-title {
    font-size: 28px;
    line-height: 1.25;
    letter-spacing: 0;
    margin: 0;
    -webkit-transform: translateX(-2rem);
    -ms-transform: translateX(-2rem);
    -o-transform: translateX(-2rem);
    transform: translateX(-2rem);
    -webkit-transition: 0.5s ease;
    -o-transition: 0.5s ease;
    transition: 0.5s ease;
}
.news-description {
    opacity: 0;
    margin-bottom: 0;
    line-height: 1.71;
    margin-top: 10%;
    -webkit-transform: translateY(-2rem);
    -ms-transform: translateY(-2rem);
    -o-transform: translateY(-2rem);
    transform: translateY(-2rem);
    -webkit-transition: 0.5s 0.3s ease;
    -o-transition: 0.5s 0.3s ease;
    transition: 0.5s 0.3s ease;
}
.news-hover .read-more {
    position: absolute;
    opacity: 0;
    bottom: 2.7rem;
}
.read-more {
    font-weight: 600;
}
.news-item:hover .news-hover {
    background-color: #272727;
}
.news-item:hover .hover-border::before,
.news-item:hover .hover-border::after,
.news-item:hover .hover-border div::before,
.news-item:hover .hover-border div::after {
    -webkit-transform: translateX(0);
    -ms-transform: translateX(0);
    -o-transform: translateX(0);
    transform: translateX(0);
}
.news-item:hover .news-hover .content {
    opacity: 1;
}
.news-item:hover .news-hover .news-title,
.news-item:hover .news-hover .news-description {
    opacity: 1;
    -webkit-transform: translateY(0);
    -ms-transform: translateY(0);
    -o-transform: translateY(0);
    transform: translateY(0);
}
.news-item:hover .news-hover .read-more {
    opacity: 1;
}
.js-isotope {
    overflow: hidden;
}
.filter-content-2 {
    margin-bottom: 5.9rem;
}
.filter-content-2 .filter li,
.filter-content-3 .filter li,
.filter-content-4 .filter li {
    margin-right: 4rem;
}
.filter-content-3 {
    margin-bottom: 4.6rem;
}
.filter-content-4 {
    margin: 6rem 0 9rem;
}
.grid-items {
    margin:-30px -10px -15px 5px;
}
.grid-items:after {
    content: '';
    clear: both;
    display: block;
}
.grid-item {
float:left;
    padding: 30px 10px 15px 10px; 
}

.project-hover-2 {
    position: absolute;
    z-index: 2;
    left: 10;
    top: 0;
    width:100%;
    height: 100%;
    padding: 2.71rem;

}
.project-hover-2 .icon-plus {
    opacity: 0;
    position: absolute;
    color: #000;
    right: 2.71rem;
    font-size: 3rem;
   
}
.project-hover-2 .project-title {
    opacity: 0;
    position: absolute;
    bottom: 2.71rem;
    color: #fff;
   
}
.project-item:hover .project-hover-2 {
   
}
.project-item:hover .project-hover-2 .project-title,
.project-item:hover .project-hover-2 .icon-plus {

   }
.read-more a { text-decoration:none }
.read-more a:hover { text-decoration:none }
.news-item img { margin-bottom:15px }

@media (max-width: 480px) {
  .grid-item {
    padding: 30px 25px 15px 10px; 
}
		}