diff --git a/CHANGELOG.md b/CHANGELOG.md
index 399a0daed..35bc9a1c9 100644
--- a/CHANGELOG.md
+++ b/CHANGELOG.md
@@ -16,4 +16,5 @@ Branche de développement
 ========================
 
 - Fix error on the "see more" link which was not showed
+- Layout of the task list
 
diff --git a/Resources/public/sass/_task-list.scss b/Resources/public/sass/_task-list.scss
new file mode 100644
index 000000000..3350a4ace
--- /dev/null
+++ b/Resources/public/sass/_task-list.scss
@@ -0,0 +1,53 @@
+table.chill-task-list {
+    .chill-task-list__row > div {
+        margin-bottom: 0.50rem;
+    }
+    
+    .chill-task-list__row__title {
+        font-weight: bold;
+        font-size: 1.40rem;
+    }
+    
+    .chill-task-list__row__type {
+        font-variant: small-caps;
+        display: inline;
+        padding: 0.05rem .15rem;
+        font-size: 0.88rem;
+        font-weight: light;
+        line-height: 1;
+        text-align: center;
+        white-space: nowrap;
+        vertical-align: baseline;
+        border: 1px solid var(--chill-dark-gray);
+        color: var(--chill-dark-gray);
+    }
+    
+    .chill-task-list__row__person-for {
+        display: inline;
+        font-weight: bold;
+    }
+    
+    .chill-task-list__row__assignee {
+        display: inline;
+        
+    }
+    
+    .chill_task-list__row__assignee_by {
+        display: inline;
+        font-weight: bold;
+    }
+    
+    .chill-task-list__row__dates {
+        & > ul {
+            display: inline;
+            list-style: none;
+            
+            & > li {
+                display: inline;
+                margin-right: 0.25rem;
+                
+            }
+        }
+    }
+}
+
diff --git a/Resources/public/sass/_task.scss b/Resources/public/sass/_task.scss
index 6f28b5164..4e668f3fe 100644
--- a/Resources/public/sass/_task.scss
+++ b/Resources/public/sass/_task.scss
@@ -1,5 +1,6 @@
 @import '../../../../main/Resources/public/sass/custom/config/colors';
 @import "_task-statuses.scss";
+@import "_task-list.scss";
 
 div#single_task_warningInterval {
     display: flex;
diff --git a/Resources/translations/messages.fr.yml b/Resources/translations/messages.fr.yml
index 239ee16ab..80d3065b1 100644
--- a/Resources/translations/messages.fr.yml
+++ b/Resources/translations/messages.fr.yml
@@ -60,6 +60,8 @@ Unassigned: Non assigné
 Associated person: Personne associée
 Default task: Tâche par défaut
 Not assigned: Aucun utilisateur assigné
+For person: Pour
+By: Par
 
 # transitions - default task definition
 'new': 'nouvelle'
diff --git a/Resources/views/SingleTask/_list.html.twig b/Resources/views/SingleTask/_list.html.twig
index db2df8771..9f124d866 100644
--- a/Resources/views/SingleTask/_list.html.twig
+++ b/Resources/views/SingleTask/_list.html.twig
@@ -2,66 +2,61 @@
         {% if tasks|length > 0 %}
             <h3>{{ title|trans }}</h3>
 
-            <table class="records_list">
-                <thead>
-                    <tr>
-                        <th class="chill-red">{{ 'Title'|trans }}</th>
-                        {% if person is null %}
-                        <th>{{ 'Person'|trans }}</th>
-                        {% endif %}
-                        <th class="chill-orange">{{ 'Task status'|trans }}</th>
-                        <th>{{ 'Dates'|trans }}</th>
-                    </tr>
-                </thead>
+            <table class="records_list chill-task-list">
                 <tbody>
                     {% for task in tasks %}
                         <tr>
