diff --git a/index.html b/index.html
new file mode 100644
index 0000000..a35f90e
--- /dev/null
+++ b/index.html
@@ -0,0 +1,21 @@
+
+
+
+
+ Mock
+
+
+
+
+
+
\ No newline at end of file
diff --git a/styles.css b/styles.css
new file mode 100644
index 0000000..953df67
--- /dev/null
+++ b/styles.css
@@ -0,0 +1,79 @@
+body {
+ text-align: center;
+ box-sizing: border-box;
+}
+
+.iphone-outer {
+ width: 250px;
+ height: 500px;
+ border-radius: 45px;
+ border: 5px solid lightgrey;
+ text-align: center;
+ display: inline-block;
+}
+
+.top {
+ width: 10px;
+ height: 10px;
+ background-color: #444;
+ border-radius: 10px;
+ display: inline-block;
+ margin-top: 10px;
+ position: relative;
+}
+
+.top::before {
+ content: '';
+ width: 12px;
+ height: 12px;
+ background-color: #444;
+ border-radius: 5px;
+ position: absolute;
+ top: 15px;
+ left: -45px;
+}
+
+.top::after {
+ content: '';
+ border: 2px solid #444;
+ width: 40px;
+ border-radius: 5px;
+ position: absolute;
+ top: 22px;
+ left: -18px;
+}
+
+.screen-outer {
+ width: 85%;
+ margin: 35px auto 10px auto;
+ height: 355px;
+ display: block;
+ border: 3px solid #444;
+ border-radius: 3px;
+}
+
+.screen-inner {
+ width: 100%;
+ height: 100%;
+ background-image: url('wallpaper.jpg');
+ background-size: cover;
+ background-repeat: no-repeat;
+}
+
+.touch-id-outer {
+ width: 50px;
+ height: 50px;
+ border-radius: 50px;
+ display: inline-block;
+ background-image: linear-gradient(grey, white, lightgrey);
+}
+
+.touch-id-inner {
+ width: 43px;
+ height: 43px;
+ border-radius: 43px;
+ display: inline-block;
+ background-color: white;
+ margin-top: 3px;
+}
+
diff --git a/wallpaper.jpg b/wallpaper.jpg
new file mode 100644
index 0000000..3f1c27b
Binary files /dev/null and b/wallpaper.jpg differ