diff --git a/.DS_Store b/.DS_Store
index 09b0c07..6ba18a0 100644
Binary files a/.DS_Store and b/.DS_Store differ
diff --git a/index.html b/index.html
index c14b388..56bbaf4 100644
--- a/index.html
+++ b/index.html
@@ -6,65 +6,87 @@
     <title>Liste d'Équipes</title>
     <!-- Bootstrap CSS (via CDN) -->
     <link rel="stylesheet" href="https://stackpath.bootstrapcdn.com/bootstrap/4.3.1/css/bootstrap.min.css">
+    <style>
+        body {
+            background-color: #ffffff; /* Fond blanc */
+            color: #000000; /* Text color */
+            margin: 0;
+            padding: 0;
+        }
+        .header {
+            background: rgba(255, 255, 255, 0.8);
+            padding: 20px;
+            display: flex;
+            justify-content: space-between;
+            align-items: center;
+        }
+        .logo {
+            width: 150px;
+            height: auto;
+        }
+        .header-links {
+            display: flex;
+            align-items: center;
+        }
+        .header-links a {
+            color: #000000;
+            margin-right: 20px;
+            text-decoration: none;
+            font-weight: bold;
+        }
+        .header-links a:hover {
+            color: #ffffff;
+        }
+        .container {
+            background: linear-gradient(rgba(255, 255, 255, 0.8), rgba(255, 255, 255, 0.8)), /* White faded background */
+                        linear-gradient(to right, #0C2340, #1D428A, #006BB6); /* Background for the content */
+            padding: 20px;
+            border-radius: 10px;
+            margin-top: 20px;
+        }
+        .list-group-item {
+            display: flex;
+            justify-content: space-between;
+            align-items: center;
+            background-color: #1D428A;
+            color: #ffffff; /* Text color for list items */
+            border: none; /* Remove border */
+            margin-bottom: 5px; /* Adjust spacing between list items */
+        }
+        .button-group button {
+            margin-right: 5px;
+        }
+    </style>
 </head>
 <body>
-    <div class="container mt-5">
+    <div class="header">
+        <img src="static/Logo-NBA.png" alt="Logo NBA" class="logo">
+        <div class="header-links">
+            <a href="#">Accueil</a>
+            <a href="autre-page1.html">Autre Page 1</a>
+            <a href="autre-page2.html">Autre Page 2</a>
+            <!-- Ajoutez plus de liens au besoin -->
+        </div>
+    </div>
+
+    <div class="container">
         <h1 class="text-center mb-4">Liste d'Équipes</h1>
         <input type="text" id="searchInput" class="form-control mb-4" placeholder="Rechercher une équipe..." oninput="filterTeams()">
-        <ul id="teamList" class="list-group"></ul>
+        <ul id="teamList" class="list-group">
+            <li class="list-group-item">
+                Équipe 1
+                <div class="button-group">
+                    <button class="btn btn-success" onclick="ajouterEquipe(0)">+</button>
+                    <button class="btn btn-danger" onclick="enleverEquipe(0)">-</button>
+                </div>
+            </li>
+            <!-- Ajoutez plus d'équipes au besoin -->
+        </ul>
     </div>
 
     <!-- Bootstrap JS, Popper.js, and jQuery (via CDN) -->
     <script src="https://code.jquery.com/jquery-3.3.1.slim.min.js"></script>
     <script src="https://cdnjs.cloudflare.com/ajax/libs/popper.js/1.14.7/umd/popper.min.js"></script>
     <script src="https://stackpath.bootstrapcdn.com/bootstrap/4.3.1/js/bootstrap.min.js"></script>
-
-    <script>
-        // Liste d'équipes (exemple)
-        const teams = [
-            "Équipe 1",
-            "Équipe 2",
-            "Équipe 3",
-            "Équipe 4",
-            "Équipe 5",
-            "Équipe 6",
-            "Équipe 7",
-            "Équipe 8",
-            "Équipe 9",
-            "Équipe 10"
-            // Ajoutez plus d'équipes au besoin
-        ];
-
-        // Fonction pour afficher les équipes dans la liste
-        function displayTeams(filteredTeams) {
-            const teamList = document.getElementById("teamList");
-            teamList.innerHTML = "";
-
-            for (let i = 0; i < filteredTeams.length; i++) {
-                const teamItem = document.createElement("li");
-                teamItem.className = "list-group-item";
-                teamItem.textContent = filteredTeams[i];
-                teamItem.onclick = function () {
-                    alert("Vous avez cliqué sur " + filteredTeams[i]);
-                };
-
-                teamList.appendChild(teamItem);
-            }
-        }
-
-        // Affiche les cinq premières équipes par défaut
-        displayTeams(teams.slice(0, 5));
-
-        // Fonction pour filtrer les équipes en fonction de la recherche
-        function filterTeams() {
-            const searchInput = document.getElementById("searchInput");
-            const searchTerm = searchInput.value.toLowerCase();
-
-            const filteredTeams = teams.filter(team => team.toLowerCase().includes(searchTerm));
-
-            // Affiche les équipes filtrées
-            displayTeams(filteredTeams);
-        }
-    </script>
 </body>
 </html>
diff --git a/static/.DS_Store b/static/.DS_Store
new file mode 100644
index 0000000..c6f835d
Binary files /dev/null and b/static/.DS_Store differ
diff --git a/static/Logo-NBA.png b/static/Logo-NBA.png
new file mode 100644
index 0000000..f3b5896
Binary files /dev/null and b/static/Logo-NBA.png differ
