Ada-C6 · bellewether · Sep 16, 2016 · Sep 23, 2016 · Sep 23, 2016 · Sep 23, 2016
diff --git a/about.html b/about.html
@@ -0,0 +1,43 @@
+<!DOCTYPE html>
+<html>
+  <head>
+    <meta charset="utf-8">
+    <title>About Page</title>
+    <link href="styles/styles.css" rel="stylesheet">
+  </head>
+  <body>
+    <header>
+      <h1><a href="index.html">YASMIN OR</a></h1>
+    </header>
+
+    <main>
+      <nav>
+        <h4><a href="index.html">home.</a></h4>
+        <h4><a href="about.html">about.</a></h4>
+        <h4><a href="portfolio.html">portfolio.</a></h4 >
+        <h4><a href="blog.html">blog.</a></h4>
+      </nav>
+
+      <img src="imgs/really-woman.jpg" alt="Me but not really me"/>
+
+      <article>
+        <p><strong>Hello</strong></p>
+        <p>Pitchfork asymmetrical kombucha, sustainable salvia helvetica four loko. Pour-over stumptown hella neutra organic actually. You probably haven't heard of them live-edge wolf authentic semiotics. Listicle put a bird on it dreamcatcher, street art YOLO celiac brooklyn tumblr jean shorts photo booth vegan. Selvage fashion axe hot chicken, literally subway tile raw denim live-edge godard kinfolk mumblecore health goth fanny pack post-ironic vaporware sriracha. Lumbersexual poutine polaroid, meggings authentic gentrify health goth. Salvia vaporware vegan keytar gluten-free viral ennui.</p>
+        <p class="contact"><strong>email:</strong> yasminor [at] gmail [dot] com</p>
+        <p class="contact"><strong>twitter:</strong> @bellwether_bloc</p>
+        <p class="contact"><strong>github:</strong> @bellewether</p>
+      </article>
+    </main>
+
+
+    <footer>
+      <p id="disclaimer">All ideas, work and opinions expressed are my own.</p>
+      <span>
+        <a href=""><img src="imgs/icons/email-icon.png" alt="email-icon" class="social-media-icons"/></a>
+        <a href=""><img src="imgs/icons/icon-twitter-grey-150x150.png" alt="twitter-icon" class="social-media-icons"/></a>
+        <a href=""><img src="imgs/icons/facebookicon.png" alt="facebook-icon" class="social-media-icons"/></a>
+        <a href=""><img src="imgs/icons/google-plus-4-512.png" alt="google-plus-icon" class="social-media-icons"/></a>
+      </span>
+    </footer>
+  </body>
+</html>
diff --git a/blog.html b/blog.html
@@ -0,0 +1,51 @@
+<head>
+  <meta charset="utf-8">
+  <title>Blog Page</title>
+  <link href="styles/styles.css" rel="stylesheet">
+</head>
+<body>
+  <header>
+    <h1><a href="index.html">YASMIN OR</a></h1>
+
+  </header>
+
+  <main>
+    <nav>
+      <h4><a href="index.html">home.</a></h4>
+      <h4><a href="about.html">about.</a></h4>
+      <h4><a href="portfolio.html">portfolio.</a></h4 >
+        <h4><a href="blog.html">blog.</a></h4>
+      </nav>
+    <!-- <p id="home-blurb">Pitchfork asymmetrical kombucha, sustainable salvia helvetica four loko. Pour-over stumptown hella neutra organic actually. You probably haven't heard of them live-edge wolf authentic semiotics. Listicle put a bird on it dreamcatcher, street art YOLO celiac brooklyn tumblr jean shorts photo booth vegan. Selvage fashion axe hot chicken, literally subway tile raw denim live-edge godard kinfolk mumblecore health goth fanny pack post-ironic vaporware sriracha. Lumbersexual poutine polaroid, meggings authentic gentrify health goth. Salvia vaporware vegan keytar gluten-free viral ennui.</p> -->
+    <img src="imgs/very-bored-woman.jpg" alt="bored-woman"/>
+
+    <article class="blog-post">
+      <p>Pitchfork asymmetrical kombucha, sustainable salvia helvetica four loko. Pour-over stumptown hella neutra organic actually. You probably haven't heard of them live-edge wolf authentic semiotics. Listicle put a bird on it dreamcatcher, street art YOLO celiac brooklyn tumblr jean shorts photo booth vegan. Selvage fashion axe hot chicken, literally subway tile raw denim live-edge godard kinfolk mumblecore health goth fanny pack post-ironic vaporware sriracha. Lumbersexual poutine polaroid, meggings authentic gentrify health goth. Salvia vaporware vegan keytar gluten-free viral ennui.</p>
+      <strong>23 September 2016</strong>
+    </article>
+
+    <article class="blog-post">
+      <img src="imgs/beautiful-zombie.jpg" alt="beautiful zombie"/>
+      <p>mood</p>
+      <strong>20 September 2016</strong>
+    </article>
+
+    <article class="blog-post">
+      <p>Et proin nam dictum mauris congue. Id vivamus, maecenas magna leo vestibulum ac in, diam ut litora lacus orci, nascetur mi sapien, nulla felis dictum a. Phasellus ipsum enim duis proin arcu, a ullamcorper metus. Est enim egestas lorem maecenas. Consectetuer donec molestiae libero tellus elementum et, elit orci vel quis, nam accumsan amet, vitae sed omnis. Turpis et wisi etiam sed in quisque. Potenti vulputate vitae rerum erat vel lacus, mattis malesuada suspendisse, commodo velit amet ipsum faucibus in justo, volutpat sem iaculis, sem praesent hendrerit. Nonummy nonummy, non at ante montes hendrerit platea, vulputate mattis lobortis mollis pellentesque aenean amet. Nunc pellentesque nibh.</p>
+      <strong>19 September 2016</strong>
+    </article>
+
+  </main>
+
+
+  <footer>
+    <p id="disclaimer">All ideas, work and opinions expressed are my own.</p>
+    <span>
+      <a href=""><img src="imgs/icons/email-icon.png" alt="email-icon" class="social-media-icons"/></a>
+      <a href=""><img src="imgs/icons/icon-twitter-grey-150x150.png" alt="twitter-icon" class="social-media-icons"/></a>
+      <a href=""><img src="imgs/icons/facebookicon.png" alt="facebook-icon" class="social-media-icons"/></a>
+      <a href=""><img src="imgs/icons/google-plus-4-512.png" alt="google-plus-icon" class="social-media-icons"/></a>
+    </span>
+  </footer>
+</body>
+</html>
diff --git a/imgs/.DS_Store b/imgs/.DS_Store
diff --git a/imgs/beautiful-zombie.jpg b/imgs/beautiful-zombie.jpg
diff --git a/imgs/icons/.DS_Store b/imgs/icons/.DS_Store
diff --git a/imgs/icons/email-icon.png b/imgs/icons/email-icon.png
diff --git a/imgs/icons/facebookicon.png b/imgs/icons/facebookicon.png
diff --git a/imgs/icons/google-plus-4-512.png b/imgs/icons/google-plus-4-512.png
diff --git a/imgs/icons/icon-twitter-grey-150x150.png b/imgs/icons/icon-twitter-grey-150x150.png
diff --git a/imgs/michael-jackson.jpg b/imgs/michael-jackson.jpg
diff --git a/imgs/mourning-girl.jpg b/imgs/mourning-girl.jpg
diff --git a/imgs/really-woman.jpg b/imgs/really-woman.jpg
diff --git a/imgs/silly-classical-painting.jpg b/imgs/silly-classical-painting.jpg
diff --git a/imgs/very-bored-woman.jpg b/imgs/very-bored-woman.jpg
diff --git a/imgs/woman-drinking-on-a-train.jpg b/imgs/woman-drinking-on-a-train.jpg
diff --git a/index.html b/index.html
@@ -0,0 +1,37 @@
+<!DOCTYPE html>
+<html>
+  <head>
+    <meta charset="utf-8">
+    <title>Yasmin's Personal Site</title>
+    <link href="styles/styles.css" rel="stylesheet">
+  </head>
+  <body>
+    <header>
+      <h1><a href="index.html">YASMIN OR</a></h1>
+
+    </header>
+
+    <main>
+      <nav>
+        <h4><a href="index.html">home.</a></h4>
+        <h4><a href="about.html">about.</a></h4>
+        <h4><a href="portfolio.html">portfolio.</a></h4 >
+          <h4><a href="blog.html">blog.</a></h4>
+        </nav>
+      <!-- <p id="home-blurb">Pitchfork asymmetrical kombucha, sustainable salvia helvetica four loko. Pour-over stumptown hella neutra organic actually. You probably haven't heard of them live-edge wolf authentic semiotics. Listicle put a bird on it dreamcatcher, street art YOLO celiac brooklyn tumblr jean shorts photo booth vegan. Selvage fashion axe hot chicken, literally subway tile raw denim live-edge godard kinfolk mumblecore health goth fanny pack post-ironic vaporware sriracha. Lumbersexual poutine polaroid, meggings authentic gentrify health goth. Salvia vaporware vegan keytar gluten-free viral ennui.</p> -->
+      <img src="imgs/michael-jackson.jpg" alt="Me but not really me"/>
+      <!-- <p id="short-bio">Hi! Some very short bio stuff will go here. Like what my name is, how I spend my days and energy, plus a few things I'm just into. Maybe I will also include a link to my twitter page.</p> -->
+    </main>
+
+
+    <footer>
+      <p id="disclaimer">All ideas, work and opinions expressed are my own.</p>
+      <span>
+        <a href=""><img src="imgs/icons/email-icon.png" alt="email-icon" class="social-media-icons"/></a>
+        <a href=""><img src="imgs/icons/icon-twitter-grey-150x150.png" alt="twitter-icon" class="social-media-icons"/></a>
+        <a href=""><img src="imgs/icons/facebookicon.png" alt="facebook-icon" class="social-media-icons"/></a>
+        <a href=""><img src="imgs/icons/google-plus-4-512.png" alt="google-plus-icon" class="social-media-icons"/></a>
+      </span>
+    </footer>
+  </body>
+</html>
diff --git a/portfolio.html b/portfolio.html
@@ -0,0 +1,36 @@
+<!DOCTYPE html>
+<html>
+  <head>
+    <meta charset="utf-8">
+    <title>Yasmin's Portfolio</title>
+    <link href="styles/styles.css" rel="stylesheet">
+  </head>
+  <body>
+    <header>
+      <h1><a href="index.html">YASMIN OR<a/></h1>
+
+    </header>
+
+    <main>
+      <nav>
+        <h4><a href="index.html">home.</a></h4>
+        <h4><a href="about.html">about.</a></h4>
+        <h4><a href="portfolio.html">portfolio.</a></h4 >
+          <h4><a href="blog.html">blog.</a></h4>
+        </nav>
+
+      <img src="imgs/mourning-girl.jpg" alt="mourning-girl"/>
+
+    </main>
+
+    <footer>
+      <p id="disclaimer">All ideas, work and opinions expressed are my own.</p>
+      <span>
+        <a href=""><img src="imgs/icons/email-icon.png" alt="email-icon" class="social-media-icons"/></a>
+        <a href=""><img src="imgs/icons/icon-twitter-grey-150x150.png" alt="twitter-icon" class="social-media-icons"/></a>
+        <a href=""><img src="imgs/icons/facebookicon.png" alt="facebook-icon" class="social-media-icons"/></a>
+        <a href=""><img src="imgs/icons/google-plus-4-512.png" alt="google-plus-icon" class="social-media-icons"/></a>
+      </span>
+    </footer>
+  </body>
+</html>
diff --git a/styles/styles.css b/styles/styles.css
@@ -0,0 +1,85 @@
+html {
+  font: 12px/16px Arial, Serif;
+}
+
+header {
+  /*position: absolute;*/
+  /*border-style: solid;*/
+  /*display: inline-block;*/
+}
+header h1 a{
+  /*position: absolute;*/
+  display: inline-block;
+  margin: 50px 0px 10px 35px;
+  font-size: 35px;
+  letter-spacing: 3.5px;
+  text-decoration: none;
+  color: black;
+}
+
+main nav h4 {
+  display: inline-block;;
+  /*float: right;*/
+  margin: 10px 5px 5px 0;
+  font-size: 16px;
+}
+
+main nav h4 a {
+  text-decoration: none;
+  color: black;
+}
+
+main nav {
+  margin: 0px 0px 10px 35px;
+  /*display: inline-block;*/
+}
+
+main {
+  /*margin: 0 0 0 0;*/
+  /*border-style: solid;*/
+}
+
+main img {
+  width: 16%;
+  height: auto;
+  margin: 0px 0px 0px 35px;
+}
+
+article {
+  display: inline-block;
+  max-width: 50%;
+  float: right;
+  margin: 0 350px 0 0;
+}
+
+article.blog-post {
+  display: inline-block;
+  max-width: 50%;
+  float: right;
+  margin: 0 350px 50px 0;
+}
+
+article.blog-post p {
+  text-align: left;
+}
+
+article.blog-post img{
+  width: 70%;
+  height: auto;
+  margin: 0 500px 0 0;
+}
+
+footer p{
+  font-size: 10px;
+  margin: 10px auto 15px 35px;
+}
+
+.social-media-icons {
+  display: inline;
+  max-width: 1.75%;
+  max-height: auto;
+}
+
+footer span {
+  margin: auto auto auto 93px;
+}