diff --git a/projects/frontend/src/styles/components/carousel.sass b/projects/frontend/src/styles/components/carousel.sass
index 227bdd0..e57f4d5 100644
--- a/projects/frontend/src/styles/components/carousel.sass
+++ b/projects/frontend/src/styles/components/carousel.sass
@@ -24,6 +24,9 @@
   display: flex
   flex-direction: row
 
+.p-carousel-item
+  display: flex
+
 .p-carousel-indicator-list
   display: flex
   flex-direction: row
diff --git a/projects/frontend/src/views/gallery/gallery-view.vue b/projects/frontend/src/views/gallery/gallery-view.vue
index d561a54..abc7629 100644
--- a/projects/frontend/src/views/gallery/gallery-view.vue
+++ b/projects/frontend/src/views/gallery/gallery-view.vue
@@ -51,6 +51,13 @@ const currentSelection = defineModel('currentSelection', { type: Number, default
 const currentUrl = computed(() => (resolved.value as GalleryEntryWithVariants).variants[currentSelection.value].url)
 const currentAlt = computed(() => (resolved.value as GalleryEntryWithVariants).variants[currentSelection.value].alternativeText)
 const currentCaption = computed(() => (resolved.value as GalleryEntryWithVariants).variants[currentSelection.value].caption)
+const carouselResponsiveOptions = [
+  {
+    breakpoint: '800px',
+    numVisible: 3,
+    numScroll: 1,
+  },
+]
 
 const onVariantSelected = (event: Event, id: number) => {
   currentSelection.value = id
@@ -86,6 +93,7 @@ onMounted(async () => {
           :value='variants'
           :numVisible='5'
           :numScroll='5'
+          :responsiveOptions='carouselResponsiveOptions'
         )
           template(
             #item='slotProps'