:(

<!DOCTYPE html>
<html>
<head>
  <meta charset="utf-8" />
  <title>RIT GPA calculator</title>
  <script type="text/javascript" src="http://code.jquery.com/jquery-latest.min.js"></script>
  <!--[if lt IE 9]>
    <script src="http://html5shiv.googlecode.com/svn/trunk/html5.js"></script>
  <![endif]-->
  <style type="text/css">

    #qtr_calc {
       float: left;
       margin: 3em;
       padding: 2em;
       border: 1px double #F2F2F2; /* inside border */
       outline: 1px solid #BFBFBF; /* outside border */
    }

    #sem_calc {
       float: left;
       top: 0;
       margin: 3em;
       padding: 2em;
       border: 1px double #F2F2F2; /* inside border */
       outline: 1px solid #BFBFBF; /* outside border */
    }

    #content {
       width: 70%;
       min-width: 400px;
    }

    footer {
       bottom: 0;
       position: fixed;
    }
  </style>
</head>
<body>
  <div id="wrapper">
    <header>RIT GPA CALCULATOR.
    </header>
    <section id="content">
      <div id="qtr_calc">
         <label for="qtr_cred_hrs">Quarter class credit hours:</label><br />
         <input type="text" id="qtr_cred_hours" /><br /><br />
         <label for="qtr_grade">Letter grade:</label><br />
         <input type="text" id="qtr_grade" /></div>
      </div>
      <div id="sem_calc">
         <label for="sem_cred_hrs">Semester class credit hours:</label><br />
         <input type="text" id="sem_cred_hours" /><br /><br />
         <label for="sem_grade">Letter grade:</label><br />
         <input type="text" id="sem_grade" /></div>
      </div>
    </section>
    <footer>
      Footer
    </footer>
  </div>
</body>
</html>