CodeYourFuture · myaskylar · May 16, 2021 · May 16, 2021 · May 16, 2021 · May 16, 2021
diff --git a/css/style.css b/css/style.css
@@ -6,3 +6,183 @@
  *    for example: General styles, Navigation styles, Hero styles, Footer etc.
  * 
  */
+body {
+  font-family: sans-serif, serif, monospace;
+}
+
+.sign-up-nav-bar {
+  display: flex;
+}
+
+.nav-bar-container {
+  display: flex;
+  background-color: silver;
+  font-size: 1em;
+  font-weight: bolder;
+}
+
+.sign-up-nav-bar > li {
+  display: inline;
+}
+
+.nav-icon {
+  width: 40px;
+  height: 40px;
+}
+
+#logo {
+  width: 100%;
+  height: 200px;
+  background: none;
+  display: flex;
+  align-items: center;
+} /*needs @media queries*/
+
+.head-line {
+  width: 80%;
+  height: 100px;
+  font-size: 100px;
+  text-align: center;
+  background: none;
+  position: fixed;
+  margin-left: 140px;
+  display: flex;
+  justify-content: space-around;
+}
+
+article :first-child {
+  text-transform: uppercase;
+  font-size: 2.5rem;
+  font-weight: bolder;
+  color: rgb(5, 5, 5);
+  text-shadow: 3px 3px rgb(38, 108, 129);
+}
+
+article :last-child {
+  font-size: 1.5rem;
+  font-weight: bold;
+}
+
+article {
+  border-bottom: groove;
+  border-width: 1px;
+}
+
+.section-container {
+  display: flex;
+}
+
+.twitter {
+  background: none;
+  margin: 20px 20px;
+  border-right: 1px solid grey;
+}
+
+.pic {
+  float: left;
+}
+
+.twitter > p {
+  font-size: 1.35rem;
+}
+
+.facebook {
+  background: none;
+  margin-top: 10px;
+}
+
+.facebook > p {
+  font-size: 1.35rem;
+}
+
+.instagram {
+  background: none;
+  border-top: 1px solid grey;
+}
+
+.instagram > p {
+  font-size: 1.35rem;
+}
+
+.credit {
+  text-align: right;
+  font-weight: bold;
+}
+
+footer {
+  background: none;
+  font-size: 1rem;
+  font-weight: bold;
+  text-align: center;
+  border-top: 1px solid grey;
+}
+
+footer > p {
+  margin: 0mm;
+}
+
+@media screen and (max-width: 1400px) {
+  .nav-bar-container {
+    display: block;
+    background-color: silver;
+    font-size: 1em;
+    font-weight: bolder;
+  }
+}
+
+@media screen and (max-width: 1300px) {
+  #logo {
+    display: none;
+  }
+}
+
+@media screen and (max-width: 500px) {
+  .nav-bar-container {
+    font-size: 0.5em;
+    font-weight: bolder;
+    display: block;
+  }
+
+  .sign-up-nav-bar {
+    display: flex;
+    margin-left: 120px;
+  }
+
+  .nav-icon {
+    width: 30px;
+    height: 30px;
+  }
+
+  #logo {
+    display: none;
+  }
+
+  article :last-child {
+    font-weight: bold;
+    font-size: inherit;
+  }
+
+  .twitter > p {
+    font-size: inherit;
+  }
+
+  .facebook > p {
+    font-size: inherit;
+  }
+
+  .instagram > p {
+    font-size: inherit;
+  }
+
+  .section-container {
+    display: flex;
+    flex-wrap: wrap;
+  }
+
+  .twitter {
+    background: none;
+    margin: auto;
+    border-right: none;
+    border-bottom: 1px solid grey;
+  }
+}
diff --git a/image/1024px-Facebook_icon.svg.png b/image/1024px-Facebook_icon.svg.png
diff --git a/image/1200px-Facebook_Logo_(2019).svg.png b/image/1200px-Facebook_Logo_(2019).svg.png
diff --git a/image/1200px-Instagram_logo.svg.png b/image/1200px-Instagram_logo.svg.png
diff --git a/image/1200px-Twitter_Logo_Mini.svg.png b/image/1200px-Twitter_Logo_Mini.svg.png
diff --git a/image/1200px-Twitter_logo.svg.png b/image/1200px-Twitter_logo.svg.png
diff --git a/image/330px-Mark_Zuckerberg_F8_2019_Keynote_(32830578717)_(cropped).jpg b/image/330px-Mark_Zuckerberg_F8_2019_Keynote_(32830578717)_(cropped).jpg
diff --git a/image/Instagram_logo_2016.svg.png b/image/Instagram_logo_2016.svg.png
diff --git a/image/Jack_Dorsey_2014_(cropped).jpg b/image/Jack_Dorsey_2014_(cropped).jpg
diff --git a/image/kevinsystrom-headshot.jpg b/image/kevinsystrom-headshot.jpg