.z-posts-grid{
  margin: 30px 0;
  .post-item{
    float: left;
    margin-bottom: 20px;
    &:hover{
      .image{
        -webkit-box-shadow: 0 0 10px 0 rgba(0,0,0,0.5);
        box-shadow: 0 0 10px 0 rgba(0,0,0,0.5);
      }
    }
    @media (min-width: 960px){
      width: 30%;
      margin-right: 5%;
      &:nth-child(3n){
        margin-right: 0;
      }
    }
    &.post-item-video{
      .image{
        a{
          color: #fff;
        }
      }
      i {
        position: absolute;
        top: 50%;
        left: 50%;
        transform: translate(-50%, -50%);
        font-size: 60px;
      }
    }
    .image{
      @include transition;
      height: 300px;
      border-radius: 3px;
      background:{
        color: #eee;
        size: cover;
        position: center;
      }
      position: relative;
      @media (min-width: 960px){
        height: 250px;
      }
      a{
        display: block;
        position: absolute;
        top: 0;
        left: 0;
        width: 100%;
        height: 100%;
      }
    }
    h2,p{
      text-align: center;
    }
  }
}