Convert the viewer into a carousel.

src/scss/viewer.scss

@@ -2,11 +2,47 @@ ha-hls-player {
   transform-style: preserve-3d;
 }
 img,video {
-  width: 100%;
-  height: 100%;
   display: block;
+  max-width: 100%;
 }
-div {
+
+div.container {
   // Keep the controls positioned relative to the video.
   position: relative;
+}
+
+.embla {
+  position: relative;
+  margin-left: auto;
+  margin-right: auto;
+}
+
+.embla__viewport {
+  overflow: hidden;
+  width: 100%;
+}
+
+.embla__container {
+  display: flex;
+  user-select: none;
+  -webkit-touch-callout: none;
+  -khtml-user-select: none;
+  -webkit-tap-highlight-color: transparent;
+}
+
+.embla__viewport.is-draggable {
+  cursor: move;
+  cursor: grab;
+}
+
+.embla__viewport.is-dragging {
+  cursor: grabbing;
+}
+
+.embla__slide {
+  position: relative;
+  min-width: 100%;
+  max-width: 100%;
+  margin-right: 10px;
+  overflow: hidden;
 }