bloominstituteoftechnology · social-collab · May 8, 2020 · May 8, 2020 · May 8, 2020 · May 8, 2020
diff --git a/README.md b/README.md
@@ -36,14 +36,34 @@ Edit this document to include your answers after each question. Make sure to lea
 
 1. If you were to describe semantic HTML to the next cohort of students, what would you say?
 
+
+Semantic HTML is the particular way in which a code should be written in order for search engines and other programmers to be able to easily understand your code, such as including ```<header></header>``` tags to identify headers, ```<section></section>``` tags to identify sections, using proper hierarchy ```<header></header><section><h1></h1><h2></h2><p></p></section><footer></footer>```, etc.
+
+
 2. What are the 4 areas of the box model?
 
+
+Content (innermost section), border, padding, and margin (outtermost section)
+
+
 3. While using flexbox, what axis does the following property work on: ```align-items: center```?
 
+
+Cross Axis (sometimes called the vertical axis)
+
+
 4. Explain why git is valuable to a team of developers.
 
+
+It allows many different developers to work on a project and update the changes within github quickly and easily
+
+
 5. Define mobile-first design in your own words.
 
+
+To design a website for mobile first. In today's world, mobile is used more than laptops and desktops, so it would make sense to design for mobile first. It can also simplify the responsive design projects.
+
+
 You are expected to be able to answer all these questions. Your responses contribute to your Sprint Challenge grade. Skipping this section *will* prevent you from passing this challenge.
 
 ## Instructions

diff --git a/about.html b/about.html
@@ -0,0 +1,41 @@
+<!doctype html>
+
+<html lang="en">
+<head>
+  <meta charset="utf-8">
+
+  <title>Sprint Challenge - Home</title>
+
+  <link href="https://fonts.googleapis.com/css?family=Roboto|Rubik" rel="stylesheet">
+  <link rel="stylesheet" href="style/index.css">
+
+</head>
+
+<body>
+    <div class="container">
+
+		<header>
+
+			<img class="logo" src="assets/lambda-black.png" alt="Black Lambda School Logo" />
+
+			<nav>
+				<div class="nav-item"><a href="/home.html" title="Homepage">Home</a></div>
+				<div class="nav-item"><a href="/about.html" title="About Page">About</a></div>
+				<div class="nav-item">Products</div>
+				<div class="nav-item">Blog</div>
+				<div class="nav-item">Contact</div>
+			</nav>
+		</header>
+
+        <footer>
+            <nav>
+                <a href="#">Home</a>
+                <a href="#">About</a>
+                <a href="#">Products</a>
+                <a href="#">Blog</a>
+                <a href="#">Contact</a>
+            </nav>
+        </footer>
+    </div><!-- container -->        
+</body>
+</html>
diff --git a/index.html b/index.html
@@ -8,12 +8,28 @@
 
   <link href="https://fonts.googleapis.com/css?family=Roboto|Rubik" rel="stylesheet">
   <link rel="stylesheet" href="style/index.css">
-
+	<meta name="viewport" content="width=device-width, initial-scale=1.0">
 </head>
 
 <body>
     <div class="container">
 
+		<header>
+
+			<img class="logo" src="assets/lambda-black.png" alt="Black Lambda School Logo" />
+
+			<nav>
+				<div class="nav-item"><a href="/home.html" title="Homepage">Home</a></div>
+				<div class="nav-item"><a href="/about.html" title="About Page">About</a></div>
+				<div class="nav-item"><a href="#">Products</a></div>
+				<div class="nav-item"><a href="#">Blog</a></div>
+				<div class="nav-item"><a href="#">Contact</a></div>
+			</nav>
+
+		</header>
+
+		<img class="header-image" src="assets/jumbo.jpg" alt="Awesome image" />
+
         <section class="top-content">
             <div class="text-container">
                 <h2>The Future</h2>
@@ -30,16 +46,16 @@ <h2>The Past</h2>
             <h2>Why Did It Have To Be Boxes...</h2>
 
             <div class="boxes">
-                <div class="box">Box 1</div>
-                <div class="box">Box 2</div>
-                <div class="box">Box 3</div>
-                <div class="box">Box 4</div>
-                <div class="box">Box 5</div>
-                <div class="box">Box 6</div>
-                <div class="box">Box 7</div>
-                <div class="box">Box 8</div>
-                <div class="box">Box 9</div>
-                <div class="box">Box 10</div>
+                <div class="box box1">Box 1</div>
+                <div class="box box2">Box 2</div>
+                <div class="box box3">Box 3</div>
+                <div class="box box4">Box 4</div>
+                <div class="box box5">Box 5</div>
+                <div class="box box6">Box 6</div>
+                <div class="box box7">Box 7</div>
+                <div class="box box8">Box 8</div>
+                <div class="box box9">Box 9</div>
+                <div class="box box10">Box 10</div>
             </div>
 
         </section>
@@ -63,8 +79,8 @@ <h2>Moon</h2>
 
         <footer>
             <nav>
-                <a href="#">Home</a>
-                <a href="#">About</a>
+                <a href="/index.html">Home</a>
+                <a href="/about.html">About</a>
                 <a href="#">Products</a>
                 <a href="#">Blog</a>
                 <a href="#">Contact</a>