diff --git a/assets/contracts/leftarrow.png b/assets/contracts/leftarrow.png
new file mode 100644
index 0000000..787f82a
Binary files /dev/null and b/assets/contracts/leftarrow.png differ
diff --git a/assets/contracts/rightarrow.png b/assets/contracts/rightarrow.png
new file mode 100644
index 0000000..997099b
Binary files /dev/null and b/assets/contracts/rightarrow.png differ
diff --git a/css/global.css b/css/global.css
index 3e479ab..24e408a 100644
--- a/css/global.css
+++ b/css/global.css
@@ -67,7 +67,7 @@ html {
 
 .contracts {
   margin-left: 240px;
-  margin-top: 250px;
+  margin-top: 225px;
   height: 100vh;
   width: 100vh;
 }
@@ -80,4 +80,20 @@ html {
 
 .status-accepted {
   color: greenyellow;
+}
+
+#leftarrow {
+  width: 50px;
+  height: 50px;
+}
+
+#rightarrow {
+  width: 50px;
+  height: 50px;
+}
+
+.arrows {
+  text-align: center;
+
+
 }
\ No newline at end of file
diff --git a/html/templates/contracts/contracts.html b/html/templates/contracts/contracts.html
index de05fa8..429133b 100644
--- a/html/templates/contracts/contracts.html
+++ b/html/templates/contracts/contracts.html
@@ -1,4 +1,8 @@
 <link rel="stylesheet" href="css/global.css">
 <div class="contract-screen">
     <div class="contracts"></div>
+</div>
+<div class="arrows">
+    <input type="image" id="leftarrow" alt="Login" src="/assets/contracts/leftarrow.png" />
+    <input type="image" id="rightarrow" alt="Login" src="/assets/contracts/rightarrow.png" />
 </div>
\ No newline at end of file
diff --git a/js/controllers/contracts.js b/js/controllers/contracts.js
index 941379e..24392fb 100644
--- a/js/controllers/contracts.js
+++ b/js/controllers/contracts.js
@@ -86,7 +86,9 @@ export default (temp_engine) => {
                         <p style="color:white" class="card-text">${contract.deadline}</p>
                         <p style="color:white" class="card-text">${contract.deadline}</p>
                         <p class="card-text status-accepted">Status : ${status}</p>
-                        <button data-id="${contract.id}" type="button" class="btn btn-primary btn-infos" data-bs-toggle="modal" data-bs-target="#exampleModal">Infos</button>                      
+                        <button data-id="${contract.id}" class="btn-modify btn btn-primary btn-accept" data-toggle="modal" data-target="#Modify" >Contract accepted</button>                      
+                        <button data-id="${contract.id}" type="button" class="btn btn-primary btn-infos" data-bs-toggle="modal" data-bs-target="#exampleModal">Infos</button> 
+                        
                       </div>
                     </div>
             `
@@ -111,13 +113,14 @@ export default (temp_engine) => {
                         <button data-id="${contract.id}" class="btn-modify btn btn-primary btn-accept" data-toggle="modal" data-target="#Modify" >Accepter</button>                       
                       </div>
                     </div>
-                  `
+            `
         }
 
         $('.contracts').append(card);
         $('.contracts').append(card);
 
 
+
       });
 
     })