/* Animations */


/* menu */

@-webkit-keyframes pulse {
	0%, 100% {
		box-shadow: 0px 0px 15px 0px white;
		background-color: rgba(255, 255, 255, 0.7);
	}	
	50% {
		box-shadow: 0px 0px 2px 0px white;
		background-color: rgba(255, 255, 255, 0.2);
	}
}

@keyframes pulse {
	0%, 100% {
		box-shadow: 0px 0px 15px 0px white;
		background-color: rgba(255, 255, 255, 0.7);
	}	
	50% {
		box-shadow: 0px 0px 2px 0px white;
		background-color: rgba(255, 255, 255, 0.2);
	}
}

#menuHighlight {
	-webkit-animation-name: pulse;
	-moz-animation-name: pulse;
	-ms-animation-name: pulse;
	-o-animation-name: pulse;
	animation-name: pulse;
	
	-webkit-animation-duration: 2000ms;
	-webkit-animation-iteration-count: infinite;
	-webkit-animation-timing-function: ease-in-out;

	animation-duration: 2000ms;
	animation-iteration-count: infinite;
	animation-timing-function: ease-in-out;
}


/* photo flash */

@-webkit-keyframes flash {
	0%, 100% {opacity: 0;}	
	40% {opacity: 1;}
}

@keyframes flash {
	0%, 100% {opacity: 0;}	
	40% {opacity: 1;}
}

.flash {
	-webkit-animation-duration: 250ms;
	-webkit-animation-iteration-count: 1;
	-webkit-animation-timing-function: linear;

	animation-duration: 250ms;
	animation-iteration-count: 1;
	animation-timing-function: linear;
	
	-webkit-animation-name: flash;
	-moz-animation-name: flash;
	-ms-animation-name: flash;
	-o-animation-name: flash;
	animation-name: flash;
}


/* speaker */

@-webkit-keyframes bump {
	0%, 24%, 50%, 100% {
		-webkit-transform: scale(1.01);
	}
	16%, 32% {
		-webkit-transform: scale(1.02);
	}
	75% {
		-webkit-transform: scale(1.02);
	}
}
@keyframes bump {
	0%, 24%, 50%, 83%, 100% {
		transform: scale(1.0);
	}
	16%, 32%, 75%, 90% {
		transform: scale(1.02);
	}
}
.bump {
	-webkit-animation-name: bump;
	animation-name: bump;

	-webkit-animation-duration: 900ms;
	-webkit-animation-iteration-count: infinite;
	-webkit-animation-timing-function: linear;

	animation-duration: 900ms;
	animation-iteration-count: infinite;
	animation-timing-function: linear;
}


/* music notes */

@-webkit-keyframes fly-northeast {
	0% {
		-webkit-transform: translate(50px, -25px);
		opacity: 0;
	}
	20% { opacity: 1; }
	100% {
		-webkit-transform: translate(450px, -100px);
		opacity: 0;
	}
}
@-webkit-keyframes fly-east {
	0% {
		-webkit-transform: translate(50px, 0px);
		opacity: 0;
	}
	20% { opacity: 1; }
	100% {
		-webkit-transform: translate(450px, -25px);
		opacity: 0;
	}
}
@-webkit-keyframes fly-southeast {
	0% {
		-webkit-transform: translate(50px, 25px);
		opacity: 0;
	}
	20% { opacity: 1; }
	100% {
		-webkit-transform: translate(450px, 100px);
		opacity: 0;
	}
}
@-webkit-keyframes fly-northwest {
	0% {
		-webkit-transform: translate(-50px, -25px);
		opacity: 0;
	}
	20% { opacity: 1; }
	100% {
		-webkit-transform: translate(-450px, -150px);
		opacity: 0;
	}
}
@-webkit-keyframes fly-west {
	0% {
		-webkit-transform: translate(-50px, 0px);
		opacity: 0;
	}
	20% { opacity: 1; }
	100% {
		-webkit-transform: translate(-450px, 25px);
		opacity: 0;
	}
}
@-webkit-keyframes fly-southwest {
	0% {
		-webkit-transform: translate(-50px, 25px);
		opacity: 0;
	}
	20% { opacity: 1; }
	100% {
		-webkit-transform: translate(-450px, 100px);
		opacity: 0;
	}
}

