diff --git a/app.js b/app.js
index e69de29..0de7ea4 100644
--- a/app.js
+++ b/app.js
@@ -0,0 +1,7 @@
+var today = new Date();
+var day = today.getDay();
+var hour = today.getHours();
+var min = today.getMinutes();
+var daylist = ["Sunday","Monday","Tuesday","Wednesday","Thursday","Friday","Saturday"];
+document.getElementById("time").innerHTML=hour+":"+min;
+document.getElementById("day").innerHTML=daylist[day];
diff --git a/index.js b/index.js
index e69de29..ab354d3 100644
--- a/index.js
+++ b/index.js
@@ -0,0 +1,31 @@
+
+
+
+
+
+
+ Smart Watch
+
+
+
+
+
SmartWatch
+
+
+
+
+
diff --git a/style.css b/style.css
index e69de29..962f5cf 100644
--- a/style.css
+++ b/style.css
@@ -0,0 +1,73 @@
+.black{
+ height: 100%;
+ width: 50%;
+ position: fixed;
+ z-index: 1;
+ top: 0;
+ overflow-x: hidden;
+ padding-top: 20px;
+ left: 0;
+ background-color: gray;
+}
+.white{
+ height: 100%;
+ width: 50%;
+ position: fixed;
+ z-index: 1;
+ top: 0;
+ overflow-x: hidden;
+ padding-top: 20px;
+ right: 0;
+ background-color: whitesmoke;
+ display: flex;
+ flex-direction: row;
+ justify-content: center;
+ align-items: center;
+ padding: 10px 0;
+}
+.head{
+ color: white;
+ font-size: 90px;
+ font-weight: 500;
+ text-align: center;
+ margin-top: 40%;
+ margin-bottom: 30%;
+}
+.watch {
+ background: black;
+ height: 50vh;
+ width: 22vw;
+ border-radius: 85px;
+ color: white;
+ display: flex;
+ flex-direction: row;
+ justify-content: center;
+ align-items: center;
+ padding: 10px 0;
+
+}
+
+.watchBack {
+ position: absolute;
+ background: #c44e4e;
+ height: 58vh;
+ width: 22vw;
+ border-radius: 105px;
+ z-index: -1;
+
+}
+.icons {
+ height: 6vh;
+ width: 21vw;
+ align-self: end;
+ position: absolute;
+ display: flex;
+ justify-content: space-evenly;
+}
+
+.time {
+ display: flex;
+ flex-direction: column;
+ align-items: center;
+ font-size: xxx-large;
+}
+ 
+ 
+