<!DOCTYPE html>
<html>
<head>
<style>
form {
margin:auto;
position:relative;
width:550px;
height:600px;
font-family: Tahoma, Geneva, sans-serif;
font-size: 14px;
font-style: italic;
line-height: 24px;
font-weight: bold;
color: #09C;
text-decoration: none;
border-radius: 10px;
padding:10px;
border: 1px solid #999;
border: inset 1px solid #333;
box-shadow: 0px 0px 8px rgba(0, 0, 0, 0.3);
}
.input {
width:375px;
display:block;
border: 1px solid #999;
height: 25px;
box-shadow: 0px 0px 8px rgba(0, 0, 0, 0.3);
}
textarea {
display:block;
}
textarea#feedback {
width:375px;
height:150px;
display:block;
}
input#button {
width:100px;
position:absolute;
right:20px;
bottom:20px;
background:#09C;
color:#fff;
font-family: Tahoma, Geneva, sans-serif;
height:30px;
border-radius: 15px;
border: 1p solid #999;
}
input#button:hover {
background:#fff;
color:#09C;
}
input:focus, textarea:focus {
border: 1px solid #09C;
}
</style>
</head>
<body>
<form action="http://workshop.sps.nyu.edu/~sultans/util/form/formProc.cgi">
<div>
<h1>Contact Form</h1>
<label>
<span>Your name</span> <input type="text" id="name" class=input name="name">
</label>
<label>
<span>Email Address</span> <input type="text" id="email" class=input name="email">
</label>
<label>
<span>Subject</span> <input type="text" id="subject" class=input name="subject">
</label>
<label>
<span>Date</span> <input type="date" id="date" class=input name="date">
</label>
<label>
<span>Gender</span> <div class=input>
<input type="radio" name="gender" value="M"> Male
<input type="radio" name="gender" value="F"> Female
</div>
</label>
<span>Residence State</span><select class=input name="state">
<option value="00"> --Choose from below--</option>
<option value="NY"> New York</option>
<option value="NJ"> New Jersey</option>
<option value="CT"> Connecticut</option>
</select>
</label>
<label>
<span>Message</span> <textarea id="feedback" name="feedback"></textarea>
</label>
<label>
<input id=button type="submit" class=input value="Submit Form" />
</label>
</div>
</form>
</body>
</html>