Scale up as you grow — whether you're running one virtual machine or ten thousand.

From GPU-powered inference and Kubernetes to managed databases and storage, get everything you need to build, scale, and deploy intelligent applications.

In the code below, I have stacked five, vertically scrollable, images. I would like to replace each of these images with a slideshow carousel. In other words, I would like five stacked, horizontally scrollable slideshows, using just HTML and CSS (No JavaScript).
Does anyone know how that can be done?
Thanks!!
HTML:
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>All about Nothing</title>
<link rel="stylesheet" href="style.css">
</head>
<body>
<div>
<section class="blur-container SlideShow-1">
</section>
<section class="blur-container SlideShow-2">
</section>
<section class="blur-container SlideShow-3">
</section>
<section class="blur-container SlideShow-4">
</section>
<section class="blur-container SlideShow-5">
</section>
</div>
</body>
</html>
CSS Code:
section {
height: 100vh;
display: flex;
position: relative;
}
.blur-container {
background-size: cover !important;
background-position: center !important;
background-attachment: fixed !important;
&::before,
&::after {
top: 0px;
left: 0px;
content: '';
width: 100%;
height: 100%;
display: block;
position: absolute;
}
}
.SlideShow-1 {
background: url('https://arthur.io/img/art/jpg/000017344d60348e7/monika-bielskyte/untitled-27/large-2x/monika-bielskyte--untitled-27.webp');
}
.SlideShow-2 {
background: url('https://arthur.io/img/art/jpg/000017344d60398be/monika-bielskyte/untitled-29/large-2x/monika-bielskyte--untitled-29.webp');
}
.SlideShow-3 {
background: url('https://arthur.io/img/art/jpg/0017344d60a261291/monika-bielskyte/untitled-63/large-2x/monika-bielskyte--untitled-63.webp');
}
.SlideShow-4 {
background: url('https://arthur.io/img/art/jpg/00017344d603531b3/monika-bielskyte/untitled-19/large-2x/monika-bielskyte--untitled-19.webp');
}
.SlideShow-5 {
background: url('https://arthur.io/img/art/jpg/000017344d60398be/monika-bielskyte/untitled-29/large-2x/monika-bielskyte--untitled-29.webp');
}
Ruz
9ee5b5ed90ff4f7b9e69d1681de3b4
34bcef38725b4e6eb5224ae028f17e
Paul Hives
Inshot Pro
TiggaBiscuit
Roger Ross
Yavin Fickel
da04b39dc1b94b8395443a37a964c6
Connor
a83662b77b56408096139dd19e615a
MassiveSeaGreenAnemone