diff --git a/views/index.html b/public/index.html
similarity index 80%
rename from views/index.html
rename to public/index.html
index 1b99c61..0febc55 100644
--- a/views/index.html
+++ b/public/index.html
@@ -17,11 +17,8 @@
       type="image/x-icon"
     />
     <!-- import the webpage's stylesheet -->
-    <link
-      rel="stylesheet"
-      href="https://stackpath.bootstrapcdn.com/bootstrap/4.5.2/css/bootstrap.min.css"
-    />
-    <link rel="stylesheet" href="/style.css" />
+    <link rel="stylesheet" href="https://stackpath.bootstrapcdn.com/bootstrap/4.5.2/css/bootstrap.min.css" />
+    <link rel="stylesheet" href="style.css" />
 
     <!-- import libraries -->
     <script src="/lib/peerjs.js"></script>
@@ -29,7 +26,7 @@
     <script src="https://cdn.jsdelivr.net/npm/vue/dist/vue.js"></script>
 
     <!-- import the webpage's client-side javascript file -->
-    <script src="/main.js" type="module"></script>
+    <script src="main.js" type="module"></script>
   </head>
   <body class="bg-dark text-white">
     <!-- Image and text -->
@@ -55,6 +52,9 @@
           <div class="card text-dark">
             <video id="localVideo" class="card-img-top" autoplay></video>
             <div class="card-body">
+              <details>
+                <summary></summary>
+              </details> 
               <h5 class="card-title">It'se me!</h5>
               <!-- audio source -->
               <div class="form-group">
@@ -78,7 +78,14 @@
         <div class="col-6">
           <div class="card text-dark">
             <div class="card-body">
-              <h5 class="card-title">Remote</h5>
+              <h5 class="card-title">Control</h5>
+              <div class="input-group mb-3">
+                <div class="input-group-prepend">
+                  <button class="btn btn-outline-secondary" type="button">Copy</button>
+                </div>
+                <input id="my-peer-id" type="text" class="form-control" placeholder="my-peer-id">
+              </div>
+              <hr> 
               <input type="text" id="connect-to-peer" class="form-control" placeholder="paste-peer-id-here">
               <br>
               <button class="btn btn-sm btn-success" onclick="connectToPeer()">
@@ -96,17 +103,16 @@
       <div class="row mt-3">        
         <!-- peer -->
         <div class="col-6">
-          <div class="card">
+          <div class="card text-dark">
             <video id="remoteVideo" class="card-img-top" autoplay></video>
-            <h5 class="card-title">Remote</h5>
             <div class="card-body">
-              <p class="card-text"></p>
+              <h5 class="card-title">Remote</h5>
             </div>
           </div>
         </div>
       </div>
     </div>
 
-    <footer>Made with <a href="https://glitch.com">Glitch</a>!</footer>
+    <footer class="text-center mt-3">Made with <a href="https://glitch.com" target="_blank">Glitch</a>!</footer>
   </body>
 </html>
diff --git a/server.js b/server.js
index 46183f8..abc773c 100644
--- a/server.js
+++ b/server.js
@@ -15,7 +15,7 @@ app.use(express.static("public"));
 
 // https://expressjs.com/en/starter/basic-routing.html
 app.get("/", (request, response) => {
-  response.sendFile(__dirname + "/views/index.html");
+  response.sendFile(__dirname + "/public/index.html");
 });
 
 // listen for requests :)
