add sound controls and fullscreen

1 files changed, 30 insertions, 7 deletions

diff --git a/style.css b/style.css
index 2b3b0fe..2b3b86e 100644
--- a/style.css
+++ b/style.css
@@ -1,9 +1,10 @@
 body {
-  color: white;
+  color: orange;
   background-color: black;
   font-family: "VT323", monospace;
   position: relative;
   overflow-x: hidden;
+  margin-bottom: 0;
 }
 
 .logo {
@@ -29,12 +30,34 @@ body {
   font-family: "VT323", monospace;
   width: min(90vw, 800px);
   margin: auto;
-  border-left: 1px solid white;
-  border-right: 1px solid white;
+  border-left: 1px solid orange;
+  border-right: 1px solid orange;
   padding: 8px;
   min-height: 95vh;
 }
 
+#footer {
+  position: sticky;
+  bottom: 0;
+  left: 0;
+  right: 0;
+  border-top: 1px solid orange;
+  text-transform: uppercase;
+  font-family: "VT323", monospace;
+  font-size: 16px;
+  background-color: black;
+  color: orange;
+  margin: 0;
+  height: 32px;
+  overflow: hidden;
+  text-align: center;
+  padding-top: 8px;
+}
+
+#footer a {
+  color: orange;
+}
+
 .center-screen-container {
     position: absolute;
     top: 0;
@@ -52,7 +75,7 @@ body {
 }
 
 .alert-box {
-  border: 2px solid white;
+  border: 2px solid orange;
   background-color: black;
   padding: 16px;
   max-width: min(80vw, 600px);
@@ -60,7 +83,7 @@ body {
 }
 
 .bordered {
-  border: 2px solid white;
+  border: 2px solid orange;
 }
 
 h1 {
@@ -82,7 +105,7 @@ p {
 
 input {
   font-family: "VT323", monospace;
-  color: white;
+  color: orange;
   background-color: black;
   font-size: 16px;
   padding: 8px;
@@ -96,7 +119,7 @@ input[type=button] {
 }
 input[type=button]:hover {
   color: black;
-  background-color: white;
+  background-color: orange;
 }
 input[type=button]:active {
   color: black;