/* CSS Document */
/* CSS ANIMATIONS SHOULD ONLY BE USED FOR NON-ESSENTIAL FEATURES -- These do NOT work in IE9. Code appropriately */
.no_animation * { /* To suppress animations */
  -webkit-animation: none !important; /* Chrome, Safari 3.1+ */
	 -moz-animation: none !important; /* Firefox 3.5-15  */
	   -o-animation: none !important; /* Opera 10.50-12.00 */
		  animation: none !important; /* Firefox 16+, IE 10+, Opera 12.10+ */
}
.animation_scale_wobble {
	-webkit-animation-name: SCALE_WOBBLE;
	-webkit-animation-duration: 3s;
	-webkit-animation-timing-function: ease;
	-webkit-animation-iteration-count: infinite;

	-moz-animation-name: SCALE_WOBBLE;
	-moz-animation-duration: 3s;
	-moz-animation-timing-function: ease;
	-moz-animation-iteration-count: infinite;

	-o-animation-name: SCALE_WOBBLE;
	-o-animation-duration: 3s;
	-o-animation-timing-function: ease;
	-o-animation-iteration-count: infinite;

	animation-name: SCALE_WOBBLE;
	animation-duration: 3s;
	animation-timing-function: ease;
	animation-iteration-count: infinite;
}
.animation_squish {
	-webkit-animation-name: SQUISH;
	-webkit-animation-duration: 0.5s;
	-webkit-animation-timing-function: ease;
	-webkit-animation-iteration-count: infinite;

	-moz-animation-name: SQUISH;
	-moz-animation-duration: 0.5s;
	-moz-animation-timing-function: ease;
	-moz-animation-iteration-count: infinite;

	-o-animation-name: SQUISH;
	-o-animation-duration: 0.5s;
	-o-animation-timing-function: ease;
	-o-animation-iteration-count: infinite;

	animation-name: SQUISH;
	animation-duration: 0.5s;
	animation-timing-function: ease;
	animation-iteration-count: infinite;
}
.animation_shaky { /* Used as an extra visual in capsule.js */
	-webkit-animation-name: SHAKE_X;
	-webkit-animation-duration: 0.25s;
	-webkit-animation-timing-function: ease;
	-webkit-animation-iteration-count: infinite;

	-moz-animation-name: SHAKE_X;
	-moz-animation-duration: 0.25s;
	-moz-animation-timing-function: ease;
	-moz-animation-iteration-count: infinite;

	-o-animation-name: SHAKE_X;
	-o-animation-duration: 0.25s;
	-o-animation-timing-function: ease;
	-o-animation-iteration-count: infinite;

	animation-name: SHAKE_X;
	animation-duration: 0.25s;
	animation-timing-function: ease;
	animation-iteration-count: infinite;
}
.animation_shaky_y { /* Used as an extra visual in blending.js */
	-webkit-animation-name: SUBTLE_SHAKE_Y;
	-webkit-animation-duration: 0.25s;
	-webkit-animation-timing-function: ease;
	-webkit-animation-iteration-count: infinite;

	-moz-animation-name: SUBTLE_SHAKE_Y;
	-moz-animation-duration: 0.25s;
	-moz-animation-timing-function: ease;
	-moz-animation-iteration-count: infinite;

	-o-animation-name: SUBTLE_SHAKE_Y;
	-o-animation-duration: 0.25s;
	-o-animation-timing-function: ease;
	-o-animation-iteration-count: infinite;

	animation-name: SUBTLE_SHAKE_Y;
	animation-duration: 0.25s;
	animation-timing-function: ease;
	animation-iteration-count: infinite;
}
.animation_subtle_bob { /* used in wordchang.js, and as an extra effect in audiseg.js */
	-webkit-animation-name: SUBTLE_SHAKE_Y;
	-webkit-animation-duration: 7s;
	-webkit-animation-timing-function: ease-in-out;
	-webkit-animation-iteration-count: infinite;

	-moz-animation-name: SUBTLE_SHAKE_Y;
	-moz-animation-duration: 7s;
	-moz-animation-timing-function: ease-in-out;
	-moz-animation-iteration-count: infinite;

	-o-animation-name: SUBTLE_SHAKE_Y;
	-o-animation-duration: 7s;
	-o-animation-timing-function: ease-in-out;
	-o-animation-iteration-count: infinite;

	animation-name: SUBTLE_SHAKE_Y;
	animation-duration: 7s;
	animation-timing-function: ease-in-out;
	animation-iteration-count: infinite;
}
.animation_extreem_bob { /* used in hi_freq for the rising & falling cat */
	-webkit-animation-name: EXTRA_SHAKE_Y;
	-webkit-animation-duration: 20s;
	-webkit-animation-timing-function: linear;
	-webkit-animation-iteration-count: infinite;

	-moz-animation-name: EXTRA_SHAKE_Y;
	-moz-animation-duration: 20s;
	-moz-animation-timing-function: linear;
	-moz-animation-iteration-count: infinite;

	-o-animation-name: EXTRA_SHAKE_Y;
	-o-animation-duration: 20s;
	-o-animation-timing-function: linear;
	-o-animation-iteration-count: infinite;

	animation-name: EXTRA_SHAKE_Y;
	animation-duration: 20s;
	animation-timing-function: linear;
	animation-iteration-count: infinite;
}
.animation_decoding_bob { /* Not used */
	-webkit-animation-name: SHAKE_DECODING_Y;
	-webkit-animation-duration: 0.8s;
	-webkit-animation-timing-function: linear;
	-webkit-animation-iteration-count: infinite;

	-moz-animation-name: SHAKE_DECODING_Y;
	-moz-animation-duration: 0.8s;
	-moz-animation-timing-function: linear;
	-moz-animation-iteration-count: infinite;

	-o-animation-name: SHAKE_DECODING_Y;
	-o-animation-duration: 0.8s;
	-o-animation-timing-function: linear;
	-o-animation-iteration-count: infinite;

	animation-name: SHAKE_DECODING_Y;
	animation-duration: 0.8s;
	animation-timing-function: linear;
	animation-iteration-count: infinite;
}
.animation_eject { /* used in missionfusion to toss aliens into space */
  -webkit-animation: EJECT 2s ease-out; /* Chrome, Safari 3.1+ */
	 -moz-animation: EJECT 2s ease-out; /* Firefox 3.5-15  */
	   -o-animation: EJECT 2s ease-out; /* Opera 10.50-12.00 */
		  animation: EJECT 2s ease-out; /* Firefox 16+, IE 10+, Opera 12.10+ */
}
.animation_fade_cycle {
  -webkit-animation: FADE_CYCLE 1.5s ease infinite; /* Chrome, Safari 3.1+ */
	 -moz-animation: FADE_CYCLE 1.5s ease infinite; /* Firefox 3.5-15  */
	   -o-animation: FADE_CYCLE 1.5s ease infinite; /* Opera 10.50-12.00 */
		  animation: FADE_CYCLE 1.5s ease infinite; /* Firefox 16+, IE 10+, Opera 12.10+ */
}
.animation_constant_rotation {
  -webkit-animation: ROTATE360 5s linear infinite; /* Chrome, Safari 3.1+ */
	 -moz-animation: ROTATE360 5s linear infinite; /* Firefox 3.5-15  */
	   -o-animation: ROTATE360 5s linear infinite; /* Opera 10.50-12.00 */
		  animation: ROTATE360 5s linear infinite; /* Firefox 16+, IE 10+, Opera 12.10+ */
}
.animation_minute_rotation {
  -webkit-animation: ROTATE360 60s linear infinite; /* Chrome, Safari 3.1+ */
	 -moz-animation: ROTATE360 60s linear infinite; /* Firefox 3.5-15  */
	   -o-animation: ROTATE360 60s linear infinite; /* Opera 10.50-12.00 */
		  animation: ROTATE360 60s linear infinite; /* Firefox 16+, IE 10+, Opera 12.10+ */
}
/* storyelement.js wiggling pinatas
.animation_wiggle_rotation {
  -webkit-animation: ROTATE_WIGGLE 2.5s cubic-bezier(0.645, 0.045, 0.355, 1) infinite;
	 -moz-animation: ROTATE_WIGGLE 2.5s cubic-bezier(0.645, 0.045, 0.355, 1) infinite;
	   -o-animation: ROTATE_WIGGLE 2.5s cubic-bezier(0.645, 0.045, 0.355, 1) infinite;
		  animation: ROTATE_WIGGLE 2.5s cubic-bezier(0.645, 0.045, 0.355, 1) infinite;
}*/
.make_appear {
  -webkit-animation: APPEAR 0.5s 1 forwards; /* Chrome, Safari 3.1+ */
	 -moz-animation: APPEAR 0.5s 1 forwards; /* Firefox 3.5-15  */
	   -o-animation: APPEAR 0.5s 1 forwards; /* Opera 10.50-12.00 */
		  animation: APPEAR 0.5s 1 forwards; /* Firefox 16+, IE 10+, Opera 12.10+ */
}
.make_disappear {
  -webkit-animation: DISAPPEAR 0.5s 1 forwards; /* Chrome, Safari 3.1+ */
	 -moz-animation: DISAPPEAR 0.5s 1 forwards; /* Firefox 3.5-15  */
	   -o-animation: DISAPPEAR 0.5s 1 forwards; /* Opera 10.50-12.00 */
		  animation: DISAPPEAR 0.5s 1 forwards; /* Firefox 16+, IE 10+, Opera 12.10+ */
}
/*  APPEAR / DISAPPEAR
* To get the effect to continue after the animation is complete,
* use the forwards keyword in the animation properties
*/
@-webkit-keyframes APPEAR { 0% { visibility: inherit; opacity: 0; } 100% { opacity: 1; } }
@-moz-keyframes APPEAR { 0% { visibility: inherit; opacity: 0; } 100% { opacity: 1; } }
@-o-keyframes APPEAR { 0% { visibility: inherit; opacity: 0; } 100% { opacity: 1; } }
@keyframes APPEAR { 0% { visibility: inherit; opacity: 0; } 100% { opacity: 1; } }

