diff --git a/frontend/static/views/theme.html b/frontend/static/views/theme.html
index 4922a3c2..50b0215e 100644
--- a/frontend/static/views/theme.html
+++ b/frontend/static/views/theme.html
@@ -1,24 +1,49 @@
-<div class="jumbotron niceborder text-indent mt-2 mb-4">
-  <p class="lead text-justify" ng-bind-html="themes[current_theme].headline"></p>
-  <p class="text-justify" ng-bind-html="themes[current_theme].intro"></p>
-</div>
-
-<div class="card niceborder mb-5">
-  <ul class="list-group" ng-repeat="(k,exercice) in themes[current_theme].exercices">
-    <li class="list-group-item">
-      <a ng-href="tags/{{tag}}" class="badge badge-pill badge-secondary ml-1 float-right" ng-repeat="tag in themes[current_theme].exercices[k].tags">#{{tag}}</a>
-      <h5 class="card-title">
-	<a ng-href="{{ themes[current_theme].urlid }}/{{ themes[current_theme].exercices[k].urlid }}" ng-if="my.exercices[k]">
-	  {{ exercice.title }}
-	</a>
-	<span ng-if="!my.exercices[k]">
-	  <span class="glyphicon glyphicon-lock" aria-hidden="true" title="Vous n'avez pas encore accès à ce défi"></span>
-	  {{ exercice.title }}
-	</span>
-	<span class="glyphicon glyphicon-ok" aria-hidden="true" ng-if="(my.team_id && my.exercices[k].solved)"></span>
-	<span class="glyphicon glyphicon-gift" aria-hidden="true" ng-if="themes[current_theme].exercices[k].curcoeff > 1.0" title="Un bonus est actuellement appliqué lors de la résolution de ce défi"></span>
-      </h5>
-      <p class="card-text" ng-bind-html="exercice.headline"></p>
+<div class="card niceborder text-indent mt-2 mb-4">
+  <div class="card-body bg-dark">
+    <p class="mt-4 mr-3 ml-3 card-text lead text-justify" ng-bind-html="themes[current_theme].headline"></p>
+    <p class="mb-4 mr-3 ml-3 card-text text-justify" ng-bind-html="themes[current_theme].intro"></p>
+  </div>
+  <ul class="list-group">
+    <li class="list-group-item" ng-repeat="(k,exercice) in themes[current_theme].exercices">
+      <div class="row">
+      <div class="col-1" style="margin-top: -0.75rem; margin-bottom: -0.75rem; text-align: right">
+	<svg style="height: 120px; max-height: 100%; width: 23px;">
+	  <rect
+	    style="fill:#{{ my.exercices[k].solved ? '62c462' : 'aaa' }}"
+	    width="5"
+	    height="200"
+	    x="10"
+	    y="0" />
+	  <rect
+	    style="fill:#{{ my.exercices[k] ? '62c462' : 'aaa' }}"
+	    width="5"
+	    height="30"
+	    x="10"
+	    y="0" />
+	  <path
+	    style="fill:#{{ my.exercices[k] ? (my.exercices[k].solved ? '62c462' : (themes[current_theme].exercices[k].curcoeff > 1.0 ? 'f89406' : '5bc0de')) : 'aaa' }}"
+	    d="m 22,24 a 9.5700617,9.5700617 0 0 1 -9.5690181,9.57006 9.5700617,9.5700617 0 0 1 -9.57110534,-9.56797 9.5700617,9.5700617 0 0 1 9.56692984,-9.57215 9.5700617,9.5700617 0 0 1 9.5731926,9.56588" />
+	</svg>
+      </div>
+      <div class="col-10">
+	<a ng-href="tags/{{tag}}" class="badge badge-pill badge-secondary ml-1 float-right" ng-repeat="tag in themes[current_theme].exercices[k].tags">#{{tag}}</a>
+	<h5>
+	  <a ng-href="{{ themes[current_theme].urlid }}/{{ themes[current_theme].exercices[k].urlid }}" ng-if="my.exercices[k]">
+	    {{ exercice.title }}
+	  </a>
+	  <span ng-if="!my.exercices[k]" style="white-space: nowrap">
+	    <span class="glyphicon glyphicon-lock" aria-hidden="true" title="Vous n'avez pas encore accès à ce défi"></span>
+	    {{ exercice.title }}
+	  </span>
+	  <span class="glyphicon glyphicon-gift" aria-hidden="true" ng-if="themes[current_theme].exercices[k].curcoeff > 1.0" title="Un bonus est actuellement appliqué lors de la résolution de ce défi"></span>
+	</h5>
+	<p ng-bind-html="exercice.headline"></p>
+      </div>
+      <div class="col-1">
+	<a ng-if="my.exercices[k]" class="float-right" ng-href="{{ themes[current_theme].urlid }}/{{ themes[current_theme].exercices[k].urlid }}" style="font-size: 3rem"><span class="glyphicon glyphicon-chevron-right" aria-hidden="true"></span></a>
+	<span ng-if="!my.exercices[k]" class="float-right" style="font-size: 3rem"><span class="glyphicon glyphicon-chevron-right" aria-hidden="true"></span></span>
+      </div>
+      </div>
     </li>
   </ul>
 </div>