@import url("reset.css");

body {font-family: Arial; font-size: 72.5%; background: #fff; padding: 20px 0; height: 100%;}
#wrap {width: 960px; margin: 0 auto; background: #fff url(../img/wrap_bg.jpg) no-repeat top left; padding: 10px 20px; height: 100%;}
#header {height: 100px; position: relative;}
#header h1 {display: none;}
#header #logo {width: 221px; height: 51px; background: url(../img/logo.png) no-repeat top left; position: absolute; top: 21px; left: 20px; text-indent: -9999px;}
#header #header_contact {width: 256px; height: 40px; position: absolute; top: 42px; right: 20px; background: url(../img/phone_numbers.png) no-repeat top left; text-indent: -9999px;}

.home {background: #000 url(../img/novelty_bg_bw.jpg) no-repeat top center;}
.design {background: #6ba7f0 url(../img/bg_design.png) repeat-x top left;}
.seo {background: #59b400 url(../img/bg_seo.png) repeat-x top left;}
.hosting {background: #fd7100 url(../img/bg_hosting.png) repeat-x top left;}
.consulting{background: #e93500 url(../img/bg_consulting.png) repeat-x top left;}
.portfolio{background: #ec0508 url(../img/bg_portfolio.png) repeat-x top left;}
.company{background: #333 url(../img/bg_company.png) repeat-x top left;}
.contact{background: #1c086b url(../img/bg_contact.png) repeat-x top left;}

#nav {height: 34px; width: 960px; background: url(../img/nav.png) no-repeat top left; position: relative;}
#nav li {display: block; position: absolute;}
#nav li a {display: block; height: 34px; text-indent: -9999px;}
#nav #nav_design {width: 177px; height: 34px; top: 0; left: 0;}
#nav #nav_design a {width: 177px;}
.design #nav #nav_design a, #nav #nav_design a:hover {background: url(../img/nav_color.png) no-repeat 0 0;}
#nav #nav_seo {width: 88px; height: 34px; top: 0; left: 177px;}
#nav #nav_seo a {width: 88px;}
.seo #nav #nav_seo a, #nav #nav_seo a:hover {background: url(../img/nav_color.png) no-repeat -177px 0;}
#nav #nav_hosting {width: 125px; height: 34px; top: 0; left: 265px;}
#nav #nav_hosting a {width: 125px;}
.hosting #nav #nav_hosting a, #nav #nav_hosting a:hover {background: url(../img/nav_color.png) no-repeat -265px 0;}
#nav #nav_consulting {width: 154px; height: 34px; top: 0; left: 390px;}
#nav #nav_consulting a {width: 154px;}
.consulting #nav #nav_consulting a, #nav #nav_consulting a:hover {background: url(../img/nav_color.png) no-repeat -390px 0;}
#nav #nav_portfolio {width: 139px; height: 34px; top: 0; left: 544px;}
#nav #nav_portfolio a {width: 139px;}
.portfolio #nav #nav_portfolio a, #nav #nav_portfolio a:hover {background: url(../img/nav_color.png) no-repeat -544px 0;}
#nav #nav_company {width: 138px; height: 34px; top: 0; left: 683px;}
#nav #nav_company a {width: 138px;}
.company #nav #nav_company a, #nav #nav_company a:hover {background: url(../img/nav_color.png) no-repeat -683px 0;}
#nav #nav_contact {width: 139px; height: 34px; top: 0; left: 821px;}
#nav #nav_contact a {width: 139px;}
.contact #nav #nav_contact a, #nav #nav_contact a:hover {background: url(../img/nav_color.png) no-repeat -821px 0;}

#top {height: 204px; background: #fff;}
.design #top {background: url(../img/top_design.jpg) no-repeat top left;}
.design a {color:#0076ff;}
.seo #top {background: url(../img/top_seo.jpg) no-repeat top left;}
.seo a {color: #1eff00;}
.hosting #top {background: url(../img/top_hosting.jpg) no-repeat top left;}
.hosting a {color:#fbee00;}
.consulting #top {background: url(../img/top_consulting.jpg) no-repeat top left;}
.consulting a {color:#ff7300;}
.portfolio #top {background: url(../img/top_porfolio.jpg) no-repeat top left;}
.portfolio a {color: #f70000;}
.company #top {background: url(../img/top_company.jpg) no-repeat top left;}
.company a {color: #ff0064;}
.contact #top {background: url(../img/top_contact.jpg) no-repeat top left;}
.contact a {color: #6e47cd;}

#wall {height: 180px;}
#flash_wrap {height: 720px; margin-top: -170px;}

#main {background: url(../img/shadow.png) no-repeat top left; overflow: hidden; clear: both; margin: 0; padding: 25px 0 15px 0; position: relative;}
#main .col_left {width: 630px; float: left; margin: 0 0 0 10px;}
#main .col_left p {line-height: 150%; margin: 0 20px 15px 48px; font-size: 1.2em;}
#main .col_left_sub {width: 570px; float: left; padding: 0 20px 0 0;}
#main .col_left_sub p {font-size: 1.2em; line-height: 150%; margin: 0 0 15px 0;}
#main .col_right {width: 300px; float: right;}
#main  h2 {text-indent: -9999px; height: 33px; margin: 0 0 15px 0;}
#main  p.subtitle {margin: 0 0 10px 45px; font-size: 1.2em; padding: 0 0 10px 0;}

#main_gutter {padding: 0 40px;}
#main_gutter p {font-size: 1.2em; line-height: 150%; margin: 0 0 15px 0;}

ul.page_list {list-style-type: disc; margin: 0 0 0 62px;}
ul.page_list li {margin: 0 0 10px 0; font-size: 1.2em; line-height: 150%;}

.title_web_design {background: url(../img/title_web_design.png) no-repeat top left;}
.title_seo {background: url(../img/title_seo.png) no-repeat top left;}
.title_hosting {background: url(../img/title_hosting.png) no-repeat top left;}
.title_consulting {background: url(../img/title_consulting.png) no-repeat top left;}
.title_company {background: url(../img/title_company.png) no-repeat top left;}
.title_contact {background: url(../img/title_contact.png) no-repeat top left;}

#contact_form {width: 290px; height: 190px; background: url(../img/contact.png) no-repeat top left; padding: 58px 0 0 0;}
#contact_form h3 {display: none;}
#contact_form label {display: none;}
#contact_form p {margin: 0 0 11px 80px; padding: 0px; height: 22px;}
#contact_form .textbox {width: 170px; margin: 0 padding: 0;}
#contact_form .selectbox {width: 175px;}
#contact_form #submit_button {width: 60px; height: 21px; background: url(../img/button_send.png) no-repeat top left; border: 0; text-indent: -9999px; cursor: pointer; margin: 8px 34px 0 0; float: right;}


#hosting_button {margin: 0 0 0 40px; clear: both; display: block; padding: 10px 0;}

#footer {background: #000; color: #fff; padding: 15px 40px; font-size: 1.2em; margin: 0 0 10px 0;}

#bottom {border-top: 1px solid #ddd;}
#bottom #columns {overflow: hidden;}
#bottom #columns div {float: left;}
#bottom #columns h3 {font-size: 2em; font-weight: bold; margin: 0 0 15px 15px; padding: 15px 0 0 0;}
#bottom #columns ul {list-style: disc; margin: 0 15px 0 35px; height: 122px;}
#bottom #columns ul li {margin: 0 0 10px 0; line-height: 150%;}
#bottom #columns .button {margin: 0 auto; padding: 10px 0 20px 0; margin: 0 0 0 58px;}
#bottom #columns #far_left {background: #fff;width: 240px; border-right: 1px solid #ddd;}
#bottom #columns #left {background: #fff;width: 239px; border-right: 1px solid #ddd;}
#bottom #columns #middle {background: #fff;width: 239px; border-right: 1px solid #ddd;}
#bottom #columns #right {background: #fff;width: 239px;}

.price {color: green; font-size: 3em; text-align: center; font-weight: bold; margin: 10px 0 5px 0; display: block;}
.price span {font-size: 14px; font-weight: bold; color: #000;}

.link_list {margin: 15px 0 0 60px; list-style-type: disc;}
.link_list li {font-size: 1.2em; margin: 0 0 10px 0;}

#logo_row {margin: 0 0 15px 0;}

#hosting_logos {width: 640px; height: 172px;}

#bottom_links {text-align: center; line-height: 100%; padding: 0 0 15px 0;}
#bottom_links li {display: inline; margin: 0 5px;}
#bottom_links li a {color: #aaa;}

#validation_errors {margin: 10px 0 0 0; color: red; padding: 0; width: 290px; text-align: center;}
#validation_errors  p {margin: 0 10px 10px 10px;}

#gainesville {height: 93px; width: 265px; background: url(../img/gainesville.jpg) no-repeat top left; position: absolute; top: 423px; right: 22px; text-indent: -9999px;}
#character_eyez {height: 93px; width: 265px; background: url(../img/character_eyez.jpg) no-repeat top left; position: absolute; top: 300px; right: 22px; text-indent: -9999px;}

a {text-decoration: none;}
a:hover {text-decoration: underline;}

em {font-weight: bold;}