diff --git a/EMS/admin-ui-bundle/src/Resources/views/bootstrap5/revision/task/ajax.twig b/EMS/admin-ui-bundle/src/Resources/views/bootstrap5/revision/task/ajax.twig
index 0aeb9f71c..db654940f 100644
--- a/EMS/admin-ui-bundle/src/Resources/views/bootstrap5/revision/task/ajax.twig
+++ b/EMS/admin-ui-bundle/src/Resources/views/bootstrap5/revision/task/ajax.twig
@@ -206,60 +206,64 @@
 {% endblock %}
 
 {% block modalTaskBody %}
-    <div class="nav-tabs-custom">
-        <ul class="nav nav-tabs">
-            <li class="active">
-                <a href="#tab_task_info" data-bs-toggle="tab" aria-expanded="true">
-                    <i class="fa fa-info-circle" aria-hidden="true"></i>&nbsp;{{ 'task.update.tab.info'|trans }}
-                </a>
-            </li>
-            <li>
-                <a href="#tab_task_history" data-bs-toggle="tab" aria-expanded="false">
-                    <i class="fa fa-history" aria-hidden="true"></i>&nbsp;{{ 'task.update.tab.history'|trans }}
-                </a>
-            </li>
-        </ul>
-        <div class="tab-content">
-            <div class="tab-pane active" id="tab_task_info">
-                {% if form is defined %}
-                    {{ block('taskForm') }}
-                {% else %}
-                    <div class="row">
-                        <div class="col-md-12 mb-3">
-                            <div class="mb-1"><strong>{{ 'task.field.title'|trans }}</strong></div>
-                            <div>{{ task.title }}</div>
-                        </div>
-                        <div class="col-md-4 mb-3">
-                            <div class="mb-1"><strong>{{ 'task.field.assignee'|trans }}</strong></div>
-                            <div>{{ task.assignee|emsco_display_name }}</div>
-                        </div>
-                        <div class="col-md-4 mb-3">
-                            <div class="mb-1"><strong>{{ 'task.field.requester'|trans }}</strong></div>
-                            <div>{{ task.createdBy|emsco_display_name }}</div>
-                        </div>
-                        <div class="col-md-4 mb-3">
-                            <div class="mb-1"><strong>{{ 'task.field.deadline'|trans }}</strong></div>
-                            {%- if task.hasDeadline -%}
-                                <div>
-                                    {%- set deadline = task.deadline.format(date_format) -%}
-                                    {%- if task.deadline.timestamp < date('now').timestamp -%}
-                                        <span class="text-danger"><strong>{{ deadline }}</strong></span>
-                                    {%- else -%}
-                                        {{ deadline }}
-                                    {%- endif -%}
-                                </div>
-                            {%- else -%}
-                                /
-                            {%- endif -%}
-                        </div>
-                        <div class="col-md-12 mb-3">
-                            <div class="mb-1"><strong>{{ 'task.field.description'|trans }}</strong></div>
-                            {%- if task.hasDescription -%}<div>{{ task.description|nl2br }}</div>{% else %}/{% endif %}
+    <div class="card card-{{ theme_color }}">
+        <div class="card-header p-0 border-bottom-0">
+            <ul class="nav nav-tabs" role="tablist">
+                <li class="nav-item">
+                    <a href="#tab_task_info" data-bs-target="#tab_task_info" data-bs-toggle="pill" class="nav-link active" aria-selected="true">
+                        <i class="fa fa-info-circle" aria-hidden="true"></i>&nbsp;{{ 'task.update.tab.info'|trans }}
+                    </a>
+                </li>
+                <li class="nav-item">
+                    <a href="#tab_task_history" data-bs-target="#tab_task_history" data-bs-toggle="pill" class="nav-link" aria-selected="false">
+                        <i class="fa fa-history" aria-hidden="true"></i>&nbsp;{{ 'task.update.tab.history'|trans }}
+                    </a>
+                </li>
+            </ul>
+        </div>
+        <div class="card-body">
+            <div class="tab-content">
+                <div class="tab-pane fade active show" id="tab_task_info" role="tabpanel">
+                    {% if form is defined %}
+                        {{ block('taskForm') }}
+                    {% else %}
+                        <div class="row">
+                            <div class="col-md-12 mb-3">
+                                <div class="mb-1"><strong>{{ 'task.field.title'|trans }}</strong></div>
+                                <div>{{ task.title }}</div>
+                            </div>
+                            <div class="col-md-4 mb-3">
+                                <div class="mb-1"><strong>{{ 'task.field.assignee'|trans }}</strong></div>
+                                <div>{{ task.assignee|emsco_display_name }}</div>
+                            </div>
+                            <div class="col-md-4 mb-3">
+                                <div class="mb-1"><strong>{{ 'task.field.requester'|trans }}</strong></div>
+                                <div>{{ task.createdBy|emsco_display_name }}</div>
+                            </div>
+                            <div class="col-md-4 mb-3">
+                                <div class="mb-1"><strong>{{ 'task.field.deadline'|trans }}</strong></div>
+                                {%- if task.hasDeadline -%}
+                                    <div>
+                                        {%- set deadline = task.deadline.format(date_format) -%}
+                                        {%- if task.deadline.timestamp < date('now').timestamp -%}
+                                            <span class="text-danger"><strong>{{ deadline }}</strong></span>
+                                        {%- else -%}
+                                            {{ deadline }}
+                                        {%- endif -%}
+                                    </div>
+                                {%- else -%}
+                                    /
+                                {%- endif -%}
+                            </div>
+                            <div class="col-md-12 mb-3">
+                                <div class="mb-1"><strong>{{ 'task.field.description'|trans }}</strong></div>
+                                {%- if task.hasDescription -%}<div>{{ task.description|nl2br }}</div>{% else %}/{% endif %}
+                            </div>
                         </div>
-                    </div>
-                {% endif %}
+                    {% endif %}
+                </div>
+                <div class="tab-pane fade" id="tab_task_history" role="tabpanel">{{ block('renderHistoryTimeline') }}</div>
             </div>
-            <div class="tab-pane" id="tab_task_history">{{ block('renderHistoryTimeline') }}</div>
         </div>
     </div>
 {% endblock %}