diff --git a/binary/index.html b/binary/index.html
index a4e8613..fb770bc 100644
--- a/binary/index.html
+++ b/binary/index.html
@@ -8,7 +8,7 @@
 		<link rel="stylesheet" href="style.css">
 	</head>
 	<body>
-		<div class="card shadow">
+		<div class="cards shadow">
 			<h1>Binary Translator</h1>
 			<textarea id="textInput" placeholder="Enter text..." rows="5"></textarea>
 			<button id="translate-to-binary">Translate to Binary</button>
diff --git a/binary/style.css b/binary/style.css
index 479d68d..1bd6fbb 100644
--- a/binary/style.css
+++ b/binary/style.css
@@ -1,10 +1,7 @@
 @import url(/global.css);
 
-.container { 
-	text-align: center; 
-	padding: 20px; 
-	border-radius: 20px; 
-	box-shadow: 0 4px 15px rgba(0, 0, 0, 0.7); 
+.cards {
+    text-align: center;
 }
 
 textarea, input, button { 
@@ -13,21 +10,21 @@ textarea, input, button {
 	padding: 10px; 
 	border-radius: 10px; 
 	border: none; 
-	background-color: #333; 
-	color: #f0f0f0; 
+	background-color: var(--surface1); 
+	color: var(--text); 
 }
 
 textarea {
 	resize: none;
-	margin-right: 10px;
 }
 
 button { 
 	cursor: pointer; 
-	background-color: #444; 
+    background-color: var(--surface1);
+    margin-bottom: 20px;
 }
 
 button:hover { 
-	background-color: #555; 
+    background-color: var(--surface2);
 }
 