@-webkit-keyframes DISAPPEAR { 0% { opacity: 1; } 100% { opacity: 0; visibility: hidden; } }
@-moz-keyframes DISAPPEAR { 0% { opacity: 1; } 100% { opacity: 0; visibility: hidden; } }
@-o-keyframes DISAPPEAR { 0% { opacity: 1; } 100% { opacity: 0; visibility: hidden; } }
@keyframes DISAPPEAR { 0% { opacity: 1; } 100% { opacity: 0; visibility: hidden; } }

@-webkit-keyframes FADE_CYCLE { 0% { opacity: 1; } 50% { opacity: 0.5; } 100% { opacity: 1; } }
@-moz-keyframes FADE_CYCLE { 0% { opacity: 1; } 50% { opacity: 0.5; } 100% { opacity: 1; } }
@-o-keyframes FADE_CYCLE { 0% { opacity: 1; } 50% { opacity: 0.5; } 100% { opacity: 1; } }
@keyframes FADE_CYCLE { 0% { opacity: 1; } 50% { opacity: 0.5; } 100% { opacity: 1; } }

@-webkit-keyframes SCALE_WOBBLE{
	0% { -webkit-transform: scale(1); }
	25% { -webkit-transform: scale(1, 0.95); }
	50% { -webkit-transform: scale(0.95, 1); }
	75% { -webkit-transform: scale(1, 0.95); }
	100% { -webkit-transform: scale(1); }
}

