diff --git a/src/Bundle/ChillActivityBundle/Resources/views/Activity/show.html.twig b/src/Bundle/ChillActivityBundle/Resources/views/Activity/show.html.twig
index 3efd5480b..cb5b135b3 100644
--- a/src/Bundle/ChillActivityBundle/Resources/views/Activity/show.html.twig
+++ b/src/Bundle/ChillActivityBundle/Resources/views/Activity/show.html.twig
@@ -1,65 +1,87 @@
 {%- set t = entity.type -%}
 {%- import "@ChillDocStore/Macro/macro.html.twig" as m -%}
 
-<h2 class="chill-green-dark">
-    {{ "Activity"|trans }}{{ ', le ' ~ entity.date|format_date('long') }}
-    {%- if t.emergencyVisible and entity.emergency -%}
-      <span class="badge bg-danger rounded-pill fs-6 float-end">
-        {{- 'Emergency'|trans -}}
-      </span>
-    {%- endif -%}
-</h2>
+<h1>{{ "Activity"|trans }}</h1>
 
-<h1>
-    {{ entity.type.name | localize_translatable_string }}
-</h1>
+<div class="flex-table">
+    <div class="item-bloc">
 
-<dl class="chill_view_data">
-    <dt class="inline">{{ 'by'|trans|capitalize }}</dt>
-    <dd>{{ entity.user }}</dd>
+        <div class="item-row">
+            <div class="wrap-list">
+                <div class="wl-row">
+                    <div class="wl-col title">
+                        {% if entity.date %}
+                            <p class="date-label">
+                                {{ entity.date|format_date('short') }}
+                            </p>
+                        {% endif %}
+                    </div>
+                    <div class="wl-col list">
+                        <h2 class="badge-title">
+                            <span class="title_label"></span>
+                            <span class="title_action">
+                                {{ entity.type.name | localize_translatable_string }}
+                                {% if entity.emergency %}
+                                    <span class="badge bg-danger rounded-pill fs-6 float-end">{{ 'Emergency'|trans|upper }}</span>
+                                {% endif %}
+                            </span>
+                        </h2>
+                    </div>
+                </div>
+            </div>
+        </div>
 
-    {%- if entity.scope -%}
-    <dt class="inline">{{ 'Scope'|trans }}</dt>
-    <dd>
-      <span class="scope">{{ entity.scope.name|localize_translatable_string }}</span>
-    </dd>
-    {% endif %}
+        <div class="item-row separator">
+            <dl class="chill_view_data">
+                <dt class="inline">{{ 'Referrer'|trans|capitalize }}</dt>
+                <dd>{{ entity.user }}</dd>
 
-    {% if t.socialIssuesVisible %}
-    <dt class="inline">{{ 'Social issues'|trans }}</dt>
-    <dd>
-      {% if entity.socialIssues|length == 0 %}
-        <p class="chill-no-data-statement">{{ 'No social issues associated'|trans }}</p>
-      {% else %}
-        {% for si in entity.socialIssues %}{{ si|chill_entity_render_box }}{% endfor %}
-      {% endif %}
-    </dd>
-    {% endif %}
+                {%- if entity.scope -%}
+                    <dt class="inline">{{ 'Scope'|trans }}</dt>
+                    <dd>
+                        <span class="scope">{{ entity.scope.name|localize_translatable_string }}</span>
+                    </dd>
+                {% endif %}
 
-    {% if t.socialActionsVisible %}
-    <dt class="inline">{{ 'Social actions'|trans }}</dt>
-    <dd>
-      {% if entity.socialActions|length == 0 %}
-        <span class="chill-no-data-statement">{{ 'No social actions associated'|trans }}</span>
-      {% else %}
-        {% for sa in entity.socialActions %}{{ sa|chill_entity_render_box }}{% endfor %}
-      {% endif %}
-    </dd>
-    {% endif %}
+                {% if t.socialIssuesVisible %}
+                    <dt class="inline">{{ 'Social issues'|trans }}</dt>
+                    <dd>
+                        {% if entity.socialIssues|length == 0 %}
+                            <p class="chill-no-data-statement">{{ 'No social issues associated'|trans }}</p>
+                        {% else %}
+                            {% for si in entity.socialIssues %}{{ si|chill_entity_render_box }}{% endfor %}
+                        {% endif %}
+                    </dd>
+                {% endif %}
 
