diff --git a/client/index.html b/client/index.html
old mode 100755
new mode 100644
index 5c065ceb..9ab7209f
--- a/client/index.html
+++ b/client/index.html
@@ -1,5 +1,94 @@
+<!DOCTYPE html>
+<html>
+  <script src="./index.js"></script>
+  <section class="hero is-info is-large">
+  
+    <head>
+    <meta charset="utf-8">
+    <meta name="viewport" content="width=device-width, initial-scale=1">
+    <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/bulma/0.7.1/css/bulma.min.css">
+    <script defer src="https://use.fontawesome.com/releases/v5.1.0/js/all.js"></script>
+  </head>
+  <body>
+  </body>
+
+  <div class="hero-head">
+    <nav class="navbar">
+      <div class="container">
+        <div class="navbar-brand">
+          <span class="navbar-burger burger" data-target="navbarMenuHeroB">
+            <span></span>
+            <span></span>
+            <span></span>
+          </span>
+        </div>
+        <div id="navbarMenuHeroB" class="navbar-menu">
+          <div class="navbar-end">
+            <a class="navbar-item is-active">
+              Home
+            </a>
+            <a class="navbar-item">
+              Store
+            </a>
+            <a class="navbar-item">
+              FAQ
+            </a>
+            <span class="navbar-item">
+              <a class="button is-info is-inverted">
+                <span class="icon">
+                  <i class="fab fa-github"></i>
+                </span>
+                <span>Download</span>
+              </a>
+            </span>
+          </div>
+        </div>
+      </div>
+    </nav>
+  </div>
+
+  <div class="hero-body">
+    <div class="container has-text-centered">
+      <p class="title">
+        Welcome to Cryps
+      </p>
+      <p class="subtitle">
+        The worlds best pray to win game
+      </p>
+    </div>
+  </div>
+
+  <div class="hero-foot">
+    <nav class="tabs is-boxed is-fullwidth">
+      <div class="container">
+        <ul>
+          <li class="is-active">
+            <a>Management</a>
+          </li>
+          <li>
+            <a>Inventory</a>
+          </li>
+          <li>
+            <a>Missions</a>
+          </li>
+          <li>
+            <a>Battles</a>
+          </li>
+          <li>
+            <a>Market</a>
+          </li>
+        </ul>
+      </div>
+    </nav>
+  </div>
+</section>
+
+
+</html>
+
+<!--
 <html>
 <body>
-  <script src="./index.js"></script>
 </body>
-</html>
\ No newline at end of file
+</html>
+-->
\ No newline at end of file
