Use CSS Animation to Change the Hover State of a Button-1

What syntax is wrong here for this challenge?
/
/
/
button:hover {
animation-name: background-color;
animation-duration: 500ms;
}
@keyframe background-color {
100%
background-color: #4791d0
}
/
/
/

When you define the keyframe, you should define all the steps you want, like this:

@keyframe background-color {
  0% {background-color:red}
  25% {background-color:blue}
  //and so on until 100%
}

It makes no sense to jump directly to 100%. In this case you are not defining an animation. Animation involves at least two states.