@media caroussel ressouce image

web/themes/custom/eql/scss/pages/_ressource-type-en-images.scss

@@ -8,6 +8,9 @@
       @media screen and (min-width:1100px) {
           display: flex;
       }
+      @media screen and (max-width: 810px) {
+        margin-left: 0;
+      }
       .block {
         margin-left: 0;
       }
@@ -176,12 +179,75 @@
             
             
         }
+        @media screen and (max-width: 810px) {
+          .carousel {
+            display: flex;
+            flex-direction: column;
+            gap: 2rem;
+            align-items: center;
+            width: 100vw;
+            .main-image-block{
+              width: 90%;
+            }
+          }
+        
+          .thumbnails-wrapper {
+            width: 100%;
+            display: flex !important;
+            flex-direction: row !important; /* 👈 corrige l'orientation */
+            justify-content: center;
+            align-items: center;
+            overflow-x: auto;
+            overflow-y: hidden;
+            max-height: none;
+            padding: 1rem 0;
+            position: relative;
+          }
+        
+          .thumbnails {
+            display: flex !important;
+            flex-direction: row !important; /* 👈 force l'alignement horizontal */
+            gap: 0.8  rem !important;
+            overflow-x: auto;
+            overflow-y: hidden;
+            scroll-behavior: smooth;
+            padding: 0 1rem;
+            max-width: 100%;
+            flex-wrap: nowrap;
+        
+            &::-webkit-scrollbar {
+              display: none;
+            }
+        
+            img {
+              width: 60px;
+              height: 45px;
+              flex-shrink: 0; /* évite l’écrasement */
+            }
+          }
+        
+          .thumb-arrow {
+            display: none; /* inutile si scroll horizontal */
+          }
+        }
+        
+        
+        
         // Masquer les images Drupal originales (facultatif)
         .field__items {
           display: none;
         }
       }
-    
+      .block-entity-fieldnodefield-type-de-ressource,
+      .block-entity-fieldnodetitle,
+      .block-entity-fieldnodefield-edition,
+      .block-entity-fieldnodefield-auteur-s-,
+      .block-entity-fieldnodefield-date-de-parution,
+      .block-entity-fieldnodefield-mots-clefs{
+        @media screen and (max-width: 810px) {
+          margin-left: 7%;
+        }
+      }
     }      
   }