runnerLoginForm.html

<!doctype html>
<html>
<head>
<meta charset="utf-8">
<title>Untitled Document</title>
</head>

<body>
<style>
      body, html {
        height: 100%;
        background-color: azure;
        font-family: "Trebuchet MS", Arial, Helvetica, sans-serif;
		text-align: center;

      }
      div {
        border: 1px solid gray;
        padding: 8px;
      }
      h1 {
        text-align: center;
        text-transform: uppercase;
        color: #4CAF50;
        letter-spacing: 10px;
        text-size: 20px;
      }
      p {
        text-align: center;
        letter-spacing: 3px;
      }
      td, th {
        border: 1px solid green;
        padding: 0.5rem;
        text-align: center;
      }
      table {
        border-collapse: collapse;
      }
	  a:link, a:visited {
    	background-color: #4CAF50;
    	color: white;
    	padding: 14px 25px;
    	text-align: center;
    	text-decoration: none;
    	display: inline-block;
	  }
	  a:hover, a:active {
    	background-color: #4CAF50;
	  }
    </style>
    <h1>XC Attendance
    </h1>
<h3> Login to the site:</h3>
<form action="runnerLogin.php" method="get">
<table align = "center" style="width:350px">
    	<tr>
            <td>Enter your username:</td>
            <td><input type="text" name="username" class="required username error"></td>
        </tr><tr>
            <td>Password:</td>
            <td><input name="pwd" type="password" id="pwd" class="required"></td>
        </tr>
     </table>
     <input type="submit" value="Submit">
</form>
<br>
<a href="http://times.bcp.org/webs/apps18/tanay/runnerRegister.html">No account? Register!</a>
</body>
</html>