diff --git a/assets/contracts/background.png b/assets/contracts/background.png
new file mode 100644
index 0000000..eae0e86
Binary files /dev/null and b/assets/contracts/background.png differ
diff --git a/assets/contracts/contractscreen.png b/assets/contracts/contractscreen.png
index 183cec4..4d7b07a 100644
Binary files a/assets/contracts/contractscreen.png and b/assets/contracts/contractscreen.png differ
diff --git a/assets/contracts/procurement.png b/assets/contracts/procurement.png
index c6be4fc..1adf5bf 100644
Binary files a/assets/contracts/procurement.png and b/assets/contracts/procurement.png differ
diff --git a/assets/contracts/screen.png b/assets/contracts/screen.png
new file mode 100644
index 0000000..183cec4
Binary files /dev/null and b/assets/contracts/screen.png differ
diff --git a/assets/contracts/shuttle.png b/assets/contracts/shuttle.png
index 609d433..3894798 100644
Binary files a/assets/contracts/shuttle.png and b/assets/contracts/shuttle.png differ
diff --git a/assets/contracts/transportation.png b/assets/contracts/transportation.png
index 82bc984..b0fe1b4 100644
Binary files a/assets/contracts/transportation.png and b/assets/contracts/transportation.png differ
diff --git a/css/global.css b/css/global.css
index 24e408a..8acb130 100644
--- a/css/global.css
+++ b/css/global.css
@@ -5,6 +5,7 @@
 body,
 html {
   height: 100%;
+  background-image: url("/assets/contracts/contractscreen.png");
 }
 
 
@@ -43,10 +44,11 @@ html {
 .contract-screen {
   display: flex;
   justify-content: center;
-  background-image: url("/assets/contracts/contractscreen.png");
+  background-image: url("/assets/contracts/screen.png");
   background-repeat: no-repeat;
   background-position: center;
   height: 100vh;
+  width: 100%;
 
 }
 
@@ -56,10 +58,10 @@ html {
   margin-left: 200px;
   margin-top: -160px;
   width: 100%;
+  border-width: 100px;
 }
 
 .card-body button {
-  margin-top: 50px;
   margin-right: 29px;
   margin-left: -11px;
   width: 240px;
@@ -69,7 +71,6 @@ html {
   margin-left: 240px;
   margin-top: 225px;
   height: 100vh;
-  width: 100vh;
 }
 
 /* Modal */
diff --git a/css/style.css b/css/style.css
index b8a021c..f1983a0 100644
--- a/css/style.css
+++ b/css/style.css
@@ -30,7 +30,8 @@ body {
     margin: 10px;
     width: fit-content;
     margin: auto;
-    margin-top: 10px; margin-bottom: 30px;
+    margin-top: 10px;
+    margin-bottom: 30px;
     flex-direction: column;
     align-items: center;
     border: 4px solid rgba(68, 68, 68, 0.575);
@@ -43,7 +44,8 @@ body {
     margin: 10px;
     width: 95%;
     margin: auto;
-    margin-top: 10px; margin-bottom: 30px;
+    margin-top: 10px;
+    margin-bottom: 30px;
     flex-direction: column;
     align-items: center;
     border: 4px solid rgba(68, 68, 68, 0.575);
@@ -102,7 +104,7 @@ footer {
 }
 
 .nav-nav .nav-links {
-    --links-color: rgb(0,0,0);
+    --links-color: rgb(0, 0, 0);
     --links-backcolor: rgb(255, 123, 71);
     --links-border-color: rgb(255, 173, 118);
     height: 70%;
@@ -114,7 +116,7 @@ footer {
     margin-right: 10px;
     background-color: var(--links-backcolor);
     color: var(--links-color);
-    border: 4px solid var(--links-border-color); 
+    border: 4px solid var(--links-border-color);
     list-style: none;
     display: flex;
     justify-content: center;
@@ -177,8 +179,8 @@ footer {
     border-radius: 10px;
     padding: 30px;
     font-size: 5px;
-    white-space:pre-wrap;
-    word-break:break-word;
+    white-space: pre-wrap;
+    word-break: break-word;
 }
 
 .my-modal #timer {
diff --git a/html/templates/contracts/contracts.html b/html/templates/contracts/contracts.html
index 429133b..393bf01 100644
--- a/html/templates/contracts/contracts.html
+++ b/html/templates/contracts/contracts.html
@@ -3,6 +3,6 @@
     <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" />
+    <input type="image" id="leftarrow" alt="" src="/assets/contracts/leftarrow.png" />
+    <input type="image" id="rightarrow" alt="" 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 24392fb..86072f9 100644
--- a/js/controllers/contracts.js
+++ b/js/controllers/contracts.js
@@ -28,8 +28,6 @@ export default (temp_engine) => {
               $(e.target).parent().children(".status-onhold").html("Status : accepté");
               $(e.target).parent().children(".status-onhold").attr("class", 'status-accepted');
               $(e.target).html("Contract accepted")
-              // $(e.target).remove();
-
             });
           }
         });
@@ -86,9 +84,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}" class="btn-modify btn btn-primary btn-accept" data-toggle="modal" data-target="#Modify" >Contract accepted</button>                      
+                        <p></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>  
                       </div>
                     </div>
             `
@@ -117,9 +115,6 @@ export default (temp_engine) => {
         }
 
         $('.contracts').append(card);
-        $('.contracts').append(card);
-
-
 
       });