Cómo crear un efecto de rebote CSS3

Estoy tratando de crear un efecto de rebote al final de la animación sin usar ningún código de terceros o javascript. No tengo idea de cómo hacer esto solo usando CSS puro.

Esto es lo que tengo hasta ahora:

HTML:

<div></div>
<div></div>
<div></div>

CSS:

div {
    background:  tomato;
    width: 100px;
    height: 100px;
    margin-bottom: 10px;
    transition: transform 0.3s ease-in;
    transform-origin: top left;
}
div:hover { 
    -webkit-transform: scale3d(5, 5, 5);
    transform: scale3d(5);
}

MANIFESTACIÓN

Respuestas a la pregunta(2)

Su respuesta a la pregunta