diff --git a/Site/CSS/Main.css b/Site/CSS/Main.css
index 49241cdaa..5b2537f78 100644
--- a/Site/CSS/Main.css
+++ b/Site/CSS/Main.css
@@ -5,16 +5,21 @@ body {
 .nav {
     background: #343334;
     box-shadow: 0 3px 5px #343334;
+    padding: 5px;
 }
 
-.nav > a, .sidenav a {
+.nav > a {
+    font-size: 1.8em;
+    margin-left: 15px
+}
+
+.nav > a, .sidenav > a {
     color: whitesmoke;
     font-family:Verdana;
     font-weight: 500;
-
 }
 
-.nav > a:hover, .sidenav a:hover {
+.nav > a:hover, .sidenav > a:hover {
     color: #17a2b8;
 }
 
@@ -42,6 +47,11 @@ body {
     margin-left: 60px;
 }
 
+.main > div {
+    margin: 50px;
+    width: 30%;
+}
+
 #logo {
     width: 100%;
     height: 80px;
diff --git a/Site/Index.html b/Site/Index.html
index 8a6a0d6f2..94e2c17af 100644
--- a/Site/Index.html
+++ b/Site/Index.html
@@ -19,9 +19,11 @@
                 <a class="nav-link" href="#">Thresholds</a>
                 <a class="nav-link" href="#">3D</a>
             </nav>
-            <Slider v-model="value1"></Slider>
+            <div id="input-tab">
+                <Slider v-for="slider in sliders" v-model="slider.value"></Slider>
+            </div>
         </div>
-        <div id="app"></div>
+
     <script src="JS/vue.js"></script>
     <script src="JS/iview.min.js"></script>
     <script src="JS/main.js"></script>
diff --git a/Site/JS/main.js b/Site/JS/main.js
index 4487bad8c..b6909dc27 100644
--- a/Site/JS/main.js
+++ b/Site/JS/main.js
@@ -15,3 +15,13 @@
 
 //     document.getElementById(index).style.display = "block";
 // }
+
+let inputTab = new Vue({
+    el: "#input-tab",
+    data: {
+        sliders: [
+            { value: 25 },
+            { value: 30 }
+        ]
+      }
+})
\ No newline at end of file