diff --git a/osinaweb/db.sqlite3 b/osinaweb/db.sqlite3
index f1e97913..29417acf 100644
Binary files a/osinaweb/db.sqlite3 and b/osinaweb/db.sqlite3 differ
diff --git a/osinaweb/templates/index.html b/osinaweb/templates/index.html
index bf2e7d87..a2d98508 100644
--- a/osinaweb/templates/index.html
+++ b/osinaweb/templates/index.html
@@ -139,52 +139,75 @@
                 <div class="w-full bg-white h-fit rounded-md border border-gray-200">
                     <!-- TABLE HEADER -->
                     <div class="w-full h-[70px] rounded-t-md grid grid-cols-2">
+                        {% if task.status == 'Open' %}
+                        <div
+                            class="flex justify-center items-center border-r border-b border-gray-200 bg-blue-500 rounded-tl-md text-xl text-white font-semibold">
+                            <p>{{task.name}}</p>
+                        </div>
+                        {% endif %}
+
+                        {% if task.status == 'Working On' %}
                         <div
-                            class="flex justify-center items-center border-r border-b border-gray-200 bg-slate-600 rounded-tl-md text-xl text-white font-semibold">
+                            class="flex justify-center items-center border-r border-b border-gray-200 bg-yellow-500 rounded-tl-md text-xl text-white font-semibold">
                             <p>{{task.name}}</p>
                         </div>
+                        {% endif %}
 
                         <div class="grid grid-cols-3">
                             {% if task.status == 'Open' %}
                             <div
-                                class="flex justify-center items-center border-r border-b border-gray-200 text-white bg-red-500">
+                                class="flex justify-center items-center border-r border-b border-gray-200 text-white bg-blue-500">
                                 <p>{{task.status}}</p>
                             </div>
                             {% endif %}
 
                             {% if task.status == 'Working On' %}
                             <div
-                                class="flex justify-center items-center border-r border-b border-gray-200 text-white bg-orange-500">
+                                class="flex justify-center items-center border-r border-b border-gray-200 text-white bg-yellow-500">
                                 <p>{{task.status}}</p>
                             </div>
                             {% endif %}
 
                             {% if task.status == 'Open' %}
                             <div
-                                class="flex justify-center items-center border-r border-b border-gray-200 text-white bg-red-500">
+                                class="flex justify-center items-center border-r border-b border-gray-200 text-white bg-blue-500">
                                 <p>{{task.formatted_start_date}}</p>
                             </div>
                             {% endif %}
 
                             {% if task.status == 'Working On' %}
                             <div
-                                class="flex justify-center items-center border-r border-b border-gray-200 text-white bg-orange-500">
+                                class="flex justify-center items-center border-r border-b border-gray-200 text-white bg-yellow-500">
                                 <p>{{task.formatted_start_date}}</p>
                             </div>
                             {% endif %}
 
                             {% if task.status == 'Open' %}
+                            {% if task.end_date < current_date %}
                             <div
                                 class="flex justify-center items-center border-b border-gray-200 text-white bg-red-500 rounded-tr-md">
                                 <p>{{task.formatted_end_date}}</p>
                             </div>
+                            {% else %}
+                            <div
+                            class="flex justify-center items-center border-b border-gray-200 text-white bg-blue-500 rounded-tr-md">
+                            <p>{{task.formatted_end_date}}</p>
+                            </div>
+                            {% endif %}
                             {% endif %}
 
                             {% if task.status == 'Working On' %}
-                            <div
-                                class="flex justify-center items-center border-b border-gray-200 text-white bg-orange-500 rounded-tr-md">
+                                {% if task.end_date < current_date %}
+                                <div
+                                    class="flex justify-center items-center border-b border-gray-200 text-white bg-red-500 rounded-tr-md">
+                                    <p>{{task.formatted_end_date}}</p>
+                                </div>
+                                {% else %}
+                                <div
+                                class="flex justify-center items-center border-b border-gray-200 text-white bg-yellow-500 rounded-tr-md">
                                 <p>{{task.formatted_end_date}}</p>
-                            </div>
+                                </div>
+                                {% endif %}
                             {% endif %}
                         </div>
 
@@ -292,7 +315,7 @@
 
                         {% if task.status == 'Working On' %}
                         <div
