#oppside {float:right;}

div#slider { width: 100%; max-width: 1000px; overflow: hidden }
div#slider figure {
position: relative; width: 500%;
margin: 0; padding: 0; font-size: 0; text-align: left;
}

div#slider figure img { width: 20%; height: auto; float: left; }


@keyframes slidy {
0% { left: 0%; }
20% { left: 0%; }
25% { left: -100%; }
45% { left: -100%; }
50% { left: -200%; }
70% { left: -200%; }
75% { left: -300%; }
95% { left: -300%; }
100% { left: -400%; }
}



div#slider figure {
position: relative; width: 500%;
margin: 0; padding: 0; font-size: 0; left: 0; text-align: left;
animation: 10s slidy infinite;
}

@keyframes slidey {
5% { left: 0%; }
10% { left: -100%; }
15% { left: -100%; }
20% { left: -200%; }
25% { left: -200%; }
30% { left: -300%; }
35% { left: -300%; }
40% { left: -400%; }
45% { left: -400%; }
50% { left: -500%; }
55% { left: -500%; }
60% { left: -600%; }
65% { left: -600%; }
70% { left: -700%; }
75% { left: -700%; }
80% { left: -800%; }
85% { left: -800%; }
90% { left: -900%; }
95% { left: -900%; }
100% { left: -1000%; }
}

div#slider {
margin: auto;
width: 100%;
max-width: 640px;
border: solid 4px white;
-moz-border-radius: 5px 5px 5px 5px;
-webkit-border-radius: 5px 5px 5px 5px;
border-radius: 5px 5px 5px 5px;
-webkit-box-shadow: 10px 10px 13px 0px rgba(0,0,0,0.75);
-moz-box-shadow: 10px 10px 13px 0px rgba(0,0,0,0.75);
box-shadow: 10px 10px 13px 0px rgba(0,0,0,0.75);
overflow: hidden; }

div#slider figure img { width: 10%; }

div#slider figure {
position: relative;
width: 1000%;
margin: 0;
left: 0;
font-size: 0;
-webkit-animation: 60s slidey infinite;
-o-animation: 60s slidey infinite;
-moz-animation: 60s slidey infinite;
-ms-animation: 60s slidey infinite;
animation: 60s slidey infinite;
}
