.navigation-wrapper {
  background-color: #ffffff;
}
.navigation {
  display: flex;
  flex-direction: row;
  height: 3.5rem;
  text-align: center;
}
.navigation > li {
  flex: 1;
  padding-top: 0.5rem;
  font-size: 0;
  transition: all 300ms linear;
}
.navigation a {
  height: 100%;
}

.navigation .icon.icon-home,
.navigation .icon.icon-search,
.navigation .icon.icon-heart,
.navigation .icon.icon-user {
  background-position-y: -21px !important;
  transition: all 200ms linear;
}
.navigation .icon.icon-home:hover,
.navigation .icon.icon-search:hover,
.navigation .icon.icon-heart:hover,
.navigation .icon.icon-user:hover {
  background-position-y: -27px !important;
}