cristinafurlong · August 29, 2015 14:16
diff --git a/index.html b/index.html
 <!DOCTYPE html>
 <html lang="en">
  <head>
    <meta charset="utf-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1">
    <title>Basic Bootstrap Template</title>

    <!-- Bootstrap --><!-- Latest compiled and minified CSS -->
 	<link rel="stylesheet" href="http://netdna.bootstrapcdn.com/bootstrap/3.1.1/css/bootstrap.min.css">

 	<!-- Optional theme -->
 	<link rel="stylesheet" href="http://netdna.bootstrapcdn.com/bootstrap/3.1.1/css/bootstrap-theme.min.css">

    <!-- HTML5 Shim and Respond.js IE8 support of HTML5 elements and media queries -->
    <!-- WARNING: Respond.js doesn't work if you view the page via file:// -->
    <!--[if lt IE 9]>
      <script src="https://oss.maxcdn.com/libs/html5shiv/3.7.0/html5shiv.js"></script>
      <script src="https://oss.maxcdn.com/libs/respond.js/1.4.2/respond.min.js"></script>
    <![endif]-->
  </head>
  <body>
    
 	<div class="container">
 	  <div class="jumbotron">
 <h2>Is your school getting Safety Ed from the DOT?</h2>
 <p>Providing various classroom and out of school programming, DOT reached over 700 schools.</p>
 <iframe width='100%' height='520' frameborder='0' src='http://cristina-furlong.cartodb.com/viz/2aeb00b6-b916-11e4-8364-0e9d821ea90d/embed_map' allowfullscreen webkitallowfullscreen mozallowfullscreen oallowfullscreen msallowfullscreen></iframe>
 <cite>Source: NYC Department of Transportation. </cite>	    <p class="lead">Everything I learned in Grad School, I learned from Coal Miners Daughter First.</p>
 	  </div><!-- /jumbotron -->
 	     <p class="text-muted byline">By Cristina Furlong | <a href="//twitter.com/cristinafurlong">@missmarty70</a> | Mar 31, 2014</p>
 	    <p>Most of your content will end up here: inside the Bootstrap "container" div, but outside the "jumbotron". Bootstrap has some classes that make some basic layout things a whole lot easier. <a href="http://getbootstrap.com/css/#helper-classes-floats">Quickfloats</a> are handy for pullquotes. You can let them find their own size or use <a href="http://getbootstrap.com/css/#grid">the grid</a> to set their width.</p>
 	    <p>Bootstrap does a lot of fancy footwork to customize layouts on tiny, small, medium and large screens. For now, I suggest that you stick to the <code>col-md-</code> classes. They're the most universal. Our goal here is to tell good stories, not master the finer points of CSS layout, with or without Bootstrap.</p>
 	    <p>We didn't talk much about <code>p</code>aragraphs, <code>blockquote</code>s or <code>a</code>nchors, but you'll need them if you don't want your content to run together in a great heap. You can wrap paragaphs in <code>&lt;p&gt;</code> tags manually, but if you want some help with the basic pieces, I'm a huge fan of <a href="http://mouapp.com/">Mou</a>. You can compose in Markdown, a heavily simplified syntax, and then copy the resulting HTML into a Bootstrap template. Markdown is a very basic language -- you can't do a lot with it, so you can focus on the basics. </p> 
 	<div class="row">		
 	<div class="col-md-4">
 		<p>This is my header. On small screens it should be at the top. On medium screens, it should be on the upper left.</p>
 	</div>
 		<div class="col-md-8">
 		<p>This is my content. There's a lot of it. On small screens it should be in the in middle. On medium screens, it should be on the right.</p>

 		<p>Lorem Ipsum is simply dummy text of the printing and typesetting industry. Lorem Ipsum has been the industry's standard dummy text ever since the 1500s, when an unknown printer took a galley of type and scrambled it to make a type specimen book. It has survived not only five centuries, but also the leap into electronic typesetting, remaining essentially unchanged. It was popularised in the 1960s with the release of Letraset sheets containing Lorem Ipsum passages, and more recently with desktop publishing software like Aldus PageMaker including versions of Lorem Ipsum.</p>

 		<p>It is a long established fact that a reader will be distracted by the readable content of a page when looking at its layout. The point of using Lorem Ipsum is that it has a more-or-less normal distribution of letters, as opposed to using 'Content here, content here', making it look like readable English. Many desktop publishing packages and web page editors now use Lorem Ipsum as their default model text, and a search for 'lorem ipsum' will uncover many web sites still in their infancy. Various versions have evolved over the years, sometimes by accident, sometimes on purpose (injected humour and the like).</p>
 	</div>
 	<div class="col-md-4 pull-left">
 		<p>This is my Footer. On small screens it should be at the bottom. On medium screens, it should be on the lower left.</p>
 	</div>
 </div> <!-- /row -->		
 	
 	
 	</div><!-- /container --> 

 	 
  </body>
  
 </html>
	<!DOCTYPE html>
	<html lang="en">
	<head>
	<meta charset="utf-8">
	<meta http-equiv="X-UA-Compatible" content="IE=edge">
	<meta name="viewport" content="width=device-width, initial-scale=1">
	<title>Basic Bootstrap Template</title>

	<!-- Bootstrap --><!-- Latest compiled and minified CSS -->
	<link rel="stylesheet" href="http://netdna.bootstrapcdn.com/bootstrap/3.1.1/css/bootstrap.min.css">

	<!-- Optional theme -->
	<link rel="stylesheet" href="http://netdna.bootstrapcdn.com/bootstrap/3.1.1/css/bootstrap-theme.min.css">

	<!-- HTML5 Shim and Respond.js IE8 support of HTML5 elements and media queries -->
	<!-- WARNING: Respond.js doesn't work if you view the page via file:// -->
	<!--[if lt IE 9]>
	<script src="https://oss.maxcdn.com/libs/html5shiv/3.7.0/html5shiv.js"></script>
	<script src="https://oss.maxcdn.com/libs/respond.js/1.4.2/respond.min.js"></script>
	<![endif]-->
	</head>
	<body>

	<div class="container">
	<div class="jumbotron">
	<h2>Is your school getting Safety Ed from the DOT?</h2>
	<p>Providing various classroom and out of school programming, DOT reached over 700 schools.</p>
	<iframe width='100%' height='520' frameborder='0' src='http://cristina-furlong.cartodb.com/viz/2aeb00b6-b916-11e4-8364-0e9d821ea90d/embed_map' allowfullscreen webkitallowfullscreen mozallowfullscreen oallowfullscreen msallowfullscreen></iframe>
	<cite>Source: NYC Department of Transportation. </cite> <p class="lead">Everything I learned in Grad School, I learned from Coal Miners Daughter First.</p>
	</div><!-- /jumbotron -->
	<p class="text-muted byline">By Cristina Furlong \| <a href="//twitter.com/cristinafurlong">@missmarty70</a> \| Mar 31, 2014</p>
	<p>Most of your content will end up here: inside the Bootstrap "container" div, but outside the "jumbotron". Bootstrap has some classes that make some basic layout things a whole lot easier. <a href="http://getbootstrap.com/css/#helper-classes-floats">Quickfloats</a> are handy for pullquotes. You can let them find their own size or use <a href="http://getbootstrap.com/css/#grid">the grid</a> to set their width.</p>
	<p>Bootstrap does a lot of fancy footwork to customize layouts on tiny, small, medium and large screens. For now, I suggest that you stick to the <code>col-md-</code> classes. They're the most universal. Our goal here is to tell good stories, not master the finer points of CSS layout, with or without Bootstrap.</p>
	<p>We didn't talk much about <code>p</code>aragraphs, <code>blockquote</code>s or <code>a</code>nchors, but you'll need them if you don't want your content to run together in a great heap. You can wrap paragaphs in <code><p></code> tags manually, but if you want some help with the basic pieces, I'm a huge fan of <a href="http://mouapp.com/">Mou</a>. You can compose in Markdown, a heavily simplified syntax, and then copy the resulting HTML into a Bootstrap template. Markdown is a very basic language -- you can't do a lot with it, so you can focus on the basics. </p>
	<div class="row">
	<div class="col-md-4">
	<p>This is my header. On small screens it should be at the top. On medium screens, it should be on the upper left.</p>
	</div>
	<div class="col-md-8">
	<p>This is my content. There's a lot of it. On small screens it should be in the in middle. On medium screens, it should be on the right.</p>

	<p>Lorem Ipsum is simply dummy text of the printing and typesetting industry. Lorem Ipsum has been the industry's standard dummy text ever since the 1500s, when an unknown printer took a galley of type and scrambled it to make a type specimen book. It has survived not only five centuries, but also the leap into electronic typesetting, remaining essentially unchanged. It was popularised in the 1960s with the release of Letraset sheets containing Lorem Ipsum passages, and more recently with desktop publishing software like Aldus PageMaker including versions of Lorem Ipsum.</p>

	<p>It is a long established fact that a reader will be distracted by the readable content of a page when looking at its layout. The point of using Lorem Ipsum is that it has a more-or-less normal distribution of letters, as opposed to using 'Content here, content here', making it look like readable English. Many desktop publishing packages and web page editors now use Lorem Ipsum as their default model text, and a search for 'lorem ipsum' will uncover many web sites still in their infancy. Various versions have evolved over the years, sometimes by accident, sometimes on purpose (injected humour and the like).</p>
	</div>
	<div class="col-md-4 pull-left">
	<p>This is my Footer. On small screens it should be at the bottom. On medium screens, it should be on the lower left.</p>
	</div>
	</div> <!-- /row -->


	</div><!-- /container -->


	</body>

	</html>