/* CSS Document */

/* HTML, BODY ---------- */
* {margin:0; padding:0;}
body {margin:0; background: url(images/bg.gif) top center no-repeat; font-family: Verdana, Arial, Helvetica, sans-serif; font-size:12px; line-height:20px; text-align:justify;}
p, h2, h3, ul, blockquote, ol {padding-top:10px; padding-bottom:10px;}
ul, blockquote, ol {padding-left:30px; padding-right:20px;}
a {color:#67bf74;}
a:hover {text-decoration:none;}
a img {border-style:none;}
#contact a {color:#000;}
#footer h2 {margin:0; padding:0; font-size:11px; font-weight:normal; color:#666; }
.links a {color:#507195;}

/* LAYOUT ---------- */
#wrap {width:977px; margin:0 auto; background:url(images/tile-body.gif) repeat-y; overflow:auto; padding-bottom:20px;}
#header {width:977px; background:url(images/bg-header.gif) no-repeat; min-height:764px; height:auto !important; height:764px; }
#leftcolumn {width:197px; position:absolute; top:225px; z-index:80; padding-left:5px; }
#contact {width:171px; height:258px; background:url(images/bg-contact.jpg) no-repeat ; margin:15px 0 5px 9px; padding:35px 0 0 7px; line-height:16px; text-align:left; }
#wordoftheday {width:165px; line-height:14px; margin:8px 0 0 14px;}
#footer {width:913px; margin:0 auto; background:url(images/bg-footer.jpg) no-repeat; padding:32px 32px 20px 32px; line-height:14px; clear:both;}
#content {width:470px; padding:48px 25px 40px 218px; float:left;}
#lookingfor {width:357px;  background:#6fcb7b; padding:5px 50px 35px 30px; margin:0 auto;}
#rightcolumn {float:left; width:240px; padding:48px 0 0 0; color:#666;}
#levels {width:100%; border:1px solid #437fc1;  text-align:center; padding:0; margin:0;}
#levels td {padding:5px;}

/* HEADERS ---------- */
h1 {background-repeat: no-repeat; height: 50px; width:409px; text-indent: -999em; margin: 5px 0 0 0; padding:0;}
h2 {font-size:14px; color:#437fc1; text-transform:uppercase; text-align:left;}
h3 {font-size:12px;}
h1#logo {float:right;
margin: 0;
padding: 0;
background-repeat: no-repeat; 
width: 543px;/* this width reflects the width of the logo image */
height: 178px; /* this height reflects the height of the heading image */
overflow: hidden; 
text-indent: -999em;} /* hides rich text so only background image shows */

h1#logo a {
display: block; 
height: 178px;/*same height as logo h1*/ 
width: 543px;/*same width as logo h1*/}

/* CLASSES ---------- */
.imgleft {float:left; margin:0 10px 10px 0;}
.right {float:right;}
.left {float:left;}
.hide {display:none;}
.flash {padding: 0; width:468px; height:279px; }
.flashp {color:#000; background-image: url(images/1.jpg); text-align:center; padding:20px 10px}
.block {display:block;}
.listnone {list-style:none;}
.center {text-align:center;}
.clear {clear:both;}
.links {color:#507195;}
.bluetext {color:#437fc1;}
.name {float:right; clear:both; font-weight:bold; color:#437fc1;}



/* NAVIGATION ---------- */


/* NAVIGATION MAIN ---------- */
ul#nav {list-style: none; padding: 0; width:138px; margin:0 0 20px 19px;}

/*  Sets styles for all links that are inside the ul id="nav" */
#nav a {display: block;height: 30px; overflow: hidden; text-indent:-999em; width:138px}

/* Set the image for each nav item */
#services {background: url(images/nav-services.gif); }
#portfolio {background: url(images/nav-portfolio.gif); }
#aboutus {background: url(images/nav-about-us.gif); }
#blog {background: url(images/nav-blog.gif); }
#kudos {background: url(images/nav-kudos.gif); }
#home {background: url(images/nav-home.gif); }

/* Shift the image position up to show the active state */
#nav a:hover, #nav .active, #nav li:hover, #nav li.sfhover, 
#nav li:hover #services, #nav li.sfhover #services, 
#nav li:hover #portfolio, #nav li.sfhover #portfolio, 
#nav li:hover #aboutus, #nav li.sfhover #aboutus, 
#nav li:hover #blog, #nav li.sfhover #blog, 
#nav li:hover #kudos, #nav li.sfhover #kudos, 
#nav li:hover #home, #nav li.sfhover #home {background-position:-138px 0pt;}

/* Set the cursor to default arrow so link does not appear clickable */
#nav .active {cursor: default}

#nav, #nav ul {list-style: none; margin: 0; }
#nav li {display: inline; }
#nav li ul {background: #6ac376; left: -999em; padding: 4px 0 0 4px; position: absolute; z-index: 1; border:#437fc1 1px solid; text-align:left;}
#nav li:hover ul, #nav li.sfhover ul {left: auto; margin: -25px 0 0 135px; color:#FFF;}
#nav ul li a {height:20px; margin: 0; text-decoration: none; width: 227px; text-indent:0; color:#000; font-size:12px; text-transform:uppercase; }
#nav ul li a:hover {color:#FFF;}

/* LOOKING FOR MAIN ---------- */
ul#looking {list-style: none; padding: 15px 0 0 0; margin:0; width:364px; }

/*  Sets styles for all links that are inside the ul id="nav" */
#looking a {display: block;height: 24px; overflow: hidden; text-indent:-999em; width:364px}

/* Set the image for each nav item */
#websiteconsulting {background: url(images/nav-call-outs-web-site-consulting.gif); }
#websitedesign {background: url(images/nav-call-outs-web-design.gif); }
#logodesign {background: url(images/nav-call-outs-logo-design.gif); }
#businesscardsletterhead {background: url(images/nav-call-outs-business-cards-letterheads.gif); }
#marketingdesign {background: url(images/nav-call-outs-marketing-design.gif); }
#searchengineoptimization {background: url(images/nav-call-outs-search-engine-optimization.gif); }

/* Shift the image position up to show the active state */
#looking a:hover, #looking .active, #looking li:hover, #looking li.sfhover, 
#looking li:hover #websiteconsulting, #looking li.sfhover #websiteconsulting, 
#looking li:hover #websitedesign, #looking li.sfhover #websitedesign, 
#looking li:hover #logodesign, #looking li.sfhover #logodesign, 
#looking li:hover #businesscardsletterhead, #looking li.sfhover #businesscardsletterhead, 
#looking li:hover #marketingdesign, #looking li.sfhover #marketingdesign, 
#looking li:hover #searchengineoptimization, #looking li.sfhover #searchengineoptimization {background-position:-364px 0pt;}

/* PRODUCTS */
ul#products {width:462px; margin:0 auto; list-style:none;}
#products li {float:left; width:231px;  padding:5px; margin:0 10px 10px 0; border:1px solid #868484; background:#FFF;}
#products a {color:#868484; font-size:12px; text-decoration:none;}
.price {color:#8fc081; font-size:11px;  font-weight:bold;}

#viewcart {position:absolute; z-index:3; top:10px; margin-left:0px;}