#frame {width:90%; height:90%; padding:2px; border:1px solid #ddd; margin:2px auto;
position:inherit;

-moz-border-radius: 10px;
-webkit-border-radius: 10px;
border-radius: 10px;
-moz-box-shadow: 0px 5px 10px rgba(0, 0, 0, 0.5);
-webkit-box-shadow: 0px 5px 10px rgba(0, 0, 0, 0.5);
box-shadow: 0px 5px 10px rgba(0, 0, 0, 0.5);
}
#gallery {width:548px; height:158px;
position:relative; overflow:hidden; border:0px solid #888;}

#gallery a img {border:0;}

#gallery img {position:absolute; left:-550px; top: 0; z-index:1; border:0;
-moz-animation-iteration-count: infinite;
-moz-animation-timing-function: linear;
-moz-animation-duration:40s;
-webkit-animation-iteration-count: infinite;
-webkit-animation-timing-function: linear;
-webkit-animation-duration:40s;
}
#gallery img.p1 {left:0;}

/* for Firefox */
@-moz-keyframes show1 {
0% {left:0;}
10% {left:0;}
11% {left:550px;}
100% {left:550px;}
}
@-moz-keyframes show2 {
0% {left:-550px;}
10% {left:-550px;}
11% {left:0;}
20% {left:0;}
21% {left:-550px;}
100% {left:-550px;}
}
@-moz-keyframes show3 {
0% {left:-550px;}
10% {left:-550px;}
11% {left:0;}
20% {left:0;}
21% {left:-550px;}
100% {left:-550px;}
}
@-moz-keyframes show4 {
0% {left:-550px;}
10% {left:-550px;}
11% {left:0;}
20% {left:0;}
21% {left:-550px;}
100% {left:-550px;}
}
@-moz-keyframes show5 {
0% {left:-550px;}
10% {left:-550px;}
11% {left:0;}
20% {left:0;}
21% {left:-550px;}
100% {left:-550px;}
}
@-moz-keyframes show6 {
0% {left:-550px;}
10% {left:-550px;}
11% {left:0;}
20% {left:0;}
21% {left:-550px;}
100% {left:-550px;}
}
@-moz-keyframes show7 {
0% {left:-550px;}
10% {left:-550px;}
11% {left:0;}
20% {left:0;}
21% {left:-550px;}
100% {left:-550px;}
}
@-moz-keyframes show8 {
0% {left:-550px;}
10% {left:-550px;}
11% {left:0;}
20% {left:0;}
21% {left:-550px;}
100% {left:-550px;}
}
@-moz-keyframes show9 {
0% {left:-550px;}
10% {left:-550px;}
11% {left:0;}
20% {left:0;}
21% {left:-550px;}
100% {left:-550px;}
}

@-moz-keyframes show10 {
0% {left:-550px;}
90% {left:-550px;}
91% {left:0;}
99% {left:0;}
100% {left:-550px;}
}

@-moz-keyframes show11 {
0% {left:550px;}
99% {left:550px;}
100% {left:0;}
}


#gallery img.p1 {
-moz-animation-name: show1;
}
#gallery img.p2 {
-moz-animation-name: show2;
}
#gallery img.p3 {
-moz-animation-name: show3;
}
#gallery img.p4 {
-moz-animation-name: show4;
}
#gallery img.p5 {
-moz-animation-name: show5;
}
#gallery img.p6 {
-moz-animation-name: show6;
}
#gallery img.p7 {
-moz-animation-name: show7;
}
#gallery img.p8 {
-moz-animation-name: show8;
}
#gallery img.p9 {
-moz-animation-name: show9;
}
#gallery img.p10 {
-moz-animation-name: show10;
}
#gallery img.p11 {
-moz-animation-name: show11;
}

#gallery:hover img {
 -moz-animation-play-state: paused;
 }

/* for Safari and Chrome */
@-webkit-keyframes show1 {
0% {left:0;}
10% {left:0;}
11% {left:320px;}
100% {left:320px;}
}
@-webkit-keyframes show2 {
0% {left:-320px;}
10% {left:-320px;}
11% {left:0;}
20% {left:0;}
21% {left:-320px;}
100% {left:-320px;}
}
@-webkit-keyframes show3 {
0% {left:320px;}
20% {left:320px;}
21% {left:0;}
30% {left:0;}
31% {left:320px;}
100% {left:320px;}
}
@-webkit-keyframes show4 {
0% {left:-320px;}
30% {left:-320px;}
31% {left:0;}
40% {left:0;}
41% {left:-320px;}
100% {left:-320px;}
}
@-webkit-keyframes show5 {
0% {left:320px;}
40% {left:320px;}
41% {left:0;}
50% {left:0;}
51% {left:320px;}
100% {left:320px;}
}
@-webkit-keyframes show6 {
0% {left:-320px;}
50% {left:-320px;}
51% {left:0;}
60% {left:0;}
61% {left:-320px;}
100% {left:-320px;}
}
@-webkit-keyframes show7 {
0% {left:320px;}
60% {left:320px;}
61% {left:0;}
70% {left:0;}
71% {left:320px;}
100% {left:320px;}
}
@-webkit-keyframes show8 {
0% {left:-320px;}
70% {left:-320px;}
71% {left:0;}
80% {left:0;}
81% {left:-320px;}
100% {left:-320px;}
}
@-webkit-keyframes show9 {
0% {left:320px;}
80% {left:320px;}
81% {left:0;}
90% {left:0;}
91% {left:320px;}
100% {left:320px;}
}

@-webkit-keyframes show10 {
0% {left:-320px;}
90% {left:-320px;}
91% {left:0;}
99% {left:0;}
100% {left:-320px;}
}

@-webkit-keyframes show11 {
0% {left:320px;}
99% {left:320px;}
100% {left:0;}
}


#gallery img.p1 {
-webkit-animation-name: show1;
}
#gallery img.p2 {
-webkit-animation-name: show2;
}
#gallery img.p3 {
-webkit-animation-name: show3;
}
#gallery img.p4 {
-webkit-animation-name: show4;
}
#gallery img.p5 {
-webkit-animation-name: show5;
}
#gallery img.p6 {
-webkit-animation-name: show6;
}
#gallery img.p7 {
-webkit-animation-name: show7;
}
#gallery img.p8 {
-webkit-animation-name: show8;
}
#gallery img.p9 {
-webkit-animation-name: show9;
}
#gallery img.p10 {
-webkit-animation-name: show10;
}
#gallery img.p11 {
-webkit-animation-name: show11;
}

#gallery:hover img {
 -webkit-animation-play-state: paused;
 }
