body { background-color: #050505; width: 8000px; font-family: "Gill Sans", Helvetica, Tahoma, Verdana, Arial, sans-serif; overflow: hidden; }

#header { height: 108px; background: #000 url(../images/header.png) top left repeat-x; }
#body { height: 420px; background: #DDD url(../images/background.png) top left repeat-x; }
#footer { height: 32px; background: #000 url(../images/footer.png) top left repeat-x; }

.absolute { position: absolute; }

#logo { position: fixed; top: 0; left: 0; }
#menu { position: fixed; top: 528px; left: 0; }

h1 { color: #FFF; font-size: 260%; }
h2 { color: #FFF; font-size: 140%; }

a:link { text-decoration: none; }
a:visited {	text-decoration: none; }

/* ----- ----- ----- ----- Splash Page ----- ----- ----- ----- */

#splash { top: 108px; left: 0; }

#footer ul { padding: 0 0 0 10px; display: inline; }
#footer li { display: inline; }

/* ----- ----- ----- ----- Works Page ----- ----- ----- ----- */

#worksball { background-image: url(../images/ball.png); width: 18px; height: 18px; top: 365px; left: 42px; }

#works {position: absolute; width: 900px; height: 340px; top: 140px; left: 1640px; color: #FFF;}
#worksnav {position: absolute; width: 180px; height: 340px; top: 0; left: 30px; line-height: 0; margin: 0; padding: 0;}
#worksweb {position: absolute; width: 700px; height: 340px; top: 0; left: 230px;}

#works a {text-decoration: none;}
#works img {border: none; padding: 0; margin: 0;}

#worksnav ul {margin: 0; padding: 0;}
#worksnav li {width: 180px; height: 48px; margin: 10px 0; list-style: none;}
#worksnav li img {border: 1px solid #FFF;}

#worksweb h2 {font-size: 160%;}
#worksweb p, #worksweb a {line-height: 130%; padding: 10px 0; color: #222;}
#worksweb a {color: #FFF; text-decoration: underline;}
#worksweb a:hover {color: #FFF; text-decoration: none;}
#worksweb #preview {float: right; padding: 0; margin: 0 0 0 20px; border: 1px solid #FFF; line-height: 0;}
#worksweb #thumbs {position: absolute; top: 200px;}
#worksweb #thumbs img {border: 1px solid #FFF;}
#worksweb #thumbs #thumb1 {margin: 0 15px 0 0;}
#worksweb #thumbs #thumb2 {margin: 0 15px 0 0;}

#worksweb h2 {line-height: 100%;}

#worksphoto {display:none;}

/* ----- ----- ----- ----- About Page ----- ----- ----- ----- */

#about { top: 120px; left: 3200px; }
#aboutball { background-image: url(../images/ball.png); width: 18px; height: 18px; top: 385px; left: 140px; }

#aboutpic { width: 288px; height: 327px; top: 25px;  left: 30px; }
#abouttext { width: 540px; height: 340px; top: 25px; left: 380px; }

#aboutdiv { width: 540px; height: 2px; top: 68px; left: 0; background-color: #111; }
#abouttitle { width: 540px; height: 98px; top: 0; left: 0; }
#aboutcontent { width: 290px; height: 220px; top: 88px; left: 0; color: #111; font: 100%; line-height: 160%; }

#aboutlinks { width: 180px; height: 220px; top: 108px; left: 360px; }

.aboutbox { position: absolute; border: 2px solid #111; }

#aboutlink1 { width: 176px; height: 26px; top: 160px; left: 360px; background-color: #111; }
#aboutlink2 { width: 176px; height: 26px; top: 210px; left: 360px; background-color: #111; }
#aboutlink3 { width: 176px; height: 26px; top: 260px; left: 360px; background-color: #111; }
#aboutlink4 { width: 176px; height: 26px; top: 310px; left: 360px; background-color: #111; }

/* ----- ----- ----- ----- Contact Page ----- ----- ----- ----- */

#contact { top: 120px; left: 4800px; }
#contactball { background-image: url(../images/ball.png); width: 18px; height: 18px; top: 385px; left: 208px; }
#contact form {position: absolute; left: 30px;}

#contacttext { top: 25px; left: 680px; width: 290px; height: 340px; font-size: 110%; line-height: 120%; color: #111;}

#name		{ width: 145px; height: 45px; top: 25px; left: 0px; background-image: url(../images/contactbg/namebg.gif); text-align: right; vertical-align: middle;}
#iname		{ width: 470px; height: 45px; top: 25px; left: 155px; background-image: url(../images/contactbg/namebg.gif); vertical-align: middle;}
#email		{ width: 145px; height: 45px; top: 80px; left: 0px; background-image: url(../images/contactbg/emailbg.gif); text-align: right; vertical-align: middle;}
#iemail		{ width: 470px; height: 45px; top: 80px; left: 155px; background-image: url(../images/contactbg/emailbg.gif); vertical-align: middle;}
#message	{ width: 145px; height: 170px; top: 135px; left: 0px; background-image: url(../images/contactbg/messagebg.gif); text-align: right; vertical-align: middle;}
#imessage	{ width: 470px; height: 225px; top: 135px; left: 155px; background-image: url(../images/contactbg/inputbg.gif);}
#submit		{ width: 145px; height: 45px; top: 315px; left: 0px; background-image: url(../images/contactbg/submitbg.gif); text-align: right; vertical-align: middle;}

#iname input, #iemail input { width: 450px; }

.formfield { width: 450px; }
#contact div p { color: #FFF; font-size: 110%; font-family: "Gill Sans", Helvetica, Tahoma, Verdana, Arial, sans-serif; padding: 10px; }
input, textarea { background: none; border: none; color: #FFF; font-size: 110%; font-family: "Gill Sans", Helvetica, Tahoma, Verdana, Arial, sans-serif; padding: 10px;}
textarea { width: 95%; height: 95%;}