@-moz-keyframes SCALE_WOBBLE{
	0% { -moz-transform: scale(1); }
	25% { -moz-transform: scale(1, 0.95); }
	50% { -moz-transform: scale(0.95, 1); }
	75% { -moz-transform: scale(1, 0.95); }
	100% { -moz-transform: scale(1); }
}

@-o-keyframes SCALE_WOBBLE{
	0% { -o-transform: scale(1); }
	25% { -o-transform: scale(1, 0.95); }
	50% { -o-transform: scale(0.95, 1); }
	75% { -o-transform: scale(1, 0.95); }
	100% { -o-transform: scale(1); }
}

@keyframes SCALE_WOBBLE{
	0% { transform: scale(1); }
	25% { transform: scale(1, 0.95); }
	50% { transform: scale(0.95, 1); }
	75% { transform: scale(1, 0.95); }
	100% { transform: scale(1); }
}


@-webkit-keyframes SQUISH {
	0% { -webkit-transform: scale(1); }
	50% { -webkit-transform: scale(1.2, 0.9); }
	100% { -webkit-transform: scale(1); }
}

@-moz-keyframes SQUISH{
	0% { -moz-transform: scale(1); }
	50% { -moz-transform: scale(1.2, 0.9); }
	100% { -moz-transform: scale(1); }
}

@-o-keyframes SQUISH{
	0% { -o-transform: scale(1); }
	50% { -o-transform: scale(1.2, 0.9); }
	100% { -o-transform: scale(1); }
}

@keyframes SQUISH{
	0% { transform: scale(1); }
	50% { transform: scale(1.2, 0.9); }
	100% { transform: scale(1); }
}


@-webkit-keyframes EJECT {
	0% { opacity: 1; -webkit-transform: translateY(0) rotate(0deg) scale(1) translateX(0) }
	5% { -webkit-transform: translateY(-50px) rotate(30deg) scale(1) translateX(10px) }
	100% { opacity: 1; -webkit-transform: translateY(-200px) rotate(720deg) scale(0) translateX(100px) }
}

