#myButton {
  padding: 50px;
  background: yellow;
  cursor: pointer;
  transition-property: background, transform;
  transition-duration: 5s,         10s;  /*background changes over 5 seconds and rotate happens over 0.5 seconds*/
  transition-delay:    0s,         1s; /*specifies duration to wait before starting a property's transition effect when the value changes, so in this case 0 seconds are being waited/no wait before background starts changing. */
  display: inline-block;
  transform: rotate(0deg);
}

#myButton:hover {
  background: cyan;
  transform: rotate(90deg);
}