diff --git a/lacommunaute/templates/forum/forum_detail.html b/lacommunaute/templates/forum/forum_detail.html
index 8ed799320..0ac118d9b 100644
--- a/lacommunaute/templates/forum/forum_detail.html
+++ b/lacommunaute/templates/forum/forum_detail.html
@@ -48,10 +48,10 @@ <h2 class="mt-3">
                     </div>
                     <div class="col-12 col-lg-3">
                         <a href="{% url 'forum_extension:forum' parent_forum.slug parent_forum.id %}"
-                           class="matomo-event h3 text-decoration-none d-inline-block"
-                           data-matomo-category="engagement"
-                           data-matomo-action="view"
-                           data-matomo-option="forum">
+                            class="matomo-event h3 text-decoration-none d-inline-block"
+                            data-matomo-category="engagement"
+                            data-matomo-action="view"
+                            data-matomo-option="forum">
                             Les autres fiches du thème
                         </a>
                         <ul class="nav nav-tabs flex-column">
@@ -97,11 +97,11 @@ <h2 class="mt-3">
                         <div class="col-12 col-sm-auto forum-actions-block">
                             {% if user_can_add_topic %}
                                 <a href="{% url 'forum_conversation:topic_create' forum.slug forum.pk %}"
-                                   rel="nofollow"
-                                   class="btn btn-primary btn-ico matomo-event"
-                                   data-matomo-category="engagement"
-                                   data-matomo-action="contribute"
-                                   data-matomo-option="new_topic">
+                                    rel="nofollow"
+                                    class="btn btn-primary btn-ico matomo-event"
+                                    data-matomo-category="engagement"
+                                    data-matomo-action="contribute"
+                                    data-matomo-option="new_topic">
                                     <i class="ri-chat-new-line ri-lg"></i>
                                     <span>{% if forum.kind == 'NEWS' %}{% trans "New news" %}{% else %}{% trans "New topic" %}{% endif %}</span>
                                 </a>
@@ -112,10 +112,10 @@ <h2 class="mt-3">
                                 </button>
                                 <div class="dropdown-menu" aria-labelledby="id_dropdown_moderators_stats_button">
                                     <a href="{% url 'members:forum_profiles' forum.slug forum.pk %}"
-                                       class="dropdown-item matomo-event"
-                                       data-matomo-category="engagement"
-                                       data-matomo-action="view"
-                                       data-matomo-option="directory">
+                                        class="dropdown-item matomo-event"
+                                        data-matomo-category="engagement"
+                                        data-matomo-action="view"
+                                        data-matomo-option="directory">
                                         {% trans "Members" %}
                                     </a>
                                 </div>
@@ -163,16 +163,16 @@ <h2 class="mt-3">
                         </ul>
                         <div class="tab-content topiclist">
                             <div class="tab-pane fade show active" id="topics"
-                                 role="tabpanel"
-                                 aria-labelledby="topics-tab">
+                                role="tabpanel"
+                                aria-labelledby="topics-tab">
                                 {% with unread_topics=unread_topics  %}
                                     {% include "forum_conversation/topic_list.html" %} <!-- note vincentporte : to be optimized -->
                                 {% endwith %}
                             </div>
                             {% if announces %}
                                 <div class="tab-pane fade" id="announces"
-                                     role="tabpanel"
-                                     aria-labelledby="announces-tab">
+                                    role="tabpanel"
+                                    aria-labelledby="announces-tab">
                                     {% with topics=announces hide_if_empty=True unread_topics=unread_topics loadmoretopic_url=None %}
                                         {% include "forum_conversation/topic_list.html" %} <!-- note vincentporte : to be optimized -->
                                     {% endwith %}
diff --git a/lacommunaute/templates/forum_conversation/partials/post_feed_form_collapsable.html b/lacommunaute/templates/forum_conversation/partials/post_feed_form_collapsable.html
index 1f6c0128d..729ec70ad 100644
--- a/lacommunaute/templates/forum_conversation/partials/post_feed_form_collapsable.html
+++ b/lacommunaute/templates/forum_conversation/partials/post_feed_form_collapsable.html
@@ -10,12 +10,12 @@
                 <div class="row">
                     <div class="col-12 post-content-wrapper">
                         <form hx-post="{% url 'forum_conversation_extension:post_create' topic.forum.slug topic.forum.pk topic.slug topic.pk %}"