@-moz-keyframes EJECT {
	0% { opacity: 1; -moz-transform: translateY(0) rotate(0deg) scale(1) translateX(0) }
	5% { -moz-transform: translateY(-50px) rotate(30deg) scale(1) translateX(10px) }
	100% { opacity: 1; -moz-transform: translateY(-200px) rotate(720deg) scale(0) translateX(100px) }
}

@-o-keyframes EJECT {
	0% { opacity: 1; -o-transform: translateY(0) rotate(0deg) scale(1) translateX(0) }
	5% { -o-transform: translateY(-50px) rotate(30deg) scale(1) translateX(10px) }
	100% { opacity: 1; -o-transform: translateY(-200px) rotate(720deg) scale(0) translateX(100px) }
}

@keyframes EJECT {
	0% { opacity: 1; transform: translateY(0) rotate(0deg) scale(1) translateX(0) }
	5% { transform: translateY(-50px) rotate(30deg) scale(1) translateX(10px) }
	100% { opacity: 1; transform: translateY(-200px) rotate(720deg) scale(0) translateX(100px) }
}

@-webkit-keyframes ROTATE360 {
	0% { -webkit-transform: rotate(0deg); }
	100% { -webkit-transform: rotate(360deg); }
}
@-moz-keyframes ROTATE360 {
	0% { -moz-transform: rotate(0deg); }
	100% { -moz-transform: rotate(360deg); }
}
@-o-keyframes ROTATE360 {
	0% { -o-transform: rotate(0deg); }
	100% { -o-transform: rotate(360deg); }
}
@keyframes ROTATE360 {
	0% { transform: rotate(0deg); }
	100% { transform: rotate(360deg); }
}

/* storyelement.js wiggling pinatas
@-webkit-keyframes ROTATE_WIGGLE {
	0% { -webkit-transform: rotate(5deg); }
	50% { -webkit-transform: rotate(-5deg); }
	100% { -webkit-transform: rotate(5deg); }
}
@-moz-keyframes ROTATE_WIGGLE {
	0% { -moz-transform: rotate(5deg); }
	50% { -moz-transform: rotate(-5deg); }
	100% { -moz-transform: rotate(5deg); }
}
@-o-keyframes ROTATE_WIGGLE {
	0% { -o-transform: rotate(5deg); }
	5% { -o-transform: rotate(-5deg); }
	100% { -o-transform: rotate(5deg); }
}
@keyframes ROTATE_WIGGLE {
	0% { transform: rotate(5deg); }
	50% { transform: rotate(-5deg); }
	100% { transform: rotate(5deg); }
}
 */
@-webkit-keyframes SHAKE_X {
	0% { -webkit-transform: translateX(0%); }
	25% { -webkit-transform: translateX(-5%); }
	75% { -webkit-transform: translateX(5%); }
	100% { -webkit-transform: translateX(0%); }
}
@-moz-keyframes SHAKE_X {
	0% { -moz-transform: translateX(0%); }
	25% { -moz-transform: translateX(-5%); }
	75% { -moz-transform: translateX(5%); }
	100% { -moz-transform: translateX(0%); }
}
@-o-keyframes SHAKE_X {
	0% { -o-transform: translateX(0%); }
	25% { -o-transform: translateX(-5%); }
	75% { -o-transform: translateX(5%); }
	100% { -o-transform: translateX(0%); }
}
@keyframes SHAKE_X {
	0% { transform: translateX(0%); }
	25% { transform: translateX(-5%); }
	75% { transform: translateX(5%); }
	100% { transform: translateX(0%); }
}

@-webkit-keyframes SHAKE_Y {
	0% { -webkit-transform: translateY(0%); }
	25% { -webkit-transform: translateY(-5%); }
	75% { -webkit-transform: translateY(5%); }
	100% { -webkit-transform: translateY(0%); }
}
@-moz-keyframes SHAKE_Y {
	0% { -moz-transform: translateY(0%); }
	25% { -moz-transform: translateY(-5%); }
	75% { -moz-transform: translateY(5%); }
	100% { -moz-transform: translateY(0%); }
}
@-o-keyframes SHAKE_Y {
	0% { -o-transform: translateY(0%); }
	25% { -o-transform: translateY(-5%); }
	75% { -o-transform: translateY(5%); }
	100% { -o-transform: translateY(0%); }
}
@keyframes SHAKE_Y {
	0% { transform: translateY(0%); }
	25% { transform: translateY(-5%); }
	75% { transform: translateY(5%); }
	100% { transform: translateY(0%); }
}

