.artistList {
  display: flex;
  flex-wrap: wrap;
}

.artistList>p {
  width: calc( (100% - ( 14px * 1 ) ) / 2 );
  transition: .5s;
  background: linear-gradient(to left, #fff,#fff 50%,#00477f 50%,#00477f) right/200% 200% no-repeat;
}


@media screen and (max-width: 899px){
  .artistList>p:nth-child(2n+1) {
    margin-right: 14px;
  }
}

@media screen and (min-width: 900px){
  .artistList>p {
    width: calc( (100% - ( 14px * 3 ) ) / 4 );
  }

  .artistList>p:not(:nth-child(4n)) {
    margin-right: 14px;
  }
}

.artistList>p a{
  text-align: center;
  display: flex;
  position: relative;
  justify-content: center;
  align-items: center;
  height: 100%;
  min-height: 80px;
}

.artistList>p:hover{
  background-position: left;
}