diff --git a/index.HTML b/index.HTML
new file mode 100644
index 0000000..534ddea
--- /dev/null
+++ b/index.HTML
@@ -0,0 +1,139 @@
+<!DOCTYPE html>
+<html>
+<head>
+<link rel="stylesheet" href="https://bootswatch.com/4/cyborg/bootstrap.min.css">
+  <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.5.1/jquery.min.js"></script>
+  <script src="https://cdnjs.cloudflare.com/ajax/libs/popper.js/1.16.0/umd/popper.min.js"></script>
+  <script src="https://maxcdn.bootstrapcdn.com/bootstrap/4.5.2/js/bootstrap.min.js"></script>
+  <script src = "scripts/functions.js" type="text/javascript"></script>
+<meta name="viewport" content="width=device-width, initial-scale=1">
+</head>
+<!--<script>
+function calcLevels(){
+
+var HIGH = parseInt(document.getElementById("high").value);
+var LOW = parseInt(document.getElementById("low").value);
+var CLOSE = parseInt(document.getElementById("close").value);
+var RANGE = HIGH - LOW;
+var H1 = CLOSE + RANGE * 1.1/12;
+var H2 = CLOSE + RANGE * 1.1/6;
+var H3 = CLOSE + RANGE * 1.1/4;
+var H4 = CLOSE + RANGE * 1.1/2;
+var H5 = H4 + 1.168 * (H4-H3);
+var H6 = (HIGH/LOW) * CLOSE;
+var PP = (HIGH + LOW + CLOSE) / 3;
+var L1 = CLOSE - RANGE * 1.1/12;
+var L2 = CLOSE - RANGE * 1.1/6;
+var L3 = CLOSE - RANGE * 1.1/4;
+var L4 = CLOSE - RANGE * 1.1/2;
+var L5 = L4 - 1.168 * (L4-L3);
+var L6 = CLOSE - (H6 - CLOSE);
+document.getElementById("h6").innerText = parseFloat(H6).toFixed(2);
+document.getElementById("h5").innerText = parseFloat(H5).toFixed(2);
+document.getElementById("h4").innerText = parseFloat(H4).toFixed(2);
+document.getElementById("h3").innerText = parseFloat(H3).toFixed(2);
+document.getElementById("h2").innerText = parseFloat(H2).toFixed(2);
+document.getElementById("h1").innerText = parseFloat(H1).toFixed(2);
+document.getElementById("pp").innerText = parseFloat(PP).toFixed(2);
+document.getElementById("l6").innerText = parseFloat(L6).toFixed(2);
+document.getElementById("l5").innerText = parseFloat(L5).toFixed(2);
+document.getElementById("l4").innerText = parseFloat(L4).toFixed(2);
+document.getElementById("l3").innerText = parseFloat(L3).toFixed(2);
+document.getElementById("l2").innerText = parseFloat(L2).toFixed(2);
+document.getElementById("l1").innerText = parseFloat(L1).toFixed(2);
+
+document.getElementById("levels").style.display="block";
+}
+</script> -->
+<!--<style>
+tr {
+  border-bottom: 1px solid #ddd;
+}
+table {
+  border-collapse: collapse;
+}
+</style> -->
+</head>
+<body>
+<div class="container">
+<table>
+<thead><tr><td colspan = 2 align = "center"><h4>Camarilla Pivots</h4></td><tr></thead>
+<tbody>
+ <tr> <td><label for="high">High</label></td>
+  <td><input type="text" id="high" name="high" value=""></td></tr>
+  <tr> <td><label for="low">Low</label>
+  <td><input type="text" id="low" name="low" value=""></td></tr>
+  <tr> <td><label for="close">Close</label>
+  <td><input type="text" id="close" name="close" value=""></td></tr>
+  <tr> <td colspan=2 align= "center"><input type="button" value="Calculate Levels" onclick="calcLevels();" data-toggle="modal" data-target="#myModal"></td></tr></tbody></table> </div> <br><br>
+
+
+<!-- <table id = "levels" style="display:none;"> -->
+<!-- <tr> -->
+<!-- <th>Level</th> -->
+<!-- <th>Value</th> -->
+<!-- </tr> -->
+<!-- <tr><td>Resistance 6</td><td id="h6"></td></tr> -->
+<!-- <tr><td>Resistance 5</td><td id="h5"></td></tr> -->
+<!-- <tr><td>Resistance 4</td><td id="h4"></td></tr> -->
+<!-- <tr><td>Resistance 3</td><td id="h3"></td></tr> -->
+<!-- <tr><td>Resistance 2</td><td id="h2"></td></tr> -->
+<!-- <tr><td>Resistance 1</td><td id="h1"></td></tr> -->
+<!-- <tr><td>Pivot Level</td><td id="pp"></td></tr> -->
+<!-- <tr><td>Support 1</td><td id="l1"></td></tr> -->
+<!-- <tr><td>Support 2</td><td id="l2"></td></tr> -->
+<!-- <tr><td>Support 3</td><td id="l3"></td></tr> -->
+<!-- <tr><td>Support 4</td><td id="l4"></td></tr> -->
+<!-- <tr><td>Support 5</td><td id="l5"></td></tr> -->
+<!-- <tr><td>Support 6</td><td id="l6"></td></tr> -->
+<!-- </table> -->
+
+<div class="modal" id="myModal">
+  <div class="modal-dialog">
+    <div class="modal-content">
+
+      <!-- Modal Header -->
+      <div class="modal-header">
+        <h4 class="modal-title">Camarilla Levels</h4>
+        <button type="button" class="close" data-dismiss="modal">&times;</button>
+      </div>
+
+      <!-- Modal body -->
+      <div class="modal-body">
+          <table class="table table-striped">
+    <thead>
+      <tr>
+        <th>Level</th>
+        <th>Value</th>
+      </tr>
+    </thead>
+    <tbody>
+      <tr><td>Resistance 6</td><td id="h6"></td></tr>
+<tr><td>Resistance 5</td><td id="h5"></td></tr>
+<tr><td>Resistance 4</td><td id="h4"></td></tr>
+<tr><td>Resistance 3</td><td id="h3"></td></tr>
+<tr><td>Resistance 2</td><td id="h2"></td></tr>
+<tr><td>Resistance 1</td><td id="h1"></td></tr>
+<tr><td>Pivot Level</td><td id="pp"></td></tr>
+<tr><td>Support 1</td><td id="l1"></td></tr>
+<tr><td>Support 2</td><td id="l2"></td></tr>
+<tr><td>Support 3</td><td id="l3"></td></tr>
+<tr><td>Support 4</td><td id="l4"></td></tr>
+<tr><td>Support 5</td><td id="l5"></td></tr>
+<tr><td>Support 6</td><td id="l6"></td></tr>
+    </tbody>
+  </table>
+  </div>
+
+      <!-- Modal footer -->
+      <div class="modal-footer">
+        <button type="button" class="btn btn-danger" data-dismiss="modal">Close</button>
+      </div>
+
+    </div>
+  </div>
+</div>
+
+</body>
+</html>
+

Level	Value
Resistance 6
Resistance 5
Resistance 4
Resistance 3
Resistance 2
Resistance 1
Pivot Level
Support 1
Support 2
Support 3
Support 4
Support 5
Support 6