diff --git a/web/themes/custom/quartiers_de_demain/dist/assets/css/bundle.css b/web/themes/custom/quartiers_de_demain/dist/assets/css/bundle.css
index c215d40..2ab0fe6 100644
--- a/web/themes/custom/quartiers_de_demain/dist/assets/css/bundle.css
+++ b/web/themes/custom/quartiers_de_demain/dist/assets/css/bundle.css
@@ -3275,11 +3275,13 @@ main {
 #lessites .content_container #block-quartiers-de-demain-titredepage {
   margin-top: 1rem;
   width: fit-content;
+  margin-left: 10%;
 }
 @media (max-width: 810px) {
   #lessites .content_container #block-quartiers-de-demain-titredepage {
     margin-top: 10rem;
     grid-column: 2/span 9;
+    margin-left: 0;
   }
 }
 #lessites .content_container #block-quartiers-de-demain-titredepage h1 {
@@ -3290,28 +3292,42 @@ main {
 }
 #lessites .content_container .view {
   display: flex;
-  flex-direction: row;
+  flex-direction: column;
   flex-wrap: wrap;
   width: 100vw;
 }
 #lessites .content_container .view .header_view {
-  flex: 0 1 100%;
-  position: relative !important;
   height: fit-content;
   z-index: 0;
   width: 100vw;
   margin-bottom: 2rem;
 }
+@media (max-width: 1100px) {
+  #lessites .content_container .view .header_view {
+    flex: 0 1 100%;
+    position: relative !important;
+  }
+}
 #lessites .content_container .view .header_view #block-sitesmap-block {
-  margin: auto;
   width: 30vw;
+  height: fit-content;
+  top: 250px;
+  position: fixed;
+}
+@media (max-width: 1100px) {
+  #lessites .content_container .view .header_view #block-sitesmap-block {
+    margin: auto;
+    width: 30vw;
+    position: relative !important;
+    top: 0px;
+  }
 }
 #lessites .content_container .view .header_view #block-sitesmap-block #sites-map-container {
   width: 100%;
 }
 @media (max-width: 810px) {
   #lessites .content_container .view .header_view #block-sitesmap-block #sites-map-container {
-    height: 300px;
+    height: fit-content;
   }
 }
 #lessites .content_container .view .views-row-wrapper {
@@ -3321,13 +3337,21 @@ main {
   justify-content: center;
   width: 60%;
   margin: auto;
-  padding-left: 4rem;
-  gap: 20px;
+  padding-left: 10%;
+  gap: 25px;
+  margin-right: 10%;
+}
+@media (max-width: 1100px) {
+  #lessites .content_container .view .views-row-wrapper {
+    padding-left: 0;
+    margin-right: auto;
+    width: 80%;
+  }
 }
 #lessites .content_container .view .views-row-wrapper .views-row {
   width: 18%;
   margin-bottom: 2rem;
-  font-size: 0.55rem;
+  font-size: 0.4rem;
 }
 @media (max-width: 810px) {
   #lessites .content_container .view .views-row-wrapper .views-row {
@@ -3338,6 +3362,7 @@ main {
   color: rgb(7, 50, 194);
   font-family: "gilroy-bold";
   padding-top: 0.5rem;
+  font-size: 0.55rem;
 }
 #lessites .content_container .view .views-row-wrapper .views-row .views-field-field-images .field-content img {
   width: 100%;
diff --git a/web/themes/custom/quartiers_de_demain/src/assets/scss/pages/lessites.scss b/web/themes/custom/quartiers_de_demain/src/assets/scss/pages/lessites.scss
index c915f44..5fd347b 100644
--- a/web/themes/custom/quartiers_de_demain/src/assets/scss/pages/lessites.scss
+++ b/web/themes/custom/quartiers_de_demain/src/assets/scss/pages/lessites.scss
@@ -10,9 +10,12 @@ main{
         #block-quartiers-de-demain-titredepage{
             margin-top: 1rem;
             width: fit-content;
+            margin-left: 10%;
+
             @media(max-width: 810px){
                 margin-top: 10rem;
                 grid-column: 2 /span 9;
+                margin-left: 0;
             } 
 
             h1{
@@ -25,26 +28,41 @@ main{
 
         .view{
             display: flex;
-            flex-direction: row;
+            flex-direction: column;
             flex-wrap: wrap;
             width: 100vw;
 
             .header_view {
-                flex: 0 1 100%;
-                position: relative !important;
+                // flex: 0 1 100%;
+                // position: relative !important;
                 height: fit-content;
                 z-index: 0;
                 width: 100vw;
                 margin-bottom: 2rem;
+                @media (max-width:1100px) {
+                    flex: 0 1 100%;
+                    position: relative !important;
+                }
                 
                 #block-sitesmap-block{
-                    margin: auto;
+                    // margin: auto;
+                    // width: 30vw;
                     width: 30vw;
+                    height: fit-content;
+                    top: 250px;
+                    position: fixed;
+                    @media (max-width:1100px) {
+                        margin: auto;
+                        width: 30vw;
+                        position: relative !important;
+                        top: 0px;
 
+                    }
+                  
                     #sites-map-container{
                         width: 100%;
                         @media(max-width: 810px){
-                            height: 300px;
+                            height:fit-content;
                         }
                     }
                 }
@@ -58,12 +76,18 @@ main{
                 justify-content: center;
                 width: 60%;
                 margin: auto;
-                padding-left: 4rem;
-                gap: 20px;
+                padding-left: 10%;
+                gap: 25px;
+                margin-right: 10%;
+                @media (max-width:1100px) {
+                    padding-left: 0;
+                    margin-right: auto;
+                    width: 80%;
+                }
                 .views-row{
                     width: 18%;
                     margin-bottom: 2rem;
-                    font-size: 0.55rem ;
+                    font-size: 0.4rem ;
 
                     @media(max-width: 810px){
                         width: 45%;
@@ -72,6 +96,8 @@ main{
                         color: $blue_QDD;
                         font-family: "gilroy-bold";
                         padding-top: 0.5rem;    
+                        font-size: 0.55rem ;
+
                     }
                     .views-field-field-images .field-content img{
                         width: 100%;