diff --git a/css/contracts.css b/css/contracts.css
index 853c789..2663cc2 100644
--- a/css/contracts.css
+++ b/css/contracts.css
@@ -39,7 +39,7 @@
 .card-button{
   margin-top: 10px;
 }
-.btn-infos{
+/* .btn-infos{
   background-color: transparent;
   border-color: rgb(0,255,0);
   font-size: 15pt;
@@ -60,7 +60,7 @@
   transition: 0.2s;
   color: rgb(208, 255, 0);
   border-color: rgb(208, 255, 0);
-}
+} */
 .img
 {
   position: absolute;
diff --git a/css/global.css b/css/global.css
index 967c74f..7809461 100644
--- a/css/global.css
+++ b/css/global.css
@@ -20,11 +20,11 @@ body{
     margin: 0;
     padding: 0;
 }
-
+/* 
 button{
     font-family: var(--text-familly);
     color: var(--text-color);
-}
+} */
 
 input{
     font-family: var(--text-familly);
@@ -113,19 +113,49 @@ select {
     font-size: 20px;
 }
 
-.base-btn{
+/* .base-btn{
     margin: 2px;
     padding: 10px;
     border: none;
     border-radius: 5px;
     background-color: var(--sec-color);
     font-size: 20px;
+} */
+button, .button {
+    background-color: #1a1a1a; 
+    color: #ffffff; 
+    border: 2px solid #ffffff;
+    padding: 10px; 
+    font-size: 13px; 
+    cursor: pointer; 
+    border-radius: 5px; 
+    transition: background-color 0.3s, color 0.3s, border-color 0.3s; 
 }
 
-.base-btn:hover{
-    box-shadow: 1px 1px 1px 0px rgba(88, 88, 252, 0.842);
+button:hover, .button:hover {
+    background-color: #ffffff; 
+    color: #1a1a1a; 
+    border-color: #1a1a1a; 
+}
+
+button:active, .button:active {
+    background-color: #333333; 
+    color: #ffffff; 
+    border-color: #ffffff; 
 }
 
+button:disabled, .button:disabled {
+    background-color: #555555; 
+    color: #b3b3b3; 
+    border-color: #b3b3b3; 
+    cursor: not-allowed; 
+    opacity: 0.6; 
+}
+
+/* .base-btn:hover{
+    box-shadow: 1px 1px 1px 0px rgba(88, 88, 252, 0.842);
+} */
+
 .base-select {
     margin: 5px;
     padding: 10px;
diff --git a/html/templates/ships/ships.html b/html/templates/ships/ships.html
index fc31222..4c1444c 100644
--- a/html/templates/ships/ships.html
+++ b/html/templates/ships/ships.html
@@ -2,12 +2,5 @@
 <div class="block-ships">
   <a class="prev">❮</a>
   <a class="next">❯</a>
-  <div class="buttonShip">
-    <button id="" class="reg base-btn" data-symbol="">Name</button>
-    <button id="" class="nav base-btn" data-symbol="">Navigation</button>
-    <button id="" class="crew base-btn" data-symbol="">Crew</button>
-    <button id="" class="frame base-btn" data-symbol="">Frame</button>
-    <button id="" class="react base-btn" data-symbol="">Reactor</button>
-    <button id="" class="fuel base-btn" data-symbol="">Fuel</button>
-  </div> 
+ 
 </div>
\ No newline at end of file
diff --git a/js/controllers/ships.js b/js/controllers/ships.js
index b732d36..6ec106f 100644
--- a/js/controllers/ships.js
+++ b/js/controllers/ships.js
@@ -22,7 +22,16 @@ export default (temp_engine) => {
                 class="imgShip" 
                 src="/assets/spaceships/b_spaceships.png" 
                 alt="" />
+                <div class="buttonShip">
+                  <button id="" class="reg base-btn" data-symbol="${ship.symbol}">Name</button>
+                  <button id="" class="nav base-btn" data-symbol="${ship.symbol}">Navigation</button>
+                  <button id="" class="crew base-btn" data-symbol="${ship.symbol}">Crew</button>
+                  <button id="" class="frame base-btn" data-symbol="${ship.symbol}">Frame</button>
+                  <button id="" class="react base-btn" data-symbol="${ship.symbol}">Reactor</button>
+                  <button id="" class="fuel base-btn" data-symbol="${ship.symbol}">Fuel</button>
+              </div> 
             </div>
+            
           `
           )
       });
@@ -30,6 +39,7 @@ export default (temp_engine) => {
 
       temp_engine.add_event(".reg", "click", (e) => {
         const id_ship = $(e.target).attr("data-symbol");
+        console.log("test ")
         ships.forEach(ship =>{
           if(ship.symbol==id_ship)
           {
@@ -152,15 +162,15 @@ export default (temp_engine) => {
         slides[i].style.display = "none";  
       }
       slides[slideIndex-1].style.display = "block";
-      let img = slideIndex[slideIndex - 1].children(".imgShip");
-      if (n > 0)
-      {
-        img.animate({left: '250px'})
-      }
-      else
-      {
+      // let img = slideIndex[slideIndex - 1].children(".imgShip");
+      // if (n > 0)
+      // {
+      //   img.animate({left: '250px'})
+      // }
+      // else
+      // {
 
-      }
+      // }
         
     }