* { margin: 0; padding: 0; }
html, body { height: 100%; }
body { background: #d3d3d3 url(images/bg.png) repeat-x top; font-size: small; font-family: arial, verdana, tahoma, sans-serif; }

h1 { font-size: 140%; margin: 0; padding-top: 4px; padding-bottom: 1px; }
h2 { font-size: 140%; margin: 0; padding-top: 4px; padding-bottom: 1px; }
h3 { font-size: 120%; margin: 0; padding-top: 4px; padding-bottom: 1px; }
h4 { font-size: 100%; margin: 0; padding-top: 4px; padding-bottom: 1px; }
p { margin: 0; padding-top: 4px; padding-bottom: 8px; }

.didyouknow { color: #7dd51b; }
.codingorange { color: #ff8a00; }
.contactblue { color: #1d89cb; }

a:link, a:visited, a:active { outline: none; color: #454545; text-decoration: underline; }
a:hover { color: #000000; text-decoration: none; }

#container { width: 1000px; margin: 0 auto; }
#top { width: 1000px; height: 127px; background: url(images/top.png); }

#testimonials { position: relative; }
#testimonials p { font-size: 90%; text-align: center; margin: 0; padding: 0; }
#testimonials #testone { position: absolute; left: 494px; top: 22px; width: 130px; height: 75px; }
#testimonials #testtwo { position: absolute; left: 664px; top: 22px; width: 130px; height: 75px; }
#testimonials #testthree { position: absolute; left: 834px; top: 22px; width: 130px; height: 75px; }
.testauth { color: #166ebe; }

#nav { clear: both; width: 1000px; height: 49px; background: url(images/nav.png); }
#nav ul { margin: 0; padding: 0; margin-left: 11px; list-style: none; list-style-image: none; }
#nav ul li { float: left; text-align: center; width: 163px; }
#nav li a { display: block; width: 163px; line-height: 49px; color: white; text-decoration: none; }
#nav li a:hover { background: url(images/navhover.png) no-repeat bottom center; color: #37aaeb; }

#canvas { width: 960px; min-height: 200px; height: auto !important; height: 200px; padding-left: 20px; padding-right: 20px; background: url(images/canvas.png) repeat-y; }

#welcome { float: left; width: 480px; margin-left: 20px; }
#welcome p { line-height:18px; }
#didyouknow { float: right; width: 400px; margin-right: 20px; }
#didyouknow p { line-height:18px; }

#threechoice { clear: both; width: 795px; margin: 0 auto; padding-top: 20px; }
#threechoice .choice { float: left; width: 220px; padding:10px; margin-left: 7px; margin-right: 7px;}
.choice p { text-align:justify; }
.choice img { border: none; }

#designboxes { clear: both; width: 846px; margin: 0 auto; padding-top: 20px; }

#designboxes #designbox { float: left; position: relative; margin-right: 15px; width: 403px; height: 260px; background: url(images/webdesignbox.png); }
#designbox #destext { position: absolute; top: 30px; left: 20px; width: 365px; height: 110px; overflow: hidden; text-align:justify; line-height:18px; }
#designbox #deslinks { position: absolute; top: 153px; left: 20px; line-height: 20px; }
#deslinks a { color: #1f87cc; }
#deslinks a:hover { color: #176599; }

#designboxes #logobox { float: left; position: relative; margin-left: 15px; width: 403px; height: 260px; background: url(images/logodesignbox.png); }
#logobox #logotext { position: absolute; top: 30px; left: 20px; width: 365px; height: 110px; overflow: hidden; text-align:justify; line-height:18px; }
#logobox #logolinks { position: absolute; top: 153px; left: 300px; line-height: 20px; text-align: right; }
#logolinks a { color: #75A41E; }
#logolinks a:hover { color: #4D6B14; }

#devboxes { clear: both; width: 920px; margin: 0 auto; padding-top: 10px;  }
.devbox { float: left; position: relative; width: 416px; height: 121px; line-height: 18px; padding: 5px 15px 20px 15px; }
.devbox a { color: #df781d; }
.devbox a:hover { color: #ff8900; }
#fullxhtml { background: url(images/fullxhtml.png); }
#psdtoxhtml { background: url(images/psdtoxhtml.png); margin-left: 15px; }
#tablestodivs { background: url(images/tablestodivs.png); }
#websitechanges { background: url(images/websitechanges.png); margin-left: 15px; }

.devboxrowitem { width: 205px; height: 160px; float: left; margin-left: 10px; padding-right: 10px; border-right: 1px solid #D4D4D4; }
.devboxrowitem p { text-align: justify; }
.devboxrowitem a { color: #df781d; }
.devboxrowitem a:hover { color: #ff8900; }

#highlight_blank { width: 1000px; height: 249px; background: url(images/highlight_blank.png); }
#highlight_home { width: 1000px; height: 249px; background: url(images/highlight_home.png); }
#highlight_design { width: 1000px; height: 249px; background: url(images/highlight_design.png); }
#highlight_coding { width: 1000px; height: 249px; background: url(images/highlight_coding.png); }
#highlight_portfolio { width: 1000px; height: 249px; background: url(images/highlight_portfolio.png); }
#highlight_about { width: 1000px; height: 249px; background: url(images/highlight_about.png); }
#highlight_contact { width: 1000px; height: 249px; background: url(images/highlight_contact.png); }

#footer { clear: both; width: 960px; height: 76px; padding-top: 20px; padding-left: 20px; padding-right: 20px; background: url(images/footer.png); }
#footer p { font-size: 80%; }

.linkstub { width: 130px; margin-right: 10px; float: right;  }
.under { padding-left: 2px; }
.bold { font-weight: bold; font-size: small; }

#portfoliolist { clear: both; width: 930px; margin: 0 auto; padding-top: 20px; }
#portfoliolist .portfolioitem { float: left; width: 430px; height: 200px;  margin-left: 25px; }
.portfolioitem a img { border: none; }

#about { clear: both; float: left; width: 450px; margin-left: 15px; padding: 8px; padding-top: 20px; line-height: 18px; }
#quality { float: right; background: url(images/qualitometer.png); width: 371px; height: 200px; margin-right: 40px; margin-top: 50px; }
#quality p { margin-top: 110px; margin-left: 10px; width: 260px; }
#promise { float: left; width: 450px; margin-left: 15px; padding: 8px; padding-top: 20px; line-height: 18px; }

.contactleft { float: left; clear: left; width: 400px; margin-left: 15px; padding: 8px; line-height: 18px; }
.contactright { width: 450px; margin-right: 15px; float: right; }

input, textarea { padding: 2px; }