diff --git a/starter_code/images/facebook (1).png b/starter_code/images/facebook (1).png
new file mode 100644
index 0000000..3a72823
Binary files /dev/null and b/starter_code/images/facebook (1).png differ
diff --git a/starter_code/images/facebook.png b/starter_code/images/facebook.png
new file mode 100644
index 0000000..3a72823
Binary files /dev/null and b/starter_code/images/facebook.png differ
diff --git a/starter_code/images/menu.png b/starter_code/images/menu.png
new file mode 100644
index 0000000..2574592
Binary files /dev/null and b/starter_code/images/menu.png differ
diff --git a/starter_code/images/twiter.png b/starter_code/images/twiter.png
new file mode 100644
index 0000000..27f7455
Binary files /dev/null and b/starter_code/images/twiter.png differ
diff --git a/starter_code/images/youtube.png b/starter_code/images/youtube.png
new file mode 100644
index 0000000..ff9fdcb
Binary files /dev/null and b/starter_code/images/youtube.png differ
diff --git a/starter_code/index.html b/starter_code/index.html
index bf06bff..6d04a03 100644
--- a/starter_code/index.html
+++ b/starter_code/index.html
@@ -1,20 +1,62 @@
 <!DOCTYPE html>
 <html lang="en">
-  <head>
-    <meta charset="UTF-8" />
-    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
-    <meta http-equiv="X-UA-Compatible" content="ie=edge" />
-
-    <!-- link the font awesome CDN -->
-    <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" />
-    <title>Where work happens | Slack</title>
-  </head>
-
-  <body>
-   
-    
-  </body>
-</html>
+
+<head>
+  <meta charset="UTF-8" />
+  <meta name="viewport" content="width=device-width, initial-scale=1.0" />
+  <meta http-equiv="X-UA-Compatible" content="ie=edge" />
+  <link href="https://cdn.jsdelivr.net/npm/bootstrap@5.3.2/dist/css/bootstrap.min.css" rel="stylesheet">
+  <link rel="stylesheet" href="./stylesheets/style.css" />
+  <title>Where work happens | Slack</title>
+</head>
+
+<body>
+
+  <header class="menu">
+    <img src="./images/slack-logo.png" alt="logo-slack" class="logo">
+    <img src="./images/menu.png" alt="" class="navicon">
+    <nav>
+      <ul>
+        <li>Why Slack</li>
+        <li>Pricing</li>
+        <li>About Us</li>
+      </ul>
+    </nav>
+  </header>
+  <section class="top">
+    <div class="container">
+      <div class="row">
+        <div class="col-lg-6">
+          <h1>Where Work Happens</h1>
+          <p>When your tem needs to kick off a project, hire a new employee, deploy some code, review a sales contract,
+            finalize next years budget, measure an A/B tes, plan your next office opening, and more, slack has you
+            covered
+          </p>
+          <form>
+            <input type="text" id="text_id" value="Email address" class="input-top">
+          </form>
+          <button class="butt-email" type="submit">Get Starter</button>
+          <p>Already using Slack?><a href="#">Sign in.</a></p>
+        </div>
+        <div class="col-lg-6">
+          <img src="images/home_talking.png" alt="" class="img-top">
+        </div>
+      </div>
+    </div>
+  </section>
+  <section class="mid">
+    <div class="container">
+      <div class="row">
+        <div class="col-lg-6">
+        </div>
+      </div>
+    </div>
+
+
+  </section>
+
+
+
+</body>
+
+</html>
\ No newline at end of file
diff --git a/starter_code/stylesheets/style.css b/starter_code/stylesheets/style.css
index cff873e..787d2db 100644
--- a/starter_code/stylesheets/style.css
+++ b/starter_code/stylesheets/style.css
@@ -5,3 +5,48 @@ main-titles dark-grey: #2C303F;
 paragraph grey: #5b5e6d;
 nav grey: #5b5e6d;
 */
+img {
+    width: 100%;
+}
+
+body {
+    margin: 0;
+    padding: 0;
+}
+
+.menu {
+    border-bottom: 1px #ccc;
+    justify-content: space-between;
+    display: flex;
+    padding: 10px;
+    align-items: center;
+    position: fixed;
+    width: 100%;
+}
+
+.butt-email {
+    background-color: #1264a3;
+    border: none;
+    padding: 10px 25px;
+    color: #fff;
+    border-radius: 5px
+}
+
+.menu .logo {
+    width: 130px
+}
+
+.menu .navicon {
+    width: 50px;
+}
+
+.menu ul {
+    display: flex;
+    margin: 0;
+    list-style: none;
+    justify-content: space-between;
+}
+
+.menu nav li {
+    margin-right: 6px;
+}
\ No newline at end of file
