diff --git a/src/components/Flatastic/Flatastic.tsx b/src/components/Flatastic/Flatastic.tsx
index 968f05b..cce0b55 100644
--- a/src/components/Flatastic/Flatastic.tsx
+++ b/src/components/Flatastic/Flatastic.tsx
@@ -35,9 +35,11 @@ export default function Flatastic() {
             className = "irregular";
         } else {
             className = chore.timeLeftNext <= 0 ? "due" : "notDue";
-            timeLeftInDays = Math.abs(
-                Math.floor(chore.timeLeftNext / (60 * 60 * 24)),
-            );
+            timeLeftInDays = <span className={style.timeLeft}>
+                {Math.abs(
+                    Math.floor(chore.timeLeftNext / (60 * 60 * 24)),
+                )}d
+            </span>;
         }
 
         return (
diff --git a/src/components/Flatastic/style.module.css b/src/components/Flatastic/style.module.css
index 8a3ea11..eb1f027 100644
--- a/src/components/Flatastic/style.module.css
+++ b/src/components/Flatastic/style.module.css
@@ -30,5 +30,9 @@
 }
 
 .notDue {
-    background-color: #ccffcc;
+    background-color: #a6cfa6;
+}
+
+.timeLeft {
+    font-weight: bold;
 }