-                              hx-target="#postinfeedarea{{topic.pk}}"
-                              hx-swap="outerHTML"
-                              class="majorpoints matomo-event"
-                              data-matomo-category="engagement"
-                              data-matomo-action="contribute"
-                              data-matomo-option="post">
+                            hx-target="#postinfeedarea{{topic.pk}}"
+                            hx-swap="outerHTML"
+                            class="majorpoints matomo-event"
+                            data-matomo-category="engagement"
+                            data-matomo-action="contribute"
+                            data-matomo-option="post">
                             {% csrf_token %}
 
                             {% if post_form.non_field_errors %}
diff --git a/lacommunaute/templates/forum_conversation/partials/topic_likes.html b/lacommunaute/templates/forum_conversation/partials/topic_likes.html
index 1be8729c3..2ce464edd 100644
--- a/lacommunaute/templates/forum_conversation/partials/topic_likes.html
+++ b/lacommunaute/templates/forum_conversation/partials/topic_likes.html
@@ -5,12 +5,12 @@
     {% with topic.likes as counter %}
         {% if user.is_authenticated %}
             <button hx-post="{% url 'forum_conversation_extension:like_topic' topic.forum.slug topic.forum.pk topic.slug topic.pk %}" id="like-button{{topic.pk}}"
-                    hx-target="#likesarea{{topic.pk}}"
-                    hx-swap="outerHTML"
-                    class="btn btn-ico btn-link btn-like px-0 text-nowrap matomo-event"
-                    data-matomo-category="engagement"
-                    data-matomo-action="like"
-                    data-matomo-option="topic"
+                hx-target="#likesarea{{topic.pk}}"
+                hx-swap="outerHTML"
+                class="btn btn-ico btn-link btn-like px-0 text-nowrap matomo-event"
+                data-matomo-category="engagement"
+                data-matomo-action="like"
+                data-matomo-option="topic"
             >
                 <i class="{% if topic.has_liked %}ri-heart-3-fill{% else %}ri-heart-3-line{% endif %} me-1" aria-hidden="true"></i><span>{{counter}}</span>
             </button>
diff --git a/lacommunaute/templates/forum_conversation/topic_list.html b/lacommunaute/templates/forum_conversation/topic_list.html
index a395134b1..367246c60 100644
--- a/lacommunaute/templates/forum_conversation/topic_list.html
+++ b/lacommunaute/templates/forum_conversation/topic_list.html
@@ -32,10 +32,10 @@
                                     <i class="{% if topic.is_sticky %}ri-lightbulb-flash-line{% elif topic.is_announce %}ri-information-line{% else %}ri-record-circle-line{% endif %} ri-xl aria-hidden="true""></i>
                                 </span>
                                 <a href="{% url 'forum_conversation:topic' topic.forum.slug topic.forum.pk topic.slug topic.pk %}"
-                                   class="matomo-event"
-                                   data-matomo-category="engagement"
-                                   data-matomo-action="view"
-                                   data-matomo-option="topic">
+                                    class="matomo-event"
+                                    data-matomo-category="engagement"
+                                    data-matomo-action="view"
+                                    data-matomo-option="topic">
                                     {{ topic.subject }} {% if topic.is_locked %}&nbsp;<i class="fas fa-times-circle locked-indicator" aria-label="{% trans 'This topic is locked' %}"></i>{% endif %}
                                 </a>
                             </p>
@@ -56,13 +56,13 @@
                                         {{ topic.first_post.content.rendered|urlizetrunc_target_blank:30|img_fluid|truncatechars_html:200 }}
                                         {% if topic.first_post.content.rendered|length > 200 %}
                                             <a hx-get="{% url 'forum_conversation_extension:showmore_topic' topic.forum.slug topic.forum.pk topic.slug topic.pk %}"