@-webkit-keyframes SUBTLE_SHAKE_Y {
	0% { -webkit-transform: translateY(2%); }
	50% { -webkit-transform: translateY(-2%); }
	100% { -webkit-transform: translateY(2%); }
}
@-moz-keyframes SUBTLE_SHAKE_Y {
	0% { -moz-transform: translateY(2%); }
	50% { -moz-transform: translateY(-2%); }
	100% { -moz-transform: translateY(2%); }
}
@-o-keyframes SUBTLE_SHAKE_Y {
	0% { -o-transform: translateY(2%); }
	50% { -o-transform: translateY(-2%); }
	100% { -o-transform: translateY(2%); }
}
@keyframes SUBTLE_SHAKE_Y {
	0% { transform: translateY(2%); }
	50% { transform: translateY(-2%); }
	100% { transform: translateY(2%); }
}

@-webkit-keyframes EXTRA_SHAKE_Y {
	0% { -webkit-transform: translateY(0%); }
	25% { -webkit-transform: translateY(-100%); }
	75% { -webkit-transform: translateY(100%); }
	100% { -webkit-transform: translateY(0%); }
}
@-moz-keyframes SHAKE_Y {
	0% { -moz-transform: translateY(0%); }
	25% { -moz-transform: translateY(-100%); }
	75% { -moz-transform: translateY(100%); }
	100% { -moz-transform: translateY(0%); }
}
@-o-keyframes SHAKE_Y {
	0% { -o-transform: translateY(0%); }
	25% { -o-transform: translateY(-100%); }
	75% { -o-transform: translateY(100%); }
	100% { -o-transform: translateY(0%); }
}
@keyframes SHAKE_Y {
	0% { transform: translateY(0%); }
	25% { transform: translateY(-100%); }
	75% { transform: translateY(100%); }
	100% { transform: translateY(0%); }
}

@-webkit-keyframes SHAKE_DECODING_Y {
	0% { -webkit-transform: translateY(0%); }
	25% { -webkit-transform: translateY(-15%); }
	75% { -webkit-transform: translateY(15%); }
	100% { -webkit-transform: translateY(0%); }
}
@-moz-keyframes SHAKE_DECODING_Y {
	0% { -moz-transform: translateY(0%); }
	25% { -moz-transform: translateY(-15%); }
	75% { -moz-transform: translateY(15%); }
	100% { -moz-transform: translateY(0%); }
}
@-o-keyframes SHAKE_DECODING_Y {
	0% { -o-transform: translateY(0%); }
	25% { -o-transform: translateY(-15%); }
	75% { -o-transform: translateY(15%); }
	100% { -o-transform: translateY(0%); }
}
@keyframes SHAKE_DECODING_Y {
	0% { transform: translateY(0%); }
	25% { transform: translateY(-15%); }
	75% { transform: translateY(15%); }
	100% { transform: translateY(0%); }
}

/*
.animation_firework {  TESTING
	-webkit-animation-name: FIREWORK;
	-webkit-animation-duration: 5s;
	-webkit-animation-timing-function: ease;
	-webkit-animation-iteration-count: infinite;

	animation-name: FIREWORK;
	animation-duration: 5s;
	animation-timing-function: ease;
	animation-iteration-count: infinite;
}
@-webkit-keyframes FIREWORK {
	0% { opacity: 0; -webkit-transform: translateY(150px) rotate(-360deg) scale(0) ; }
	10% { opacity: 0.9; -webkit-transform: translateY(0%) rotate(0deg) scale(1); }
	100% { opacity: 0; -webkit-transform: translateY(100%) rotate(30deg) scale(1.5); }
}
@keyframes FIREWORK {
	0% { opacity: 0; transform: translateY(150px) rotate(-360deg) scale(0) ; }
	10% { opacity: 0.9; transform: translateY(0%) rotate(0deg) scale(1); }
	100% { opacity: 0; transform: translateY(100%) rotate(30deg) scale(1.5); }
}*/


.animation_shooting_star { /* used in capsule.js */
	-webkit-animation-name: SHOOTING_STAR;
	-webkit-animation-duration: 3s;
	-webkit-animation-timing-function: linear;
	-webkit-animation-iteration-count: 3;

	animation-name: SHOOTING_STAR;
	animation-duration: 3s;
	animation-timing-function: linear;
	animation-iteration-count: 3;
}
@-webkit-keyframes SHOOTING_STAR {
	0% { opacity: 1; -webkit-transform: translate(0px, 0px) rotate(-45deg) ; }
	100% { opacity: 0; -webkit-transform: translate(500px, 500px) rotate(-45deg); }
}
@keyframes SHOOTING_STAR {
	0% { opacity: 1; transform: translate(0px, 0px) rotate(-60deg) ; }
	100% { opacity: 0; transform: translate(500px, 500px) rotate(-60deg) ; }
}