-                            <td>
-                               
-                                <p><strong>{{ task.title }}</strong></p>
-                                <dl>
-                                    <dt>{{ 'Task type'|trans }}</dt>
-                                    <dd>{{ task_workflow_metadata(task, 'definition.name')|trans }}</dd>
-                                </dl>
-                            </td>
-                            {% if person is null %}
-                            <td><a href="{{ path('chill_person_view', {person_id : task.person.Id}) }}">{{ task.person}}</a></td>
-                            {% endif %}
-                            <td>
-                                {% for place in workflow_marked_places(task) %}
-                                    <span class="task-status box type-{{ task.type }} place-{{ place }}">{{ place|trans }}</span>
-                                {% endfor %}
+                            <td class="chill-task-list__row">
                                 
-                                {% if task.assignee is not null %}
-                                <dl>
-                                    <dt>{{ 'Assignee'|trans }}</dt>
-                                    <dd>{{ task.assignee.username }}</dd>
-                                </dl>
+                                <div>
+                                    <span class="chill-task-list__row__title">{{ task.title }}</span>
+                                </div>
+                                
+                                {% if person is null %}
+                                    <div>
+                                        <span class="chill-task-list__row__person-for">{{ 'For person'|trans }}&nbsp;:</span> <span class="chill-task-list__row__person"><a href="{{ path('chill_person_view', {person_id : task.person.Id}) }}">{{ task.person}}</a></span>
+                                    </div>
                                 {% endif %}
+                                
+                                <div>
+                                    <span class="chill-task-list__row__type">{{ task_workflow_metadata(task, 'definition.name')|trans }}</span>
+                                </div>
+                                
+
                                     
-                            </td>
-                            <td>
-                                {% if task.startDate is null and task.warningDate is null and task.endDate is null %}
-                                    {{'No dates specified'|trans}}
-                                {% else %}
-                                <ul class="record_actions_column">
-                                    {% if task.startDate is not null %}
-                                        <li>
-                                            {{'Start'|trans}}&nbsp;: {{ task.startDate|localizeddate('medium', 'none') }}
-                                        </li>
+                                <div>
+                                
+                                    {% for place in workflow_marked_places(task) %}
+                                        <span class="task-status box type-{{ task.type }} place-{{ place }}">{{ place|trans }}</span>
+                                    {% endfor %}
+                                    {% if task.assignee is not null %}
+                                        <div class="chill-task-list__row__assignee"><span class="chill_task-list__row__assignee_by">{{ 'By'|trans }}&nbsp;:</span> {{ task.assignee.username }}</div>
                                     {% endif %}
-                                    {% if task.warningDate is not null %}
-                                        <li>
-                                            {{'Warning'|trans}}&nbsp;: {{ task.warningDate|localizeddate('medium', 'none') }}
-                                        </li>
-                                    {% endif %}
-                                    {% if task.endDate is not null %}
-                                        <li>
-                                            {{'End'|trans}}&nbsp;: {{ task.endDate|localizeddate('medium', 'none') }}
-                                        </li>
-                                     {% endif %}
-                                </ul>
+                                </div>
+                                
+                                
+                                {% if task.startDate is not null or task.warningDate is not null or task.endDate is not null %}
+                                <div class="chill-task-list__row__dates">
+                                    <ul class="record_actions_column">
+                                        {% if task.startDate is not null %}
+                                            <li title="{{ 'Start'|trans|escape('html_attr') }}">
+                                                <i class="fa fa-play" ></i> {{ task.startDate|localizeddate('medium', 'none') }}
+                                            </li>
+                                        {% endif %}
+                                        {% if task.warningDate is not null %}
+                                            <li title="{{ 'Warning'|trans|escape('html_attr') }}">
+                                                <i class="fa fa-exclamation-triangle"></i> {{ task.warningDate|localizeddate('medium', 'none') }}
+                                            </li>
+                                        {% endif %}
+                                        {% if task.endDate is not null %}
+                                            <li title="{{ 'End'|trans|escape('html_attr') }}">
+                                                <i class="fa fa-hourglass-end"></i> {{ task.endDate|localizeddate('medium', 'none') }}
+                                            </li>
+                                         {% endif %}
+                                    </ul>
+                                </div>
                                 {% endif %}
+                                
                             </td>
                             <td>
                                 <ul class="record_actions">