diff --git a/front-end/src/components/AddExpense.js b/front-end/src/components/AddExpense.js
index b2acbf8..e8f99ec 100644
--- a/front-end/src/components/AddExpense.js
+++ b/front-end/src/components/AddExpense.js
@@ -511,7 +511,7 @@ const AddExpense = (props) => {
           <div className="submitBtn">
             <button type="submit">Done</button>
           </div>
-          <div className="space-to-scroll"></div>
+          <div className="space-to-scrolls"></div>
         </form>
       </div>
       <SplitModal
diff --git a/front-end/src/styles/AddExpense.css b/front-end/src/styles/AddExpense.css
index e64d1df..ba1d72f 100644
--- a/front-end/src/styles/AddExpense.css
+++ b/front-end/src/styles/AddExpense.css
@@ -50,8 +50,8 @@
   background-color: #d32f2f;
 }
 
-.space-to-scroll {
-  height: 60px;
+.space-to-scrolls {
+    height: 60px;
 }
 
 /* Dark Mode for Add Expense Modal */
@@ -100,7 +100,8 @@
   @apply bg-red-600;
 }
 
-.dark-mode .space-to-scroll {
-  @apply bg-gray-800;
-  height: 40px;
-}
+.dark-mode .space-to-scrolls {
+    @apply bg-gray-700; 
+    height: 60px;
+    
+}
\ No newline at end of file
diff --git a/front-end/src/styles/Expense.css b/front-end/src/styles/Expense.css
index 16836d6..e350aee 100644
--- a/front-end/src/styles/Expense.css
+++ b/front-end/src/styles/Expense.css
@@ -101,6 +101,14 @@
     @apply bg-gray-700 border-gray-600; 
 }
 
+.dark-mode .expense .expense-item .positive {
+    color: green;
+}
+
+.dark-mode .expense .expense-item .negative {
+    color: red;
+}
+
 .dark-mode .expense-item span:first-child,
 .dark-mode .expense-item span:nth-child(2),
 .dark-mode .expense-details {