_sass/_animations.scss

/* ==========================================================================
   Animations
   ========================================================================== */

/*
   Wiggle animation
   ========================================================================== */

@include keyframes(wiggle) {
	25%, 50%, 75%, 100% { @include transform-origin(top center); }
	25% { @include transform(rotate(8deg)); }
	50% { @include transform(rotate(-4deg)); }
	75% { @include transform(rotate(2deg)); }
	100% { @include transform(rotate(0deg)); }
}

/*
   Pop animation
   ========================================================================== */

@include keyframes(pop) {
	50% { @include transform(scale(1.1)); }
	100% { @include transform(scale(1)); }
}

/*
   Hang animation
   ========================================================================== */

@include keyframes(hang) {
	50% { @include transform(translateY(-3px)); }
	100% { @include transform(translateY(-6px)); }
}
.hang {
	display: inline-block;
	@include animation-name(hang);
	@include animation-duration(0.5s);
	@include animation-timing-function(linear);
	@include animation-iteration-count(infinite);
	@include animation-direction(alternate);
}