diff --git a/.DS_Store b/.DS_Store
new file mode 100644
index 000000000..6b0540d5c
Binary files /dev/null and b/.DS_Store differ
diff --git a/starter_code/index.html b/starter_code/index.html
index 2f593610f..8304ef69f 100644
--- a/starter_code/index.html
+++ b/starter_code/index.html
@@ -10,7 +10,7 @@
   <link href="https://use.fontawesome.com/releases/v5.0.1/css/all.css" rel="stylesheet" />
 
   <!-- link your styles -->
-  <link rel="stylesheet" href="./stylesheets/style.css" />
+  <link rel="stylesheet" href="./stylesheets/style.css"/>
 
   <link rel="icon" type="image/x-icon" href="./images/slack-icon.png">
   <title>Slack is your digital HQ | Slack</title>
@@ -19,10 +19,10 @@
 <body>
   <!-- NAVBAR -->
   <nav>
-    <div>
-      <img src="./images/slack-logo.png" alt="Slack logo" />
+    <div class = "leftParent">
+      <img src="./images/slack-logo.png" alt="Slack logo" class="logoLeft"/>
 
-      <ul>
+      <ul class = "hide">
         <li>
           <a href="#">Product</a>
         </li>
@@ -39,7 +39,7 @@
     </div>
 
     <div>
-      <button>
+      <button class="rightParent">
         <img src="./images/icon-search.png" alt="Search icon">
       </button>
 
@@ -66,27 +66,28 @@ <h1>Great teamwork starts with a digital HQ</h1>
 
       <p>Slack is free to try for as long as you'd like.</p>
 
-      <div>
+      <div class=" btn-size">
         <button>Sign up with email</button>
 
-        <button>
-          <img src="./images/logo-google.png" alt="Google logo" />
+        <button class="btn-adjust">
+          <img src="./images/logo-google.png" alt="Google logo"/>
           <span>Sign up with Google</span>
+          <span></span>
         </button>
       </div>
 
     </div>
 
-    <div>
+    <div class="img-size">
       <img src="./images/hero-product-ui.png" alt="Slack app screenshot" />
     </div>
   </header>
 
   <main>
-    <section>
+    <section class="logos">
       <p>Trusted by companies all over the world</p>
 
-      <div>
+      <div class="companies">
         <img src="./images/logo-airbnb.png" alt="Airbnb logo" />
         <img src="./images/logo-nasa.png" alt="NASA logo" />
         <img src="./images/logo-uber.png" alt="Uber logo" />
@@ -97,7 +98,7 @@ <h1>Great teamwork starts with a digital HQ</h1>
 
     </section>
 
-    <section>
+    <section class="average">
       <h3>Teams large and small rely on Slack</h3>
       <p>Slack securely scales up to support collaboration at the world’s biggest companies.</p>
 
diff --git a/starter_code/stylesheets/style.css b/starter_code/stylesheets/style.css
index 59f4a7798..0cb63ac73 100644
--- a/starter_code/stylesheets/style.css
+++ b/starter_code/stylesheets/style.css
@@ -8,3 +8,113 @@ paragraph yellow: #ECB12F
 links blue: #2E71A6
 footer links grey: #454245
 */
+
+*{
+font-family: sans-serif;
+
+}
+
+
+
+
+@media screen and (width < 760px) {
+
+nav {
+background-color: rgb(182, 182, 255);
+display: flex;
+
+
+}
+
+.hide {
+display: none;
+}
+
+ .leftParent{
+display: flex;
+ justify-content: flex-start;
+      }
+
+.logoLeft {
+    justify-content: flex-start;
+    width: 100px
+ }
+
+ .rightParent {
+
+display: flex;
+justify-content: flex-end;
+
+}
+
+
+.header {
+background-color: blueviolet;
+display: flex;
+flex-direction: column;
+align-items: center;
+}
+
+header > div{
+    display: flex;
+    flex-direction: column;
+    }
+
+.btn-size{
+display: flex;
+flex-direction: column;
+
+}
+
+.img-size{
+display: flex;
+align-items: center;
+}
+
+.btn-adjust{
+display: flex;
+ justify-content: space-between;
+background-color:#4285F4;
+}
+
+
+.btn-adjust > img{
+    width: 15px;
+background-color: white;
+}
+
+.logos {
+background-color: ivory;
+display: flex;
+flex-direction: column;
+
+}
+
+.logos > p {
+text-align: center;
+
+   }
+
+.companies {
+ display: flex;
+ justify-content: center;
+align-items: center;
+flex-wrap: wrap;
+gap: 40px;
+}
+
+ .companies > img {
+width: 200px;
+height: 40px;
+object-fit: contain;
+}
+
+.average{
+display: flex;
+flex-direction: column;
+color: #540B51;
+text-align: center;    
+
+ }
+
+}
\ No newline at end of file
