diff --git a/template.html b/template.html
index 27f1466..b7880af 100644
--- a/template.html
+++ b/template.html
@@ -1,12 +1,57 @@
-<div>
-    <p> {My Name} </p>
+ <html>
+  <head>     
+    <style>
+      #container {
+        font-family: Helvetica;
+        padding: 10px;
+        border: 1px solid #FDBCB4;
+        background-color:purple;
+    
+        /*loading an image that you have added to the project*/
+        background-image: url(assets/bubbles.gif);
+      }
+
+      #title {
+        font-size: 30px;
+        color:#FDBCB4;
+        text-align: center;
+        padding: 10px;
+      }
+
+      img{
+        width: 300px;
+        
+        /*This makes the image centered horizontally!*/
+        display: block;
+        margin-left: auto;
+        margin-right: auto;
+      }
+
+      #quote-container {
+        color: #4166F5;
+        padding: 30px;
+        font-style: italic;
+      }
+
+      #quote {
+        padding: 30px;
+        background-color: #FDBCB4;
+        color: white;
+        border: 1px dotted white;
+      }
+    </style>
+    </head>
+</html>
+<div id="container">
+    <p id="title"> Karmeen Ho </p>
+    <css></css>
     
     <div>
-        <img src=""></img>
+        <img src="http://aelida.com/wp-content/uploads/2013/09/all-studs.jpg"></img>
     </div>
     
-    <div>
+    <div id="quote-container">
         <p>What I'm saying in 2015: </p>
-        <p>{My Yearbook Quote} </p>
+        <pm id="quote">I don't want other people decide who I am. I want to decide for myself.</p>
     </div>
 </div>
