league/my-blog.html

## my-blog.html
<!DOCTYPE html>
<html lang="en" xmlns="http://www.w3.org/1999/xhtml">
  <head>
    <meta charset="utf-8" />
    <title>My Blog</title>

    <style>
      .navbar {
        width: 100%;
        background: #8698ff;
        font-weight: bold;
        letter-spacing: 0.025em;
        box-shadow: 1px 1px 10px 2px #888888;
        z-index: 3;
        margin: 0;
        top: 0;
        left:0;
        position: fixed;
      }
      .navbar ul {
        text-align: center;
        margin: 0;
      }
      .navbar ul li {
        display: inline-block;
        padding: 0 3em;
        line-height: 3em;
      }
      .navbar ul li:hover {
        background: rgba(99, 122, 254, 0.4);
        height: 110%;
        text-decoration: none;
      }
      .Menu_links a{
        color:white;
        text-decoration:none;
      }
      .blogContainer{
        margin-left:15%;
        margin-right:15%;
        padding-top:5%;
        padding-left:10%;
        padding-right:10%;
        padding-bottom:5%;
        width:50%;
        height:110%;
        box-shadow: 0px 2px 2px 2px #808080;
        background-color:white;
      }
      .blogTitle{
        text-align:center;
      }
      .myPicture{
        border-radius: 50%;
        display: block;
        margin-left: auto;
        margin-right: auto
      }
      body{
        background-color:#d8d8d8;
      }
    </style>
  </head>
  <body>
    <!----your Navigation Bar menu-->
    <nav class="navbar">
      <ul class="Menu_links">
        <li><a class="index_button" href="MyBlog.html">Home</a></li>
        <li><a class="contact_button" href="https://www.instagram.com/?hl=en">Instagram</a></li>
        <li><a href="https://twitter.com/?lang=en">Twitter</a></li>
      </ul>
    </nav>
    <!--end of navbar---->
    <br />
    <div class="blogContainer">
      <img class="myPicture" src="https://s-media-cache-ak0.pinimg.com/564x/0f/49/37/0f4937617bf3874f31e21521483d8d8f.jpg" height="194" width="160" />
      <h1 class="blogTitle">My blog Posts</h1>
      <br />
      <div class="blogs">
        <div id="Elon">
          <a href="https://www.tesla.com/blog/master-plan-part-deux"><h1>Master Plan, Part Deux</h1></a>
          <h3>Elon Musk July 20, 2016</h3>
          <p1>The first master plan that I wrote 10 years ago is now in the final stages of completion. It wasn't all that complicated and basically consisted of:</p1>
          <br />
          <ol>
            <li>Create a low volume car, which would necessarily be expensive</li>
            <li>Use that money to develop a medium volume car at a lower price</li>
            <li>Use that money to create an affordable, high volume car</li>
            <li>Provide solar power. No kidding, this has literally been on our website for 10 years.</li>
          </ol>
          <p2>The reason we had to start off with step 1 was that it was all I could afford to do with what I made from PayPal. I thought our chances of success were so low that I didn't want to risk anyone's funds in the beginning but my own. The list of successful car company startups is short. As of 2016, the number of American car companies that haven't gone bankrupt is a grand total of two: Ford and Tesla. Starting a car company is idiotic and an electric car company is idiocy squared.</p2>
          <p3>Also, a low volume car means a much smaller, simpler factory, albeit with most things done by hand. Without economies of scale, anything we built would be expensive, whether it was an economy sedan or a sports car. While at least some people would be prepared to pay a high price for a sports car, no one was going to pay $100k for an electric Honda Civic, no matter how cool it looked.</p3>
          <p4>Part of the reason I wrote the first master plan was to defend against the inevitable attacks Tesla would face accusing us of just caring about making cars for rich people, implying that we felt there was a shortage of sports car companies or some other bizarre rationale. Unfortunately, the blog didn't stop countless attack articles on exactly these grounds, so it pretty much completely failed that objective.</p4>
          <p5>However, the main reason was to explain how our actions fit into a larger picture, so that they would seem less random. The point of all this was, and remains, accelerating the advent of sustainable energy, so that we can imagine far into the future and life is still good. That's what "sustainable" means. It's not some silly, hippy thing -- it matters for everyone.</p5>
          <p6>By definition, we must at some point achieve a sustainable energy economy or we will run out of fossil fuels to burn and civilization will collapse. Given that we must get off fossil fuels anyway and that virtually all scientists agree that dramatically increasing atmospheric and oceanic carbon levels is insane, the faster we achieve sustainability, the better.</p6>
          <br />
        </div>
        <hr />
        <div>
          <a href="http://www.lipsum.com/feed/html"> <h1>Lorem Ipsum</h1></a>
          <h3>Some Latin guy  Long-Long ago AD</h3>
          <p>
            Lorem ipsum dolor sit amet, consectetur adipiscing elit. Sed ut blandit sapien. Phasellus non lorem sagittis, finibus turpis vel, pharetra augue. Vivamus mattis scelerisque lectus, eget tincidunt lectus volutpat vel. Cras pellentesque orci eget nisl fringilla lobortis. Ut id tortor sed nibh finibus accumsan. Morbi eu tempor sem, vel dictum nulla. Morbi blandit nulla id mi consequat viverra. In elementum leo libero, nec pharetra arcu molestie id. Mauris fringilla libero justo, vel suscipit libero ullamcorper gravida. Proin ipsum diam, posuere vitae elementum sit amet, maximus id enim. Sed convallis nunc massa, ac consectetur purus aliquet in. Suspendisse ultrices orci nec lobortis tincidunt. Quisque sed dolor ut velit porta lobortis a at tellus. Vestibulum tellus risus, accumsan a lacus et, consectetur feugiat dolor.

            Etiam facilisis nec nunc sed iaculis. Pellentesque scelerisque diam sed felis imperdiet, at convallis orci lacinia. Etiam sodales, lorem at molestie lacinia, ex elit faucibus felis, sed posuere dolor augue ut lectus. Pellentesque et ante eu odio aliquam ullamcorper in vitae sapien. Nullam rutrum elementum risus sit amet tempor. In suscipit quam vitae odio tempus tristique. Quisque semper metus purus, vel porttitor dolor scelerisque et. Fusce fermentum posuere magna ut rutrum. Maecenas sagittis elit sit amet nisl suscipit faucibus. Donec eu leo pellentesque, tempus metus euismod, luctus nunc. Quisque pharetra urna vel purus tincidunt, et lacinia orci gravida. Aliquam gravida venenatis purus ac dapibus.

            Nulla ac viverra sem, a porttitor ligula. Phasellus sit amet commodo ligula, ut placerat quam. Nam nisl felis, tristique a consectetur ut, ultrices eget urna. Proin at ullamcorper nibh, ut dignissim orci. Sed nec erat diam. Sed tempor nunc ac augue tincidunt, id egestas purus vehicula. Duis suscipit egestas felis, at accumsan arcu ultrices in. Etiam finibus, odio blandit lobortis volutpat, ipsum felis euismod turpis, et cursus dui lacus id sem. Maecenas condimentum pulvinar nisi nec interdum. Phasellus pretium justo dictum sem malesuada, in egestas ipsum malesuada. Vestibulum ante ipsum primis in faucibus orci luctus et ultrices posuere cubilia Curae;

            Curabitur ligula ex, semper in congue vel, ornare vitae augue. Maecenas efficitur euismod sem in convallis. Suspendisse lobortis ultrices nibh, sit amet ornare elit. Nullam non nunc arcu. Etiam pretium, nisl sed posuere dictum, ligula mi dignissim elit, at luctus elit nisl id purus. Cras aliquam eu metus eu rutrum. Maecenas sit amet suscipit nisi, vel blandit dui. Phasellus venenatis finibus pellentesque. Quisque sit amet consequat quam. Pellentesque sit amet erat a velit lacinia ornare et a leo. Quisque hendrerit scelerisque mauris ut malesuada. Fusce euismod lectus non massa interdum, sed congue purus aliquam.

            Suspendisse accumsan feugiat aliquet. Duis elementum dictum ipsum, eget hendrerit elit iaculis id. Etiam fringilla mi id neque porta scelerisque. Orci varius natoque penatibus et magnis dis parturient montes, nascetur ridiculus mus. Aliquam ornare mauris non massa dignissim finibus id sed lacus. Maecenas rhoncus bibendum lorem a iaculis. Sed tincidunt elementum cursus. Suspendisse faucibus, tortor eget aliquet tincidunt, ex sapien ultricies dolor, ac volutpat tellus ante nec lorem. Praesent vel ex in nunc sodales condimentum id et erat. Maecenas tempor, velit nec euismod aliquet, tellus tellus volutpat ligula, vel euismod tellus tortor vel velit. Proin id elit at lectus commodo fringilla id at massa. In sit amet nisl leo. Vivamus ante est, maximus sed diam et, accumsan iaculis felis. Donec dapibus tortor ac massa porttitor, sed consectetur mi maximus. Donec mi diam, commodo et malesuada vel, posuere vel metus. Curabitur imperdiet rhoncus efficitur.
          </p>
          <br />
        </div>
        <hr />
        <div>
          <a href="http://www.storybytes.com/view-stories/2000/black-death.html"><h1>Black Death</h1></a>
          <h3>Brenda Ross   October 2000</h3>
          <p>I am a transmigrant, a restless soul doomed to walk from place to place and from body to body unceasingly. My soul is so zygomorphic that even Death is incapable of allowing it to cross the great divide.
            The Gods in their ironic wisdom have arranged for me to suffer many indignities.<p>

          <p>In the 20th century alone, my tired old soul has been housed within a reluctant concubine as she writhed under the amorous attentions of a middle aged Flemish cockalorum.<p>

          <p>And this same soul has been encased in the tortured body of a young airman in a prisoner of war camp.</p>
          <p>
            I have also been propelled from the dying body of the esteemed inventor of advanced Zen meditation into the pimply abode of a shallow youth with the distinguished reputation of tossing the highest flapjack ever at the local pancake house.
            In earlier times my soul has inhabited the diverse personalities of a Roman gladiator, an African pygmy and a medieval minstrel. I have been imbedded inside an ugly old hag who sat knitting at the foot of the guillotine as she watched the beheading of the French aristocracy. I led one life captaining a pirate ship, where I ordered insubordinate scruffy crewmembers to walk the plank or be keelhauled under the ship.</p>
          <p>
            The burden of these multiple lifestyles appalls me. If there are lessons to be learned, I seem incapable of learning them. And so, as I lay here on yet another deathbed, once again I plead with Black Death to break the cycle.
          </p>
        </div>
      </div>

    </div>
  </body>
