diff --git a/example/index.html b/example/index.html
index 8f19058..791735a 100644
--- a/example/index.html
+++ b/example/index.html
@@ -13,14 +13,17 @@
 </head>
 <body>
 
-<div class="container">
+<h1 class="text-center">Vue-Socket.io</h1>
 
+<div class="container">
     <div v-if="!join" id="join" class="text-center">
         <form @submit.prevent="joinChat(name)">
             <div class="form-group">
                 <input type="text" max="12" class="form-control input-lg text-center" v-model="name" placeholder="Name">
             </div>
             <button class="btn btn-primary btn-lg" type="submit">Join Chat</button>
+            <br>
+            <a href="https://github.com/metinseylan/vue-socket.io">Github</a>
         </form>
 
     </div>
diff --git a/example/style.css b/example/style.css
index c8919cd..9d05946 100644
--- a/example/style.css
+++ b/example/style.css
@@ -9,7 +9,6 @@ body {
 
 .container {
     max-width: 700px;
-    margin-top: 5%;
     box-shadow: 0 2px 3px rgba(0, 0, 0, .05);
     background-color: #fff;
     border: 1px solid #eee;
@@ -83,4 +82,52 @@ body {
 .chat .input {
     position: absolute;
     bottom: 0;
+}
+
+@media screen and (max-width: 768px) {
+    body, html {
+        position: relative;
+        width: 100%;
+        height: 100%;
+    }
+
+    #join .btn {
+        display: block;
+        width: 100%;
+    }
+
+    .container {
+        position: absolute;
+        width: 100%;
+        height: 89%;
+    }
+
+    h1 {
+        margin: 4% 0;
+    }
+
+    .users {
+        display: none;
+    }
+
+    .chat {
+        float: none;
+        padding: 0;
+        height: 100%;
+        width: 100%;
+        position: absolute;
+    }
+
+    .chat .messages {
+        height: 90%;
+    }
+
+    .chat .messages ul {
+        height: 100%;
+    }
+
+    #group {
+        height: 100%;
+        position: relative;
+    }
 }
\ No newline at end of file
