/* EXTRA CSS3 FOR ANIMATION, JS-BASED etc */

/* ANIMATION */

.reviews_animation {
	-ms-animation-name: icon-bell;
	-webkit-animation-name: icon-bell;
		animation-name: icon-bell;
	-ms-animation-duration: 4s;
	-webkit-animation-duration: 4s;
		animation-duration: 4s;
	-ms-animation-timing-function: linear;
	-webkit-animation-timing-function: linear;
		animation-timing-function: linear;
	-ms-animation-iteration-count: 5;
	-webkit-animation-iteration-count: 5;
		animation-iteration-count: 5;
	
	/* optimisations */
	-webkit-transform-style: preserve-3d;
	-ms-transform-style: preserve-3d;
	transform-style: preserve-3d;
	will-change: transform;
}

@-ms-keyframes icon-bell {
	0% {
		-ms-transform-origin: 50% 0;
		-ms-transform: rotateZ(-15deg);
	}
	2.5% {
		-ms-transform: rotateZ(15deg);
	}
	5% {
		-ms-transform: rotateZ(-18deg);
	}
	7.5% {
		-ms-transform: rotateZ(18deg);
	}
	10% {
		-ms-transform: rotateZ(-22deg);
	}
	12.5% {
		-ms-transform: rotateZ(22deg);
	}
	15% {
		-ms-transform: rotateZ(-18deg);
	}
	17.5% {
		-ms-transform: rotateZ(18deg);
	}
	20% {
		-ms-transform: rotateZ(-12deg);
	}
	22.5% {
		-ms-transform: rotateZ(12deg);
	}
	25% {
		-ms-transform: rotateZ(0deg);
	}
}

@-webkit-keyframes icon-bell {
	0% {
		-webkit-transform-origin: 50% 0;
			transform-origin: 50% 0;
		-webkit-transform: rotateZ(-15deg);
	}
	2.5% {
		-webkit-transform: rotateZ(15deg);
	}
	5% {
		-webkit-transform: rotateZ(-18deg);
	}
	7.5% {
		-webkit-transform: rotateZ(18deg);
	}
	10% {
		-webkit-transform: rotateZ(-22deg);
	}
	12.5% {
		-webkit-transform: rotateZ(22deg);
	}
	15% {
		-webkit-transform: rotateZ(-18deg);
	}
	17.5% {
		-webkit-transform: rotateZ(18deg);
	}
	20% {
		-webkit-transform: rotateZ(-12deg);
	}
	22.5% {
		-webkit-transform: rotateZ(12deg);
	}
	25% {
		-webkit-transform: rotateZ(0deg);
	}
}

@keyframes icon-bell {
	0% {
		-webkit-transform-origin: 50% 0;
			transform-origin: 50% 0;
		-webkit-transform: rotateZ(-15deg);
			transform: rotateZ(-15deg);
	}
	2.5% {
		-webkit-transform: rotateZ(15deg);
			transform: rotateZ(15deg);
	}
	5% {
		-webkit-transform: rotateZ(-18deg);
			transform: rotateZ(-18deg);
	}
	7.5% {
		-webkit-transform: rotateZ(18deg);
			transform: rotateZ(18deg);
	}
	10% {
		-webkit-transform: rotateZ(-22deg);
			transform: rotateZ(-22deg);
	}
	12.5% {
		-webkit-transform: rotateZ(22deg);
			transform: rotateZ(22deg);
	}
	15% {
		-webkit-transform: rotateZ(-18deg);
			transform: rotateZ(-18deg);
	}
	17.5% {
		-webkit-transform: rotateZ(18deg);
			transform: rotateZ(18deg);
	}
	20% {
		-webkit-transform: rotateZ(-12deg);
			transform: rotateZ(-12deg);
	}
	22.5% {
		-webkit-transform: rotateZ(12deg);
			transform: rotateZ(12deg);
	}
	25% {
		-webkit-transform: rotateZ(0deg);
			transform: rotateZ(0deg);
	}
}


/* @MEDIA OPTIMISATION */

