<section id="contact">
					<div class="content">
						<div id="form">
							<form action="" id="contactForm" method="post">
								<span>Name</span>
								<input type="text" name="name" class="name" placeholder="Enter your name" tabindex=1 />
								<span>Email</span>
								<input type="text" name="email" class="email" placeholder="Enter your email" tabindex=2 />
								<span id="captcha"></span>
								<input type="text" name="captcha" class="captcha" maxlength="4" size="4" placeholder="Enter captcha code" tabindex=3 />
								<span>Message</span>
								<textarea class="message" placeholder="Enter your message" tabindex=4></textarea>
								<input type="submit" name="submit" value="Send e-mail" class="submit" tabindex=5>
							</form>
						</div>
			</section>
* {
  margin: 0;
  padding: 0  
}
body {
  margin: 15px auto 0;
  width: 410px;
  color: black;
}
#contact {
  overflow: auto;
}
#contact #form {
  width:410px;
  float:left;
}
#contact #form span {
  display:block;
  float:left;
  width:100px;
  padding-top:5px;
  font: 14px/16px'Bree Serif', Georgia, serif;
}
#contact #form input {
  float:left;
  width:255px;
  border:0px;
  padding:10px 10px 10px 30px;
  font: 11px/20px'Open Sans', Verdana, Helvetica, sans-serif;
  margin-bottom:10px;
  border: 1px solid black;
  color: black;
}
#contact #form textarea {
  float:left;
  border:0px;
  width:255px;
  height:140px;
  padding:10px 10px 10px 30px;
  font: 11px/20px'Open Sans', Verdana, Helvetica, sans-serif;
  color:#F1F1F1;
  resize: none;
  border: 1px solid black;
}
#contact #form input.submit {
  cursor: pointer;
  width:85px;
  height:30px;
  float:right;
  padding:0px 0px 5px 0px;
  margin:10px 16px 0px 0px;
  background:#222222;
  color:#F1F1F1;
  font: 14px/16px'Bree Serif', Georgia, serif;
}

External CSS

This Pen doesn't use any external CSS resources.

External JavaScript

  1. https://cdnjs.cloudflare.com/ajax/libs/jquery/2.1.3/jquery.min.js