/* sppellingsentence */
.animation_star_sparkle {
  -webkit-animation: STAR_SPARKLE 1.5s ease infinite; /* Chrome, Safari 3.1+ */
	 -moz-animation: STAR_SPARKLE 1.5s ease infinite; /* Firefox 3.5-15  */
	   -o-animation: STAR_SPARKLE 1.5s ease infinite; /* Opera 10.50-12.00 */
		  animation: STAR_SPARKLE 1.5s ease infinite; /* Firefox 16+, IE 10+, Opera 12.10+ */
}
@-webkit-keyframes STAR_SPARKLE {
	0% { opacity: 0.5; -webkit-transform: rotate(30deg) scale(0.4) ; }
	50% { opacity: 1; -webkit-transform: rotate(-30deg) scale(1); }
	100% { opacity: 0.5; -webkit-transform: rotate(30deg) scale(0.4); }
}
@-moz-keyframes STAR_SPARKLE {
	0% { opacity: 0.5; -moz-transform: rotate(30deg) scale(0.4) ; }
	50% { opacity: 1; -moz-transform: rotate(-30deg) scale(1); }
	100% { opacity: 0.5; -moz-transform: rotate(30deg) scale(0.4); }
}
@-ms-keyframes STAR_SPARKLE {
	0% { opacity: 0.5; -ms-transform: rotate(30deg) scale(0.4) ; }
	50% { opacity: 1; -ms-transform: rotate(-30deg) scale(1); }
	100% { opacity: 0.5; -ms-transform: rotate(30deg) scale(0.4); }
}
@-o-keyframes STAR_SPARKLE {
	0% { opacity: 0.5; -0-transform: rotate(30deg) scale(0.4) ; }
	50% { opacity: 1; -o-transform: rotate(-30deg) scale(1); }
	100% { opacity: 0.5; -o-transform: rotate(30deg) scale(0.4); }
}
@keyframes STAR_SPARKLE {
	0% { opacity: 0.5; transform: rotate(30deg) scale(0.4) ; }
	50% { opacity: 1; transform: rotate(-30deg) scale(1); }
	100% { opacity: 0.5; transform: rotate(30deg) scale(0.4); }
}

.sequence_girl_head{
	transform: rotate(-2deg);
	-webkit-animation: SEQUENCE_GIRL_HEAD 2s ease-in-out infinite;
	-moz-animation: SEQUENCE_GIRL_HEAD 2s ease-in-out infinite;
	-ms-animation: SEQUENCE_GIRL_HEAD 2s ease-in-out infinite;
	-o-animation: SEQUENCE_GIRL_HEAD 2s ease-in-out infinite;
	animation: SEQUENCE_GIRL_HEAD 2s ease-in-out infinite;
	-ms-transform-origin: 20% 40%;
	-webkit-transform-origin: 20% 40%;
	transform-origin: 50% 60%;
}
@-webkit-keyframes SEQUENCE_GIRL_HEAD
{

0%   {-webkit-transform: rotate(-2deg);}
50%	{-webkit-transform: rotate(10deg);}
100%  {-webkit-transform: rotate(-2deg);}
}
@-moz-keyframes SEQUENCE_GIRL_HEAD
{

0%   {-moz-transform: rotate(-2deg);}
50%	{-moz-transform: rotate(10deg);}
100%  {-moz-transform: rotate(-2deg);}
}
@-ms-keyframes SEQUENCE_GIRL_HEAD
{

0%   {-ms-transform: rotate(-2deg);}
50%	{-ms-transform: rotate(10deg);}
100%  {-ms-transform: rotate(-2deg);}
}
@-o-keyframes SEQUENCE_GIRL_HEAD
{

0%   {-o-transform: rotate(-2deg);}
50%	{-o-transform: rotate(10deg);}
100%  {-o-transform: rotate(-2deg);}
}
@keyframes SEQUENCE_GIRL_HEAD
{

0%   {transform: rotate(-2deg);}
50%	{transform: rotate(10deg);}
100%  {transform: rotate(-2deg);}
}

