diff --git a/web/themes/custom/eql/css-compiled/styles.css b/web/themes/custom/eql/css-compiled/styles.css
index 6770b15..1b0d7c1 100644
--- a/web/themes/custom/eql/css-compiled/styles.css
+++ b/web/themes/custom/eql/css-compiled/styles.css
@@ -219,16 +219,13 @@ a {
   font-size: 2rem; }
 
 .block-views-blockactus-blocks-pages-block-1 {
-  background-color: #09398b;
-  padding: 1rem; }
+  background-color: #09398b; }
   .block-views-blockactus-blocks-pages-block-1 .view-content {
-    display: flex;
-    flex-direction: row;
-    padding-left: 8rem;
-    padding-right: 4rem;
+    display: grid;
+    grid-template-columns: 1fr repeat(4, 2fr) 1fr;
     margin: auto; }
-    .block-views-blockactus-blocks-pages-block-1 .view-content .views-row {
-      width: 25%; }
+    .block-views-blockactus-blocks-pages-block-1 .view-content .views-row:nth-of-type(1) {
+      grid-column: 2; }
     .block-views-blockactus-blocks-pages-block-1 .view-content .node-type-actualite {
       color: white;
       line-height: 1.5rem;
diff --git a/web/themes/custom/eql/scss/pages/_home.scss b/web/themes/custom/eql/scss/pages/_home.scss
index c664248..e008d4a 100644
--- a/web/themes/custom/eql/scss/pages/_home.scss
+++ b/web/themes/custom/eql/scss/pages/_home.scss
@@ -29,20 +29,30 @@
 
 .block-views-blockactus-blocks-pages-block-1{
     background-color: $blue-dark;
-    padding: 1rem;
+    // padding: 1rem;
 
 
     .view-content{
-        display: flex;
-        flex-direction: row;
+        // display: flex;
+        // flex-direction: row;
+        display: grid;
+        grid-template-columns: 1fr repeat(4, 2fr) 1fr;
+        // grid-template-areas: "margin-left actu1 actu2 actu3 actu4 margin-right";
         // justify-content: space-between;
-        padding-left: 8rem;
-        padding-right: 4rem;
+        // padding-left: 8rem;
+        // padding-right: 4rem;
         margin: auto;
-        .views-row{
-            width: 25%;
-        }
+        .views-row:nth-of-type(1) { grid-column: 2; }
+        // {
+            // width: 25%;
+            // :nth-of-type(1) { grid-column: 2; } // marche pas, la première actu se mets dans la 1re colu
+            // :nth-of-type(2) { grid-area: actu2; }
+            // :nth-of-type(3) { grid-area: actu3; }
+            // :nth-of-type(4) { grid-area: actu4; }
+        // }
         .node-type-actualite{
+
+            // grid-column: 2 / span 5;
             color: $white;
             line-height: 1.5rem;
             padding: 0.5rem;