diff --git a/.vscode/settings.json b/.vscode/settings.json
new file mode 100644
index 000000000..6f3a2913e
--- /dev/null
+++ b/.vscode/settings.json
@@ -0,0 +1,3 @@
+{
+    "liveServer.settings.port": 5501
+}
\ No newline at end of file
diff --git a/starter_code/index.html b/starter_code/index.html
index 2f593610f..509d7cc5a 100644
--- a/starter_code/index.html
+++ b/starter_code/index.html
@@ -64,7 +64,7 @@
     <div>
       <h1>Great teamwork starts with a digital HQ</h1>
 
-      <p>Slack is free to try for as long as you'd like.</p>
+      <p id="slacksubscription"> <span id="orangetext">Slack is free to try</span> for as long as you'd like.</p>
 
       <div>
         <button>Sign up with email</button>
@@ -78,7 +78,7 @@ <h1>Great teamwork starts with a digital HQ</h1>
     </div>
 
     <div>
-      <img src="./images/hero-product-ui.png" alt="Slack app screenshot" />
+      <img src="./images/hero-product-ui.png" alt="Slack app screenshot" class="bigimage"/>
     </div>
   </header>
 
@@ -87,12 +87,12 @@ <h1>Great teamwork starts with a digital HQ</h1>
       <p>Trusted by companies all over the world</p>
 
       <div>
-        <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" />
-        <img src="./images/logo-target.png" alt="Target logo" />
-        <img src="./images/logo-nyt.png" alt="New York Times logo" />
-        <img src="./images/logo-spotify.png" alt="Spotify logo" />
+        <img src="./images/logo-airbnb.png" alt="Airbnb logo" class="bigimage"/>
+        <img src="./images/logo-nasa.png" alt="NASA logo" class="bigimage"/>
+        <img src="./images/logo-uber.png" alt="Uber logo" class="bigimage"/>
+        <img src="./images/logo-target.png" alt="Target logo" class="bigimage"/>
+        <img src="./images/logo-nyt.png" alt="New York Times logo" class="bigimage"/>
+        <img src="./images/logo-spotify.png" alt="Spotify logo" class="bigimage"/>
       </div>
 
     </section>
diff --git a/starter_code/stylesheets/style.css b/starter_code/stylesheets/style.css
index 59f4a7798..3b66e8949 100644
--- a/starter_code/stylesheets/style.css
+++ b/starter_code/stylesheets/style.css
@@ -1,5 +1,60 @@
-/*
-background purple: #540B51
+body {
+    background: #540B51; 
+}
+
+.bigimage {
+    max-width: 100px; 
+}
+
+h1 {
+    color: white;
+    text-align: center;
+    font-size: 60px;
+    font-weight: 500;
+}
+
+nav {
+    display: flex;
+    flex-direction: row;
+    justify-content: space-between;
+    padding: 50px;
+}
+
+nav div:first-child img {
+    width: 200px;
+}
+
+body nav button {
+    background-color: #540B51;
+    border: none;
+    color: white;
+    justify-content: space-between;
+}
+
+
+ul {
+    display: none;
+}
+
+#slacksubscription {
+    color: white;
+    text-align: center;
+    font-size: 20px;
+    padding-bottom: 30px;
+}
+
+#orangetext {
+    color: #ECB12F;
+}
+
+header div button {
+    display: flex;
+    flex-direction: column;
+    justify-content: center;
+    flex-grow: 1;
+}
+
+/*background purple: #54 0B51
 background ivory: #F3EAE2
 button blue: #4285F4
 titles black: #191817
@@ -8,3 +63,9 @@ paragraph yellow: #ECB12F
 links blue: #2E71A6
 footer links grey: #454245
 */
+
+@media screen and (min-width: 768){
+   ul {
+    display: block;
+} 
+}