CSS Wobble Animation (hatching egg)

gistfile1.css

.wobble { 
	-webkit-transform-origin: 55% 70%;
	-moz-transform-origin: 50% 60%;
	-ms-transform-origin: 50% 60%;
	-o-transform-origin: 50% 60%;
	transform-origin: 50% 60%;
 }

@-webkit-keyframes wiggle {
	0% {-webkit-transform:rotate(4deg);}
	50% {-webkit-transform:rotate(-4deg);}
	100% {-webkit-transform:rotate(4deg);}
}
 
@-moz-keyframes wiggle {
	0% {-moz-transform:rotate(4deg);}
	50% {-moz-transform:rotate(-4deg);}
	100% {-moz-transform:rotate(4deg);}
}
 
@keyframes wiggle {
	0% {transform:rotate(4deg);}
	50% {transform:rotate(-4deg);}
	100% {transform:rotate(4deg);}
}
 
.wobble:hover {
	-webkit-animation: wiggle 0.3s 3;
	-moz-animation: wiggle 0.3s 3;
	animation: wiggle 0.3s 3;
}