-    {% if t.reasonsVisible %}
-    <dt class="inline">{{ 'Reasons'|trans }}</dt>
-    <dd>
-      {%- if entity.reasons is empty -%}
-        <span class="chill-no-data-statement">{{ 'No reason associated'|trans }}</span>
-      {%- else -%}
-        {% for r in entity.reasons %}{{ r|chill_entity_render_box }}{% endfor %}
-      {%- endif -%}
-    </dd>
-    {% endif %}
-</dl>
+                {% if t.socialActionsVisible %}
+                    <dt class="inline">{{ 'Social actions'|trans }}</dt>
+                    <dd>
+                        {% if entity.socialActions|length == 0 %}
+                            <span class="chill-no-data-statement">{{ 'No social actions associated'|trans }}</span>
+                        {% else %}
+                            {% for sa in entity.socialActions %}{{ sa|chill_entity_render_box }}{% endfor %}
+                        {% endif %}
+                    </dd>
+                {% endif %}
 
-<h2 class="chill-green-dark">{{ 'Concerned groups'|trans }}</h2>
+                {% if t.reasonsVisible %}
+                    <dt class="inline">{{ 'Reasons'|trans }}</dt>
+                    <dd>
+                        {%- if entity.reasons is empty -%}
+                            <span class="chill-no-data-statement">{{ 'No reason associated'|trans }}</span>
+                        {%- else -%}
+                            {% for r in entity.reasons %}{{ r|chill_entity_render_box }}{% endfor %}
+                        {%- endif -%}
+                    </dd>
+                {% endif %}
+            </dl>
+        </div>
+
+    </div>
+</div>
+
+<h2 class="chill-blue">{{ 'Concerned groups'|trans }}</h2>
 
 {% include 'ChillActivityBundle:Activity:concernedGroups.html.twig' with {
     'context': context,
@@ -67,90 +89,97 @@
     'badge_person': 'true'
 } %}
 
-<h2 class="chill-green-dark">{{ 'Activity data'|trans }}</h2>
-<dl>
-    <dt class="inline">{{ 'Date'|trans }}</dt>
-    <dd>{{ entity.date|format_date('long') }}</dd>
+<h2 class="chill-blue">{{ 'Activity data'|trans }}</h2>
 
-    {% if t.locationVisible %}
-    <dt class="inline">{{ 'Activity location'|trans }}</dt>
-    <dd>
-      {% if entity.location is not null %}
-        <p>
-          <span>{{ entity.location.locationType.title|localize_translatable_string }}</span>
-          {{ entity.location.name }}
-        </p>
-        <div class="ms-3">{{ entity.location.address|chill_entity_render_box }}</div>
-      {% else %}
-        <span class="chill-no-data-statement">{{ 'No address given'|trans }}</span>
-      {% endif %}
-    </dd>
-    {% endif %}
+<div class="flex-table">
+    <div class="item-bloc">
 
-    {% if t.durationTimeVisible and is_granted('CHILL_ACTIVITY_SEE_DETAILS', entity) %}
-    <dt class="inline">{{ 'Duration Time'|trans }}</dt>
-    <dd>
-      {% if entity.durationTime is not null %}
-        {{ entity.durationTime|date('H:i') }}
-      {% else %}
-        <span class="chill-no-data-statement">{{ 'None'|trans|capitalize }}</span>
-      {% endif %}
-    </dd>
-    {% endif %}
+        <dl class="chill_view_data">
+            <dt class="inline">{{ 'Date'|trans }}</dt>
+            <dd>{{ entity.date|format_date('long') }}</dd>
 
