bjelline/index.html

## index.html
<!DOCTYPE html>
<html>
  <head>
    <meta charset="utf-8">
    <title>Better Forms with HTML5 and CSS3</title>
    <link rel="stylesheet" href="style.css">
  </head>
  <body>


      <header>
        <h1>Form <small>with HTML5 und CSS3</small></h1>
      </header>

      <article>

      <form action="http://webcode.multimediatechnology.at/code/echo.php">

            <label>Username: <input type="text" id="username" name="username"></label>
            <label>E-Mail: <input type="text" id="email" name="email"></label>


            <label>Degree Program:
              <select id="study" name="study">
                <option>Computer Science</option>
                <option>Digital Media</option>
                <option>Mathematics</option>
                <option>Electrical Engineering</option>
              </select>
            </label>

            <fieldset>
              <h3>Knowledge</h3>
              <label>
                <input type="checkbox" name="knowledge" value="sql">
                Databases and SQL
              </label>
              <label>
                <input type="checkbox" name="knowledge" value="html">
                HTML and CSS
              </label>
              <label>
                <input type="checkbox" name="knowledge" value="programming">
                Programming (Variables, Loops, Functions, Objects, Methods) in
                any language.
              </label>
              <label>
                <input type="checkbox" name="knowledge" value="unix">
                UNIX command line
              </label>
            </fieldset>

            <label>Comments
              <textarea rows="3" id="comments" name="comments">no comment</textarea>
            </label>

            <button type="submit" class="btn btn-primary">Save changes</button>

      </form>
    </article>
</body>

</html>

## style.css
body {
  font-family: "Helvetica Neue", Helvetica, Arial, sans-serif;
  font-size: 13px;
  line-height: 18px;
  color: #333333;
  background-color: #ffffff;
}

a {
  color: #0088cc;
  text-decoration: none;
}

a:hover {
  color: #005580;
  text-decoration: underline;
}

header,article,footer {
  display:block;
  margin-right: auto;
  margin-left: auto;
  width: 940px;
}

h1 small {
  font-size: 50%;
  font-weight: normal;
  color: #999999;
}

nput.btn-primary {
  background-color: #0074cc;
}

label {
  color: #888;
  font-style: italic;
  margin:20px 0;
}

label, input, select, textarea {
  display: block;
}

fieldset input {
  display: inline;
}
fieldset label {
  font-style: normal;
}

fieldset {
  border: none;
  background: #ddd;
}
	<!DOCTYPE html>
	<html>
	<head>
	<meta charset="utf-8">
	<title>Better Forms with HTML5 and CSS3</title>
	<link rel="stylesheet" href="style.css">
	</head>
	<body>


	<header>
	<h1>Form <small>with HTML5 und CSS3</small></h1>
	</header>

	<article>

	<form action="http://webcode.multimediatechnology.at/code/echo.php">

	<label>Username: <input type="text" id="username" name="username"></label>
	<label>E-Mail: <input type="text" id="email" name="email"></label>


	<label>Degree Program:
	<select id="study" name="study">
	<option>Computer Science</option>
	<option>Digital Media</option>
	<option>Mathematics</option>
	<option>Electrical Engineering</option>
	</select>
	</label>

	<fieldset>
	<h3>Knowledge</h3>
	<label>
	<input type="checkbox" name="knowledge" value="sql">
	Databases and SQL
	</label>
	<label>
	<input type="checkbox" name="knowledge" value="html">
	HTML and CSS
	</label>
	<label>
	<input type="checkbox" name="knowledge" value="programming">
	Programming (Variables, Loops, Functions, Objects, Methods) in
	any language.
	</label>
	<label>
	<input type="checkbox" name="knowledge" value="unix">
	UNIX command line
	</label>
	</fieldset>

	<label>Comments
	<textarea rows="3" id="comments" name="comments">no comment</textarea>
	</label>

	<button type="submit" class="btn btn-primary">Save changes</button>

	</form>
	</article>
	</body>

	</html>
	body {
	font-family: "Helvetica Neue", Helvetica, Arial, sans-serif;
	font-size: 13px;
	line-height: 18px;
	color: #333333;
	background-color: #ffffff;
	}

	a {
	color: #0088cc;
	text-decoration: none;
	}

	a:hover {
	color: #005580;
	text-decoration: underline;
	}

	header,article,footer {
	display:block;
	margin-right: auto;
	margin-left: auto;
	width: 940px;
	}

	h1 small {
	font-size: 50%;
	font-weight: normal;
	color: #999999;
	}

	nput.btn-primary {
	background-color: #0074cc;
	}

	label {
	color: #888;
	font-style: italic;
	margin:20px 0;
	}

	label, input, select, textarea {
	display: block;
	}

	fieldset input {
	display: inline;
	}
	fieldset label {
	font-style: normal;
	}

	fieldset {
	border: none;
	background: #ddd;
	}