diff --git a/UI/css/style.css b/UI/css/style.css
new file mode 100644
index 0000000000000000000000000000000000000000..7c05912b70ab49a1fb9a76a05417132dd2d30979
--- /dev/null
+++ b/UI/css/style.css
@@ -0,0 +1,133 @@
+*,
+*:before,
+*:after{
+ padding: 0;
+ margin: 0;
+ box-sizing: border-box;
+ font-family: verdana;
+ color: #ffffff;
+ letter-spacing: 0.5px;
+ outline: none;
+ border: none;
+ text-decoration: none;
+ }
+
+body{
+ background-color: #080710;
+}
+.wrap{
+ width: 430px;
+ height: 520px;
+ position: absolute;
+ transform: translate(-50%,-50%);
+ left: 50%;
+ top: 50%;
+}
+.wrap .shape{
+ height: 200px;
+ width: 200px;
+ position: absolute;
+ border-radius: 50%;
+}
+.shape:first-child{
+ background: linear-gradient(
+ #1845ad,
+ #23a2f6
+ );
+ left: -50px;
+ top: -50px;
+}
+.shape:last-child{
+ background: linear-gradient(
+ to right,
+ #ff512f,
+ #f09819
+ );
+ right: -30px;
+ bottom: -50px;
+}
+form{
+ height: 600px;
+ width: 500px;
+ background-color: rgba(255,255,255,0.13);
+ position: absolute;
+ transform: translate(-50%,-50%);
+ top: 50%;
+ left: 50%;
+ border-radius: 20px;
+ backdrop-filter: blur(3px);
+ border: 2px solid rgba(255,255,255,0.1);
+ box-shadow: 0 0 40px rgba(8,7,16,0.6);
+ padding: 40px 25px;
+}
+h2{
+ text-align: center;
+ font-size: 2em;
+}
+p{
+ margin: 10px;
+ text-align: center;
+}
+
+
+.form-group{
+ margin-top: 40px;
+
+}
+
+
+
+input{
+ display: block;
+ height: 50px;
+ width: 100%;
+ background-color: rgba(255,255,255,0.07);
+ border-radius: 5px;
+ padding: 0 10px;
+ margin-top: 30px;
+ margin-bottom: 15px;
+ font-size: 15px;
+ font-weight: 300;
+}
+::placeholder{
+ color: #e5e5e5;
+}
+
+.container
+{
+ position: absolute;
+ top: 85%;
+ left: 50%;
+ transform: translate(-50%, -50%);
+}
+
+.button
+{
+ position: relative;
+ text-align: center;
+ width: 200px;
+ padding: 10px;
+ font-size: 20px;
+ font-family: poppins;
+ font-weight: 400;
+ border: 5px solid #15f4ee;
+ text-transform: uppercase;
+ letter-spacing: 7px;
+ cursor: pointer;
+ border-radius: 100px;
+ transition: 1.5s;
+}
+
+.button:hover
+{
+ box-shadow: 0 5px 50px 0 #15f4ee inset,0 5px 50px 0 #15f4ee,
+ 0 5px 50px 0 #15f4ee inset,0 5px 50px 0 #15f4ee;
+}
+
+
+form1 div { margin-bottom: 10px; }
+form1 div .clear { margin-bottom: 0; }
+form1 input,label { cursor: pointer; }
+
+form1 input[type="radio"] { float: left; width: 20px; margin-right: 20px; margin-top: 0px; }
+form1 label { float: left; width: 100px; margin-bottom: 50px;}
\ No newline at end of file
diff --git a/UI/css/style1.css b/UI/css/style1.css
new file mode 100644
index 0000000000000000000000000000000000000000..a7c9e65a3bf95bd2d8c2b297d8733b237c23baec
--- /dev/null
+++ b/UI/css/style1.css
@@ -0,0 +1,103 @@
+*,
+*:before,
+*:after{
+ padding: 0;
+ margin: 0;
+ box-sizing: border-box;
+ font-family: verdana;
+ color: #ffffff;
+ letter-spacing: 0.5px;
+ outline: none;
+ border: none;
+ text-decoration: none;
+ }
+
+body{
+ background-color: #080710;
+}
+.wrap{
+ width: 430px;
+ height: 520px;
+ position: absolute;
+ transform: translate(-50%,-50%);
+ left: 50%;
+ top: 50%;
+}
+.wrap .shape{
+ height: 200px;
+ width: 200px;
+ position: absolute;
+ border-radius: 50%;
+}
+.shape:first-child{
+ background: linear-gradient(
+ #1845ad,
+ #23a2f6
+ );
+ left: -50px;
+ top: -50px;
+}
+.shape:last-child{
+ background: linear-gradient(
+ to right,
+ #ff512f,
+ #f09819
+ );
+ right: -30px;
+ bottom: -50px;
+}
+form{
+ height: 500px;
+ width: 500px;
+ background-color: rgba(255,255,255,0.13);
+ position: absolute;
+ transform: translate(-50%,-50%);
+ top: 50%;
+ left: 50%;
+ border-radius: 20px;
+ backdrop-filter: blur(3px);
+ border: 2px solid rgba(255,255,255,0.1);
+ box-shadow: 0 0 40px rgba(8,7,16,0.6);
+ padding: 40px 25px;
+}
+h2{
+ text-align: center;
+ font-size: 2em;
+}
+p{
+ margin: 10px;
+ text-align: center;
+}
+
+
+.form-group{
+ margin-top: 50px;
+}
+input{
+ display: block;
+ height: 50px;
+ width: 100%;
+ background-color: rgba(255,255,255,0.07);
+ border-radius: 5px;
+ padding: 0 10px;
+ margin-top: 30px;
+ font-size: 14px;
+ font-weight: 300;
+}
+::placeholder{
+ color: #e5e5e5;
+}
+button{
+ margin-top: 30px;
+ width: 100%;
+ background: rgb(131,58,180);
+ background: cyan;
+ color: #080710;
+ padding: 15px 0;
+ font-size: 18px;
+ font-weight: 600;
+ border-radius: 5px;
+ cursor: pointer;
+}
+button:hover{
+ background: #e5e5e5;
\ No newline at end of file
diff --git a/UI/css/style_Analyze.css b/UI/css/style_Analyze.css
new file mode 100644
index 0000000000000000000000000000000000000000..0afcac4cbe46bbdda42ed3d3e89764e95849ff5a
--- /dev/null
+++ b/UI/css/style_Analyze.css
@@ -0,0 +1,124 @@
+*,
+*:before,
+*:after{
+ padding: 0;
+ margin: 0;
+ box-sizing: border-box;
+ font-family: verdana;
+ color: #ffffff;
+ letter-spacing: 0.5px;
+ outline: none;
+ border: none;
+ text-decoration: none;
+ }
+
+body{
+ background-color: #080710;
+}
+.wrap{
+ width: 430px;
+ height: 520px;
+ position: absolute;
+ transform: translate(-50%,-50%);
+ left: 50%;
+ top: 50%;
+}
+.wrap .shape{
+ height: 200px;
+ width: 200px;
+ position: absolute;
+ border-radius: 50%;
+}
+.shape:first-child{
+ background: linear-gradient(
+ #1845ad,
+ #23a2f6
+ );
+ left: -50px;
+ top: -50px;
+}
+.shape:last-child{
+ background: linear-gradient(
+ to right,
+ #ff512f,
+ #f09819
+ );
+ right: -30px;
+ bottom: -50px;
+}
+form{
+ height: 800px;
+ width: 900px;
+ background-color: rgba(255,255,255,0.13);
+ position: absolute;
+ transform: translate(-50%,-50%);
+ top: 50%;
+ left: 50%;
+ border-radius: 20px;
+ backdrop-filter: blur(3px);
+ border: 2px solid rgba(255,255,255,0.1);
+ box-shadow: 0 0 40px rgba(8,7,16,0.6);
+ padding: 40px 25px;
+}
+h2{
+ text-align: center;
+ font-size: 2em;
+}
+p{
+ margin: 10px;
+ text-align: center;
+}
+
+
+.form-group{
+ margin-top: 50px;
+}
+
+
+
+input{
+ display: block;
+ height: 50px;
+ width: 100%;
+ background-color: rgba(255,255,255,0.07);
+ border-radius: 5px;
+ padding: 0 10px;
+ margin-top: 30px;
+ font-size: 15px;
+ font-weight: 300;
+}
+::placeholder{
+ color: #e5e5e5;
+}
+
+.container
+{
+ position: absolute;
+ top: 95%;
+ left: 52%;
+ transform: translate(-50%, -50%);
+}
+
+.button
+{
+ position: relative;
+ text-align: center;
+ margin-bottom: 12px;
+ width: 200px;
+ padding: 10px;
+ font-size: 15px;
+ font-family: poppins;
+ font-weight: 400;
+ border: 5px solid #15f4ee;
+ text-transform: uppercase;
+ letter-spacing: 7px;
+ cursor: pointer;
+ border-radius: 100px;
+ transition: 1.5s;
+}
+
+.button:hover
+{
+ box-shadow: 0 5px 50px 0 #15f4ee inset,0 5px 50px 0 #15f4ee,
+ 0 5px 50px 0 #15f4ee inset,0 5px 50px 0 #15f4ee;
+}
\ No newline at end of file
diff --git a/UI/css/style_TG.css b/UI/css/style_TG.css
new file mode 100644
index 0000000000000000000000000000000000000000..8ae7e8ffb1df2e96ef6cb610183bc9994808e44e
--- /dev/null
+++ b/UI/css/style_TG.css
@@ -0,0 +1,125 @@
+*,
+*:before,
+*:after{
+ padding: 0;
+ margin: 0;
+ box-sizing: border-box;
+ font-family: verdana;
+ color: #ffffff;
+ letter-spacing: 0.5px;
+ outline: none;
+ border: none;
+ text-decoration: none;
+ }
+
+body{
+ background-color: #080710;
+}
+.wrap{
+ width: 430px;
+ height: 520px;
+ position: absolute;
+ transform: translate(-50%,-50%);
+ left: 50%;
+ top: 50%;
+}
+.wrap .shape{
+ height: 200px;
+ width: 200px;
+ position: absolute;
+ border-radius: 50%;
+}
+.shape:first-child{
+ background: linear-gradient(
+ #1845ad,
+ #23a2f6
+ );
+ left: -50px;
+ top: -50px;
+}
+.shape:last-child{
+ background: linear-gradient(
+ to right,
+ #ff512f,
+ #f09819
+ );
+ right: -30px;
+ bottom: -50px;
+}
+form{
+ height: 820px;
+ width: 900px;
+ background-color: rgba(255,255,255,0.13);
+ position: absolute;
+ transform: translate(-50%,-50%);
+ top: 50%;
+ left: 50%;
+ border-radius: 20px;
+ backdrop-filter: blur(3px);
+ border: 2px solid rgba(255,255,255,0.1);
+ box-shadow: 0 0 40px rgba(8,7,16,0.6);
+ padding: 40px 25px;
+}
+h2{
+ text-align: center;
+ font-size: 2em;
+}
+p{
+ margin: 10px;
+ text-align: center;
+}
+
+
+.form-group{
+ margin-top: 50px;
+}
+
+
+
+input{
+ display: block;
+ height: 30px;
+ width: 50%;
+ background-color: rgba(255,255,255,0.07);
+ border-radius: 5px;
+ padding: 0 10px;
+ margin-top: 5px;
+ margin-bottom: 5px;
+ font-size: 15px;
+ font-weight: 300;
+}
+::placeholder{
+ color: #e5e5e5;
+}
+
+.container
+{
+ position: absolute;
+ top: 95%;
+ left: 52%;
+ transform: translate(-50%, -50%);
+}
+
+.button
+{
+ position: relative;
+ text-align: center;
+ margin-bottom: 12px;
+ width: 200px;
+ padding: 10px;
+ font-size: 15px;
+ font-family: poppins;
+ font-weight: 400;
+ border: 5px solid #15f4ee;
+ text-transform: uppercase;
+ letter-spacing: 7px;
+ cursor: pointer;
+ border-radius: 100px;
+ transition: 1.5s;
+}
+
+.button:hover
+{
+ box-shadow: 0 5px 50px 0 #15f4ee inset,0 5px 50px 0 #15f4ee,
+ 0 5px 50px 0 #15f4ee inset,0 5px 50px 0 #15f4ee;
+}
diff --git a/UI/css/style_offchain.css b/UI/css/style_offchain.css
new file mode 100644
index 0000000000000000000000000000000000000000..0afcac4cbe46bbdda42ed3d3e89764e95849ff5a
--- /dev/null
+++ b/UI/css/style_offchain.css
@@ -0,0 +1,124 @@
+*,
+*:before,
+*:after{
+ padding: 0;
+ margin: 0;
+ box-sizing: border-box;
+ font-family: verdana;
+ color: #ffffff;
+ letter-spacing: 0.5px;
+ outline: none;
+ border: none;
+ text-decoration: none;
+ }
+
+body{
+ background-color: #080710;
+}
+.wrap{
+ width: 430px;
+ height: 520px;
+ position: absolute;
+ transform: translate(-50%,-50%);
+ left: 50%;
+ top: 50%;
+}
+.wrap .shape{
+ height: 200px;
+ width: 200px;
+ position: absolute;
+ border-radius: 50%;
+}
+.shape:first-child{
+ background: linear-gradient(
+ #1845ad,
+ #23a2f6
+ );
+ left: -50px;
+ top: -50px;
+}
+.shape:last-child{
+ background: linear-gradient(
+ to right,
+ #ff512f,
+ #f09819
+ );
+ right: -30px;
+ bottom: -50px;
+}
+form{
+ height: 800px;
+ width: 900px;
+ background-color: rgba(255,255,255,0.13);
+ position: absolute;
+ transform: translate(-50%,-50%);
+ top: 50%;
+ left: 50%;
+ border-radius: 20px;
+ backdrop-filter: blur(3px);
+ border: 2px solid rgba(255,255,255,0.1);
+ box-shadow: 0 0 40px rgba(8,7,16,0.6);
+ padding: 40px 25px;
+}
+h2{
+ text-align: center;
+ font-size: 2em;
+}
+p{
+ margin: 10px;
+ text-align: center;
+}
+
+
+.form-group{
+ margin-top: 50px;
+}
+
+
+
+input{
+ display: block;
+ height: 50px;
+ width: 100%;
+ background-color: rgba(255,255,255,0.07);
+ border-radius: 5px;
+ padding: 0 10px;
+ margin-top: 30px;
+ font-size: 15px;
+ font-weight: 300;
+}
+::placeholder{
+ color: #e5e5e5;
+}
+
+.container
+{
+ position: absolute;
+ top: 95%;
+ left: 52%;
+ transform: translate(-50%, -50%);
+}
+
+.button
+{
+ position: relative;
+ text-align: center;
+ margin-bottom: 12px;
+ width: 200px;
+ padding: 10px;
+ font-size: 15px;
+ font-family: poppins;
+ font-weight: 400;
+ border: 5px solid #15f4ee;
+ text-transform: uppercase;
+ letter-spacing: 7px;
+ cursor: pointer;
+ border-radius: 100px;
+ transition: 1.5s;
+}
+
+.button:hover
+{
+ box-shadow: 0 5px 50px 0 #15f4ee inset,0 5px 50px 0 #15f4ee,
+ 0 5px 50px 0 #15f4ee inset,0 5px 50px 0 #15f4ee;
+}
\ No newline at end of file
diff --git a/UI/css/style_onchain.css b/UI/css/style_onchain.css
new file mode 100644
index 0000000000000000000000000000000000000000..0afcac4cbe46bbdda42ed3d3e89764e95849ff5a
--- /dev/null
+++ b/UI/css/style_onchain.css
@@ -0,0 +1,124 @@
+*,
+*:before,
+*:after{
+ padding: 0;
+ margin: 0;
+ box-sizing: border-box;
+ font-family: verdana;
+ color: #ffffff;
+ letter-spacing: 0.5px;
+ outline: none;
+ border: none;
+ text-decoration: none;
+ }
+
+body{
+ background-color: #080710;
+}
+.wrap{
+ width: 430px;
+ height: 520px;
+ position: absolute;
+ transform: translate(-50%,-50%);
+ left: 50%;
+ top: 50%;
+}
+.wrap .shape{
+ height: 200px;
+ width: 200px;
+ position: absolute;
+ border-radius: 50%;
+}
+.shape:first-child{
+ background: linear-gradient(
+ #1845ad,
+ #23a2f6
+ );
+ left: -50px;
+ top: -50px;
+}
+.shape:last-child{
+ background: linear-gradient(
+ to right,
+ #ff512f,
+ #f09819
+ );
+ right: -30px;
+ bottom: -50px;
+}
+form{
+ height: 800px;
+ width: 900px;
+ background-color: rgba(255,255,255,0.13);
+ position: absolute;
+ transform: translate(-50%,-50%);
+ top: 50%;
+ left: 50%;
+ border-radius: 20px;
+ backdrop-filter: blur(3px);
+ border: 2px solid rgba(255,255,255,0.1);
+ box-shadow: 0 0 40px rgba(8,7,16,0.6);
+ padding: 40px 25px;
+}
+h2{
+ text-align: center;
+ font-size: 2em;
+}
+p{
+ margin: 10px;
+ text-align: center;
+}
+
+
+.form-group{
+ margin-top: 50px;
+}
+
+
+
+input{
+ display: block;
+ height: 50px;
+ width: 100%;
+ background-color: rgba(255,255,255,0.07);
+ border-radius: 5px;
+ padding: 0 10px;
+ margin-top: 30px;
+ font-size: 15px;
+ font-weight: 300;
+}
+::placeholder{
+ color: #e5e5e5;
+}
+
+.container
+{
+ position: absolute;
+ top: 95%;
+ left: 52%;
+ transform: translate(-50%, -50%);
+}
+
+.button
+{
+ position: relative;
+ text-align: center;
+ margin-bottom: 12px;
+ width: 200px;
+ padding: 10px;
+ font-size: 15px;
+ font-family: poppins;
+ font-weight: 400;
+ border: 5px solid #15f4ee;
+ text-transform: uppercase;
+ letter-spacing: 7px;
+ cursor: pointer;
+ border-radius: 100px;
+ transition: 1.5s;
+}
+
+.button:hover
+{
+ box-shadow: 0 5px 50px 0 #15f4ee inset,0 5px 50px 0 #15f4ee,
+ 0 5px 50px 0 #15f4ee inset,0 5px 50px 0 #15f4ee;
+}
\ No newline at end of file
diff --git a/UI/css/style_page1.css b/UI/css/style_page1.css
new file mode 100644
index 0000000000000000000000000000000000000000..1585e77e0c96a4467abfd4a27ce83edd4bc81789
--- /dev/null
+++ b/UI/css/style_page1.css
@@ -0,0 +1,124 @@
+*,
+*:before,
+*:after{
+ padding: 0;
+ margin: 0;
+ box-sizing: border-box;
+ font-family: verdana;
+ color: #ffffff;
+ letter-spacing: 0.5px;
+ outline: none;
+ border: none;
+ text-decoration: none;
+ }
+
+body{
+ background-color: #080710;
+}
+.wrap{
+ width: 430px;
+ height: 520px;
+ position: absolute;
+ transform: translate(-50%,-50%);
+ left: 50%;
+ top: 50%;
+}
+.wrap .shape{
+ height: 200px;
+ width: 200px;
+ position: absolute;
+ border-radius: 50%;
+}
+.shape:first-child{
+ background: linear-gradient(
+ #1845ad,
+ #23a2f6
+ );
+ left: -50px;
+ top: -50px;
+}
+.shape:last-child{
+ background: linear-gradient(
+ to right,
+ #ff512f,
+ #f09819
+ );
+ right: -30px;
+ bottom: -50px;
+}
+form{
+ height: 500px;
+ width: 500px;
+ background-color: rgba(255,255,255,0.13);
+ position: absolute;
+ transform: translate(-50%,-50%);
+ top: 50%;
+ left: 50%;
+ border-radius: 20px;
+ backdrop-filter: blur(3px);
+ border: 2px solid rgba(255,255,255,0.1);
+ box-shadow: 0 0 40px rgba(8,7,16,0.6);
+ padding: 40px 25px;
+}
+h2{
+ text-align: center;
+ font-size: 2em;
+}
+p{
+ margin: 10px;
+ text-align: center;
+}
+
+
+.form-group{
+ margin-top: 50px;
+}
+
+
+
+input{
+ display: block;
+ height: 50px;
+ width: 100%;
+ background-color: rgba(255,255,255,0.07);
+ border-radius: 5px;
+ padding: 0 10px;
+ margin-top: 30px;
+ font-size: 15px;
+ font-weight: 300;
+}
+::placeholder{
+ color: #e5e5e5;
+}
+
+.container
+{
+ position: absolute;
+ top: 57%;
+ left: 50%;
+ transform: translate(-50%, -50%);
+}
+
+.button
+{
+ position: relative;
+ text-align: center;
+ margin-bottom: 12px;
+ width: 200px;
+ padding: 10px;
+ font-size: 15px;
+ font-family: poppins;
+ font-weight: 400;
+ border: 5px solid #15f4ee;
+ text-transform: uppercase;
+ letter-spacing: 7px;
+ cursor: pointer;
+ border-radius: 100px;
+ transition: 1.5s;
+}
+
+.button:hover
+{
+ box-shadow: 0 5px 50px 0 #15f4ee inset,0 5px 50px 0 #15f4ee,
+ 0 5px 50px 0 #15f4ee inset,0 5px 50px 0 #15f4ee;
+}
\ No newline at end of file