@keyframes fly-northeast {
	0% {
		transform: translate(50px, -25px);
		opacity: 0;
	}
	20% { opacity: 1; }
	100% {
		transform: translate(450px, -100px);
		opacity: 0;
	}
}
@keyframes fly-east {
	0% {
		transform: translate(50px, 0px);
		opacity: 0;
	}
	20% { opacity: 1; }
	100% {
		transform: translate(450px, -25px);
		opacity: 0;
	}
}
@keyframes fly-southeast {
	0% {
		transform: translate(50px, 25px);
		opacity: 0;
	}
	20% { opacity: 1; }
	100% {
		transform: translate(450px, 100px);
		opacity: 0;
	}
}
@keyframes fly-northwest {
	0% {
		transform: translate(-50px, -25px);
		opacity: 0;
	}
	20% { opacity: 1; }
	100% {
		transform: translate(-450px, -150px);
		opacity: 0;
	}
}
@keyframes fly-west {
	0% {
		transform: translate(-50px, 0px);
		opacity: 0;
	}
	20% { opacity: 1; }
	100% {
		transform: translate(-450px, 25px);
		opacity: 0;
	}
}
@keyframes fly-southwest {
	0% {
		transform: translate(-50px, 25px);
		opacity: 0;
	}
	20% { opacity: 1; }
	100% {
		transform: translate(-450px, 100px);
		opacity: 0;
	}
}



.fly-northeast {
	-webkit-animation-name: fly-northeast;
	animation-name: fly-northeast;

	-webkit-animation-duration: 2000ms;
	-webkit-animation-iteration-count: infinite;
	-webkit-animation-timing-function: ease-out;

	animation-duration: 2000ms;
	animation-iteration-count: infinite;
	animation-timing-function: ease-out;
}
.fly-east {
	-webkit-animation-name: fly-east;
	animation-name: fly-east;

	-webkit-animation-duration: 2000ms;
	-webkit-animation-iteration-count: infinite;
	-webkit-animation-timing-function: ease-out;

	animation-duration: 2000ms;
	animation-iteration-count: infinite;
	animation-timing-function: ease-out;
}
.fly-southeast {
	-webkit-animation-name: fly-southeast;
	animation-name: fly-southeast;

	-webkit-animation-duration: 2000ms;
	-webkit-animation-iteration-count: infinite;
	-webkit-animation-timing-function: ease-out;

	animation-duration: 2000ms;
	animation-iteration-count: infinite;
	animation-timing-function: ease-out;
}
.fly-northwest {
	-webkit-animation-name: fly-northwest;
	animation-name: fly-northwest;

	-webkit-animation-duration: 2000ms;
	-webkit-animation-iteration-count: infinite;
	-webkit-animation-timing-function: ease-out;

	animation-duration: 2000ms;
	animation-iteration-count: infinite;
	animation-timing-function: ease-out;
}
.fly-west {
	-webkit-animation-name: fly-west;
	animation-name: fly-west;

	-webkit-animation-duration: 2000ms;
	-webkit-animation-iteration-count: infinite;
	-webkit-animation-timing-function: ease-out;

	animation-duration: 2000ms;
	animation-iteration-count: infinite;
	animation-timing-function: ease-out;
}
.fly-southwest {
	-webkit-animation-name: fly-southwest;
	animation-name: fly-southwest;

	-webkit-animation-duration: 2000ms;
	-webkit-animation-iteration-count: infinite;
	-webkit-animation-timing-function: ease-out;

	animation-duration: 2000ms;
	animation-iteration-count: infinite;
	animation-timing-function: ease-out;
}
.delay1 {
	-webkit-animation-delay: 250ms;
	animation-delay: 250ms;
}
.delay2 {
	-webkit-animation-delay: 500ms;
	animation-delay: 500ms;
}
.delay3 {
	-webkit-animation-delay: 850ms;
	animation-delay: 850ms;
}
.delay4 {
	-webkit-animation-delay: 1300ms;
	animation-delay: 1300ms;
}
.delay5 {
	-webkit-animation-delay: 1600ms;
	animation-delay: 1600ms;
}


/* chocolate lab run cycle — 4-frame sprite inside the video frame */

@-webkit-keyframes dog-run {
	to { background-position: -1088px 0; }
}
@keyframes dog-run {
	to { background-position: -1088px 0; }
}

#doyou2 .dog-scene {
	-webkit-animation: dog-run 560ms steps(4) infinite;
	animation: dog-run 560ms steps(4) infinite;
}