@charset "UTF-8";

/* CSS Document */

body { background-image: url(images/bg.gif); background-position: top center; background-color: #9dc549; background-repeat: no-repeat; font-size: 62.5%; }

img, div { border: none; }

* { margin: 0px; padding: 0px; }

h1 { font-family: Arial, Helvetica, sans-serif; font-size: 1.3em; color: #fff; margin-top: -2px; float: inherit; text-transform: uppercase; }

h2 { font-size: 2.5em; }

/* ------------------------------------------------------------------------------ Top */

#wrap { width: 1024px; margin: 0 auto; }

#topbit { width: 1024px; height: 62px; float: left; }

#shdwleft { width: 17px; height: 1079px; float: left; background-image: url(images/shadow-left.gif); }

#shdwright { width: 16px; height: 1079px; float: left; background-image: url(images/shadow-right.gif); }

#main { width: 901px; height: 1079px; padding: 0 46px 0 44px; float: left; background-image: url(images/bgrepeat.gif); background-repeat: repeat-y; }

#logo { width: 901px; height: 68px; }

/* ------------------------------------------------------------------------------ Green Top Bit */

#green { width: 901px; height: 301px; background-image: url(images/bgtop.jpg); padding: 46px 0 0 0px; }

#greentext { width: 390px; padding: 44px 40px 0 22px; float: left; }

#greentext p { font-family: Arial, Helvetica, sans-serif; font-size: 1.1em; color: #fff; line-height: 18px; padding: 5px 0; }

#greentext a { font-weight: bold; color: #FFFFFF; }

#greentext a:hover { font-weight: bold; color: #FFFFFF; text-decoration: none; }

#wletter { float: left; padding-right: 11px; width: 80px; height: 54px; background-image: url(images/w.gif); background-position: top left; background-repeat: no-repeat; }

#wheadone { width: 290px; float: inherit; padding-bottom: 4px; }

#flash { width: 377px; height: 164px; padding: 49px 27px 0 0; float: right; }

/* ------------------------------------------------------------------------------ Main Bits Bit */

#boxone { width: 407px; height: 269px; padding: 39px 45px 0 0; float: left; background-image: url(images/icon-brochure-folder.gif); background-position: top right; background-repeat: no-repeat; }

#boxtwo { width: 403px; height: 269px; padding: 39px 0 0 46px; float: left; background-image: url(images/icon-logo-design.gif); background-position: top right; background-repeat: no-repeat; }

#boxthree { width: 407px; height: 269px; padding: 39px 45px 0 0; float: left; background-image: url(images/icon-directory-design.gif); background-position: top right; background-repeat: no-repeat; }

#boxfour { width: 403px; height: 269px; padding: 39px 0 0 46px; float: left; background-image: url(images/icon-corporate-identity.gif); background-position: top right; background-repeat: no-repeat; }

#maintext { width: 901px; float: left; }

#maintext p { font-family: Arial, Helvetica, sans-serif; font-size: 1.1em; color: #6b6b6b; line-height: 18px; padding-bottom: 10px; }

#maintext a { font-weight: bold; color: #79b400; }

#maintext a:hover { font-weight: bold; color: #79b400; text-decoration: none; }

#pageend { width: 901px; height: 102px; float: left; background-image: url(images/bgpage.gif); background-position: bottom center; background-repeat: no-repeat; }

/*tabs*/

#tabs { width: 960px; height: 205px; margin-left: 17px; display: inline; }

#web { background: url(images/web-design.jpg) no-repeat; width: 240px; height: 169px; float: left; position: relative; padding-right: 10px; }

#seo { background: url(images/seo.jpg) no-repeat; width: 240px; height: 169px; float: left; position: relative; }

#better { background: url(images/better-web.jpg) no-repeat; width: 240px; height: 169px; float: left; position: relative; padding-right: 10px; }

#best { background: url(images/best-web.jpg) no-repeat; width: 240px; height: 169px; float: left; position: relative; margin: 0 10px 0 17px; }

.tabnav { height: 30px; width: 92px; display: block; background: url(images/more-button.jpg) no-repeat; outline: none; position: absolute; top: 115px; left: 75px; }

/* ------------------------------------------------------------------------------ Contact Bit */

#shdwbtm { width: 1024px; height: 35px; background-image: url(images/shadow-btm.gif); float: left; }

#contact { width: 342px; height: 218px; padding: 72px 0 0 82px; background-image: url(images/bgcontact.jpg); background-position: top center; background-repeat: no-repeat; float: left; margin-top: 20px; }

#contactpadleft { padding-left: 300px; }

.bibform { width: 284px; height: 24px; background-image: url(images/form.gif); background-position: top left; background-repeat: no-repeat; border: 0; font-family: Arial, Helvetica, sans-serif; font-size: 1.1em; color: #6b6b6b; margin-bottom: 6px; }

.bibmessage { width: 284px; height: 71px; background-image: url(images/message.gif); background-position: top left; background-repeat: no-repeat; border: 0; font-family: Arial, Helvetica, sans-serif; font-size: 1.1em; color: #6b6b6b; margin-bottom: 6px; }

.bibform:hover { height: 22px; width: 282px; border: 1px solid #79b400; background-image: none; background-color: #fff; }

.bibmessage:hover { height: 69px; width: 282px; border: 1px solid #79b400; background-image: none; background-color: #fff; }

.bibbutton { padding-left: 192px; }

/* ------------------------------------------------------------------------------ Footer Bit */

#footerrpt { height: 94px; background-image: url(images/footerbg.gif); background-repeat: repeat-x; background-position: top; background-color: #363636; clear: left; }

#footer { width: 902px; height: 63px; margin: 0 auto; padding: 31px 61px 0 61px; }

#footer p { font-family: Arial, Helvetica, sans-serif; font-size: 1.1em; color: #fff; line-height: 16px; margin-top: -2px; }

#footer a { color: #FFFFFF; }

#footer a:hover { text-decoration: none; }

.footlogo { width: 201px; float: left; }

.foottext { width: 200px; float: left; }

.footadds { width: 492px; float: left; text-align: right; }

/* ------------------------------------------------------------------------------ Classes */

.floatleft { float: left; }

.floatright { float: right; }

.contact { float: right; padding: 27px 47px 0 0; }

.padtoppara { padding-top: 7px; }

.picright { float: right; padding: 15px 0 5px 5px; }

.trow { padding: 4px 0; width: 290px; }

.trowt { width: 290px; }

.name-missing { padding-right: 6px; }

.capitals { text-transform: uppercase; }

/* ------------------------------------------------------------------------------ Clever Contact Form */

/* Form styling from here on out. There is nothing in here that you HAVE to use to get this to work */	
#messageSent { display:none; }

#contactForm textarea, #contactForm input { width:284px; height:15px; line-height:14px; font-size:11px; padding:2px 2px 0px; }

#contactForm input { background-position:0px -20px; height: 21px; background:#fbfbfb url(images/form.gif) repeat-x top; color:#6b6b6b; border:1px solid #efefef;  color:#6b6b6b; }

#contactForm textarea { height:71px; font-family:Verdana, Geneva, sans-serif; background:#fbfbfb url(images/form.gif) repeat-x top; color:#6b6b6b; border:1px solid #efefef;  }

#contactForm .submit { float:left; width: 92px; height: 30px; margin-left: 196px; background: none; padding-top: 4px; border: none; }

#contactForm .submit:active { }

#contactForm label { padding-left:4px; font-weight:bold; }

#mail_response h3 { padding-left: 10px; font-family: Arial, Helvetica, sans-serif; font-size: 1.7em; color: #6b6b6b; line-height: 18px; padding-bottom: 10px; padding-top: 5px; }

#mail_response h5 { font-family: Arial, Helvetica, sans-serif; font-size: 1.4em; color: #6b6b6b; line-height: 18px; padding-bottom: 10px; }

#mail_response p { padding-left: 10px; font-family: Arial, Helvetica, sans-serif; font-size: 1.1em; color: #6b6b6b; line-height: 18px; padding-bottom: 10px; }

#contactForm .input_boxes { float:left; width:204px; }

/* This hides the form validation alert messages until needed */

#contactForm span { display:none; font-family: Arial, Helvetica, sans-serif; font-size:20px; font-weight: bold; line-height:10px; padding-left:6px; color:#ff2a00; }