diff --git a/bda/templates/bda-participants.html b/bda/templates/bda-participants.html
index cb94327d..3efeccc3 100644
--- a/bda/templates/bda-participants.html
+++ b/bda/templates/bda-participants.html
@@ -1,36 +1,39 @@
 {% extends "base_title.html" %}
+{% load staticfiles %}
 
 {% block realcontent %}
     <h2>{{ spectacle }}</h2>
-      <table class='table table-striped'>
+      <table class='table table-striped etat-bda'>
         <thead>
           <tr>
-          <th>Nom</th>
-          <th>Places</th>
-          <th>Adresse Mail</th>
-          <th>Payé</th>
-          <th>Donné</th>
+          <th data-sort="string">Nom</th>
+          <th data-sort="int">Places</th>
+          <th data-sort="string">Adresse Mail</th>
+          <th data-sort="string">Payé</th>
+          <th data-sort="string">Donné</th>
           </tr>
         </thead> 
+        <tbody>
         {% for participant in participants %}
-        <tr>
-          <td>{{participant.name}}</td>
-          <td>{{participant.nb_places}} place{{participant.nb_places|pluralize}}</td>
-          <td>{{participant.email}}</td>
-          <td class={%if participant.paid %}"greenratio"{%else%}"redratio"{%endif%}>
-            {% if participant.paid %}Oui{% else %}Non{%endif%}
-          </td>
-          <td class={%if participant.given == participant.nb_places %}"greenratio"
-                        {%elif participant.given == 0%}"redratio"
-                        {%else%}"orangeratio"
-                        {%endif%}>
-            {% if participant.given == participant.nb_places %}Oui
-            {% elif participant.given == 0 %}Non
-            {% else %}{{participant.given}}/{{participant.nb_places}}
-            {%endif%}
-          </td>
-        </tr>
-        {% endfor %}
+            <tr>
+                <td data-sort-value="{{ participan.name}}">{{participant.name}}</td>
+                <td data-sort-value="{{participant.nb_places}}">{{participant.nb_places}} place{{participant.nb_places|pluralize}}</td>
+                <td data-sort-value="{{participant.email}}">{{participant.email}}</td>
+                <td data-sort-value="{{ participant.paid}}" class={%if participant.paid %}"greenratio"{%else%}"redratio"{%endif%}>
+                {% if participant.paid %}Oui{% else %}Non{%endif%}
+            </td>
+            <td data-sort-value="{{participant.given}}" class={%if participant.given == participant.nb_places %}"greenratio"
+                            {%elif participant.given == 0%}"redratio"
+                            {%else%}"orangeratio"
+                            {%endif%}>
+                {% if participant.given == participant.nb_places %}Oui
+                {% elif participant.given == 0 %}Non
+                {% else %}{{participant.given}}/{{participant.nb_places}}
+                {%endif%}
+            </td>
+            </tr>
+            {% endfor %}
+        </tbody>
       </table>
     <h3><a href="{% url "admin:bda_attribution_add" %}?spectacle={{spectacle.id}}"><span class="glyphicon glyphicon-plus-sign"></span> Ajouter une attribution</a></h3>
       <br>
@@ -45,11 +48,20 @@
 {% endfor %}
       </pre>
 
-<script>
-function toggle(id) {
-    var pre = document.getElementById(id) ;
-    pre.style.display = pre.style.display == "none" ? "block" : "none" ;
-}
-</script>
+  <script type="text/javascript"
+          src="{% static "js/jquery.min.js" %}"></script>
+  <script type="text/javascript"
+          src="{% static "js/joequery-Stupid-Table-Plugin/stupidtable.js" %}"></script>
+    <script>
+    function toggle(id) {
+        var pre = document.getElementById(id) ;
+        pre.style.display = pre.style.display == "none" ? "block" : "none" ;
+    }
+    </script>
+    <script type="text/javascript">
+        $(function(){
+        $("table.etat-bda").stupidtable();
+        });
+    </script>
  
 {% endblock %}