-                                               id="showmoretopic-button{{topic.pk}}"
-                                               hx-target="#showmoretopicsarea{{topic.pk}}"
-                                               hx-swap="outerHTML"
-                                               class="btn btn-link p-0 mh-auto matomo-event"
-                                               data-matomo-category="engagement"
-                                               data-matomo-action="showmore"
-                                               data-matomo-option="topic"
+                                                id="showmoretopic-button{{topic.pk}}"
+                                                hx-target="#showmoretopicsarea{{topic.pk}}"
+                                                hx-swap="outerHTML"
+                                                class="btn btn-link p-0 mh-auto matomo-event"
+                                                data-matomo-category="engagement"
+                                                data-matomo-action="showmore"
+                                                data-matomo-option="topic"
                                             >
                                                 {% trans "+ show more" %}
                                             </a>
@@ -121,13 +121,13 @@
             <div id="loadmoretopicsarea{{ loadmoretopic_suffix }}" class="row mx-3 mt-md-5 justify-content-center">
                 <div class="col-12 col-md-auto">
                     <a hx-get="{% url_add_query loadmoretopic_url page=page_obj.next_page_number %}"
-                       id="loadmoretopics-button"
-                       hx-target="#loadmoretopicsarea{{ loadmoretopic_suffix }}"
-                       hx-swap="outerHTML"
-                       class="btn btn-link btn-ico btn-block justify-content-center matomo-event"
-                       data-matomo-category="engagement"
-                       data-matomo-action="loadmore"
-                       data-matomo-option="topic">
+                        id="loadmoretopics-button"
+                        hx-target="#loadmoretopicsarea{{ loadmoretopic_suffix }}"
+                        hx-swap="outerHTML"
+                        class="btn btn-link btn-ico btn-block justify-content-center matomo-event"
+                        data-matomo-category="engagement"
+                        data-matomo-action="loadmore"
+                        data-matomo-option="topic">
                         <i class="ri-loop-right-line" aria-hidden="true"></i>
                         <span>{% trans "load more topics" %}</span>
                     </a>
diff --git a/lacommunaute/templates/forum_conversation/topic_list_newsfeed.html b/lacommunaute/templates/forum_conversation/topic_list_newsfeed.html
index 4bd7352ca..fbc61531c 100644
--- a/lacommunaute/templates/forum_conversation/topic_list_newsfeed.html
+++ b/lacommunaute/templates/forum_conversation/topic_list_newsfeed.html
@@ -24,10 +24,10 @@
                             </div>
                             <p class="h4 mb-0 flex-grow-1">
                                 <a href="{% url 'forum_conversation:topic' topic.forum.slug topic.forum.pk topic.slug topic.pk %}"
-                                   class="matomo-event"
-                                   data-matomo-category="engagement"
-                                   data-matomo-action="view"
-                                   data-matomo-option="news">
+                                    class="matomo-event"
+                                    data-matomo-category="engagement"
+                                    data-matomo-action="view"
+                                    data-matomo-option="news">
                                     {{ topic.subject }} {% if topic.is_locked %}&nbsp;<i class="fas fa-times-circle locked-indicator" aria-label="{% trans 'This topic is locked' %}"></i>{% endif %}
                                 </a>
                             </p>
@@ -45,13 +45,13 @@
                                         {{ topic.first_post.content.rendered|urlizetrunc_target_blank:30|img_fluid|truncatechars_html:200 }}
                                         {% if topic.first_post.content.rendered|length > 200 %}
                                             <a hx-get="{% url 'forum_conversation_extension:showmore_topic' topic.forum.slug topic.forum.pk topic.slug topic.pk %}"
-                                               id="showmoretopic-button{{topic.pk}}"
-                                               hx-target="#showmoretopicsarea{{topic.pk}}"
-                                               hx-swap="outerHTML"
-                                               class="btn btn-link p-0 mh-auto matomo-event"
-                                               data-matomo-category="engagement"
-                                               data-matomo-action="showmore"
-                                               data-matomo-option="news"
+                                                id="showmoretopic-button{{topic.pk}}"
+                                                hx-target="#showmoretopicsarea{{topic.pk}}"
+                                                hx-swap="outerHTML"
+                                                class="btn btn-link p-0 mh-auto matomo-event"
+                                                data-matomo-category="engagement"
+                                                data-matomo-action="showmore"
+                                                data-matomo-option="news"
                                             >
                                                 {% trans "+ show more" %}
                                             </a>
