diff --git a/src/java/bdd/gardeMySQL.java b/src/java/bdd/gardeMySQL.java
index cc90924..c82114d 100644
--- a/src/java/bdd/gardeMySQL.java
+++ b/src/java/bdd/gardeMySQL.java
@@ -36,7 +36,7 @@ public class gardeMySQL {
         int indiceDateFin = lesDates.length - 1;
         Pompier lePompier;
         PompierMySQL pm = new PompierMySQL();
-        ArrayList<Pompier> lesPompiers = pm.readLesPompiersCaserne(idCaserne);
+        ArrayList<Pompier> lesPompiers = pm.readLesPomprangeiersCaserne(idCaserne);
         for (Pompier unPompier : lesPompiers) {
             for (Calendar uneDate : lesDates) {
                 for (int unePeriode : lesPeriodes) {
diff --git a/src/java/servlet/GardesServlet.java b/src/java/servlet/GardesServlet.java
index 3e8fe20..b491698 100644
--- a/src/java/servlet/GardesServlet.java
+++ b/src/java/servlet/GardesServlet.java
@@ -91,7 +91,7 @@ public class GardesServlet extends HttpServlet {
             maSession.setAttribute("lesCouleurs", lesCouleurs);
         
          /* Affichage de la page de ventilation */
-        getServletContext().getRequestDispatcher("/WEB-INF/feuilleGardesJSP.jsp").forward(request, response);
+        getServletContext().getRequestDispatcher("/WEB-INF/feuilleGardes.jsp").forward(request, response);
     }
 
     /**
diff --git a/web/WEB-INF/feuilleGardes.jsp b/web/WEB-INF/feuilleGardes.jsp
index ffd469d..871d4e8 100644
--- a/web/WEB-INF/feuilleGardes.jsp
+++ b/web/WEB-INF/feuilleGardes.jsp
@@ -47,6 +47,14 @@
 </tr>
 
 </tbody>
+<div id="legendCouleur">
+                    
+                        <span  style="background-color: white">Dispo</span>
+                        <span  style="background-color: gray">Indispo</span>
+                        <span  style="background-color: yellow">Au travail</span>
+                        <span>De garde : X</span>
+                    
+                </div>
 
 </table>
 
diff --git a/web/WEB-INF/jspf/formulairePompier.jspf b/web/WEB-INF/jspf/formulairePompier.jspf
index fd9530b..77c8c47 100644
--- a/web/WEB-INF/jspf/formulairePompier.jspf
+++ b/web/WEB-INF/jspf/formulairePompier.jspf
@@ -127,48 +127,51 @@
                 </div><!-- fin ligne observation -->
             </div> <!-- fin observation -->
             <br/>
+            
+            
             <!-- tab disp -->
             <div>
                 <label for="tDisp">Disponibilitées</label>
                 <table border="1" cellspacing="3" cellpadding="1" class="table table-striped">
                     <thead>
-                        <tr>
-                    <c:forEach items="${sessionScope.lesDatesEnString}" var="uneDate" varStatus="status">
+                <tr>
+                    
+                        <c:forEach items="${sessionScope.lesDatesEnString}" var="uneDate" varStatus="status">
                         <th colspan="2" class="text-center">${uneDate}</th>
-                    </c:forEach>
-                    </tr>
-                    <tr>
+                        </c:forEach>
+                </tr>
+                <tr>
                     <c:forEach var="i" begin="0" end="4" step="1">
                         <c:forEach items="${sessionScope.lesPeriodes}" var="uneP" varStatus="status">
-                            <td class="text-center">${uneP}</td>
+                            <th class="text-center">${uneP}</th>
                         </c:forEach>
                     </c:forEach>
-                    </tr>
-                    </thead>
-                    <tbody>
-                        <c:set var="oldId" value="-1" scope="page"/>
-                        <tr>
-                            <c:forEach items="${sessionScope.lesVentilInit}" var="ventil" varStatus="status">
+                </tr>
+            </thead>
+            <tbody>
+                <c:set var="oldId" value="-1" scope="page"/>
+                <tr>
+                    <c:forEach items="${sessionScope.lesVentilInit}" var="ventil" varStatus="status">
                         <c:set var="newId" value="${gardes.getPompier().getId()}" scope="page"/>
                         <c:if test="${oldId != newId}" var="test" scope="page">
-                        </tr> <tr>
-                            <td>${ventil.getSalarie().getId()}</td>
-                            <td>${ventil.getSalarie().getNom()} ${ventil.getSalarie().getPrenom()}</td>
+                        </tr> <tr> 
+                            
+
                             <c:set var="oldId" value="${newId}" scope="page"/> 
                         </c:if>
-                            <c:set var="act" value="${gardes.getDisponibilite()}" scope="page"/>
+                        <c:set var="act" value="${gardes.getDisponibilite()}" scope="page"/>
                         <td><input type="text" value="${act}" name="lesAct" class="ztVentil ${sessionScope.lesCouleurs[act]}" readonly/></td>
 
                     </c:forEach>
-                        </tr>
-                    </tbody>
+                </tr>
+            </tbody>
                 </table>
                         <div id="legendCouleur">
                     
                         <span  style="background-color: white">Dispo</span>
                         <span  style="background-color: gray">Indispo</span>
                         <span  style="background-color: yellow">Au travail</span>
-                        
+                        <span>De garde : X</span>
                     
                 </div>
             </div>
diff --git a/web/css/mycss.css b/web/css/mycss.css
index 7f41c78..30f1ce5 100644
--- a/web/css/mycss.css
+++ b/web/css/mycss.css
@@ -84,3 +84,30 @@ aside, #btAfficherPompier {
 select[readonly] {
   pointer-events: none; 
 }
+.blanc {
+    background-color: white;
+    color: white; 
+    border-color : white;
+}
+
+.gris {
+    background-color: gray;
+    color: gray;
+    border-color: gray;
+}
+
+.jaune {
+    background-color: yellow;
+    color: yellow;
+    border-color: yellow;
+}
+
+.ztVentil {
+    width : 40%;
+    border: 3px solid;   
+    
+}
+
+.ztVentil:hover {
+    border-color: grey;    
+}