-                            class="w-full flex justify-center items-center text-white text-center bg-orange-500 rounded-t-md py-5 px-3">
+                            class="w-full flex justify-center items-center text-white text-center bg-yellow-500 rounded-t-md py-5 px-3">
                             <p>{{task.name}}</p>
                         </div>
                         {% endif %}
@@ -309,7 +332,7 @@
 
                         {% if task.status == 'Working On' %}
                         <div
-                            class="text-white bg-orange-500 border-r border-gray-200 flex justify-center items-center text-center py-3 text-sm">
+                            class="text-white bg-yellow-500 border-r border-gray-200 flex justify-center items-center text-center py-3 text-sm">
                             <p>{{task.status}}</p>
                         </div>
                         {% endif %}
@@ -324,7 +347,7 @@
 
                         {% if task.status == 'Working On' %}
                         <div
-                            class="text-white bg-orange-500 border-r border-gray-200 flex justify-center items-center text-center py-3 text-sm">
+                            class="text-white bg-yellow-500 border-r border-gray-200 flex justify-center items-center text-center py-3 text-sm">
                             <p>{{task.start_date}}</p>
                         </div>
                         {% endif %}
@@ -337,7 +360,7 @@
                         {% endif %}
 
                         {% if task.status == 'Working On' %}
-                        <div class="text-white bg-orange-500 flex justify-center items-center text-center py-3 text-sm">
+                        <div class="text-white bg-yellow-500 flex justify-center items-center text-center py-3 text-sm">
                             <p>{{task.end_date}}</p>
                         </div>
                         {% endif %}
diff --git a/osinaweb/templates/listing_pages/tasks.html b/osinaweb/templates/listing_pages/tasks.html
index af08a0fb..25737f9a 100644
--- a/osinaweb/templates/listing_pages/tasks.html
+++ b/osinaweb/templates/listing_pages/tasks.html
@@ -159,22 +159,38 @@
                     <div class="w-full bg-white h-fit rounded-md border border-gray-200">
                         <!-- TABLE HEADER -->
                         <div class="w-full h-[70px] rounded-t-md grid grid-cols-2">
+                            {% if task.status == 'Open' %}
                             <div
-                                class="flex justify-center items-center border-r border-b border-gray-200 bg-slate-600 rounded-tl-md text-xl text-white font-semibold">
+                                class="flex justify-center items-center border-r border-b border-gray-200 bg-blue-500 rounded-tl-md text-xl text-white font-semibold">
                                 <p>{{task.name}}</p>
                             </div>
+                            {% endif %}
+    
+                            {% if task.status == 'Working On' %}
+                            <div
+                                class="flex justify-center items-center border-r border-b border-gray-200 bg-yellow-500 rounded-tl-md text-xl text-white font-semibold">
+                                <p>{{task.name}}</p>
+                            </div>
+                            {% endif %}
+
+                            {% if task.status == 'Closed' %}
+                            <div
+                                class="flex justify-center items-center border-r border-b border-gray-200 bg-green-700 rounded-tl-md text-xl text-white font-semibold">
+                                <p>{{task.name}}</p>
+                            </div>
+                            {% endif %}
 
                             <div class="grid grid-cols-3">
                                 {% if task.status == 'Open' %}
                                 <div
-                                    class="flex justify-center items-center border-r border-b border-gray-200 text-white bg-red-500">
+                                    class="flex justify-center items-center border-r border-b border-gray-200 text-white bg-blue-500">
                                     <p>{{task.status}}</p>
                                 </div>
                                 {% endif %}
 
                                 {% if task.status == 'Working On' %}
                                 <div
-                                    class="flex justify-center items-center border-r border-b border-gray-200 text-white bg-orange-500">
+                                    class="flex justify-center items-center border-r border-b border-gray-200 text-white bg-yellow-500">
                                     <p>{{task.status}}</p>
                                 </div>
                                 {% endif %}
@@ -188,14 +204,14 @@
 
                                 {% if task.status == 'Open' %}
                                 <div
-                                    class="flex justify-center items-center border-r border-b border-gray-200 text-white bg-red-500">
+                                    class="flex justify-center items-center border-r border-b border-gray-200 text-white bg-blue-500">
                                     <p>{{task.formatted_start_date}}</p>
                                 </div>
                                 {% endif %}
 
                                 {% if task.status == 'Working On' %}
                                 <div
