bloominstituteoftechnology · helloitisjoshua · May 16, 2020 · May 16, 2020 · May 16, 2020 · May 16, 2020
diff --git a/README.md b/README.md
@@ -15,10 +15,10 @@ You are not allowed to collaborate during the Sprint Challenge. However, you are
 
 In this challenge, you build a missing header (navigation and image) on the home page, update some CSS styling on the home page, and make your page responsive for mobile. You will be working with a pre-existing web page, allowing you to get a taste of what it is like to inherit code from someone else, as will regularly happen on the job.
 
-In meeting the minimum viable product (MVP) specifications listed below, your web page should look like the solution screen shots of the home page and mobile version. 
+In meeting the minimum viable product (MVP) specifications listed below, your web page should look like the solution screen shots of the home page and mobile version.
 
  [Click here for home page example](https://tk-assets.lambdaschool.com/39a49225-8ac9-43da-aa90-514fd60ae99a_sprint-challenge-ui-home-example.png)
- 
+
  [Click here for tablet example](design/Tablet.png)
 
 
@@ -36,26 +36,36 @@ 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 elements used to help build the layout of a webpage in order to display information that's read by browsers as you visit a page. Heading, body, and footer for example.
+
 2. What are the 4 areas of the box model?
 
+Margin, border, padding, content
+
 3. While using flexbox, what axis does the following property work on: ```align-items: center```?
 
+The cross axis.
+
 4. Explain why git is valuable to a team of developers.
 
+Git is extremely valuable as it allows for version control of the code, while multiple people are working on different parts so issues are avoided. Allows for code review and merging so work isn't lost.
+
 5. Define mobile-first design in your own words.
 
+Mobile first development is building a website based on someone's phone in their hand versus being able to sit at a computer.
+
 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
 
 ### Task 1: Project Set Up
 
-- [ ] Create a forked copy of this project
-- [ ] Add your team lead as collaborator on Github
-- [ ] Clone your OWN version of the repository (Not Lambda's by mistake!)
-- [ ] Create a new branch: git checkout -b `<firstName-lastName>`.
-- [ ] Implement the project on your newly created `<firstName-lastName>` branch, committing changes regularly
-- [ ] Push commits: git push origin `<firstName-lastName>`
+- [X] Create a forked copy of this project
+- [X] Add your team lead as collaborator on Github
+- [X] Clone your OWN version of the repository (Not Lambda's by mistake!)
+- [X] Create a new branch: git checkout -b `<firstName-lastName>`.
+- [X] Implement the project on your newly created `<firstName-lastName>` branch, committing changes regularly
+- [X] Push commits: git push origin `<firstName-lastName>`
 
 ### Task 2:  Minimum Viable Product
 
@@ -65,23 +75,23 @@ Your finished project must include all of the following requirements:
 
 [Review the provided design files](/design). Notice the navigation and header images are missing in the starter code.
 
-* [ ] Build the HTML and CSS to create the missing navigation and header
-* [ ] Link the `About` navigation item to an about.html page (you'll also need to create `about.html`)
-* [ ] Make your design responsive such that it is accessible on mobile(500px)and matches the [mobile](design/Mobile.png) wireframe.
-* [ ] Add responsive breakpoints to your code by using media queries
+* [X] Build the HTML and CSS to create the missing navigation and header
+* [X] Link the `About` navigation item to an about.html page (you'll also need to create `about.html`)
+* [X] Make your design responsive such that it is accessible on mobile(500px)and matches the [mobile](design/Mobile.png) wireframe.
+* [X] Add responsive breakpoints to your code by using media queries
 
 You will also notice there are 10 boxes on the home page that need background colors.  Use this list below to correctly style each box:
 
-* [ ] box1: `teal`
-* [ ] box2: `gold`
-* [ ] box3: `cadetblue`
-* [ ] box4: `coral`
-* [ ] box5: `crimson`
-* [ ] box6: `forestgreen`
-* [ ] box7: `darkorchid`
-* [ ] box8: `hotpink`
-* [ ] box9: `indigo`
-* [ ] box10: `dodgerblue`
+* [X] box1: `teal`
+* [X] box2: `gold`
+* [X] box3: `cadetblue`
+* [X] box4: `coral`
+* [X] box5: `crimson`
+* [X] box6: `forestgreen`
+* [X] box7: `darkorchid`
+* [X] box8: `hotpink`
+* [X] box9: `indigo`
+* [X] box10: `dodgerblue`
 
 In your solution, it is essential that you follow best practices and produce clean and professional results. Schedule time to review, refine, and assess your work and perform basic professional polishing including spell-checking and grammar-checking on your work. It is better to submit a challenge that meets MVP than one that attempts too much and does not.
 
@@ -106,6 +116,6 @@ After finishing your required elements, you can push your work further. These go
 
 Follow these steps for completing your project.
 
-- [ ] Submit a Pull-Request to merge <firstName-lastName> Branch into master (student's  Repo). **Please don't merge your own pull request**
-- [ ] Add your team lead as a reviewer on the pull-request
-- [ ] Your team lead will count the project as complete by merging the branch back into master
+- [X] Submit a Pull-Request to merge <firstName-lastName> Branch into master (student's  Repo). **Please don't merge your own pull request**
+- [X] Add your team lead as a reviewer on the pull-request
+- [X] Your team lead will count the project as complete by merging the branch back into master
diff --git a/about.html b/about.html
diff --git a/index.html b/index.html
@@ -3,7 +3,7 @@
 <html lang="en">
 <head>
   <meta charset="utf-8">
-
+  <meta name="viewport" content="width=device-width, initial-scale=1.0" />
   <title>Sprint Challenge - Home</title>
 
   <link href="https://fonts.googleapis.com/css?family=Roboto|Rubik" rel="stylesheet">
@@ -12,8 +12,24 @@
 </head>
 
 <body>
+
     <div class="container">
-
+
+      <section class="heading-content">
+        <img class="heading-content" src="./assets/lambda-black.png" alt="black logo for Lambda"/>
+        <nav class="heading-content">
+          <a class="heading-content" href="./home.html">Home</a>
+          <a class="heading-content" href="./about.html">About</a>
+          <a class="heading-content" href="./products.html">Products</a>
+          <a class="heading-content" href="./blog.html">Blog</a>
+          <a class="heading-content" href="./contact.html">Contact</a>
+        </nav>
+      </section>
+
+      <section class="heading-content-image">
+        <img class="heading-content-image" src="./assets/jumbo.jpg" alt="time lapse of traffic on a highway"/>
+      </section>
+
         <section class="top-content">
             <div class="text-container">
                 <h2>The Future</h2>
@@ -24,24 +40,24 @@ <h2>The Past</h2>
                 <p>Proin sed quam sed tellus vestibulum ultrices quis in nunc. Phasellus id dui id tortor tincidunt efficitur. Proin faucibus imperdiet erat, non varius lacus. Maecenas non nisl id turpis egestas tincidunt. Nam condimentum venenatis magna eget finibus.</p>
             </div>
         </section>
-        
+
         <section class="middle-content">
-        
+
             <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="box1">Box 1</div>
+                <div class="box2">Box 2</div>
+                <div class="box3">Box 3</div>
+                <div class="box4">Box 4</div>
+                <div class="box5">Box 5</div>
+                <div class="box6">Box 6</div>
+                <div class="box7">Box 7</div>
+                <div class="box8">Box 8</div>
+                <div class="box9">Box 9</div>
+                <div class="box10">Box 10</div>
             </div>
-        
+
         </section>
 
         <section class="bottom-content">
@@ -60,16 +76,16 @@ <h2>Moon</h2>
             </div>
 
         </section>
-        
-        <footer>
-            <nav>
-                <a href="#">Home</a>
-                <a href="#">About</a>
-                <a href="#">Products</a>
-                <a href="#">Blog</a>
-                <a href="#">Contact</a>
+
+        <footer class="footer">
+            <nav class="footer">
+                <a class="footer" href="#">Home</a>
+                <a class="footer" href="#">About</a>
+                <a class="footer" href="#">Products</a>
+                <a class="footer" href="#">Blog</a>
+                <a class="footer" href="#">Contact</a>
             </nav>
         </footer>
-    </div><!-- container -->        
+    </div><!-- container -->
 </body>
 </html>