diff --git a/bda/templates/etat-places.html b/bda/templates/etat-places.html
index 64e7846f..ebd15c38 100644
--- a/bda/templates/etat-places.html
+++ b/bda/templates/etat-places.html
@@ -3,7 +3,7 @@
 
 {% block realcontent %}
   <h2>État des inscriptions BdA</h2>
-  <table class="table table-striped">
+  <table class="table table-striped etat-bda">
     <thead>
       <tr>
 	<th data-sort="string">Titre</th>
diff --git a/bda/templates/resume_places.html b/bda/templates/resume_places.html
index 73a46aa9..4ed33e72 100644
--- a/bda/templates/resume_places.html
+++ b/bda/templates/resume_places.html
@@ -6,12 +6,18 @@
     <h3 class="error">Attention, vous avez reçu plusieurs places pour des spectacles différents à la même date !</h3>
     {% endif %}
     {% if places %}
-    <ol>
+    <table class="table table-striped">
         {% for place in places %}
-            <li>{{ place.spectacle }}{% if place.double %} (deux places){% endif %}</li>
+            <tr>
+                <td>{{place.spectacle.title}}</td>
+                <td>{{place.spectacle.location}}</td>
+                <td>{{place.spectacle.date_no_seconds}}</td>
+                <td>{% if place.double %}deux places{%else%}une place{% endif %}</td>
+            </tr>
         {% endfor %}
-    </ol>
-    <h4>Total à payer : {{ total|floatformat }}€</h4>
+    </table>
+    <h4 class="bda-prix">Total à payer : {{ total|floatformat }}€</h4>
+    <br/>
     <h4><a href="{% url "bda-places-attribuees-ics" tirage.id %}">Exporter au format calendrier</a> (.ics, compatible avec tous les logiciels d'agenda)</h4>
     {% else %}
     <h3>Vous n'avez aucune place :(</h3>
diff --git a/bda/templates/spectacle_list.html b/bda/templates/spectacle_list.html
index a21d278b..dedc655d 100644
--- a/bda/templates/spectacle_list.html
+++ b/bda/templates/spectacle_list.html
@@ -6,7 +6,7 @@
     <h3>Liste des spectacles</h3>
 
 
-    <table class="table table-striped table-hover">
+    <table class="table table-striped table-hover etat-bda">
         <thead>
         <tr>
             <th data-sort="string">Titre</th>
@@ -17,11 +17,11 @@
         </thead>
         <tbody>
         {% for spectacle in object_list %}
-        <tr class="clickable-row" data-href="{% url 'bda-spectacle' tirage_id spectacle.id %}"> 
+    <tr class="clickable-row" data-href="{% url 'bda-spectacle' tirage_id spectacle.id %}"> 
                 <td><a href="{% url 'bda-spectacle' tirage_id spectacle.id %}">{{ spectacle.title }} <span style="font-size:small;" class="glyphicon glyphicon-link" aria-hidden="true"></span></a></td>
                 <td data-sort-value="{{ spectacle.timestamp }}">{{ spectacle.date_no_seconds }}</td>
                 <td data-sort-value="{{ spectacle.location }}">{{ spectacle.location }}</td>
-                <td data-sort-value="{{ spectacle.ratio |stringformat:".3f" }}">
+                <td data-sort-value="{{ spectacle.price |stringformat:".3f" }}">
                                 {{ spectacle.price |floatformat  }}€
             </td>
         </tr>
diff --git a/gestioncof/static/css/cof.css b/gestioncof/static/css/cof.css
index 85e0ae65..21b38d97 100644
--- a/gestioncof/static/css/cof.css
+++ b/gestioncof/static/css/cof.css
@@ -558,15 +558,6 @@ h4.block-title {
     padding-bottom: 28px;
     padding-top: 8px;
 }
-/*
-.table-clicable tbody tr {
-    cursor: pointer;
-}
-
-.table-clicable tbody tr:hover,
-.table-clicable tbody tr:active {
-    background-color: #E8C2B8;
-}*/
 
 form#bda_form ul.errorlist li {
  padding-left: 0px;
@@ -1064,6 +1055,10 @@ th[data-sort]{
     cursor:pointer;
 }
 
+tbody tr.clickable-row {
+    cursor:pointer;
+}
+
 tr.awesome{
   color: red;
 }