.sequence_page{ /* sequence.js in the showPage() */
	-webkit-animation: SEQUENCE_PAGE 4s ease-in-out;
	-moz-animation: SEQUENCE_PAGE 4s ease-in-out;
	-ms-animation: SEQUENCE_PAGE 4s ease-in-out;
	-o-animation: SEQUENCE_PAGE 4s ease-in-out;
	animation: SEQUENCE_PAGE 4s ease-in-out;
}
@-webkit-keyframes SEQUENCE_PAGE {
	0% { -webkit-transform: translateX(0%); }
	20% { -webkit-transform: translateX(-40%); }
	40% { -webkit-transform: translateX(50%); }
	60% { -webkit-transform: translateX(-20%); }
	80% { -webkit-transform: translateX(10%); }
	100% { -webkit-transform: translateX(0%); }
}
@-moz-keyframes SEQUENCE_PAGE {
	0% { -moz-transform: translateX(0%); }
	20% { -moz-transform: translateX(-40%); }
	40% { -moz-transform: translateX(50%); }
	60% { -moz-transform: translateX(-20%); }
	80% { -moz-transform: translateX(10%); }
	100% { -moz-transform: translateX(0%); }
}
@-ms-keyframes SEQUENCE_PAGE {
	0% { -ms-transform: translateX(0%); }
	20% { -ms-transform: translateX(-40%); }
	40% { -ms-transform: translateX(50%); }
	60% { -ms-transform: translateX(-20%); }
	80% { -ms-transform: translateX(10%); }
	100% { -ms-transform: translateX(0%); }
}
@-o-keyframes SEQUENCE_PAGE {
	0% { -o-transform: translateX(0%); }
	20% { -o-transform: translateX(-40%); }
	40% { -o-transform: translateX(50%); }
	60% { -o-transform: translateX(-20%); }
	80% { -o-transform: translateX(10%); }
	100% { -o-transform: translateX(0%); }
}
@keyframes SEQUENCE_PAGE {
	0% { transform: translateX(0%); }
	20% { transform: translateX(-40%); }
	40% { transform: translateX(50%); }
	60% { transform: translateX(-20%); }
	80% { transform: translateX(10%); }
	100% { transform: translateX(0%); }
}

.cherry{
	-webkit-animation: CHERRY 3s linear infinite; /* Chrome, Safari 5 */
	-moz-animation: CHERRY 3s linear infinite; /* Firefox 5-15 */
	-o-animation: CHERRY 3s linear infinite; /* Opera 12+ */
	animation: CHERRY 3s linear infinite; /* Chrome, Firefox 16+, IE 10+, Safari 5 */
}
.cherry-delay-1{
	-webkit-animation: CHERRY 3s linear infinite; /* Chrome, Safari 5 */
	-moz-animation: CHERRY 3s linear infinite; /* Firefox 5-15 */
	-o-animation: CHERRY 3s linear infinite; /* Opera 12+ */
	animation: CHERRY 3s linear infinite; /* Chrome, Firefox 16+, IE 10+, Safari 5 */
	animation-delay: 1s; /*1.3s; 1/3 of the time*/
}
.cherry-delay-2{
	-webkit-animation: CHERRY 3s linear infinite; /* Chrome, Safari 5 */
	-moz-animation: CHERRY 3s linear infinite; /* Firefox 5-15 */
	-o-animation: CHERRY 3s linear infinite; /* Opera 12+ */
	animation: CHERRY 3s linear infinite; /* Chrome, Firefox 16+, IE 10+, Safari 5 */
	animation-delay: 2s; /*2.6s; 2/3 of the time*/
}
@-webkit-keyframes CHERRY {
	/*from { -webkit-transform: rotate(0deg) translateY(25px) rotate(0deg); }
	to   { -webkit-transform: rotate(360deg) translateY(25px) rotate(-360deg); }*/
	0%  { -webkit-transform: rotate(0deg) translateX(15px) translateY(15px) rotate(0deg) scale(1); opacity: 0.9; }
	25%  { -webkit-transform: rotate(90deg) translateX(10px) translateY(10px) rotate(-90deg) scale(.8); opacity: 0.5; }
	50%  { -webkit-transform: rotate(180deg) translateX(7px) translateY(7px) rotate(-180deg) scale(.6); opacity: 0.8; }
	75%  { -webkit-transform: rotate(270deg) translateX(10px) translateY(10px) rotate(-270deg) scale(.8); opacity: 0.5; }
	100%  { -webkit-transform: rotate(360deg) translateX(15px) translateY(15px) rotate(-360deg) scale(1); opacity: 0.9; }
}

