diff --git a/mod_ci/controllers.py b/mod_ci/controllers.py
index 7ce8a0c2..1ff89108 100755
--- a/mod_ci/controllers.py
+++ b/mod_ci/controllers.py
@@ -1521,6 +1521,17 @@ def finish_type_request(log, test_id, test, request):
     g.db.add(result)
     try:
         g.db.commit()
+        
+        # Update progress message with test count
+        if len(test.progress) > 0 and test.progress[-1].status == TestStatus.testing:
+            completed_tests = TestResult.query.filter(TestResult.test_id == test.id).count()
+            total_tests = len(test.get_customized_regressiontests())
+            
+            # Update the testing progress message
+            progress_message = f"Running tests ({completed_tests}/{total_tests})"
+            test.progress[-1].message = progress_message
+            g.db.commit()
+            log.debug(f"Updated progress for test {test_id}: {progress_message}")
     except IntegrityError as e:
         log.error(f"Could not save the results: {e}")
 
diff --git a/mod_test/controllers.py b/mod_test/controllers.py
index 82eb98d3..61a77fd1 100644
--- a/mod_test/controllers.py
+++ b/mod_test/controllers.py
@@ -212,11 +212,23 @@ def get_json_data(test_id):
             'message': entry.message
         })
 
+    # Calculate testing progress
+    test_progress = {}
+    if len(test.progress) > 0 and test.progress[-1].status == TestStatus.testing:
+        completed_tests = TestResult.query.filter(TestResult.test_id == test.id).count()
+        total_tests = len(test.get_customized_regressiontests())
+        test_progress = {
+            'completed': completed_tests,
+            'total': total_tests,
+            'percentage': int((completed_tests / total_tests * 100)) if total_tests > 0 else 0
+        }
+
     return jsonify({
         'status': 'success',
         'details': pr_data["progress"],
         'complete': test.finished,
-        'progress_array': progress_array
+        'progress_array': progress_array,
+        'test_progress': test_progress
     })
 
 
diff --git a/static/css/app.css b/static/css/app.css
index 6ae72b0b..5bbe5206 100644
--- a/static/css/app.css
+++ b/static/css/app.css
@@ -40,10 +40,11 @@ html[dark=''] {
 }
 
 .menu .active > a {
-    color: #fefefe;
-    background: #2199e8;
+    color: #ffffff;      /* white */
+    background: #0A3C7D; /* navy-ish dark blue */
 }
 
+
 /* Fixes to foundation framework */
 #application-menu {
     box-shadow: 0 0 10px hsla(0, 0%, 4%, 0.5);
