.filter-options li a {
  font-size: 15px;
  padding: 7px 12px 7px 12px;
  color: rgba(56, 56, 64, 0.75);
  font-weight: 500;
  transition: all 0.2s ease-in-out;
  border-radius: 3px;
}

.filter-options li:hover a, .filter-options li.active a, .filter-options li:active a, .filter-options li:focus a {
  color: #ffffff;
  background-color: #70a67c;
}

.filter-box {
  display: none;
}

.show {
  display: block;
}

.work-container {
  margin-top: 24px;
}

.work-container .content {
  position: absolute;
  left: 0;
  right: 0;
  bottom: 0;
  overflow: hidden;
  opacity: 0;
  padding: 20px;
  transition: all 0.5s ease-in-out;
  border-radius: 6px;
  margin: 0 10px 0 10px;
}

.work-container img {
  /* Safari 6.0 - 9.0 */
  /* filter: grayscale(80%);*/
  transition: all 0.5s ease-in-out;
}

.work-container:hover:after {
  display: block;
}

.work-container:hover .content {
  opacity: 1;
  transform: translateY(-12%);
  z-index: 1;
}

.work-container:hover img {
  /* Safari 6.0 - 9.0 */
  /* filter: grayscale(0%); */
}

@media (max-width: 576px) {
  .filter-option li {
    margin-bottom: 10px;
  }
}