/*
http://css3.bradshawenterprises.com/cfimg/

For "n" images You must define:
a=presentation time for one image
b=duration for cross fading
Total animation-duration is of course t=(a+b)*n

animation-delay = t/n or = a+b

Percentage for keyframes:

0%
a/t*100%
(a+b)/t*100% = 1/n*100%
100%-(b/t*100%)
100%

This file supports 5 pictures
n = 5
a = 8
b = 2
t = 50

0%, 16%, 20%, 96%, 100%

*/

@-webkit-keyframes perf4FadeInOut {
 0% { opacity:1; }
 16% { opacity:1; }
 20% { opacity:0; }
 96% { opacity:0; }
 100% { opacity:1; }
}
@-moz-keyframes perf4FadeInOut {
 0% { opacity:1; }
 16% { opacity:1; }
 20% { opacity:0; }
 96% { opacity:0; }
 100% { opacity:1; }
}
@-o-keyframes perf4FadeInOut {
 0% { opacity:1; }
 16% { opacity:1; }
 20% { opacity:0; }
 96% { opacity:0; }
 100% { opacity:1; }
}
@keyframes perf4FadeInOut {
 0% { opacity:1; }
 16% { opacity:1; }
 20% { opacity:0; }
 96% { opacity:0; }
 100% { opacity:1; }
}

.perf4a
{
	position: relative;
	height: 258px;
	width: 400px;
	margin: 0 auto;
	margin-bottom: 0px;
}

.perf4a img
{
	position: absolute;
	left: 0;
}

.perf4a img
{
	-webkit-animation-name: perf4FadeInOut;
	-webkit-animation-timing-function: ease-in-out;
	-webkit-animation-iteration-count: infinite;
	-webkit-animation-duration: 50s;
	-moz-animation-name: perf4FadeInOut;
	-moz-animation-timing-function: ease-in-out;
	-moz-animation-iteration-count: infinite;
	-moz-animation-duration: 50s;
	-o-animation-name: perf4FadeInOut;
	-o-animation-timing-function: ease-in-out;
	-o-animation-iteration-count: infinite;
	-o-animation-duration: 50s;
	animation-name: perf4FadeInOut;
	animation-timing-function: ease-in-out;
	animation-iteration-count: infinite;
	animation-duration: 50s;
}

#performances > img:nth-of-type(1)
{
	-webkit-animation-delay: 40s;
	-moz-animation-delay: 40s;
	-o-animation-delay: 40s;
	animation-delay: 40s;
}

#performances > img:nth-of-type(2)
{
	-webkit-animation-delay: 30s;
	-moz-animation-delay: 30s;
	-o-animation-delay: 30s;
	animation-delay: 30s;
}

#performances > img:nth-of-type(3)
{
	-webkit-animation-delay: 20s;
	-moz-animation-delay: 20s;
	-o-animation-delay: 20s;
	animation-delay: 20s;
}

#performances > img:nth-of-type(4)
{
	-webkit-animation-delay: 10s;
	-moz-animation-delay: 10s;
	-o-animation-delay: 10s;
	animation-delay: 10s;
}

#performances > img:nth-of-type(5)
{
	-webkit-animation-delay: 0s;
	-moz-animation-delay: 0s;
	-o-animation-delay: 0s;
	animation-delay: 0s;
}
