div {
  margin: 50px auto;
  width: 150px;
  height: 150px;
  background: black;
  transition-property: background, width;
  transition-timing-function: ease-in-out, ease-out;
  transition-duration: 2s, 1s;
  transition-delay: 1s, 0s;
  
/*   equivalent to this: */
/*   transition: background 2s ease-in-out 1s, width 1s ease-out; */
}
div:hover {
  background: red;
  width: 300px;
}