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 3b898de..06e1849 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
@@ -5803,6 +5803,44 @@ main {
     font-size: 1rem;
   }
 }
+#ressources .layout-content .content_container .views-element-container .view-rows-wrapper.type-Les-Perspectives-Quartiers-de-demain .views-row {
+  width: 22%;
+  padding: 0.5rem;
+}
+@media (max-width: 810px) {
+  #ressources .layout-content .content_container .views-element-container .view-rows-wrapper.type-Les-Perspectives-Quartiers-de-demain .views-row {
+    width: 50%;
+  }
+}
+#ressources .layout-content .content_container .views-element-container .view-rows-wrapper.type-Les-Perspectives-Quartiers-de-demain .views-row h2 {
+  margin-bottom: 0.2rem;
+}
+#ressources .layout-content .content_container .views-element-container .view-rows-wrapper.type-Les-Perspectives-Quartiers-de-demain .views-row .views-field-field-date-ressource {
+  padding-top: 0.3rem;
+}
+#ressources .layout-content .content_container .views-element-container .view-rows-wrapper.type-Les-Perspectives-Quartiers-de-demain .views-row .views-field-body-1 p {
+  margin-top: 0.2rem;
+  margin-bottom: 0.2rem;
+}
+#ressources .layout-content .content_container .views-element-container .view-rows-wrapper.type-Les-Perspectives-Quartiers-de-demain .views-row .views-field-field-documents a,
+#ressources .layout-content .content_container .views-element-container .view-rows-wrapper.type-Les-Perspectives-Quartiers-de-demain .views-row .views-field-field-liens a {
+  display: inline-flex;
+  align-items: center;
+  color: white;
+  background: black;
+  text-transform: uppercase;
+  font-size: 0.4rem;
+  padding: 0.1rem 0.5rem;
+  padding-right: 0rem;
+}
+#ressources .layout-content .content_container .views-element-container .view-rows-wrapper.type-Les-Perspectives-Quartiers-de-demain .views-row .views-field-field-documents a::after,
+#ressources .layout-content .content_container .views-element-container .view-rows-wrapper.type-Les-Perspectives-Quartiers-de-demain .views-row .views-field-field-liens a::after {
+  display: inline-flex;
+  content: url("../img/noun-arrow-to-right.svg");
+  padding-right: 0.1rem;
+  padding-left: 0.1rem;
+  height: 25px;
+}
 
 .type-documentation .views-field-body-1,
 .type-documentation .views-field-field-images,
diff --git a/web/themes/custom/quartiers_de_demain/src/assets/scss/pages/ressources.scss b/web/themes/custom/quartiers_de_demain/src/assets/scss/pages/ressources.scss
index 003d0f4..7935bf9 100644
--- a/web/themes/custom/quartiers_de_demain/src/assets/scss/pages/ressources.scss
+++ b/web/themes/custom/quartiers_de_demain/src/assets/scss/pages/ressources.scss
@@ -362,6 +362,45 @@
                             
                         }
                     }
+                    &.type-Les-Perspectives-Quartiers-de-demain{
+                        
+                        .views-row{
+                            width: 22%;
+                            padding: 0.5rem;
+
+                            @media(max-width: 810px){
+                                width: 50%;
+                            }
+                            h2{margin-bottom: 0.2rem;}
+                            .views-field-field-date-ressource{
+                                padding-top: 0.3rem;
+                            }
+                            .views-field-body-1 p{
+                                margin-top: 0.2rem;
+                                margin-bottom: 0.2rem;
+                            }
+                            .views-field-field-documents a,
+                            .views-field-field-liens a{
+
+                                display: inline-flex;
+                                align-items: center;
+                                color: white;
+                                background: black;
+                                text-transform: uppercase;
+                                font-size: 0.4rem;
+                                padding: 0.1rem 0.5rem;
+                                padding-right: 0rem;
+                                &::after{
+                                    display: inline-flex;
+                                    content: url("../img/noun-arrow-to-right.svg");
+                                    padding-right: 0.1rem;
+                                    padding-left: 0.1rem;
+                                    height: 25px;
+                                }
+                            }
+
+                        }
+                    }
 
                 }
                 // }