For everyone who is asking the css for 7 sliders...
<div style="position: relative; background: rgb(248, 249, 250);"><div id="slider">
<figure>
<a href="IF YOU WANT TO ADD A LINK TO SLIDE THAN PLACE IT HERE"> <img src="IMAGE SOURCE LINK" ></a>
<img src="2ND IMAGE SOURCE LINK">
<img src="3RD IMAGE SOURCE LINK">
<img src="4TH IMAGE SOURCE LINK">
<img src="5TH IMAGE SOURCE LINK">
<img src="6TH IMAGE SOURCE LINK">
<img src="7TH IMAGE SOURCE LINK">
</figure>
</div>
CSS CODE
/* slideshow CSS on Admin Setting > Custom CSS */
@keyframes slideshow {
7% {left: 0;}
14% {left: 0;}
21% {left: -100%;}
28% {left: -100%;}
35% {left: -200%;}
42% {left: -200%;}
50% {left: -300%;}
57% {left: -300%;}
64% {left: -400%;}
71% {left: -400%;}
78% {left: -500%;}
85% {left: -500%;}
92% {left: -600%;}
100% {left: -600%;}
}
#slider{overflow:hidden;width:50%;margin:5px auto; border: 5px solid transparent;border-radius: 10px;}
#slider figure img{width:20%;float:left;}
#slider figure{position:relative;width:500%;margin:0;left:0;text-align:left;animation:15s slideshow infinite}
@media screen and (max-width: 767px) {#slider {overflow: hidden; width: 100%; margin: 0 auto;}}
