diff --git a/src/main/webapp/app/view/CustomCarousel.js b/src/main/webapp/app/view/CustomCarousel.js
index 6c12d4c59fa8d819ffa1686d4aa2229fbe74b1f0..ffd525631d62f37c27deed37144fe268fb783cd0 100755
--- a/src/main/webapp/app/view/CustomCarousel.js
+++ b/src/main/webapp/app/view/CustomCarousel.js
@@ -108,6 +108,12 @@ Ext.define('ARSnova.view.CustomCarousel', {
 			screenWidth = (window.innerWidth > 0) ? window.innerWidth : screen.width,
 			showNavigationElements = screenWidth >= 840 && innerItemCount > 0 && activeIndex !== -1;
 
+		if (showNavigationElements) {
+			this.addCls('setMaxCaruselWidth');
+		} else {
+			this.removeCls('setMaxCaruselWidth');
+		}
+
 		if (showNavigationElements && activeIndex !== 0) {
 			this.leftArrow.removeCls('hidden');
 		} else {
diff --git a/src/main/webapp/resources/sass/_theme.scss b/src/main/webapp/resources/sass/_theme.scss
index 7195e0df26229a03f785b77bd506c92c32d39aaf..7df95f0fa844ef22f166f8a64724eae0fc4f35f2 100644
--- a/src/main/webapp/resources/sass/_theme.scss
+++ b/src/main/webapp/resources/sass/_theme.scss
@@ -207,7 +207,8 @@ $statistics-incorrect-color: $brand-danger;
 $statistics-abstention-color: $default-grey-color;
 
 
-/** carousel indicator and navigation color configuration **/
+/** carousel width, indicator and navigation configuration **/
+$carousel-inner-max-width: 85%;
 $carousel-indicator-color: $brand-primary;
 $carousel-indicator-active-color: $brand-secondary;
 $carousel-indicator-unanswered-question-color: $brand-warning;
diff --git a/src/main/webapp/resources/sass/app/_general.scss b/src/main/webapp/resources/sass/app/_general.scss
index 8155b5e20184ace4258d6e7869a7315e81f5da85..bcb28003a5f0fee1e196778ca63526b2ac7a382a 100644
--- a/src/main/webapp/resources/sass/app/_general.scss
+++ b/src/main/webapp/resources/sass/app/_general.scss
@@ -726,3 +726,9 @@ code {
 		margin: 8px;
 	}
 }
+
+.setMaxCaruselWidth {
+	.x-container.x-form {
+		max-width: $carousel-inner-max-width;
+	}
+}