.hobby-item{
  width: 32%;
  height: auto;
  margin: 10px;
  display: flex;
  flex-direction: column;
  justify-content: flex-start;
  align-items: center;
  padding: 0;
  text-align: center;
  background-size: cover;
  background-repeat: no-repeat;
  background-position: center bottom;
}

.hobby-item img{
    width: 100%;
    filter: grayscale(100);
    -webkit-filter: grayscale(100);
    transition: filter .75s linear;
}

.hobby-item img:hover{
    width: 100%;
    filter: grayscale(0);
    -webkit-filter: grayscale(0);
    transition: filter .75s linear;
}

@keyframes grayscale{
    0%{
        filter: grayscale(100);
        -webkit-filter: grayscale(100);
    }
    100%{
        filter: grayscale(0);
        -webkit-filter: grayscale(0);
    }
}