@@ -84,13 +84,13 @@
             <div id="loadmoretopicsarea{{ loadmoretopic_suffix }}" class="row mx-3 mt-md-5 justify-content-center">
                 <div class="col-12 col-md-auto">
                     <a hx-get="{% url_add_query loadmoretopic_url page=page_obj.next_page_number %}"
-                       id="loadmoretopics-button"
-                       hx-target="#loadmoretopicsarea{{ loadmoretopic_suffix }}"
-                       hx-swap="outerHTML"
-                       class="btn btn-link btn-ico btn-block justify-content-center matomo-event"
-                       data-matomo-category="engagement"
-                       data-matomo-action="loadmore"
-                       data-matomo-option="topic">
+                        id="loadmoretopics-button"
+                        hx-target="#loadmoretopicsarea{{ loadmoretopic_suffix }}"
+                        hx-swap="outerHTML"
+                        class="btn btn-link btn-ico btn-block justify-content-center matomo-event"
+                        data-matomo-category="engagement"
+                        data-matomo-action="loadmore"
+                        data-matomo-option="topic">
                         <i class="ri-loop-right-line" aria-hidden="true"></i>
                         <span>{% trans "load more topics" %}</span>
                     </a>
diff --git a/lacommunaute/templates/pages/home.html b/lacommunaute/templates/pages/home.html
index 262af1149..4feafcb9e 100644
--- a/lacommunaute/templates/pages/home.html
+++ b/lacommunaute/templates/pages/home.html
@@ -64,10 +64,10 @@ <h3 class="m-0">
                                 {% for topic in topics_public %}
                                     <li class="mb-3 position-relative">
                                         <a href="{% url 'forum_conversation:topic' topic.forum.slug topic.forum.pk topic.slug topic.pk %}"
-                                           class="matomo-event btn-link stretched-link"
-                                           data-matomo-category="engagement"
-                                           data-matomo-action="view"
-                                           data-matomo-option="topic">
+                                            class="matomo-event btn-link stretched-link"
+                                            data-matomo-category="engagement"
+                                            data-matomo-action="view"
+                                            data-matomo-option="topic">
                                             {{ topic.subject }}
                                         </a>
                                     </li>
@@ -89,10 +89,10 @@ <h3 class="m-0">
                                 {% for forum in forums_category %}
                                     <li class="mb-3 position-relative">
                                         <a href="{% url 'forum_extension:forum' forum.slug forum.pk %}"
-                                           class="matomo-event btn-link stretched-link"
-                                           data-matomo-category="engagement"
-                                           data-matomo-action="view"
-                                           data-matomo-option="forum">
+                                            class="matomo-event btn-link stretched-link"
+                                            data-matomo-category="engagement"
+                                            data-matomo-action="view"
+                                            data-matomo-option="forum">
                                             [{{ forum.parent.name }}] {{ forum.name }}
                                         </a>
                                     </li>
@@ -114,10 +114,10 @@ <h3 class="m-0">
                                 {% for topic in topics_newsfeed %}
                                     <li class="mb-3 position-relative">
                                         <a href="{% url 'forum_conversation:topic' topic.forum.slug topic.forum.pk topic.slug topic.pk %}"
-                                           class="matomo-event btn-link stretched-link"
-                                           data-matomo-category="engagement"
-                                           data-matomo-action="view"
-                                           data-matomo-option="news">
+                                            class="matomo-event btn-link stretched-link"
+                                            data-matomo-category="engagement"
+                                            data-matomo-action="view"
+                                            data-matomo-option="news">
                                             {{ topic.subject }}
                                         </a>
                                     </li>
diff --git a/lacommunaute/templates/surveys/dsp_detail.html b/lacommunaute/templates/surveys/dsp_detail.html
index b4ed7fdcf..063d766a8 100644
--- a/lacommunaute/templates/surveys/dsp_detail.html
+++ b/lacommunaute/templates/surveys/dsp_detail.html
@@ -1,4 +1,4 @@
-{% extends 'board_base.html' %}
+{% extends "layouts/base.html" %}
 {% load i18n %}
 
 {% block title %}Diagnostic Socio Professionnel{{ block.super }}{% endblock %}
