<!DOCTYPE html>
<html>
	<head>
		<title>Determined Duckling</title>
		<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
		<link rel="stylesheet" type="text/css" href = "duck.css">
		<script type="text/javascript" src="http://code.jquery.com/jquery-1.4.3.min.js" ></script>
		<script type="text/javascript" src="duck.js"></script>
	</head>
	<body>
		<p>Find the real ducks! (Try clicking on things...) The answer should make itself clear.</p>
		<div id="entry">
			QUACKER: <input type="text" id="txt_name"/>
			<button id="entrybutton" value='1'>Check</button>
		</div>
		<hr>
		<div class="container" id="c0">
			<img src="img/decoy2.jpg" class="incorrect" width="200" height="150">
			<img src="img/decoy9.jpg" class="incorrect" width="200" height="150">
			<img src="img/correct5.jpg" class="correct" width="200" height="150">
			<hr>
		</div>
		<div class="container" id="c1">
			<img src="img/correct1.jpg" class="correct" width="200" height="150">
			<img src="img/decoy10.jpg" class="incorrect" width="200" height="150">
			<img src="img/decoy5.jpg" class="incorrect" width="200" height="150">
			<hr>
		</div>
		<div class="container" id="c2">
			<img src="img/decoy6.jpg" class="incorrect" width="200" height="150">
			<img src="img/decoy1.jpg" class="incorrect" width="200" height="150">
			<img src="img/correct0.jpg" class="correct" width="200" height="150">
			<hr>
		</div>
		<div class="container" id="c3">
			<img src="img/decoy3.jpg" class="incorrect" width="200" height="150">
			<img src="img/correct4.jpg" class="correct" width="200" height="150">
			<img src="img/decoy0.jpg" class="incorrect" width="200" height="150">
			<hr>
		</div>
		<div class="container" id="c4">
			<img src="img/decoy4.jpg" class="incorrect" width="200" height="150">
			<img src="img/correct2.jpg" class="correct" width="200" height="150">
			<img src="img/decoy11.jpg" class="incorrect" width="200" height="150">
			<hr>
		</div>
		<div class="container" id="c5">
			<img src="img/correct3.jpg" class="correct" width="200" height="150">
			<img src="img/decoy8.jpg" class="incorrect" width="200" height="150">
			<img src="img/decoy7.jpg" class="incorrect" width="200" height="150">
			<hr>
		</div>
		<div class="container" id="c6">
			<center>
				<p>Sweet! Looks like you're a great <strong>DETECT</strong>ive!</p>
			<center>
			<hr>
		</div>
	</body>
</html>