diff --git a/client/demo.js b/client/demo.js
index 03575532..52d65a2c 100644
--- a/client/demo.js
+++ b/client/demo.js
@@ -46,7 +46,7 @@ const DEMO_UNIT_DATA = {
             wingmenIDs: []
         },
         taskData: {
-            currentTask: "Example task",
+            currentTask: "Holding",
             activePath: undefined,
             targetSpeed: 400,
             targetAltitude: 3000
diff --git a/client/src/panels/unitinfopanel.ts b/client/src/panels/unitinfopanel.ts
index 3080edca..f70d8571 100644
--- a/client/src/panels/unitinfopanel.ts
+++ b/client/src/panels/unitinfopanel.ts
@@ -12,7 +12,7 @@ export class UnitInfoPanel extends Panel {
     #fuel: HTMLElement;
     #latitude: HTMLElement;
     #longitude: HTMLElement;
-    #task: HTMLElement;
+    #currentTask: HTMLElement;
     #loadoutContainer: HTMLElement;
 
     constructor(ID: string) {
@@ -27,7 +27,7 @@ export class UnitInfoPanel extends Panel {
         this.#fuel = <HTMLElement>(this.getElement().querySelector("#fuel"));
         this.#latitude = <HTMLElement>(this.getElement().querySelector("#latitude"));
         this.#longitude = <HTMLElement>(this.getElement().querySelector("#longitude"));
-        this.#task = <HTMLElement>(this.getElement().querySelector("#task"));
+        this.#currentTask = <HTMLElement>(this.getElement().querySelector("#current-task"));
         this.#loadoutContainer = <HTMLElement>(this.getElement().querySelector("#loadout-container"));
 
         document.addEventListener("unitsSelection", (e: CustomEvent<Unit[]>) => this.#onUnitsSelection(e.detail));
@@ -50,12 +50,8 @@ export class UnitInfoPanel extends Panel {
             //this.#fuel.innerText = String(unit.getMissionData().fuel + "%");
             //this.#latitude.innerText = ConvertDDToDMS(unit.getFlightData().latitude, false);
             //this.#longitude.innerText = ConvertDDToDMS(unit.getFlightData().longitude, true);
-            this.#task.innerText = unit.getTaskData().currentTask !== ""? unit.getTaskData().currentTask: "No task";
-
-            /* Set the class of the task container */
-            this.#task.classList.toggle("red", unit.getMissionData().coalition === "red");
-            this.#task.classList.toggle("blue", unit.getMissionData().coalition === "blue");
-            this.#task.classList.toggle("neutral", unit.getMissionData().coalition === "neutral");
+            this.#currentTask.dataset.currentTask = unit.getTaskData().currentTask !== ""? unit.getTaskData().currentTask: "No task";
+            this.#currentTask.dataset.coalition = unit.getMissionData().coalition;
             
             /* Add the loadout elements */
             this.#loadoutContainer.replaceChildren(...unit.getMissionData().ammo.map(
diff --git a/client/views/unitinfopanel.ejs b/client/views/unitinfopanel.ejs
index e6ae79a6..72276a47 100644
--- a/client/views/unitinfopanel.ejs
+++ b/client/views/unitinfopanel.ejs
@@ -7,9 +7,8 @@
             <div class="ol-group">
                 <div id="name" class="pill highlight-primary">Name</div>
                 <div id="group-name" class="pill highlight-primary">Group</div>
-                <div id="task" class="pill highlight-primary">Task</div>
             </div>
-            <div id="current-task" class="pill highlight-coalition" data-coalition="blue" data-current-task="Orbiting in place"></div>
+            <div id="current-task" class="pill highlight-coalition" data-coalition="blue" data-current-task=""></div>
         </div>
 
         <div id="loadout-data" class="panel-section">