</html>
	<!DOCTYPE html>
	<html lang="en" xmlns="http://www.w3.org/1999/xhtml">
	<head>
	<meta charset="utf-8" />
	<title>My Blog</title>

	<style>
	.navbar {
	width: 100%;
	background: #8698ff;
	font-weight: bold;
	letter-spacing: 0.025em;
	box-shadow: 1px 1px 10px 2px #888888;
	z-index: 3;
	margin: 0;
	top: 0;
	left:0;
	position: fixed;
	}
	.navbar ul {
	text-align: center;
	margin: 0;
	}
	.navbar ul li {
	display: inline-block;
	padding: 0 3em;
	line-height: 3em;
	}
	.navbar ul li:hover {
	background: rgba(99, 122, 254, 0.4);
	height: 110%;
	text-decoration: none;
	}
	.Menu_links a{
	color:white;
	text-decoration:none;
	}
	.blogContainer{
	margin-left:15%;
	margin-right:15%;
	padding-top:5%;
	padding-left:10%;
	padding-right:10%;
	padding-bottom:5%;
	width:50%;
	height:110%;
	box-shadow: 0px 2px 2px 2px #808080;
	background-color:white;
	}
	.blogTitle{
	text-align:center;
	}
	.myPicture{
	border-radius: 50%;
	display: block;
	margin-left: auto;
	margin-right: auto
	}
	body{
	background-color:#d8d8d8;
	}
	</style>
	</head>
	<body>
	<!----your Navigation Bar menu-->
	<nav class="navbar">
	<ul class="Menu_links">
	<li><a class="index_button" href="MyBlog.html">Home</a></li>
	<li><a class="contact_button" href="https://www.instagram.com/?hl=en">Instagram</a></li>
	<li><a href="https://twitter.com/?lang=en">Twitter</a></li>
	</ul>
	</nav>
	<!--end of navbar---->
	<br />
	<div class="blogContainer">
	<img class="myPicture" src="https://s-media-cache-ak0.pinimg.com/564x/0f/49/37/0f4937617bf3874f31e21521483d8d8f.jpg" height="194" width="160" />
	<h1 class="blogTitle">My blog Posts</h1>
	<br />
	<div class="blogs">
	<div id="Elon">
	<a href="https://www.tesla.com/blog/master-plan-part-deux"><h1>Master Plan, Part Deux</h1></a>
	<h3>Elon Musk July 20, 2016</h3>
	<p1>The first master plan that I wrote 10 years ago is now in the final stages of completion. It wasn't all that complicated and basically consisted of:</p1>
	<br />
	<ol>
	<li>Create a low volume car, which would necessarily be expensive</li>
	<li>Use that money to develop a medium volume car at a lower price</li>
	<li>Use that money to create an affordable, high volume car</li>
	<li>Provide solar power. No kidding, this has literally been on our website for 10 years.</li>
	</ol>
	<p2>The reason we had to start off with step 1 was that it was all I could afford to do with what I made from PayPal. I thought our chances of success were so low that I didn't want to risk anyone's funds in the beginning but my own. The list of successful car company startups is short. As of 2016, the number of American car companies that haven't gone bankrupt is a grand total of two: Ford and Tesla. Starting a car company is idiotic and an electric car company is idiocy squared.</p2>
	<p3>Also, a low volume car means a much smaller, simpler factory, albeit with most things done by hand. Without economies of scale, anything we built would be expensive, whether it was an economy sedan or a sports car. While at least some people would be prepared to pay a high price for a sports car, no one was going to pay $100k for an electric Honda Civic, no matter how cool it looked.</p3>
	<p4>Part of the reason I wrote the first master plan was to defend against the inevitable attacks Tesla would face accusing us of just caring about making cars for rich people, implying that we felt there was a shortage of sports car companies or some other bizarre rationale. Unfortunately, the blog didn't stop countless attack articles on exactly these grounds, so it pretty much completely failed that objective.</p4>
	<p5>However, the main reason was to explain how our actions fit into a larger picture, so that they would seem less random. The point of all this was, and remains, accelerating the advent of sustainable energy, so that we can imagine far into the future and life is still good. That's what "sustainable" means. It's not some silly, hippy thing -- it matters for everyone.</p5>
	<p6>By definition, we must at some point achieve a sustainable energy economy or we will run out of fossil fuels to burn and civilization will collapse. Given that we must get off fossil fuels anyway and that virtually all scientists agree that dramatically increasing atmospheric and oceanic carbon levels is insane, the faster we achieve sustainability, the better.</p6>
	<br />
	</div>
	<hr />
	<div>
	<a href="http://www.lipsum.com/feed/html"> <h1>Lorem Ipsum</h1></a>
	<h3>Some Latin guy Long-Long ago AD</h3>
	<p>
	Lorem ipsum dolor sit amet, consectetur adipiscing elit. Sed ut blandit sapien. Phasellus non lorem sagittis, finibus turpis vel, pharetra augue. Vivamus mattis scelerisque lectus, eget tincidunt lectus volutpat vel. Cras pellentesque orci eget nisl fringilla lobortis. Ut id tortor sed nibh finibus accumsan. Morbi eu tempor sem, vel dictum nulla. Morbi blandit nulla id mi consequat viverra. In elementum leo libero, nec pharetra arcu molestie id. Mauris fringilla libero justo, vel suscipit libero ullamcorper gravida. Proin ipsum diam, posuere vitae elementum sit amet, maximus id enim. Sed convallis nunc massa, ac consectetur purus aliquet in. Suspendisse ultrices orci nec lobortis tincidunt. Quisque sed dolor ut velit porta lobortis a at tellus. Vestibulum tellus risus, accumsan a lacus et, consectetur feugiat dolor.

	Etiam facilisis nec nunc sed iaculis. Pellentesque scelerisque diam sed felis imperdiet, at convallis orci lacinia. Etiam sodales, lorem at molestie lacinia, ex elit faucibus felis, sed posuere dolor augue ut lectus. Pellentesque et ante eu odio aliquam ullamcorper in vitae sapien. Nullam rutrum elementum risus sit amet tempor. In suscipit quam vitae odio tempus tristique. Quisque semper metus purus, vel porttitor dolor scelerisque et. Fusce fermentum posuere magna ut rutrum. Maecenas sagittis elit sit amet nisl suscipit faucibus. Donec eu leo pellentesque, tempus metus euismod, luctus nunc. Quisque pharetra urna vel purus tincidunt, et lacinia orci gravida. Aliquam gravida venenatis purus ac dapibus.

	Nulla ac viverra sem, a porttitor ligula. Phasellus sit amet commodo ligula, ut placerat quam. Nam nisl felis, tristique a consectetur ut, ultrices eget urna. Proin at ullamcorper nibh, ut dignissim orci. Sed nec erat diam. Sed tempor nunc ac augue tincidunt, id egestas purus vehicula. Duis suscipit egestas felis, at accumsan arcu ultrices in. Etiam finibus, odio blandit lobortis volutpat, ipsum felis euismod turpis, et cursus dui lacus id sem. Maecenas condimentum pulvinar nisi nec interdum. Phasellus pretium justo dictum sem malesuada, in egestas ipsum malesuada. Vestibulum ante ipsum primis in faucibus orci luctus et ultrices posuere cubilia Curae;

	Curabitur ligula ex, semper in congue vel, ornare vitae augue. Maecenas efficitur euismod sem in convallis. Suspendisse lobortis ultrices nibh, sit amet ornare elit. Nullam non nunc arcu. Etiam pretium, nisl sed posuere dictum, ligula mi dignissim elit, at luctus elit nisl id purus. Cras aliquam eu metus eu rutrum. Maecenas sit amet suscipit nisi, vel blandit dui. Phasellus venenatis finibus pellentesque. Quisque sit amet consequat quam. Pellentesque sit amet erat a velit lacinia ornare et a leo. Quisque hendrerit scelerisque mauris ut malesuada. Fusce euismod lectus non massa interdum, sed congue purus aliquam.

	Suspendisse accumsan feugiat aliquet. Duis elementum dictum ipsum, eget hendrerit elit iaculis id. Etiam fringilla mi id neque porta scelerisque. Orci varius natoque penatibus et magnis dis parturient montes, nascetur ridiculus mus. Aliquam ornare mauris non massa dignissim finibus id sed lacus. Maecenas rhoncus bibendum lorem a iaculis. Sed tincidunt elementum cursus. Suspendisse faucibus, tortor eget aliquet tincidunt, ex sapien ultricies dolor, ac volutpat tellus ante nec lorem. Praesent vel ex in nunc sodales condimentum id et erat. Maecenas tempor, velit nec euismod aliquet, tellus tellus volutpat ligula, vel euismod tellus tortor vel velit. Proin id elit at lectus commodo fringilla id at massa. In sit amet nisl leo. Vivamus ante est, maximus sed diam et, accumsan iaculis felis. Donec dapibus tortor ac massa porttitor, sed consectetur mi maximus. Donec mi diam, commodo et malesuada vel, posuere vel metus. Curabitur imperdiet rhoncus efficitur.
	</p>
	<br />
	</div>
	<hr />
	<div>
	<a href="http://www.storybytes.com/view-stories/2000/black-death.html"><h1>Black Death</h1></a>
	<h3>Brenda Ross October 2000</h3>
	<p>I am a transmigrant, a restless soul doomed to walk from place to place and from body to body unceasingly. My soul is so zygomorphic that even Death is incapable of allowing it to cross the great divide.
	The Gods in their ironic wisdom have arranged for me to suffer many indignities.<p>

	<p>In the 20th century alone, my tired old soul has been housed within a reluctant concubine as she writhed under the amorous attentions of a middle aged Flemish cockalorum.<p>

	<p>And this same soul has been encased in the tortured body of a young airman in a prisoner of war camp.</p>
	<p>
	I have also been propelled from the dying body of the esteemed inventor of advanced Zen meditation into the pimply abode of a shallow youth with the distinguished reputation of tossing the highest flapjack ever at the local pancake house.
	In earlier times my soul has inhabited the diverse personalities of a Roman gladiator, an African pygmy and a medieval minstrel. I have been imbedded inside an ugly old hag who sat knitting at the foot of the guillotine as she watched the beheading of the French aristocracy. I led one life captaining a pirate ship, where I ordered insubordinate scruffy crewmembers to walk the plank or be keelhauled under the ship.</p>
	<p>
	The burden of these multiple lifestyles appalls me. If there are lessons to be learned, I seem incapable of learning them. And so, as I lay here on yet another deathbed, once again I plead with Black Death to break the cycle.
	</p>
	</div>
	</div>

	</div>
	</body>
	</html>