diff --git a/css/style.css b/css/style.css
index b9d1871..a448560 100644
--- a/css/style.css
+++ b/css/style.css
@@ -1,25 +1,3 @@
-header .cv-container {
-    position: absolute;
-    right: 25%; 
-    transform: translateX(25%);
-}
-
-#cv-download-button {
-    padding: 8px 15px;
-    background: #FFF;
-    color: #173964;
-    border: none;
-    border-radius: 5px;
-    cursor: pointer;
-    transition: background-color 0.3s ease;
-}
-
-#cv-download-button:hover {
-    background: #1A4D7B;
-    color: #FFF;
-}
-
-/* Autres styles */
 body {
     background: #011C2D;
     margin: 0;
@@ -90,7 +68,7 @@ header .left-pane a, header .right-pane a {
     display: block;
 }
 
-header .left-pane a.active, header .right-pane li:hover {
+header .left-pane a.active, header .right-pane li:hover, header .right-pane li.selected {
     background: #1A4D7B;
     border-radius: 5px;
 }
@@ -98,7 +76,7 @@ header .left-pane a.active, header .right-pane li:hover {
 header .right-pane .file-item {
     text-align: center;
     width: 100px; 
-    height: 100px; 
+    height: 100px;
     display: flex;
     flex-direction: column;
     align-items: center;
@@ -129,6 +107,27 @@ header .right-pane .file-item:hover a {
     background: none; 
 }
 
+.cv-container {
+    position: absolute;
+    right: 50%;
+    transform: translateX(50%);
+}
+
+#cv-download-button {
+    padding: 8px 15px;
+    background: #FFF;
+    color: #173964;
+    border: none;
+    border-radius: 5px;
+    cursor: pointer;
+    transition: background-color 0.3s ease;
+}
+
+#cv-download-button:hover {
+    background: #1A4D7B;
+    color: #FFF;
+}
+
 .container {
     flex: 1;
     display: flex;
@@ -136,7 +135,7 @@ header .right-pane .file-item:hover a {
     align-items: center;
 }
 
-#sub-sections{
+#sub-sections {
     flex: 1;
     display: flex;
     flex-wrap: wrap;
@@ -162,4 +161,4 @@ header .right-pane .file-item:hover a {
 
 .sheet p, .sheet h3 {
     margin: 15px 0;
-}
\ No newline at end of file
+}
diff --git a/js/.script.js.swp b/js/.script.js.swp
new file mode 100644
index 0000000..bf7d1d7
Binary files /dev/null and b/js/.script.js.swp differ
diff --git a/js/script.js b/js/script.js
index 35cfd29..8844285 100644
--- a/js/script.js
+++ b/js/script.js
@@ -1,66 +1,60 @@
-document.addEventListener('DOMContentLoaded', function ()
-{
+document.addEventListener('DOMContentLoaded', function () {
     const globalSections = document.getElementById('global-sections');
     const subSections = document.getElementById('sub-sections');
     const contentDisplay = document.getElementById('content-display');
 
-    const sectionsData = 
-    {
-        about:
-	{
+    const sectionsData = {
+        about: {
             name: 'About',
             items: []
         },
-        projects:
-	{
+        projects: {
             name: 'Projects',
             items: [
                 {
-			filename: 'ft_42',
-			filextension: '.css',
-			title: 'ft_42.css Project',
-			content: 'Contenu du projet ft_42.css',
-			repo: 'https://github.com/user/ft_42'
-		},
+                    filename: 'ft_42',
+                    filextension: '.css',
+                    title: 'ft_42.css Project',
+                    content: 'Contenu du projet ft_42.css',
+                    repo: 'https://github.com/user/ft_42'
+                },
                 {
-			filename: 'Maquette',
-			filextension: '.html',
-			title: 'Maquette Project',
-			content: 'Contenu du projet Maquette.html',
-			repo: 'https://github.com/user/Maquette'
-		},
+                    filename: 'Maquette',
+                    filextension: '.html',
+                    title: 'Maquette Project',
+                    content: 'Contenu du projet Maquette.html',
+                    repo: 'https://github.com/user/Maquette'
+                },
                 {
-			filename: 'Mont-blanc',
-			filextension: '.LDA',
-			title: 'Mont-blanc (LDA) Project',
-			content: 'Contenu du projet Mont-blanc (LDA)',
-			repo: 'https://github.com/user/Mont-blanc'
-		},
+                    filename: 'Mont-blanc',
+                    filextension: '.LDA',
+                    title: 'Mont-blanc (LDA) Project',
+                    content: 'Contenu du projet Mont-blanc (LDA)',
+                    repo: 'https://github.com/user/Mont-blanc'
+                },
                 {
-			filename: 'test',
-			filextension: '.test',
-			title: 'test',
-			content: 'Contenu du projet test',
-			repo: 'https://github.com/user/test'
-		}
+                    filename: 'test',
+                    filextension: '.test',
+                    title: 'test',
+                    content: 'Contenu du projet test',
+                    repo: 'https://github.com/user/test'
+                }
             ]
         },
-        contact:
-	{
+        contact: {
             name: 'Contact',
             items: []
         },
-        readme:
-	{
+        readme: {
             name: 'Readme',
             items: [
                 {
-			filename: 'README',
-			filextension: '.md',
-			title: 'README',
-			content: 'Contenu du README.md',
-			repo: 'https://github.com/user/repo'
-		}
+                    filename: 'README',
+                    filextension: '.md',
+                    title: 'README',
+                    content: 'Contenu du README.md',
+                    repo: 'https://github.com/user/repo'
+                }
             ]
         }
     };
@@ -76,13 +70,11 @@ document.addEventListener('DOMContentLoaded', function ()
 
     const sectionElements = document.querySelectorAll('#global-sections .section');
 
-    function displaySectionContent(sectionName)
-    {
+    function displaySectionContent(sectionName) {
         document.querySelector('.nav-link.active')?.classList.remove('active');
         document.querySelector(`[data-section="${sectionName}"] .nav-link`).classList.add('active');
 
-        if (sectionName === 'readme')
-	{
+        if (sectionName === 'readme') {
             subSections.innerHTML = '';
 
             const item = sectionsData.readme.items[0];
@@ -106,34 +98,33 @@ document.addEventListener('DOMContentLoaded', function ()
                 <a href="#" class="sub-link" data-content="${item.content}" data-title="${item.title}" data-repo="${item.repo}">${item.filename}${item.filextension}</a>
             `;
             subSections.appendChild(li);
+
+            // Ajouter un événement de clic pour chaque sous-section
+            li.addEventListener('click', function (e) {
+                e.preventDefault();
+                document.querySelector('.file-item.selected')?.classList.remove('selected');
+                li.classList.add('selected');
+
+                const content = li.querySelector('.sub-link').getAttribute('data-content');
+                const title = li.querySelector('.sub-link').getAttribute('data-title');
+                const repo = li.querySelector('.sub-link').getAttribute('data-repo');
+                contentDisplay.innerHTML = `
+                    <div class="sheet">
+                        <h1>${title}</h1>
+                        <p>${content}</p>
+                        <p><a href="${repo}" target="_blank">Repository</a></p>
+                    </div>
+                `;
+            });
         });
     }
 
     sectionElements.forEach(section => {
-        section.addEventListener('click', function ()
-	{
+        section.addEventListener('click', function () {
             const sectionName = this.getAttribute('data-section');
             displaySectionContent(sectionName);
         });
     });
 
-    subSections.addEventListener('click', function (e)
-    {
-        if (e.target.classList.contains('sub-link') || e.target.classList.contains('file-img'))
-	{
-            e.preventDefault();
-            const content = e.target.getAttribute('data-content');
-            const title = e.target.getAttribute('data-title');
-            const repo = e.target.getAttribute('data-repo');
-            contentDisplay.innerHTML = `
-                <div class="sheet">
-                    <h1>${title}</h1>
-                    <p>${content}</p>
-                    <p><a href="${repo}" target="_blank">Repository</a></p>
-                </div>
-            `;
-        }
-    });
-
     displaySectionContent('readme');
 });