-    {% if t.travelTimeVisible and is_granted('CHILL_ACTIVITY_SEE_DETAILS', entity) %}
-    <dt class="inline">{{ 'Travel time'|trans }}</dt>
-    <dd>
-      {% if entity.travelTime is not null %}
-        {{ entity.travelTime|date('H:i') }}
-      {% else %}
-        <span class="chill-no-data-statement">{{ 'None'|trans|capitalize }}</span>
-      {% endif %}
-    </dd>
-    {% endif %}
-
-    {% if t.commentVisible and is_granted('CHILL_ACTIVITY_SEE_DETAILS', entity) %}
-    <dt class="inline">{{ 'activity.comment'|trans }}</dt>
-    <dd>
-      {%- if entity.comment.empty -%}
-        <span class="chill-no-data-statement">{{ 'No comment associated'|trans }}</span>
-      {%- else -%}
-        {{ entity.comment|chill_entity_render_box }}
-      {%- endif -%}
-    </dd>
-    {% endif %}
-
-    {% if t.documentsVisible and is_granted('CHILL_ACTIVITY_SEE_DETAILS', entity) %}
-    <dt class="inline">{{ 'Documents'|trans }}</dt>
-    <dd>
-      {% if entity.documents|length > 0 %}
-        <ul>
-          {% for d in entity.documents %}
-            <li>{{ m.download_button(d) }}</li>
-          {% endfor %}
-        </ul>
-      {% else %}
-          <span class="chill-no-data-statement">{{ 'Any document found'|trans }}</span>
-      {% endif %}
-    </dd>
-    {% endif %}
-
-    {% if t.attendeeVisible and is_granted('CHILL_ACTIVITY_SEE_DETAILS', entity) %}
-    <dt class="inline">{{ 'Attendee'|trans }}</dt>
-    <dd>
-        {% if entity.attendee is not null %}
-            {% if entity.attendee %}
-                {{ 'present'|trans|capitalize }}
-            {% else %}
-                {{ 'not present'|trans|capitalize }}
+            {% if t.locationVisible %}
+                <dt class="inline">{{ 'Activity location'|trans }}</dt>
+                <dd>
+                    {% if entity.location is not null %}
+                        <p>
+                            <span>{{ entity.location.locationType.title|localize_translatable_string }}</span>
+                            {{ entity.location.name }}
+                        </p>
+                        <div class="ms-3">{{ entity.location.address|chill_entity_render_box }}</div>
+                    {% else %}
+                        <span class="chill-no-data-statement">{{ 'No address given'|trans }}</span>
+                    {% endif %}
+                </dd>
             {% endif %}
-        {% else %}
-            <span class="chill-no-data-statement">{{ 'None'|trans|capitalize }}</span>
-        {% endif %}
-    </dd>
-    {% endif %}
 
