diff --git a/WebSocketClient/index.html b/WebSocketClient/index.html
index 4a36a9a..9674b52 100644
--- a/WebSocketClient/index.html
+++ b/WebSocketClient/index.html
@@ -14,7 +14,7 @@
     <h1>UVL Playground</h1>
     <h2 id="connection" style="color: red;"></h2>
 </div>
-<button class="tutorial-button" id="tutorialButton">?</button>
+<div class="tutorial-button" id="tutorialButton"><div class="tutorial-button-text">?</div></div>
 <div>
     <dialog id="dialog">
         <div>
diff --git a/WebSocketClient/style.css b/WebSocketClient/style.css
index c5675ee..cc136a6 100644
--- a/WebSocketClient/style.css
+++ b/WebSocketClient/style.css
@@ -144,17 +144,26 @@ a:active {
 
 .tutorial-button {
     position: fixed;
-    bottom: 20px;
-    right: 20px;
+    top: 10px;
+    right: 10px;
     background-color: #bdc3c7; /* Light gray color for dark mode */
     color: #34495e; /* Dark text color for dark mode */
     border: none;
     border-radius: 50%;
-    padding: 15px;
-    font-size: 24px;
+    padding: 10px;
+   
     cursor: pointer;
     box-shadow: 0 4px 6px rgba(0, 0, 0, 0.1);
     transition: background-color 0.3s ease;
+    width: 20px; /* Adjust the size as needed */
+    height: 20px;
+    display: flex;
+    align-items: center;
+    justify-content: center;
+  }
+
+  .tutorial-button-text {
+    font-size: 20px;
   }
 
   .tutorial-button:hover {