diff --git a/src/assets/css/pages/Thematiques.scss b/src/assets/css/pages/Thematiques.scss
index 0eb7af7..70ddfeb 100644
--- a/src/assets/css/pages/Thematiques.scss
+++ b/src/assets/css/pages/Thematiques.scss
@@ -4,7 +4,7 @@
 	}
 
 	h1 {
-		@apply text-9xl;
+		@apply text-7xl sm:text-8xl  md:text-9xl  xl:text-9xl;
 	}
 
 	--swiper-pagination-bullet-horizontal-gap: 8px;
@@ -15,37 +15,61 @@
 		opacity: 0.9;
 		scale: 1.2;
 	}
+	.page-title__span-construction {
+		@apply xl:text-5xl;
+		translate: 0 -20%;
+		@screen xl {
+			translate: 0 -50%;
+		}
+	}
 	.swiper-pagination-bullet-active {
 		border: 2px solid white;
 		scale: 1.5;
 		opacity: 1;
 	}
 	.swiper-pagination {
-		bottom: -120px !important;
+		bottom: -100px !important;
+		@screen md {
+			bottom: -120px !important;
+		}
 	}
 	.swiper-button-prev,
 	.swiper-button-next {
 		@apply bg-construction p-2 rounded-full w-auto;
+
+		// translate: 0 -100%;
 		aspect-ratio: 1/1;
 		&:after {
 			@apply w-8 h-8 block bg-contain bg-no-repeat bg-center;
 			content: "";
 			background-image: url("../../img/icons/arrow-next.svg");
 		}
+
+		@media screen and (max-width: 1279px) {
+			top: unset;
+			bottom: 0;
+			translate: 0 50%;
+		}
+		@screen sm {
+			bottom: 50% !important;
+		}
 	}
 	.swiper-button-prev {
-		left: -140px;
+		@apply lg:left-[-140px];
 		&:after {
 			transform: rotate(180deg);
 		}
 	}
 	.swiper-button-next {
-		right: -140px;
+		@apply lg:right-[-140px];
 	}
 	.swiper-container {
-		@apply mt-32 pb-24 w-full mx-auto overflow-visible;
-		max-width: 1200px;
-		width: calc(100% - 280px);
+		@apply lg:mt-20 xl:mt-32 pb-48 xl:pb-24 w-full mx-auto overflow-visible;
+		max-width: 1100px;
+		bottom: 0;
+		@screen lg {
+			width: calc(100% - 280px);
+		}
 
 		.swiper-slide {
 			@apply h-auto text-center;
@@ -60,6 +84,7 @@
 			width: 100%;
 			border-width: 28px;
 			aspect-ratio: 18/9;
+			min-height: 250px;
 
 			img {
 				@apply h-full w-full object-cover object-center;
@@ -67,14 +92,14 @@
 		}
 
 		&__title {
-			@apply my-0  absolute top-0 left-1/2 bg-construction px-2 py-1;
-			transform: translateX(-50%) translateY(-50%);
+			@apply my-0  absolute top-0 left-1/2 bg-construction px-6 py-2;
+			transform: translateX(-50%) translateY(-30%);
 			transition: transform 0.3s ease-in-out;
 			&:hover {
-				transform: translateX(-50%) scale(1.2);
+				transform: translateX(-50%) translateY(-50%) scale(1.2);
 			}
 			a {
-				@apply text-slate-900 text-4xl text-zuume no-underline block;
+				@apply text-slate-900 text-3xl text-zuume no-underline block;
 			}
 		}