Update style.css

style.css

@@ -1,28 +1,82 @@
-body {
-	padding: 2rem;
-	font-family: -apple-system, BlinkMacSystemFont, "Arial", sans-serif;
+* {
+    box-sizing: border-box;
 }
 
-h1 {
-	font-size: 16px;
-	margin-top: 0;
+html, body {
+    margin: 0 !important;
+    padding: 0 !important;
+    overflow: hidden;
 }
 
-p {
-	color: rgb(107, 114, 128);
-	font-size: 15px;
-	margin-bottom: 10px;
-	margin-top: 5px;
+#hw-canvas {
+    position:fixed;
+    left:0;
+    top:0;
+    width:100%;
+    height:100%;
+    z-index: -1;
 }
 
-.card {
-	max-width: 620px;
-	margin: 0 auto;
-	padding: 16px;
-	border: 1px solid lightgray;
-	border-radius: 16px;
+#user-input {
+    padding: 5px;
+    margin: 20px 20px 20px 20px;
+    height: 50px;
+    font-size: 25px;
+    line-height: 40px;
+    border: gray solid 0.2ch;
+    width: calc(100% - 40px);
 }
 
-.card p:last-child {
-	margin-bottom: 0;
+#bias {
+    margin-left: 20px;
+    display: inline;
+}
+#writers {
+    display: inline;
+    margin-left: 20px;
+    height:  40px;
+    border: #008CBA solid 0.3ch;
+    margin-bottom: 20px;
+}
+/* #btn {
+    
+    height: 50px;
+    border: gray solid 0.1ch;
+    background-color: red;
+} */
+
+.button {
+  margin-left: 20px;
+  border: none;
+  color: white;
+  padding: 16px 32px;
+  text-align: center;
+  text-decoration: none;
+  display: inline;
+  font-size: 16px;
+  margin: 4px 2px;
+  transition-duration: 0.4s;
+  cursor: pointer;
+}
+
+.button1 {
+  background-color: white; 
+  color: black; 
+  border: 2px solid #4CAF50;
+}
+
+.button1:hover {
+  background-color: #4CAF50;
+  color: white;
+}
+
+.button2 {
+  background-color: white; 
+  color: black; 
+  border: 2px solid #008CBA;
+}
+
+.button2:hover {
+  background-color: #008CBA;
+  color: white;
 }