How do I get this form element to sit at the center of this page?

See more:

CSS

HTML

HTML code

<form method="post" id= "form" action>
        <input type="text" id="email" name="email" value class="defaultText">
        <input type="submit" value="submit" id="submitButton">
</form>

CSS code

*{
margin:0;
p

<pre lang="CSS"><pre lang="c++"><pre lang="CSS">

adding:0;
}


/*-------------------------
General Styles
--------------------------*/


html{
background: #b0b0b0;
}

body {
background: #fff68f no-repeat center center;
font:14px/1.3 'Segoe UI',Arial, sans-serif;
}


form {
background: #181819;
display: block;
height: 31px;
padding: 10px;
position: relative;
width: 323px;
-webkit-border-radius: 3px;
-moz-border-radius: 3px;
border-radius: 3px;
}

#form {
color: rgb(238, 238, 238);
height: 31px;
position: relative;
width: 323px;
perspective-origin: 171.5px 25.5px;
transform-origin: 171.5px 25.5px;
background: rgba(24, 24, 25) none repeat scroll 0% 0% / auto padding-box border-box;
border: 0px none rgb(238, 238, 238);
border-radius: 3px 3px 3px 3px;
font: normal normal normal normal 15px/normal calibri Arial sans-serif;
margin: 0px 0px 0px -7px;
padding: 10px;
}

#submitButton {
background: url(submit_form.png) no-repeat right top;
border: none;
cursor: pointer;
height: 31px;
left: 236px;
line-height: 31px;
position: absolute;
text-indent: -99999px;
text-transform: uppercase;
top: 10px;
width: 96px;
}

#email {
background: url(submit_form.png) no-repeat;
border: none;
color: #888888;
height: 31px;
left: 10px;
line-height: 31px;
padding-left: 8px;
text-shadow: 1px 1px 0 #000000;
top: 10px;
width: 215px;
outline: none;
}