ログイン画面の作成：ｈｔｍｌ、ｃｓｓ

ウェブアプリケーション作成につき、ログイン画面を作成しようとしているのですがうまく起動しません。
どこが間違っていて、どう直せばいいのか親切な方教えていただけないでしょうか。
よろしくお願いいたします。ファイル名はindex.htmlとmain.cssにしてあります。

html
1<div class="form-wrapper">
2  <h1>Sign In</h1>
3  <form>
4    <div class="form-item">
5      <label for="email"></label>
6      <input type="email" name="email" required="required" placeholder="Email Address"></input>
7    </div>
8    <div class="form-item">
9      <label for="password"></label>
10      <input type="password" name="password" required="required" placeholder="Password"></input>
11    </div>
12    <div class="button-panel">
13      <input type="submit" class="button" title="Sign In" value="Sign In"></input>
14    </div>
15  </form>
16  <div class="form-footer">
17    <p><a href="#">Create an account</a></p>
18    <p><a href="#">Forgot password?</a></p>
19  </div>
20</div>

css
1* Fonts */
2@import url(https://fonts.googleapis.com/css?family=Open+Sans:400);
3
4/* fontawesome */
5@import url(http://weloveiconfonts.com/api/?family=fontawesome);
6[class*="fontawesome-"]:before {
7  font-family: 'FontAwesome', sans-serif;
8}
9
10/* Simple Reset */
11* { margin: 0; padding: 0; box-sizing: border-box; }
12
13/* body */
14body {
15  background: #e9e9e9;
16  color: #5e5e5e;
17  font: 400 87.5%/1.5em 'Open Sans', sans-serif;
18}
19
20/* Form Layout */
21.form-wrapper {
22  background: #fafafa;
23  margin: 3em auto;
24  padding: 0 1em;
25  max-width: 370px;
26}
27
28h1 {
29  text-align: center;
30  padding: 1em 0;
31}
32
33form {
34  padding: 0 1.5em;
35}
36
37.form-item {
38  margin-bottom: 0.75em;
39  width: 100%;
40}
41
42.form-item input {
43  background: #fafafa;
44  border: none;
45  border-bottom: 2px solid #e9e9e9;
46  color: #666;
47  font-family: 'Open Sans', sans-serif;
48  font-size: 1em;
49  height: 50px;
50  transition: border-color 0.3s;
51  width: 100%;
52}
53
54.form-item input:focus {
55  border-bottom: 2px solid #c0c0c0;
56  outline: none;
57}
58
59.button-panel {
60  margin: 2em 0 0;
61  width: 100%;
62}
63
64.button-panel .button {
65  background: #f16272;
66  border: none;
67  color: #fff;
68  cursor: pointer;
69  height: 50px;
70  font-family: 'Open Sans', sans-serif;
71  font-size: 1.2em;
72  letter-spacing: 0.05em;
73  text-align: center;
74  text-transform: uppercase;
75  transition: background 0.3s ease-in-out;
76  width: 100%;
77}
78
79.button:hover {
80  background: #ee3e52;
81}
82
83.form-footer {
84  font-size: 1em;
85  padding: 2em 0;
86  text-align: center;
87}
88
89.form-footer a {
90  color: #8c8c8c;
91  text-decoration: none;
92  transition: border-color 0.3s;
93}
94
95.form-footer a:hover {
96  border-bottom: 1px dotted #8c8c8c;
97}