Chalut chalut !

Je suis en train de travailler sur un projet personnel qui consiste à essayer de faire un site totalement animé, UNIQUEMENT en HTML et CSS !

Pour le moment, j'ai bidouillé quelque petites choses qui me mettent sur de bonnes pistes. Mais je suis confronté à un premier soucis :

http://pixelsnowis.fr/html5_css3/

En vous rendant sur la page, vous constaterez qu'au moment du clic sur l'image la plus à droite, elle pivote, entraînant avec elle l'image de gauche.
Cependant, j'aimerais que l'effet s'applique lorsque je clic, puis qu'elle reste en place tant qu'un autre clic n'a pas été fait.

J'ai fait des recherches, mais je n'ai réussi à obtenir le résultat attendu

Faut il utilise ::after ? Onclick ? Ou autre ? Comment ?