airtwo/gist:8739022

## gistfile1.txt
<!doctype html>
<html>
<head>
    <title>Site Title</title>
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <meta charset="utf-8">
    <link rel="stylesheet" type="text/css" href="/css/bootstrap.min.css" media="all">
    <link rel="stylesheet" type="text/css" href="/css/screen.css" media="all">
    <script src="/js/jquery.min.js"></script>
    <script src="/js/global.js"></script>
</head>
<body>

<div class="wrap">
    <h1>Sign up</h1>
    <form>
        <fieldset class="form-group">
            <label for="name">Name</label>
            <input id="name" type="text" class="form-control">
        </fieldset>
        <fieldset class="form-group">
            <label for="email">Email</label>
            <input id="email" type="email" class="form-control">
        </fieldset>
        <fieldset class="form-group">
            <label for="username">Username</label>
            <input id="username" type="text" class="form-control">
        </fieldset>
        <button type="submit" class="btn btn-default">Submit</button>
    </form>

    <hr>
    <h4>Part 1</h4>
    <ol>
        <li>When the submit button is clicked, any empty input fields should gain a red border.</li>
        <li>When a user clicks off of an empty input field, it should gain a red border.</li>
        <li>When a user enters text in an empty field with the red border, the red border should disappear (when field loses focus).</li>
    </ol>
    <hr>
    <h4>Part 2</h4>
    <ol start="4">
        <li>When a user clicks off of the username input field, it should check the entered username against the existing usernames at <a href="/usernames.json">/usernames.json</a>.</li>
        <li>If the entered username matches an existing username, display the message "Choose another username" and give the username input field a red border</li>
        <li>If the entered username is valid, the input field should not have a red border</li>
    </ol>
</div>

</body>
</html>
	<!doctype html>
	<html>
	<head>
	<title>Site Title</title>
	<meta name="viewport" content="width=device-width, initial-scale=1.0">
	<meta charset="utf-8">
	<link rel="stylesheet" type="text/css" href="/css/bootstrap.min.css" media="all">
	<link rel="stylesheet" type="text/css" href="/css/screen.css" media="all">
	<script src="/js/jquery.min.js"></script>
	<script src="/js/global.js"></script>
	</head>
	<body>

	<div class="wrap">
	<h1>Sign up</h1>
	<form>
	<fieldset class="form-group">
	<label for="name">Name</label>
	<input id="name" type="text" class="form-control">
	</fieldset>
	<fieldset class="form-group">
	<label for="email">Email</label>
	<input id="email" type="email" class="form-control">
	</fieldset>
	<fieldset class="form-group">
	<label for="username">Username</label>
	<input id="username" type="text" class="form-control">
	</fieldset>
	<button type="submit" class="btn btn-default">Submit</button>
	</form>

	<hr>
	<h4>Part 1</h4>
	<ol>
	<li>When the submit button is clicked, any empty input fields should gain a red border.</li>
	<li>When a user clicks off of an empty input field, it should gain a red border.</li>
	<li>When a user enters text in an empty field with the red border, the red border should disappear (when field loses focus).</li>
	</ol>
	<hr>
	<h4>Part 2</h4>
	<ol start="4">
	<li>When a user clicks off of the username input field, it should check the entered username against the existing usernames at <a href="/usernames.json">/usernames.json</a>.</li>
	<li>If the entered username matches an existing username, display the message "Choose another username" and give the username input field a red border</li>
	<li>If the entered username is valid, the input field should not have a red border</li>
	</ol>
	</div>

	</body>
	</html>