diff --git a/alonso'sWork.html b/alonso'sWork.html
new file mode 100644
index 0000000..48ca028
--- /dev/null
+++ b/alonso'sWork.html
@@ -0,0 +1,71 @@
+<!DOCTYPE html>
+<html>
+    <head>
+        <meta charset="utf-8">
+        <title>Box Model</title>
+    </head>
+    <body>
+        <h1>Box Model Visual</h1>
+        <div style="position: relative;
+                    width: 200px;
+                    height: 300px;
+                    background-color: red;
+                    padding: 10px;
+                    border: 2px solid green;
+                    margin: 0;">
+            <div id="innerdiv1" style="position: absolute;
+                        width: 100px;
+                        height: 100px;
+                        left: 3rem;
+                        background-color: blue;
+                        padding: 10px;
+                        border: 2px solid white;
+                        margin: 0;">
+                    Inner DIV
+            </div>
+
+            <div id="innerdiv2" style="position: absolute;
+                        top: 10rem;
+                        width: 150px;
+                        height: 100px;
+                        background-color: beige;
+                        padding: 10px;
+                        border: 2px solid white;
+                        margin: 0;">
+                    Inner DIV2
+            </div>
+        </div>
+
+        <div style="position: relative;
+                    top: 1rem;
+                    left: 2rem;
+                    width: 200px;
+                    height: 300px;
+                    background-color: red;
+                    padding: 10px;
+                    border: 2px solid green;
+                    margin: 0;">
+            <div id="innerdiv1" style="position: absolute;
+                        top: 3rem;
+                        width: 100px;
+                        height: 100px;
+                        background-color: blue;
+                        padding: 10px;
+                        border: 2px solid white;
+                        margin: 0;">
+                    Inner DIV
+            </div>  
+
+            <div id="innerdiv2" style="position: absolute;
+                        bottom:2px;
+                        width: 100px;
+                        height: 100px;
+                        background-color: beige;
+                        padding: 10px;
+                        border: 2px solid white;
+                        margin: 0;">
+                    Inner DIV2
+            </div>
+        </div>
+    </body>
+</html>
\ No newline at end of file
diff --git a/css/registration-style.css b/css/registration-style.css
new file mode 100644
index 0000000..412261e
--- /dev/null
+++ b/css/registration-style.css
@@ -0,0 +1,48 @@
+@import url(https://fonts.googleapis.com/css?family=Montserrat);
+
+body {
+    background-color: #9CCC65;
+    font-family: montserrat, arial, verdana;
+}
+
+.registrationCard {
+    background: white;
+	border: 0 none;
+	border-radius: 3px;
+	box-shadow: 0 0 15px 1px rgba(0, 0, 0, 0.4);
+	padding: 20px 30px;
+	box-sizing: border-box;
+	width: 20%;
+    position: relative;
+    margin-top: 16%;
+    margin-left: 40%;
+}
+
+#forgotPasswordLink {
+    margin-left: 5rem;
+    color: orange;
+    cursor: pointer;
+}
+
+#username, #password, #loginButton {
+    padding: 15px;
+	border: 1px solid #ccc;
+	border-radius: 3px;
+	margin-bottom: 10px;
+	width: 100%;
+	box-sizing: border-box;
+	font-family: montserrat;
+	color: #2C3E50;
+	font-size: 13px;
+}
+
+#loginButton {
+    cursor: pointer;
+    background-color: #81D4FA;
+}
+
+#icon {
+    position: relative;
+    font-size: 100px;
+    left: 40%;
+}
diff --git a/css/style.css b/css/style.css
index d17d83a..b905bd0 100644
--- a/css/style.css
+++ b/css/style.css
@@ -2,7 +2,6 @@ body {
     background-color: navy;
 }
 
-
 object {
     height: 100vh;
     width: 100vh;
diff --git a/login-interface.html b/login-interface.html
new file mode 100644
index 0000000..f2be6fd
--- /dev/null
+++ b/login-interface.html
@@ -0,0 +1,20 @@
+<!DOCTYPE html>
+<html lang="en">
+<head>
+  <meta charset="utf-8">
+  <meta name="viewport" content="width=device-width, initial-scale=1">
+  <meta name="description" content="">
+  <meta name="author" content="">
+  <link href="./css/registration-style.css" rel="stylesheet">
+  <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/4.7.0/css/font-awesome.min.css">
+</head> 
+<body> 
+  <section class="registrationCard">
+    <i class="fa fa-user" id="icon"></i>
+    <input id="username" type="text" name="username" placeholder="Username" />
+    <input id="password" type="password" name="password" placeholder="Password" />
+    <input id="loginButton" type="button" name="LOGIN" value="LOGIN" />
+    <a id="forgotPasswordLink">Forgot Password?</a>
+  </section>
+</body>
+</html>
\ No newline at end of file
