diff --git a/css/main.css b/css/main.css
index fa296de..82bfa02 100644
--- a/css/main.css
+++ b/css/main.css
@@ -1,5 +1,3 @@
-@import url('https://fonts.googleapis.com/css?family=VT323');
-
 body {
   pointer-events: none;
   cursor: none;
@@ -55,6 +53,107 @@ body {
   padding: 10px 20px 10px 20px;
   border: 5px double #95e208;
   box-shadow: 1px 1px 1px #95e208;
+  cursor: pointer;
+  pointer-events: all;
+}
+
+.enter-text:hover {
+  background: #0a0f08;
+}
+
+.mobile-hint {
+  font-size: 3vw;
+  margin-top: 8px;
+  opacity: 0.7;
+  display: none;
+}
+
+@media (max-width: 768px), (hover: none) {
+  .mobile-hint {
+    display: block;
+  }
+  
+  .enter-text h1 {
+    font-size: 4.5vw;
+  }
+  
+  .crt {
+    font-size: 2.8vw;
+  }
+  
+  .prompt {
+    font-size: 2vw;
+    bottom: 0.5vh;
+    left: 0.5vw;
+    white-space: normal;
+    max-width: 98vw;
+    line-height: 1.1;
+  }
+  
+  .header {
+    font-size: 2vw;
+    right: 0.5vw;
+  }
+  
+  .sending {
+    left: 1vw;
+    top: 2vh;
+    font-size: 2.2vw;
+  }
+  
+  .receiving {
+    left: 52vw;
+    top: 2vh;
+    font-size: 2.2vw;
+  }
+  
+  .sea {
+    width: 28vw;
+    height: 28vw;
+  }
+  
+  .sea-left {
+    left: 1vw;
+    top: 2.5vh;
+  }
+  
+  .sea-right {
+    left: 52vw;
+    top: 2.5vh;
+  }
+  
+  .wrap {
+    left: 30vw;
+    top: 40vh;
+    width: 40vw;
+    height: 40vw;
+  }
+  
+  .circle {
+    width: 15vw;
+    height: 15vw;
+    border: 0.3vw solid green;
+  }
+  
+  .garbage-left {
+    left: 1vw;
+    font-size: 2vw;
+    top: 55vh;
+  }
+  
+  .garbage-right {
+    right: 0.5vw;
+    font-size: 2vw;
+    top: 55vh;
+  }
+  
+  .line {
+    height: 0.3vh;
+  }
+  
+  .vline {
+    width: 95vh;
+  }
 }
 
 .background-image {
diff --git a/index.html b/index.html
index 4ae8c49..f799f76 100644
--- a/index.html
+++ b/index.html
@@ -2,6 +2,10 @@
 <html xmlns="http://www.w3.org/1999/xhtml" xmlns:fb="http://www.facebook.com/2008/fbml" xmlns:og="http://opengraphprotocol.org/schema/" lang="en">
 <head>
   <meta charset="UTF-8">
+  <meta name="viewport" content="width=device-width, initial-scale=1.0">
+  <link rel="preconnect" href="https://fonts.googleapis.com">
+  <link rel="preconnect" href="https://fonts.gstatic.com" crossorigin>
+  <link rel="stylesheet" href="https://fonts.googleapis.com/css?family=VT323&display=swap">
   <title>Jadoo 👽💻</title>
   <meta name="description" content="Use this replica computer interface to call Jadoo from Koi Mil Gaya.">
   <meta name="author" content="Arjun Munji">
@@ -15,6 +19,8 @@
   <meta property="og:type" content="article"/>
 
   <link rel="stylesheet" href="css/main.css">
+  <link rel="stylesheet" href="css/ellipse.css">
+  <link rel="stylesheet" href="css/wave.css">
   <link rel="icon" type="image/png" href="assets/favicon-32x32.png" sizes="32x32" />
   <link rel="icon" type="image/png" href="assets/favicon-16x16.png" sizes="16x16" />
 </head>
@@ -23,8 +29,9 @@
   <div class="background-image"></div>
   <div id="monitor" class="crt content">
   <img class="background" src="assets/refresh.gif" />
-  <div class="enter-text">
+  <div class="enter-text" onclick="toggleFullScreen()">
     <h1>press enter to continue</h1>
+    <p class="mobile-hint">or tap here</p>
   </div>
   <div class="line vline nodisplay"></div>
   <div class="line hline nodisplay"></div>
@@ -316,21 +323,8 @@ <h1>press enter to continue</h1>
   <audio data-key="69" src="assets/E.mp3"></audio>
   <audio data-key="70" src="assets/F.mp3"></audio>
 
-<script type="text/javascript" src="js/crt.js"></script>
-<script type="text/javascript">
-  function playAudio (e) {
-    const audio = document.querySelector(`audio[data-key="${e.keyCode}"]`);
-    const key = document.querySelector(`.key[data-key="${e.keyCode}"]`);
-    if (!audio) return; //exits the function altogether
-    audio.currentTime = 0; //resets the playhead
-    audio.play();
-  }
-  window.addEventListener('keydown', playAudio);
-  onLoad();
-</script>
-<link rel="stylesheet" href="css/ellipse.css">
-<link rel="stylesheet" href="css/wave.css">
-<link rel="stylesheet" href="css/main.css">
+<script src="js/crt.js" defer></script>
+<script src="js/main.js" defer></script>
 <script>
   (function(i,s,o,g,r,a,m){i['GoogleAnalyticsObject']=r;i[r]=i[r]||function(){
   (i[r].q=i[r].q||[]).push(arguments)},i[r].l=1*new Date();a=s.createElement(o),
diff --git a/js/crt.js b/js/crt.js
index 2141135..08dae40 100644
--- a/js/crt.js
+++ b/js/crt.js
@@ -1,11 +1,3 @@
-function onLoad(arg) {
-    document.addEventListener("keydown", function(e) {
-    if (e.keyCode == 13) {
-      toggleFullScreen();
-    }
-  });
-}
-
 function toggleFullScreen() {
   if (!document.fullscreenElement) {
     // document.getElementById('monitor').webkitRequestFullscreen();
@@ -35,3 +27,11 @@ function toggleFullScreen() {
   promptKey.innerHTML += "\tB C E D";
   promptKey.innerHTML += "\tB C F E D C";
 }
+
+function onLoad(arg) {
+    document.addEventListener("keydown", function(e) {
+    if (e.keyCode == 13) {
+      toggleFullScreen();
+    }
+  });
+}
diff --git a/js/main.js b/js/main.js
new file mode 100644
index 0000000..8fd1f65
--- /dev/null
+++ b/js/main.js
@@ -0,0 +1,9 @@
+function playAudio (e) {
+  const audio = document.querySelector(`audio[data-key="${e.keyCode}"]`);
+  const key = document.querySelector(`.key[data-key="${e.keyCode}"]`);
+  if (!audio) return; //exits the function altogether
+  audio.currentTime = 0; //resets the playhead
+  audio.play();
+}
+window.addEventListener('keydown', playAudio);
+onLoad();
