diff --git a/css/index.css b/css/index.css
index 20465b6..ff38268 100644
--- a/css/index.css
+++ b/css/index.css
@@ -163,7 +163,19 @@
     padding: 20px;
 }
   
-.card img {
+
+
+
+.card-doc {
+  margin-top: 5vh;
+  background-color: #dfdaba;
+  border-radius: 8px;
+  box-shadow: 0 4px 6px rgba(0, 0, 0, 0.1);
+  margin-bottom: 20px;
+  padding: 20px;
+}
+
+.card-doc img {
   width: 100%;
   height: auto;
   margin-bottom: 10px;
@@ -171,42 +183,42 @@
 
 }
 
-.card textarea{
+.card-doc textarea{
   width: 100%;
   height: 100vh;
   margin-bottom: 10px;
   border-radius: 7px;
 }
 
-.card embed{
+.card-doc embed{
   width: 100%;
   height: 50vh;
   margin-bottom: 10px;
 }
 
-.card iframe {
+.card-doc iframe {
   width: 100%;
   height: 50vh; 
 
 }
 
-.card video {
+.card-doc video {
   width: 100%;
   height: auto;
 
 }
 
-.card div {
+.card-doc div {
   margin-bottom: 10px;
   line-height: 1.5;
 }
 
-.card ul {
+.card-doc ul {
   padding-left: 20px;
   margin-bottom: 10px;
 }
 
-.card a{
+.card-doc a{
   width: fit-content;
   grid-column: auto;
 }
diff --git a/img/fox-reverse.gif b/img/fox-reverse.gif
new file mode 100644
index 0000000..8bc4050
Binary files /dev/null and b/img/fox-reverse.gif differ
diff --git a/index.php b/index.php
index 157c4d9..49d72c5 100644
--- a/index.php
+++ b/index.php
@@ -19,7 +19,6 @@
  /(__)\  )   /( (__  ) _ (     _)(_  )  ( \__ \ /(__)\ 
 (__)(__)(_)\_) \___)(_) (_)   (____)(_)\_)(___/(__)(__)
     </pre>
-
 </div>
 
     <h4>Comme vous pouvez le constater, on cherche quelqu'un pour le design (html + css) du site :D club.info@amicale-insat.fr</h4>
@@ -67,6 +66,7 @@
     <?php
         if(isset($_SESSION["utilisateur_authentifie"]) && ($_SESSION["utilisateur_authentifie"] == 1)){
             ?>
+    <img src="img/fox-reverse.gif">
 
 <div class="barre-recherche centre-horizontal">
         <form id="recherche_form">
diff --git a/js/index.js b/js/index.js
index 4defd8a..9ea0022 100644
--- a/js/index.js
+++ b/js/index.js
@@ -1,4 +1,89 @@
+function createDocumentCard(doc){
+    const card = document.createElement('div');
+    card.classList.add('card-doc');                
 
+    // on affiche le titre du résultat parce qu'on est pas des sauvages
+    let titre_ensemble;
+    titre_ensemble = document.createElement("h2");
+    titre_ensemble.innerText = "Document de l'archive";
+    titre_ensemble.setAttribute("onclick","document.location.href='ens.php?ensemble_id="+doc.ensemble_id.toString()+"'");
+    card.appendChild(titre_ensemble);
+
+    const buttonsDiv = document.createElement("div");
+    buttonsDiv.classList.add("ligne-boutons");
+    
+    // fichiers spéciaux ?
+
+    switch (doc.type) {
+        case 2: // image
+            const img = document.createElement('img');
+            img.src = doc.upload_path;
+            img.alt = doc.titre;
+            card.appendChild(img);
+
+            const imageLink = document.createElement('a');
+            imageLink.href = doc.upload_path;
+            imageLink.classList.add('lien');
+            imageLink.textContent = 'Voir image';
+            imageLink.target = '_blank';
+            buttonsDiv.appendChild(imageLink);
+            break;
+        case 3: // pdf
+            const embed = document.createElement('embed');
+            embed.src = doc.upload_path;
+            card.appendChild(embed);
+
+            const pdfLink = document.createElement('a');
+            pdfLink.href = doc.upload_path;
+            pdfLink.classList.add('lien');
+            pdfLink.textContent = 'Voir PDF en grand';
+            pdfLink.target = '_blank';
+            buttonsDiv.appendChild(pdfLink);
+            break;
+        case 4: // video
+            const video = document.createElement('video');
+            video.src = doc.upload_path;
+            video.controls = true;
+            card.appendChild(video);
+            break;
+        case 5:
+            const iframe = document.createElement('iframe');
+            iframe.src = doc.upload_path;
+            card.appendChild(iframe);
+            break;
+
+        case 1:
+            const textarea = document.createElement('textarea');
+            var xmlhttp, text;
+            xmlhttp = new XMLHttpRequest();
+            xmlhttp.open('GET', doc.upload_path, false);
+            xmlhttp.send();
+            text = xmlhttp.responseText;
+            textarea.value = text;
+            card.appendChild(textarea)
+            break;
+        default:
+            const unsupportedLink = document.createElement('a');
+            unsupportedLink.href = doc.upload_path;
+            unsupportedLink.classList.add('lien');
+            unsupportedLink.textContent = 'Type de fichier non supporté.';
+            unsupportedLink.target = '_blank';
+            buttonsDiv.appendChild(unsupportedLink);
+            break;
+    }
+
+    
+    const ele = document.createElement("a");
+    ele.innerText = "Voir tous les pdf de cet ensemble";
+    ele.href = `ens.php?ensemble_id=${doc.ensemble_id}`;
+    ele.classList.add("lien");
+
+    buttonsDiv.appendChild(ele);
+
+    card.appendChild(buttonsDiv);
+
+    return card;
+}
 async function rechercher(){
 
     var req = document.getElementById("recherche_input").value;
@@ -41,98 +126,37 @@ async function rechercher(){
     document.getElementById("liste_resultats").appendChild(titre);
     
     if(data.status == 1){
+        let ensemblesMap = new Map();
+
         data.resultats.forEach(doc => {
+            if (!ensemblesMap.has(doc.ensemble_id)) {
+                let ensembleDiv = document.createElement("div");
+                ensembleDiv.classList.add("ensemble");
+                ensembleDiv.classList.add("card");
 
+                let ensembleTitle = document.createElement("h2");
+                ensembleTitle.innerText = doc.ensemble_titre;
+                ensembleDiv.appendChild(ensembleTitle);
 
-            const card = document.createElement('div');
-            card.classList.add('card');                
+                let toggleButton = document.createElement("button");
+                toggleButton.innerText = "Entrevoir/Masquer les documents de cet ensemble";
+                toggleButton.setAttribute("data-ensemble-id", doc.ensemble_id);
+                toggleButton.classList.add("button");
+                toggleButton.classList.add("color-red-tr");
+                toggleButton.onclick = () => toggleVisibility(doc.ensemble_id);
+                ensembleDiv.appendChild(toggleButton);
 
-            // on affiche le titre du résultat parce qu'on est pas des sauvages
-            let titre_ensemble;
-            titre_ensemble = document.createElement("h2");
-            titre_ensemble.innerText = doc.titre;
-            titre_ensemble.setAttribute("onclick","document.location.href='ens.php?ensemble_id="+doc.ensemble_id.toString()+"'");
-            
-            card.appendChild(titre_ensemble);
+                let documentsDiv = document.createElement("div");
+                documentsDiv.classList.add("documents");
+                documentsDiv.id = "documents-" + doc.ensemble_id;
+                ensembleDiv.appendChild(documentsDiv);
 
-            const buttonsDiv = document.createElement("div");
-            buttonsDiv.classList.add("ligne-boutons");
-            
-            // fichiers spéciaux ?
-
-            switch (doc.type) {
-                case 2: // image
-                    const img = document.createElement('img');
-                    img.src = doc.upload_path;
-                    img.alt = doc.titre;
-                    card.appendChild(img);
-
-                    const imageLink = document.createElement('a');
-                    imageLink.href = doc.upload_path;
-                    imageLink.classList.add('lien');
-                    imageLink.textContent = 'Voir image';
-                    imageLink.target = '_blank';
-                    card.appendChild(imageLink);
-                    break;
-                case 3: // pdf
-                    const embed = document.createElement('embed');
-                    embed.src = doc.upload_path;
-                    card.appendChild(embed);
-
-                    const pdfLink = document.createElement('a');
-                    pdfLink.href = doc.upload_path;
-                    pdfLink.classList.add('lien');
-                    pdfLink.textContent = 'Voir PDF en grand';
-                    pdfLink.target = '_blank';
-                    card.appendChild(pdfLink);
-                    break;
-                case 4: // video
-                    const video = document.createElement('video');
-                    video.src = doc.upload_path;
-                    video.controls = true;
-                    card.appendChild(video);
-                    break;
-                case 5:
-                    const iframe = document.createElement('iframe');
-                    iframe.src = doc.upload_path;
-                    card.appendChild(iframe);
-                    break;
-
-                case 1:
-                    const textarea = document.createElement('textarea');
-                    var xmlhttp, text;
-                    xmlhttp = new XMLHttpRequest();
-                    xmlhttp.open('GET', doc.upload_path, false);
-                    xmlhttp.send();
-                    text = xmlhttp.responseText;
-                    textarea.value = text;
-                    card.appendChild(textarea)
-                    break;
-                default:
-                    const unsupportedLink = document.createElement('a');
-                    unsupportedLink.href = doc.upload_path;
-                    unsupportedLink.classList.add('lien');
-                    unsupportedLink.textContent = 'Type de fichier non supporté.';
-                    unsupportedLink.target = '_blank';
-                    buttonsDiv.appendChild(unsupportedLink);
-                    break;
+                document.getElementById("liste_resultats").appendChild(ensembleDiv);
+                ensemblesMap.set(doc.ensemble_id, documentsDiv);
             }
 
-            
-            const ele = document.createElement("a");
-            ele.innerText = "Voir tous les pdf de cet ensemble";
-            ele.href = `ens.php?ensemble_id=${doc.ensemble_id}`;
-            ele.classList.add("lien");
-
-            buttonsDiv.appendChild(ele);
-
-            card.appendChild(buttonsDiv);
-
-
-            document.getElementById("liste_resultats").appendChild(card);
-
-
-
+            let card = createDocumentCard(doc);
+            ensemblesMap.get(doc.ensemble_id).appendChild(card);
         });
     }
 }
@@ -153,7 +177,7 @@ async function gen_chronologie(){
     if(data.resultats.length > 0){
         // ensuite on ajoute un petit titre à la chronologie
         let titre = document.createElement("h1");
-        titre.innerText = "Documents récemment publiés";
+        titre.innerText = "Archives récemment publiées";
         document.getElementById("liste_resultats").appendChild(titre);
     }else{
         
@@ -162,101 +186,41 @@ async function gen_chronologie(){
     
     // et on remplis avec ce que l'api a généré
     if(data.status == 1){
+        let ensemblesMap = new Map();
+
         data.resultats.forEach(ens => {
+            ens.documents.forEach(doc => {
+                if (!ensemblesMap.has(doc.ensemble_id)) {
+                    let ensembleDiv = document.createElement("div");
+                    ensembleDiv.classList.add("ensemble");
+                    ensembleDiv.classList.add("card");
 
-            ens.documents.forEach(doc=>{
 
-                const card = document.createElement('div');
-                card.classList.add('card');                
+                    let ensembleTitle = document.createElement("h2");
+                    ensembleTitle.innerText = doc.titre;
+                    ensembleDiv.appendChild(ensembleTitle);
 
-                // on affiche le titre du résultat parce qu'on est pas des sauvages
-                let titre_ensemble;
-                titre_ensemble = document.createElement("h2");
-                titre_ensemble.innerText = doc.titre;
-                titre_ensemble.setAttribute("onclick","document.location.href='ens.php?ensemble_id="+doc.ensemble_id.toString()+"'");
-                
-                card.appendChild(titre_ensemble);
+                    let toggleButton = document.createElement("button");
+                    toggleButton.innerText = "Entrevoir/Masquer les documents de cet ensemble";
+                    toggleButton.setAttribute("data-ensemble-id", doc.ensemble_id);
+                    toggleButton.classList.add("button");
+                    toggleButton.classList.add("color-red-tr");
+                    toggleButton.onclick = () => toggleVisibility(doc.ensemble_id);
+                    ensembleDiv.appendChild(toggleButton);
 
-                const buttonsDiv = document.createElement("div");
-                buttonsDiv.classList.add("ligne-boutons");
-                
-                // fichiers spéciaux ?     
-                
-        
-                switch (doc.type) {
-                    case 2: // image
-                        const img = document.createElement('img');
-                        img.src = doc.upload_path;
-                        img.alt = doc.titre;
-                        card.appendChild(img);
-    
-                        const imageLink = document.createElement('a');
-                        imageLink.href = doc.upload_path;
-                        imageLink.classList.add('lien');
-                        imageLink.textContent = 'Voir image';
-                        imageLink.target = '_blank';
-                        buttonsDiv.appendChild(imageLink);
-                        break;
-                    case 3: // pdf
-                        const embed = document.createElement('embed');
-                        embed.src = doc.upload_path;
-                        card.appendChild(embed);
-    
-                        const pdfLink = document.createElement('a');
-                        pdfLink.href = doc.upload_path;
-                        pdfLink.classList.add('lien');
-                        pdfLink.textContent = 'Voir PDF en grand';
-                        pdfLink.target = '_blank';
-                        buttonsDiv.appendChild(pdfLink);
-                        break;
-                    case 4: // video
-                        const video = document.createElement('video');
-                        video.src = doc.upload_path;
-                        video.controls = true;
-                        card.appendChild(video);
-                        break;
-                    case 5:
-                        const iframe = document.createElement('iframe');
-                        iframe.src = doc.upload_path;
-                        card.appendChild(iframe);
-                        break;
-    
-                    case 1:
-                        const textarea = document.createElement('textarea');
-                        var xmlhttp, text;
-                        xmlhttp = new XMLHttpRequest();
-                        xmlhttp.open('GET', doc.upload_path, false);
-                        xmlhttp.send();
-                        text = xmlhttp.responseText;
-                        textarea.value = text;
-                        card.appendChild(textarea)
-                        break;
-                    default:
-                        const unsupportedLink = document.createElement('a');
-                        unsupportedLink.href = doc.upload_path;
-                        unsupportedLink.classList.add('lien');
-                        unsupportedLink.textContent = 'Type de fichier non supporté.';
-                        unsupportedLink.target = '_blank';
-                        buttonsDiv.appendChild(unsupportedLink);
-                        break;
+                    let documentsDiv = document.createElement("div");
+                    documentsDiv.classList.add("documents");
+                    documentsDiv.id = "documents-" + doc.ensemble_id;
+                    ensembleDiv.appendChild(documentsDiv);
+
+                    document.getElementById("liste_resultats").appendChild(ensembleDiv);
+                    ensemblesMap.set(doc.ensemble_id, documentsDiv);
                 }
 
-                
-                const ele = document.createElement("a");
-                ele.innerText = "Voir tous les pdf de cet ensemble";
-                ele.href = `ens.php?ensemble_id=${doc.ensemble_id}`;
-                ele.classList.add("lien");
-    
-                buttonsDiv.appendChild(ele);
-    
-                card.appendChild(buttonsDiv);
-
-                document.getElementById("liste_resultats").appendChild(card);
-
+                let card = createDocumentCard(doc);
+                card.style.display = "none";
+                ensemblesMap.get(doc.ensemble_id).appendChild(card);
             });
-
-            
-
         });
     }
 }
@@ -299,3 +263,12 @@ document.addEventListener("DOMContentLoaded", (event)=>{
 
 });
 
+function toggleVisibility(ensembleId) {
+    let documentsDiv = document.getElementById("documents-" + ensembleId);
+    
+    let cards = documentsDiv.getElementsByClassName("card-doc");
+
+    for(i = 0;i<cards.length;i++){
+        cards[i].style.display = cards[i].style.display === "none" ? "block" : "none";
+    }
+}
\ No newline at end of file