@-moz-keyframes CHERRY {
	/*from { -moz-transform: rotate(0deg) translateY(25px) rotate(0deg); }
	to   { -moz-transform: rotate(360deg) translateY(25px) rotate(-360deg); }*/
	0%  { -moz-transform: rotate(0deg) translateX(15px) translateY(15px) rotate(0deg) scale(1); opacity: 0.9; }
	25%  { -moz-transform: rotate(90deg) translateX(10px) translateY(10px) rotate(-90deg) scale(.8); opacity: 0.5; }
	50%  { -moz-transform: rotate(180deg) translateX(7px) translateY(7px) rotate(-180deg) scale(.6); opacity: 0.8; }
	75%  { -moz-transform: rotate(270deg) translateX(10px) translateY(10px) rotate(-270deg) scale(.8); opacity: 0.5; }
	100%  { -moz-transform: rotate(360deg) translateX(15px) translateY(15px) rotate(-360deg) scale(1); opacity: 0.9; }
}

@-o-keyframes CHERRY {
	/*from { -o-transform: rotate(0deg) translateY(25px) rotate(0deg); }
	to   { -o-transform: rotate(360deg) translateY(25px) rotate(-360deg); }*/
	0%  { -o-transform: rotate(0deg) translateX(15px) translateY(15px) rotate(0deg) scale(1); opacity: 0.9; }
	25%  { -o-transform: rotate(90deg) translateX(10px) translateY(10px) rotate(-90deg) scale(.8); opacity: 0.5; }
	50%  { -o-transform: rotate(180deg) translateX(7px) translateY(7px) rotate(-180deg) scale(.6); opacity: 0.8; }
	75%  { -o-transform: rotate(270deg) translateX(10px) translateY(10px) rotate(-270deg) scale(.8); opacity: 0.5; }
	100%  { -o-transform: rotate(360deg) translateX(15px) translateY(15px) rotate(-360deg) scale(1); opacity: 0.9; }
}

@keyframes CHERRY {
/*	from { transform: rotate(0deg) translateY(25px) rotate(0deg); }
	to   { transform: rotate(360deg) translateY(25px) rotate(-360deg); }*/
	/* http://stackoverflow.com/questions/26517662/css-transform-to-rotate-an-element-in-an-oval-path */
	0%  { transform: rotate(0deg) translateX(15px) translateY(15px) rotate(0deg) scale(1); opacity: 0.9; }
	25%  { transform: rotate(90deg) translateX(10px) translateY(10px) rotate(-90deg) scale(.8); opacity: 0.5; }
	50%  { transform: rotate(180deg) translateX(7px) translateY(7px) rotate(-180deg) scale(.6); opacity: 0.8; }
	75%  { transform: rotate(270deg) translateX(10px) translateY(10px) rotate(-270deg) scale(.8); opacity: 0.5; }
	100%  { transform: rotate(360deg) translateX(15px) translateY(15px) rotate(-360deg) scale(1); opacity: 0.9; }

}
@-webkit-keyframes SPACEBOOTS {
	0% { -webkit-transform: translate(2px, 1px) rotate(0deg); }
	10% { -webkit-transform: translate(-1px, -2px) rotate(-1deg); }
	20% { -webkit-transform: translate(-3px, 0px) rotate(1deg); }
	30% { -webkit-transform: translate(0px, 2px) rotate(0deg); }
	40% { -webkit-transform: translate(1px, -1px) rotate(1deg); }
	50% { -webkit-transform: translate(-1px, 2px) rotate(-1deg); }
	60% { -webkit-transform: translate(-3px, 1px) rotate(0deg); }
	70% { -webkit-transform: translate(2px, 1px) rotate(-1deg); }
	80% { -webkit-transform: translate(-1px, -1px) rotate(1deg); }
	90% { -webkit-transform: translate(2px, 2px) rotate(0deg); }
	100% { -webkit-transform: translate(1px, -2px) rotate(-1deg); }
}
.shake:hover,
.shake:focus {
	-webkit-animation-name: SPACEBOOTS;
	-webkit-animation-duration: 0.8s;
	-webkit-transform-origin: 50% 50%;
	-webkit-animation-iteration-count: infinite;
	-webkit-animation-timing-function: linear;
}
@keyframes single_rotate {
	0% {
		transform: translate(30px, 7px);
	}
	50% {
		transform: translate(45px, -7px);
	}
	100% {
		transform: translate(60px, 7px);
	}
}
@keyframes single_rotate_reverse {
	0% {
		transform: translate(30px, 7px);
	}
	50% {
		transform: translate(15px, -7px);
	}
	100% {
		transform: translate(0px, 7px);
	}
}
