Edit in JSFiddle

<html>
<head>
	<title>Exercise: Drought's footprint</title>
	<!-- Put your CSS here -->
    <link rel="stylesheet" href="css/styles.css" />

</head>
<body>
	<h1>Drought's footprint</h1>
	<p class="guff">More than half of the country was under moderate to extreme drought in June, the largest area of the contiguous United States affected by such dryness in nearly 60 years. Nearly 1,300 counties across 29 states have been declared federal disaster areas. Areas under moderate to extreme drought in June of each year are shown in orange below. <a href="http://www.nytimes.com/2012/07/20/science/earth/severe-drought-expected-to-worsen-across-the-nation.html">Related article</a></p>
	<p><em>Kevin Quealy kindly provided the basemaps for this exercise. See the original graphic <a href="http://www.nytimes.com/interactive/2012/07/20/us/drought-footprint.html">here</a>.</em></p>

	<div class="drought-year">
		<p>2012</p>
		<img src="http://codewithme.us/images/exercises/drought-maps/dmap2012.png"/>
	</div>
	<div class="drought-year">
		<p>2011</p>
		<img src="http://codewithme.us/images/exercises/drought-maps/dmap2011.png"/>
	</div>
	<div class="drought-year">
		<p>2010</p>
		<img src="http://codewithme.us/images/exercises/drought-maps/dmap2010.png"/>
	</div>
	<div class="drought-year">
		<p>2009</p>
		<img src="http://codewithme.us/images/exercises/drought-maps/dmap2009.png"/>
	</div>
	<div class="drought-year">
		<p>2008</p>
		<img src="http://codewithme.us/images/exercises/drought-maps/dmap2008.png"/>
	</div>
	<div class="drought-year">
		<p>2007</p>
		<img src="http://codewithme.us/images/exercises/drought-maps/dmap2007.png"/>
	</div>
	<div class="drought-year">
		<p>2006</p>
		<img src="http://codewithme.us/images/exercises/drought-maps/dmap2006.png"/>
	</div>
	<div class="drought-year">
		<p>2005</p>
		<img src="http://codewithme.us/images/exercises/drought-maps/dmap2005.png"/>
	</div>
	<div class="drought-year">
		<p>2004</p>
		<img src="http://codewithme.us/images/exercises/drought-maps/dmap2004.png"/>
	</div>
	<div class="drought-year">
		<p>2003</p>
		<img src="http://codewithme.us/images/exercises/drought-maps/dmap2003.png"/>
	</div>
	<div class="drought-year">
		<p>2002</p>
		<img src="http://codewithme.us/images/exercises/drought-maps/dmap2002.png"/>
	</div>
	<div class="drought-year">
		<p>2001</p>
		<img src="http://codewithme.us/images/exercises/drought-maps/dmap2001.png"/>
	</div>
	<div class="drought-year">
		<p>2000</p>
		<img src="http://codewithme.us/images/exercises/drought-maps/dmap2000.png"/>
	</div>
	<div class="drought-year">
		<p>1999</p>
		<img src="http://codewithme.us/images/exercises/drought-maps/dmap1999.png"/>
	</div>
	<div class="drought-year">
		<p>1998</p>
		<img src="http://codewithme.us/images/exercises/drought-maps/dmap1998.png"/>
	</div>
	<div class="drought-year">
		<p>1997</p>
		<img src="http://codewithme.us/images/exercises/drought-maps/dmap1997.png"/>
	</div>
	<div class="drought-year">
		<p>1996</p>
		<img src="http://codewithme.us/images/exercises/drought-maps/dmap1996.png"/>
	</div>
	<div class="drought-year">
		<p>1995</p>
		<img src="http://codewithme.us/images/exercises/drought-maps/dmap1995.png"/>
	</div>
	<div class="drought-year">
		<p>1994</p>
		<img src="http://codewithme.us/images/exercises/drought-maps/dmap1994.png"/>
	</div>
	<div class="drought-year">
		<p>1993</p>
		<img src="http://codewithme.us/images/exercises/drought-maps/dmap1993.png"/>
	</div>
</body>
</html>
/* Write your CSS here */