-</dl>
+            {% if t.durationTimeVisible and is_granted('CHILL_ACTIVITY_SEE_DETAILS', entity) %}
+                <dt class="inline">{{ 'Duration Time'|trans }}</dt>
+                <dd>
+                    {% if entity.durationTime is not null %}
+                        {{ entity.durationTime|date('H:i') }}
+                    {% else %}
+                        <span class="chill-no-data-statement">{{ 'None'|trans|capitalize }}</span>
+                    {% endif %}
+                </dd>
+            {% endif %}
+
+            {% if t.travelTimeVisible and is_granted('CHILL_ACTIVITY_SEE_DETAILS', entity) %}
+                <dt class="inline">{{ 'Travel time'|trans }}</dt>
+                <dd>
+                    {% if entity.travelTime is not null %}
+                        {{ entity.travelTime|date('H:i') }}
+                    {% else %}
+                        <span class="chill-no-data-statement">{{ 'None'|trans|capitalize }}</span>
+                    {% endif %}
+                </dd>
+            {% endif %}
+
+            {% if t.commentVisible and is_granted('CHILL_ACTIVITY_SEE_DETAILS', entity) %}
+                <dt class="inline">{{ 'activity.comment'|trans }}</dt>
+                <dd>
+                    {%- if entity.comment.empty -%}
+                        <span class="chill-no-data-statement">{{ 'No comment associated'|trans }}</span>
+                    {%- else -%}
+                        {{ entity.comment|chill_entity_render_box }}
+                    {%- endif -%}
+                </dd>
+            {% endif %}
+
+            {% if t.documentsVisible and is_granted('CHILL_ACTIVITY_SEE_DETAILS', entity) %}
+                <dt class="inline">{{ 'Documents'|trans }}</dt>
+                <dd>
+                    {% if entity.documents|length > 0 %}
+                        <ul>
+                            {% for d in entity.documents %}
+                                <li>{{ m.download_button(d) }}</li>
+                            {% endfor %}
+                        </ul>
+                    {% else %}
+                        <span class="chill-no-data-statement">{{ 'Any document found'|trans }}</span>
+                    {% endif %}
+                </dd>
+            {% endif %}
+
+            {% if t.attendeeVisible and is_granted('CHILL_ACTIVITY_SEE_DETAILS', entity) %}
+                <dt class="inline">{{ 'Attendee'|trans }}</dt>
+                <dd>
+                    {% if entity.attendee is not null %}
+                        {% if entity.attendee %}
+                            {{ 'present'|trans|capitalize }}
+                        {% else %}
+                            {{ 'not present'|trans|capitalize }}
+                        {% endif %}
+                    {% else %}
+                        <span class="chill-no-data-statement">{{ 'None'|trans|capitalize }}</span>
+                    {% endif %}
+                </dd>
+            {% endif %}
+
+        </dl>
+
+    </div>
+</div>
 
 {% set person_id = null %}
 {% if person %}
@@ -183,3 +212,9 @@
     </li>
     {% endif %}
 </ul>
+<script>
+    import ShowPane from "../../../../ChillMainBundle/Resources/public/vuejs/Address/components/ShowPane";
+    export default {
+        components: {ShowPane}
+    }
+</script>
diff --git a/src/Bundle/ChillActivityBundle/Resources/views/Activity/showAccompanyingCourse.html.twig b/src/Bundle/ChillActivityBundle/Resources/views/Activity/showAccompanyingCourse.html.twig
index ada3ebbd6..b74b315a3 100644
--- a/src/Bundle/ChillActivityBundle/Resources/views/Activity/showAccompanyingCourse.html.twig
+++ b/src/Bundle/ChillActivityBundle/Resources/views/Activity/showAccompanyingCourse.html.twig
@@ -8,8 +8,6 @@
 
 {% block content -%}
 <div class="activity-show">
-
     {% include 'ChillActivityBundle:Activity:show.html.twig' with {'context': 'accompanyingCourse'} %}
-
 </div>
 {% endblock content %}
diff --git a/src/Bundle/ChillActivityBundle/Resources/views/Activity/showPerson.html.twig b/src/Bundle/ChillActivityBundle/Resources/views/Activity/showPerson.html.twig
index 8462c4178..5e92f8fa2 100644
--- a/src/Bundle/ChillActivityBundle/Resources/views/Activity/showPerson.html.twig
+++ b/src/Bundle/ChillActivityBundle/Resources/views/Activity/showPerson.html.twig
@@ -8,8 +8,6 @@
 
 {% block personcontent -%}
 <div class="activity-show">
-
-            {% include 'ChillActivityBundle:Activity:show.html.twig' with {'context': 'person'} %}
-
+    {% include 'ChillActivityBundle:Activity:show.html.twig' with {'context': 'person'} %}
 </div>
 {% endblock personcontent %}
diff --git a/src/Bundle/ChillPersonBundle/Resources/public/chill/scss/badge.scss b/src/Bundle/ChillPersonBundle/Resources/public/chill/scss/badge.scss
index b1a06876a..984338663 100644
--- a/src/Bundle/ChillPersonBundle/Resources/public/chill/scss/badge.scss
+++ b/src/Bundle/ChillPersonBundle/Resources/public/chill/scss/badge.scss
@@ -137,7 +137,7 @@ div.accompanying_course_work-list {
 }
 
 /// dashboard_like_badge in Activities on resume page
-div.activity-list {
+div[class*='activity-'] {
     div.dashboard,
     h2.badge-title {
         span.title_label {