-                                    class="flex justify-center items-center border-r border-b border-gray-200 text-white bg-orange-500">
+                                    class="flex justify-center items-center border-r border-b border-gray-200 text-white bg-yellow-500">
                                     <p>{{task.formatted_start_date}}</p>
                                 </div>
                                 {% endif %}
@@ -208,24 +224,45 @@
                                 {% endif %}
 
                                 {% if task.status == 'Open' %}
-                                <div
-                                    class="flex justify-center items-center border-b border-gray-200 text-white bg-red-500 rounded-tr-md">
-                                    <p>{{task.formatted_end_date}}</p>
-                                </div>
+                                    {% if task.end_date < current_date %}
+                                    <div
+                                        class="flex justify-center items-center border-b border-gray-200 text-white bg-red-500 rounded-tr-md">
+                                        <p>{{task.formatted_end_date}}</p>
+                                    </div>
+                                    {% else %}
+                                    <div
+                                        class="flex justify-center items-center border-b border-gray-200 text-white bg-blue-500 rounded-tr-md">
+                                        <p>{{task.formatted_end_date}}</p>
+                                    </div>
+                                    {% endif %}
                                 {% endif %}
 
                                 {% if task.status == 'Working On' %}
-                                <div
-                                    class="flex justify-center items-center border-b border-gray-200 text-white bg-orange-500 rounded-tr-md">
-                                    <p>{{task.formatted_end_date}}</p>
-                                </div>
+                                    {% if task.end_date < current_date %}
+                                    <div
+                                        class="flex justify-center items-center border-b border-gray-200 text-white bg-red-500 rounded-tr-md">
+                                        <p>{{task.formatted_end_date}}</p>
+                                    </div>
+                                    {% else %}
+                                    <div
+                                        class="flex justify-center items-center border-b border-gray-200 text-white bg-yellow-500 rounded-tr-md">
+                                        <p>{{task.formatted_end_date}}</p>
+                                    </div>
+                                    {% endif %}
                                 {% endif %}
 
                                 {% if task.status == 'Closed' %}
-                                <div
-                                    class="flex justify-center items-center border-b border-gray-200 text-white bg-green-700 rounded-tr-md">
-                                    <p>{{task.formatted_end_date}}</p>
-                                </div>
+                                    {% if task.end_date < current_date %}
+                                    <div
+                                        class="flex justify-center items-center border-b border-gray-200 text-white bg-red-500 rounded-tr-md">
+                                        <p>{{task.formatted_end_date}}</p>
+                                    </div>
+                                    {% else %}
+                                    <div
+                                        class="flex justify-center items-center border-b border-gray-200 text-white bg-green-700 rounded-tr-md">
+                                        <p>{{task.formatted_end_date}}</p>
+                                    </div>
+                                    {% endif %}
                                 {% endif %}
                             </div>
 
@@ -333,7 +370,7 @@
 
                             {% if task.status == 'Working On' %}
                             <div
-                                class="w-full flex justify-center items-center text-white text-center bg-orange-500 rounded-t-md py-5 px-3">
+                                class="w-full flex justify-center items-center text-white text-center bg-yellow-500 rounded-t-md py-5 px-3">
                                 <p>{{task.name}}</p>
                             </div>
                             {% endif %}
@@ -364,7 +401,7 @@
 
                             {% if task.status == 'Working On' %}
                             <div
-                                class="text-white bg-orange-500 border-r border-gray-200 flex justify-center items-center text-center py-3 text-sm">
+                                class="text-white bg-yellow-500 border-r border-gray-200 flex justify-center items-center text-center py-3 text-sm">
                                 <p>{{task.status}}</p>
                             </div>
                             {% endif %}
@@ -379,7 +416,7 @@
 
                             {% if task.status == 'Working On' %}
                             <div
-                                class="text-white bg-orange-500 border-r border-gray-200 flex justify-center items-center text-center py-3 text-sm">
+                                class="text-white bg-yellow-500 border-r border-gray-200 flex justify-center items-center text-center py-3 text-sm">
                                 <p>{{task.start_date}}</p>
                             </div>
                             {% endif %}
@@ -401,7 +438,7 @@
 
                             {% if task.status == 'Working On' %}
                             <div
-                                class="text-white bg-orange-500 flex justify-center items-center text-center py-3 text-sm">
+                                class="text-white bg-yellow-500 flex justify-center items-center text-center py-3 text-sm">
                                 <p>{{task.end_date}}</p>
                             </div>
                             {% endif %}