diff --git a/index.html b/index.html
index de58fe06d..5a4a1c7f7 100644
--- a/index.html
+++ b/index.html
@@ -8,17 +8,22 @@
 </head>
 <body>
     <section class="top">
-        <h1>AMANDA FAHEY</h1>
         <nav>
+            <h1>AMANDA FAHEY</h1>
+            <div class="links">
             <button><a href="index.html">HOME</a></button>
             <button><a href="about.html">ABOUT</a></button>
             <button><a href="contact.html">CONTACT</a></button>
             <button><a href="projects.html">PROJECTS</a></button>
+        </div>
         </nav>
-        <h1>My Projects</h1>
+        <h2>My Projects</h2>
         <p>Lorem ipsum dolor sit amet consectetur adipisicing elit. Iure facilis obcaecati esse dignissimos adipisci doloribus harum similique fugiat pariatur, sed id aliquam animi maxime, vitae commodi, dolor deleniti. Architecto, facere.
         </p>
-        <img src="https://picsum.photos/800/500"/>
+
+    </section>
+    <section class="bg-img">
+
     </section>
 
     <section class="row">
diff --git a/style/index.css b/style/index.css
index e427cb25c..ef585519e 100644
--- a/style/index.css
+++ b/style/index.css
@@ -1,11 +1,39 @@
+*{
+  box-sizing: border-box;
+  padding: 0%;
+  margin: 0%
+  max-width:100%;  
+}
+
+html{
+    font-size:62.5%;
+}
+
+body{
+    font-size:1.6rem;
+}
+
+section{
+    padding:4% 0;
+}
+
+
 .top {
     display: flex;
     flex-direction: column;
     justify-content: center;
     text-align: center;
+    width:80%;
+    margin:0 auto;
 }
 
-
+.bg-img{
+    background-image:url('https://images.unsplash.com/photo-1638898863117-9625f88614e7?ixlib=rb-1.2.1&ixid=MnwxMjA3fDB8MHxlZGl0b3JpYWwtZmVlZHwyM3x8fGVufDB8fHx8&auto=format&fit=crop&w=400&q=60');
+    background-repeat: no-repeat;
+    background-size: cover;
+    background-attachment: fixed;
+    height: 50vh;
+}
 
 footer {
     background-color: lightgrey;
@@ -24,4 +52,32 @@ footer {
     width: 200px;
     text-align: center;
     padding: 20px;
-}
\ No newline at end of file
+}
+
+@media(max-width: 800px){
+    .row{
+        flex-wrap:wrap;
+    }
+    .row img{
+        width: 20%;
+    }
+    .row div{
+        width:100%;
+    }
+}
+
+@media(max-width: 500px){
+    .links{
+    display: flex;
+    flex-direction: column;
+    align-items: center;
+    }
+    .row{
+        flex-wrap:wrap;
+    }
+    .row img{
+        width: 40%;
+        margin:4% 0;
+    }
+}
+
