diff --git a/styles.css b/styles.css
index dd89a64e914776667f822c2ccea82d845ffb10b3..e1080cd51d5d7001bc0fc65871065f642300b7a6 100644
--- a/styles.css
+++ b/styles.css
@@ -420,12 +420,30 @@ ul.nav.navbar-nav.ml-auto {
     display: inline-block;
     /* height: 24px; */
     /* width: 24px; */
-    min-height: 1.5rem;
+    height: 1.5rem;
     position: relative;
     margin-left: .25rem;
     margin: auto;
-    /* margin-top: .4rem;
+    text-align: center;
+    /* margin-top: .4rem;*/
 }
+
+.iena-prog-bubble .icon-progress{
+	line-height: 25px;
+
+}
+
+.iena-prog-link{
+	display: block;
+	display: block;
+    width: 100%;
+    height: 100%;
+    position: absolute;
+    /* float: right; */
+    top: 0;
+}
+
+
 /* .iena-h-prog-mod-item.iena-g-prog-done {
 	background-color: #009085;
 	border-color: 1px solid red;
@@ -558,20 +576,24 @@ th.th-rotate > div > span {
 .state-0 span.icon-progress, .state-1 span.icon-progress, .state-2 span.icon-progress, .state-3 span.icon-progress{
 	content: "";
 	display: block;
+	color: white;
 }
 
 .state-1 span.icon-progress::after{
 	content: "\f1db";
 	font-family: FontAwesome; width: 100%; display: inline-block; 
+	color: white;
 }
 
 .state-2 span.icon-progress::after{
 	content: "\f05d";
 	font-family: FontAwesome; width: 100%; display: inline-block; text-align: center;
+	color: white;
 }
 .state-3 span.icon-progress::after{
 	content: "\f1db";
 	font-family: FontAwesome; width: 100%; display: inline-block; text-align: center;
+	color: white;
 }	
 
 
diff --git a/suivi_unit.php b/suivi_unit.php
index 8332776bd0297dde61190e57afdb7a3691047a0d..5005e0c1c3942a05ea823cb13d44bfcb8197c83c 100644
--- a/suivi_unit.php
+++ b/suivi_unit.php
@@ -290,15 +290,10 @@ $data["groups"]=array_values($groups);
 $data["modules"]=$modules;
 
 
-ini_set('xdebug.var_display_max_depth', 99);
-
-
-
 $data["students"]=format_progress($progress, $modules);
 
 
 
-
 // If a post is sent trought the page
 if ($_POST) {
 	require_once("$CFG->libdir/formslib.php");
diff --git a/templates/course-header.mustache b/templates/course-header.mustache
index 31d931cf35615f029df0a1127e21a58e749e8020..5c749eeccc2c2f9d35a2bb57b53c2f9c01240eee 100644
--- a/templates/course-header.mustache
+++ b/templates/course-header.mustache
@@ -24,15 +24,20 @@
 						</div>
 						<div class="iena-prog-label">{{completion}}%</strong> terminé</div>
 					</div>
+					<div class="iena-prog-bubbles">
 					{{#modules}}
 
 						<!-- <a href="{{url}}" class="iena-h-prog-mod-item iena-g-prog-{{completion}}"><span>{{name}}</span></a> -->
-
-						<a href="{{url}}" class="iena-h-prog-mod-item state-{{completion}}">
-							<!--<span class="icon-progress"></span>-->
-							<span class="popover-module">{{name}}</span>
-						</a>
+						<div class="iena-prog-bubble iena-h-prog-mod-item state-{{completion}}">
+							
+							<span class="icon-progress"></span>
+							<a href="{{url}}" class="iena-prog-link">
+								
+								<span class="popover-module">{{name}}</span>
+							</a>
+						</div>
 					{{/modules}}
+					</div>
 					
 				</div>
 			{{/progress_sections}}