diff --git a/app/templates/assiduites/pages/calendrier.j2 b/app/templates/assiduites/pages/calendrier.j2
index 3b94e1bef6..3c6c091d31 100644
--- a/app/templates/assiduites/pages/calendrier.j2
+++ b/app/templates/assiduites/pages/calendrier.j2
@@ -6,9 +6,9 @@
     <h2>Assiduité de {{sco.etud.nomprenom}}</h2>
 
     <div class="options">
-        <label for="show_pres">afficher les présences</label><input type="checkbox" id="show_pres" name="show_pres">
-        <label for="show_reta">afficher les retards</label><input type="checkbox" name="show_reta" id="show_reta">
-        <label for="mode_demi">mode demi journée</label><input type="checkbox" name="mode_demi" id="mode_demi">
+        <input type="checkbox" id="show_pres" name="show_pres"><label for="show_pres">afficher les présences</label>
+        <input type="checkbox" name="show_reta" id="show_reta"><label for="show_reta">afficher les retards</label>
+        <input type="checkbox" name="mode_demi" id="mode_demi"><label for="mode_demi">mode demi journée</label>
     </div>
 
     <div class="calendrier">
@@ -51,7 +51,7 @@
         --color-present: #6bdb83;
         --color-absent: #F1A69C;
         --color-retard: #f0c865;
-        --color-nonwork: #bd81ca;
+        --color-nonwork: #badfff;
         --color-defaut: #FFF;
     }
 
@@ -85,6 +85,8 @@
         justify-content: space-evenly;
         flex-wrap: wrap;
         border: 1px solid #444;
+        border-radius: 12px;
+        margin-bottom: 12px;
     }
 
     .month h3 {
@@ -98,9 +100,9 @@
         text-align: center;
         margin: 2px;
         cursor: default;
-        font-size: 12px;
+        font-size: 13px;
         position: relative;
-        font-weight: bold;
+        font-weight: normal;
         min-width: 6em;
     }
 
@@ -172,7 +174,7 @@
         text-align: center;
         z-index: 1;
         width: 100%;
-        border: 1px solid black;
+        border: 1px solid #d5d5d5;
         /*border-radius: 3px;*/
     }
 
@@ -184,7 +186,13 @@
     .options>* {
         margin-right: 5px;
     }
-
+    .options input {
+        margin-right: 6px;
+    }
+    .options label {
+        font-weight: normal;
+        margin-right: 16px;
+    }
     @media print {
         .color.present {
             background-color: var(--color-present) !important;
@@ -578,4 +586,4 @@
 
     function isCalendrier() { return true }
 </script>
-{% endblock pageContent %}
\ No newline at end of file
+{% endblock pageContent %}