8-ball styling

Author: hollinwakefield

Magic 8-Ball/app.css

@@ -4,12 +4,17 @@ body {
     font-family: "Helvetica";
     text-align: center;
     font-size: 48px;
-    margin: 15%;
+    margin: 10%;
+}
+
+h1 {
+    margin: 10%;
 }
 
 form {
     margin-left: auto;
     margin-right: auto;
+    margin: 5%;
 }
 
 :placeholder-shown {
@@ -24,12 +29,12 @@ form {
     box-shadow: inset 0 -5px 0 0 rgba(0,0,0,.1), 0 3px 8px rgba(0,0,0,.14);
     color: #000000!important;
     border: none!important;
-    font-family: "Helvetica";
-    font-size: 36px;
-    border-radius: 50px;
-    height: 75px;
-    width: 350px;
-    margin: 5rem;
+    font-family: 'Creepster', cursive;
+    font-size: 3rem;
+    border-radius: 4rem;
+    height: 7.5rem;
+    width: 25rem;
+    margin: 10rem;
     margin-left: auto;
     margin-right: auto;
     outline: none;

Magic 8-Ball/magiceightball.html

@@ -6,6 +6,8 @@
 
     <link rel="stylesheet" type="text/css" href="app.css">
     <script src="app.js"></script>
+    <link rel="preconnect" href="https://fonts.gstatic.com">
+    <link href="https://fonts.googleapis.com/css2?family=Creepster&display=swap" rel="stylesheet">
 
     <title>Magic Box</title>