@@ -100,9 +101,9 @@ html[dark=''] {
 }
 
 .to-light {
-    color: rgb(145, 255, 0);
-    background-color: white;
-}
+    color: #2B5B00;
+    background-color: #ffffff;
+  }
 
 .hidden {
     display: none;
@@ -246,7 +247,7 @@ ol.progtrckr li::before {
 }
 ol.progtrckr li.progtrckr-done::before {
     content: "\2713";
-    color: white;
+    color: #1B1B1B;
     background-color: yellowgreen;
     height: 1.2em;
     width: 1.2em;
@@ -256,7 +257,7 @@ ol.progtrckr li.progtrckr-done::before {
 }
 ol.progtrckr li.progtrckr-todo::before {
     content: "\039F";
-    color: silver;
+    color: #4A4A4A;
     background-color: #FEFEFE;
     font-size: 1.5em;
     bottom: -1.6em;
@@ -282,6 +283,23 @@ ol.progtrckr li.progtrckr-running.error {
     border-color: red;
 }
 
+/* Testing progress bar */
+.testing-progress-bar {
+    width: 80%;
+    margin: 0.5em auto 0;
+    height: 6px;
+    background-color: #e0e0e0;
+    border-radius: 3px;
+    overflow: hidden;
+}
+
+.testing-progress-fill {
+    height: 100%;
+    background-color: orange;
+    transition: width 0.5s ease;
+    border-radius: 3px;
+}
+
 .category-header {
     cursor: pointer;
 }
diff --git a/templates/test/by_id.html b/templates/test/by_id.html
index 8a92167d..1efffee4 100644
--- a/templates/test/by_id.html
+++ b/templates/test/by_id.html
@@ -48,9 +48,25 @@ <h1>Test progress for {{ title }}</h1>
                         {% if progress.progress.state == 'error' and progress.progress.step == loop.index0 -%}
                             {% set status = status ~ ' error' %}
                         {%- endif %}
-                        <li class="progtrckr-{{ status }}" id="trckr-{{ stage.description }}">{{ stage.description }}</li>
+                        <li class="progtrckr-{{ status }}" id="trckr-{{ stage.description }}">
+                            {{ stage.description }}
+                            {% if stage.value == 'testing' -%}
+                                <span id="testing-progress" style="font-size: 0.85em;">
+                                    {% if test.progress|length > 0 and test.progress[-1].status.value == 'testing' -%}
+                                        {% set completed = test.results|length %}
+                                        {% set total = test.get_customized_regressiontests()|length %}
+                                        {% if total > 0 -%}
+                                            ({{ completed }}/{{ total }})
+                                        {%- endif %}
+                                    {%- endif %}
+                                </span>
+                            {%- endif %}
+                        </li>
                     {%- endfor %}
                 </ol>
+                <div id="testing-progress-bar-container" class="testing-progress-bar" style="display: none;">
+                    <div id="testing-progress-bar-fill" class="testing-progress-fill" style="width: 0%;"></div>
+                </div>
                 <br class="clear" />
                 {% if test.progress|length > 0 %}
                     <input type="button" id="progress_button" class="button" value="Show test progress" />
@@ -58,7 +74,7 @@ <h1>Test progress for {{ title }}</h1>
                     <a target="_blank" class="button" href = "{{ url_for('test.download_build_log_file',test_id=test.id) }}">Download log file</a>
                     {% endif %}
                     <div style="overflow-x:auto;">
-                        <table id="progress_table" class="hide striped">
+                        <table class="hide striped">
                             <thead>
                             <tr>
                                 <th>Time</th>
@@ -163,6 +179,17 @@ <h6>There are no tests executed in this category.</h6>
         {% set progress = test.progress_data() %}
         var testprogress = {{ 1 if test.progress|length > 0 else 0 }};
         $(document).ready(function(){
+            // Show progress bar on initial load if testing
+            {% if test.progress|length > 0 and test.progress[-1].status.value == 'testing' -%}
+                {% set completed = test.results|length %}
+                {% set total = test.get_customized_regressiontests()|length %}
+                {% if total > 0 -%}
+                    var initialPercentage = {{ (completed / total * 100)|int }};
+                    $('#testing-progress-bar-container').show();
+                    $('#testing-progress-bar-fill').css('width', initialPercentage + '%');
+                {%- endif %}
+            {%- endif %}
+            
             {% if not test.finished %}
             var timer = setInterval(
                 function () {
@@ -208,6 +235,19 @@ <h6>There are no tests executed in this category.</h6>
                                     row += '</tr>'
                                 }
                                 $('#progress_table').html(row);
+                                
+                                // Update testing progress if available
+                                if (data.test_progress && data.test_progress.total > 0) {
+                                    var progressText = ' (' + data.test_progress.completed + '/' + data.test_progress.total + ')';
+                                    $('#testing-progress').text(progressText);
+                                    
+                                    // Show and update progress bar
+                                    $('#testing-progress-bar-container').show();
+                                    $('#testing-progress-bar-fill').css('width', data.test_progress.percentage + '%');
+                                } else {
+                                    $('#testing-progress').text('');
+                                    $('#testing-progress-bar-container').hide();
+                                }
                             } else{
                                 console.log(data.error);
                                 clearTimeout(timer);