@@ -6,22 +6,32 @@
 
 {% block content %}
 
-    <h1>Les recommandations suite à votre diagnostic</h1>
-
-    {% for label, recommendation in object.recommendations.items %}
-        <div class="row mt-3">
-            <div class="col-12">
-                <div class="card post-edit">
-                    <div class="card-header">
-                        <h3 class="m-0 h4 card-title">{{label}}</h3>
-                    </div>
-                    <div class="card-body">
-                        {{ recommendation }}
-                    </div>
+    <section class="s-title-01 mt-lg-5">
+        <div class="s-title-01__container container">
+            <div class="s-title-01__row row">
+                <div class="s-title-01__col col-12">
+                    <h1 class="s-title-01__title h1">Les recommandations suite à votre diagnostic</h1>
                 </div>
             </div>
         </div>
-    {% endfor %}
+    </section>
 
+    <section class="s-section">
+        <div class="s-section__container container">
+            <div class="s-section__row row">
+                <div class="s-section__col col-12 col-lg-8">
+                    {% for label, recommendation in object.recommendations.items %}
+                        <div>
+                            <h2 class="h3">{{label}}</h2>
+                            <div>
+                                {{ recommendation }}
+                            </div>
+                            <hr class="mt-5">
+                        </div>
+                    {% endfor %}
+                </div>
+            </div>
+        </div>
+    </section>
 
 {% endblock content %}
diff --git a/lacommunaute/templates/surveys/dsp_form.html b/lacommunaute/templates/surveys/dsp_form.html
index 153a7268c..3f944d1ef 100644
--- a/lacommunaute/templates/surveys/dsp_form.html
+++ b/lacommunaute/templates/surveys/dsp_form.html
@@ -1,31 +1,58 @@
-{% extends 'board_base.html' %}
+{% extends "layouts/base.html" %}
 {% load i18n %}
 
 {% block title %}Diagnostic Socio Professionnel{{ block.super }}{% endblock %}
-{% block meta_description %}DSP{% endblock meta_description %}"
+{% block meta_description %}DSP{% endblock meta_description %}
 
-{% block content %}
 
-    <h1>Diagnostic socio-professionnel</h1>
+{% block content %}
 
-    <form method="post">
-        {% csrf_token %}
+    <section class="s-title-01 mt-lg-5">
+        <div class="s-title-01__container container">
+            <div class="s-title-01__row row">
+                <div class="s-title-01__col col-12">
+                    <h1 class="s-title-01__title h1">Diagnostic socio-professionnel</h1>
+                </div>
+            </div>
+        </div>
+    </section>
 
-        {% for field in form %}
-            <div class="row mt-3">
-                <div class="col-12">
-                    <div class="card post-edit">
-                        <div class="card-header">
-                            <h3 class="m-0 h4 card-title">{{ field.label_tag }}</h3>
-                        </div>
-                        <div class="card-body">
-                            {{ field }}
-                        </div>
+    <section class="s-section">
+        <div class="s-section__container container">
+            <div class="s-section__row row">
+                <div class="s-section__col col-12">
+                    <div class="c-form">
+                        <form method="post">
+                            {% csrf_token %}
+                            {% for field in form %}
+                                <fieldset>
+                                    <div class="row">
+                                        <div class="col-12 col-lg-8">
+                                            <legend>{{ field.label_tag }}</legend>
+                                            <div class="form-group form-group-required">{{ field }}</div>
+                                        </div>
+                                    </div>
+                                </fieldset>
+                                <div class="row">
+                                    <div class="col-12 col-lg-7">
+                                        <hr />
+                                    </div>
+                                </div>
+                            {% endfor %}
+                            <div class="row">
+                                <div class="col-12 col-lg-7">
+                                    <div class="form-row justify-content-end">
+                                        <div class="form-group col-12 col-lg-auto">
+                                            <button type="submit" class="btn btn-block btn-primary">Valider</button>
+                                        </div>
+                                    </div>
+                                </div>
+                            </div>
+                        </form>
                     </div>
                 </div>
             </div>
-        {% endfor %}
-        <input type="submit" class="btn btn-sm btn-secondary mt-3" value="Valider">
-    </form>
+        </div>
+    </section>
 
 {% endblock content %}