diff --git a/main.py b/main.py
index bc89509..2646317 100644
--- a/main.py
+++ b/main.py
@@ -39,10 +39,16 @@ requested_map = {}
 
 @app.route('/')
 def root():
-    # For the sake of example, use static information to inflate the template.
-    # This will be replaced with real information in later steps.
     return render_template('index.html')
     
+@app.route('/index.html')
+def index():
+    return render_template('index.html')
+    
+@app.route('/about.html')
+def about():
+    return render_template('about.html')
+    
     
 def cache_file(seed, prompt_num, choices, response, tag):
 
diff --git a/static/script.js b/static/script.js
index c186760..d5ad0e1 100644
--- a/static/script.js
+++ b/static/script.js
@@ -2,11 +2,14 @@ var prompts = ["You enter a dungeon with your trusty sword and shield. You are s
 
 start_text = "<span id='a'>Adventurer@AIDungeon</span>:<span id='b'>~</span><span id='c'>$</span> ./EnterDungeon \n <br/><!-- laglaglaglaglaglaglaglaglaglaglag-->"
 
+input_form = '<form><input type="text" choice="your_choice"></form>'
+
 
 var acceptInput=false
 var action_waiting = false
 var inputStr = ""
 var typing = false
+var should_blink = false
 var blinkCounter = 0
 var action_list = ["You attack", "You tell", "You use", "You go"]
 var prompt_num = 0
@@ -16,6 +19,10 @@ var seed = Math.floor(Math.random() * (+seed_max - +seed_min)) + +seed_min;
 //var seed = 108
 console.log("Seed is ", seed)
 
+function isMobileDevice() {
+    return /Android|webOS|iPhone|iPad|iPod|BlackBerry|IEMobile|Opera Mini/i.test(navigator.userAgent) 
+};
+
 var StoryTracker = {
     firstStory: null,
     lastStory: null,
@@ -45,8 +52,6 @@ var StoryTracker = {
     },
     
     actionWait:function(){
-        console.log("action waiting ", action_waiting)
-        console.log("typing ", typing)
         if(action_waiting == true || typing){
             setTimeout(StoryTracker.actionWait, 2000);
         }
@@ -77,9 +82,8 @@ var StoryTracker = {
 
             if (StoryTracker.action_int > 3){
                 Typer.appendToText("\nWhich action do you choose? ")
-                StoryTracker.action_int = 0
+                StoryTracker.action_int = 0      
                 acceptInput = true
-                
             }
         }
         
@@ -124,7 +128,8 @@ var StoryTracker = {
         
             Typer.appendToText("Invalid choice. Must be a number from 0 to 3. \n")
             Typer.appendToText("\nWhich action do you choose? ")
-            acceptInput=true
+            acceptInput = true
+            
             
         }
         
@@ -179,17 +184,21 @@ var Typer={
  
 	blinkCursor:function(){ 
 	
-	    if(blinkCounter > 10){
-		    var cont=this.content() 
+	    if(should_blink == true){
+	
+	        if(blinkCounter > 10){
+		        var cont=this.content() 
 		
-		    if(cont.substring(cont.length-1,cont.length)=="|") 
-			    $("#console").html($("#console").html().substring(0,cont.length-1)) 
+		        if(cont.substring(cont.length-1,cont.length)=="|") 
+			        $("#console").html($("#console").html().substring(0,cont.length-1)) 
+		
+		        else
+			        $("#console").append("|")
+		    }
+		    else{
+		        blinkCounter += 1
+		    }
 		
-		    else
-			    $("#console").append("|")
-		}
-		else{
-		    blinkCounter += 1
 		}
 	}
 }
@@ -206,6 +215,7 @@ function startTyping(){
  
 }
 
+
 function typeWords() {
 	Typer.addText()
 }
@@ -218,7 +228,7 @@ document.onkeypress = function(evt) {
 
         if(charCode == 13){
             acceptInput = false
-            Typer.appendToText("\n\n")
+            Typer.appendToText("\n")
             StoryTracker.processInput(inputStr)
         }
         else{
@@ -231,6 +241,18 @@ document.onkeypress = function(evt) {
     }
 }
 
+function onButtonClick(num){
+
+    if (acceptInput == true){
+        acceptInput = false
+        num = String(num)
+        Typer.appendToText(num)
+        Typer.appendToText("\n")
+        inputStr = num
+        StoryTracker.processInput()
+    }
+}
+
 function start(){
     
     Typer.speed=1
@@ -241,6 +263,7 @@ function start(){
 
     startTyping()
     Typer.startBlinker()
+    
 }
 
 
@@ -248,5 +271,3 @@ $(document).ready(function() {
     start()
 })
 
-
-
diff --git a/static/style.css b/static/style.css
index e0e61f9..d7e72ed 100644
--- a/static/style.css
+++ b/static/style.css
@@ -10,6 +10,24 @@ body {
 	margin-right:auto;
 	margin-top:100px;
 	font-size:14px;
+	background-color: #000;
+}
+
+.about {
+    font-family: courier, monospace;
+	width:750px;
+	margin-left:auto;
+	margin-right:auto;
+	margin-top:100px;
+    font-size:14px;
+}
+
+.about text{
+    color: #fff;
+}
+.about h2{
+    color: #0bc;
+    font-size:20px;
 }
 
 a {
@@ -42,7 +60,67 @@ a {
 }
 
 @keyframes change {
-    	0%  { color:  #0f0; }
+    	0%  { color:  #333; }
     	50% { color:  #0f0; }
     	99% { color: black; }
 }
+
+#buttons {
+    position: absolute;
+    bottom: 0;
+    height: 60px;
+    width: 100%;
+    color: 334;
+    background-color:#000;
+    text-align: center;
+      display: flex;
+  justify-content: space-between;
+} 
+
+button {
+    border-color: #000
+    bottom: 0;
+    color: #fff;
+    margin-left: 4%;
+    margin-right: 4%;
+    background-color: #111;
+    width: 18%;
+    height: 40px;
+    text-align: center;
+
+}
+@media screen and (min-width: 600px) {
+  #buttons {
+    visibility: hidden;
+    display: none;
+  }
+}
+
+/* Add a black background color to the top navigation */
+.topnav {
+    background-color: #000;
+    overflow: hidden;
+    width:750px;
+	margin-left:auto;
+	margin-right:auto;
+	
+}
+
+/* Style the links inside the navigation bar */
+.topnav a {
+    font-family: courier, monospace;
+  display: inline-block;
+  color: #0bc;
+  text-align: center;
+  padding: 10px 5px;
+  text-decoration: none;
+  font-size: 16px;
+}
+
+/* Change the color of links on hover */
+.topnav a:hover {
+  background-color: #0bc;
+  color: white;
+}
+
+
diff --git a/templates/about.html b/templates/about.html
new file mode 100644
index 0000000..087853d
--- /dev/null
+++ b/templates/about.html
@@ -0,0 +1,28 @@
+<html> 
+  <head> 
+    <title>About</title> 
+    <link rel="stylesheet" type="text/css" href="static/style.css">
+  </head> 
+  <div class="topnav">
+      <a href="http://aidungeon.io">Home</a>
+      <a href="http://patreon.com/AIDungeon">Support</a>
+    </div>
+    <div class="about">
+        <h2> About AI Dungeon </h2>
+          <text> 
+    AIDungeon is an AI generated text adventure that uses deep learning to create each adventure. It uses OpenAI's new <a href="https://openai.com/blog/better-language-models/">GPT-2 model</a>, which has 117 million parameters, to generate each story block and possible action. 
+    
+    <br><br> The first couple sentences of AIDungeon and the action verbs are handcrafted, but everything else is not. Each time an option is chosen, the initial prompt, the last story block, and the last action are fed into the neural network. The resulting story and action options are then output by the model.
+    
+    <br><br> As you can probably tell there's still a ways to go before AI will be your group's dungeon master, but even after running hundreds of adventures it still manages to surprise me in interesting ways. 
+   
+    
+    <br><br> If you want to get in touch with me you can email me at nickwalton00@gmail.com.
+    
+    <br><br> I hope you enjoy exploring the strange dreams of AIDungeon.
+        
+  </text> 
+    </div>
+  
+
+</html> 
diff --git a/templates/index.html b/templates/index.html
index 7ed2270..69cee5e 100644
--- a/templates/index.html
+++ b/templates/index.html
@@ -5,10 +5,19 @@
     <script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/jquery/1.4.2/jquery.min.js"></script> 
     <link rel="stylesheet" type="text/css" href="static/style.css">
   </head> 
+  <div class="topnav">
+      <a href="about.html">About</a>
+      <a href="http://patreon.com/AIDungeon">Support</a>
+  </div>
   <body> 
     <script type="text/javascript" src="static/script.js"> 
     </script> 
     <div id="console"></div> 
-    "\n\n\n\n"
   </body> 
+  <div id="buttons">
+    <button onclick="onButtonClick(0)">0</button>
+    <button onclick="onButtonClick(1)">1</button>
+    <button onclick="onButtonClick(2)">2</button>
+    <button onclick="onButtonClick(3)">3</button>
+    </div>
 </html>