diff --git a/index.html b/index.html
index 430e806..b8ad8c1 100644
--- a/index.html
+++ b/index.html
@@ -2,23 +2,65 @@
 <html>
 <head lang="en">
     <meta charset="UTF-8">
-    <title></title>
+    <title>AES / Rijndael</title>
+    <script src="aes.js"></script>
+    <script src="support.js"></script>
 </head>
 <body>
-<script src="aes.js"></script>
-<script src="support.js"></script>
+
+    <h1>Advanced Encryption Standard (AES / Rijndael)</h1>
+    <h2>Encrypt</h2>
+    Input (hex 128 bit):<br><input type="text" name="input" value="00112233445566778899aabbccddeeff" size="32" id="input">
+    <br>
+    Key (hex 128 - 192 - 256 bit):<br><input type="text" name="key" value="000102030405060708090a0b0c0d0e0f101112131415161718191a1b1c1d1e1f" size="64" id="key">
+    <br>
+    <input id="encrypt" type="button" name="encrypt" value="Encrypt">
+    <br><br>
+    <span id="output"></span>
+
+
+    <h2>Decrypt</h2>
+    Input (hex 128 bit):<br><input type="text" name="dinput" value="00112233445566778899aabbccddeeff" size="32" id="dinput">
+    <br>
+    Key (hex 128 - 192 - 256 bit):<br><input type="text" name="dkey" value="000102030405060708090a0b0c0d0e0f101112131415161718191a1b1c1d1e1f" size="64" id="dkey">
+    <br>
+    <input id="decrypt" type="button" name="decrypt" value="Decrypt">
+    <br><br>
+    <span id="doutput"></span>
+
+
+
 
 <script>
 
+    document.getElementById("encrypt").addEventListener("click",exec_encrypt,false);
+    document.getElementById("decrypt").addEventListener("click",exec_decrypt,false);
 
-    var i = "00112233445566778899aabbccddeeff";
-    var k = "000102030405060708090a0b0c0d0e0f101112131415161718191a1b1c1d1e1f";
+    function exec_encrypt (){
 
-    KeyExpansion(k);
-    var c = encrypt(i);
-    console.log(c);
-    var p = decrypt(c);
-    console.log(p);
+        var i = document.getElementById("input").value;
+        var k = document.getElementById("key").value;
+
+        if (i.length >0 && k.length >0  && i.length == 32  && (k.length == 32  || k.length == 48 || k.length == 64 ) &&   matchExact(/((?:[0-9a-f]+)*)/,i) && matchExact(/((?:[0-9a-f]+)*)/,k)  ){
+            KeyExpansion(k);
+            document.getElementById("output").innerHTML = "Output: " + encrypt(i);
+        } else
+            document.getElementById("output").innerHTML = "Output: Invalid data";
+
+    }
+
+    function exec_decrypt (){
+
+        var i = document.getElementById("dinput").value;
+        var k = document.getElementById("dkey").value;
+
+        if (i.length >0 && k.length >0  && i.length == 32  && (k.length == 32  || k.length == 48 || k.length == 64 ) &&   matchExact(/((?:[0-9a-f]+)*)/,i) && matchExact(/((?:[0-9a-f]+)*)/,k)  ){
+            KeyExpansion(k);
+            document.getElementById("doutput").innerHTML = "Output: " + decrypt(i);
+        } else
+            document.getElementById("doutput").innerHTML = "Output: Invalid data";
+
+    }
 
 
 
