@charset "UTF-8";
/* CSS Document */

/* ||| universal set of reset styles |||*/

html,
body,
div,
span,
applet,
object,
iframe,
caption,
del,
dfn,
em,
font,
ins,
kbd,
q,
s,
samp,
small,
strike,
strong,
sub,
sup,
tt,
var,
h1,
h2,
h3,
h4,
h5,
h6,
p,
blockquote,
pre,
a,
abbr,
acronym,
address,
big,
cite,
code,
dl,
dt,
dd,
ol,
ul,
li,
fieldset,
form,
label,
legend {
	vertical-align: baseline;
	font-size: 100%;
	outline: 0;
	padding: 0;
	margin: 0;
	border: 0;
}

/* define focus styles! */

:focus {
	outline: 0;
}
body {
	background: white;
	line-height: 1;
	color: black;
}
ol,
ul {
	list-style: disc;
	list-style-position:outside;
}

/* set of clearing floats */	

.clearfix:after {
	content: ".";
	display: block;
	height: 0;
	clear: both;
	visibility: hidden;
}
.clearfix {
	display: inline-block;
}
.clr {
	font-size : 1px;
}
/* Hides from IE-mac \*/

* html .clearfix {
	height: 1%;
}
.clearfix {
	display: block;
}
.clear {
	clear: both;
}
/* End hide from IE-mac */

/* default style */

a {
	outline: none;
	cursor: pointer;
}

img {
	border: none;
	text-decoration: none;
	
}

img.pic {
	margin:15px 0 20px 0;
}

a:link,
a:visited,
a:active {
	color:#666;
	font-weight:bold;
	text-decoration:none;
}
a:hover {
	text-decoration: none;
	color: #97999C;
}

html {
	height: 100%;
	margin-bottom: 1px;
}
body {
	margin: 0;
	padding: 0;
	font-size:100%;
	background: #fff url('images/bg.jpg') no-repeat scroll center 0;
	font: normal 12px "Helvetica Neue",Arial,Helvetica,sans-serif;
	line-height:1.6;
	color: #666;
}

h1, h2.large {
	border-bottom:1px solid #b6babf;
	color:#464749;
	font-family:Arial, Helvetica, sans-serif;
	font-size:21px;
	font-weight:bold;
	line-height:24px;
	height:24px;
	margin-bottom:8px;
}

h2 {
	font-weight:bold;
	font-size:13px;
}

h1.blue, h2.largeblue {
	background: #fff url('images/bullet.png') no-repeat scroll 2px 7px;
	border-bottom:1px solid #b6babf;
	color:#464749;
	font-family:"Helvetica Neue",Arial,Helvetica,sans-serif;
	font-size:21px;
	font-weight:bold;
	line-height:24px;
	height:24px;
	margin-bottom:8px;
	padding-left:22px;
}

h1.tab-heading {
	background:transparent url(images/large-arrow.png) no-repeat scroll 0 9px;
	border-bottom:medium none;
	color:#464749;
	font-family:"Helvetica Neue",Arial,Helvetica,sans-serif;
	font-size:20px;
	font-weight:bold;
	height:36px;
	line-height:36px;
	padding-left:22px;
}

h1.sub, h2.sublarge {
	background: #fff url('images/bullet.png') no-repeat scroll 2px 7px;
	border-bottom:1px solid #b6babf;
	color:#464749;
	font-family:"Helvetica Neue",Arial,Helvetica,sans-serif;
	font-size:21px;
	font-weight:bold;
	line-height:24px;
	height:24px;
	margin-bottom:0;
	padding-left:22px;
}

h3 {
	color:#464749;
	font-weight:bold;
	font-size:13px;
	margin-bottom:6px;
}

h4 {
	color:#464749;
	font-weight:bold;
	font-size:15px;
}

.grey {
	color:#97999c;
}

.italics {
	font-style:italic;
}

p {
	font-size:12px;
	margin-bottom:8px;
	text-align:justify;
	line-height:14px;
	font-family:Arial,Helvetica,sans-serif;
}

.tab-div {
	padding:7px 15px;
	position:relative;
}

.tab-div p {
	font-size:15px;
	color:#666;
	line-height:16px;
}

.seoright {
	-moz-border-radius:12px;
	-webkit-border-radius:12px;
	border-radius: 12px;
	background:#e8f5fb none repeat scroll 0 0;
	height:160px;
	width:100%;
	margin-bottom:15px;
}

.seoleft {
	-moz-border-radius:12px;
	-webkit-border-radius:12px;
	border-radius: 12px;
	background:#e8f5fb none repeat scroll 0 0;
	height:100px;
	width:100%;
	margin-bottom:14px;
}


.portleft {
	-moz-border-radius:12px;
	-webkit-border-radius:12px;
	border-radius: 12px;
	background:#e8f5fb none repeat scroll 0 0;
	margin-bottom:14px;
	padding:7px 15px 12px;
}

.seoleft a {
	color:#666666;
	font-size:13px;
	line-height:16px;
}

input {
	margin:3px 0;
	width:90%;
	border:1px solid #ccc;
}

input.btn {
	background:#97999c;
	border:medium none;
	color:#FFFFFF;
	height:18px;
	padding:0 0 1px;
	width:43px;
	font-family:Arial, Helvetica, sans-serif;
	font-size:10px;
	-moz-border-radius:5px;
	-webkit-border-radius:5px;
}

input.btn:hover {
	background:#888;
}

textarea.msg {
	width:100%;
	height:130px;
	margin:3px 0;
	border:1px solid #ccc;
}

.thumb {
	float:left;
	padding:4px;
	border:1px solid #B6BABF;
	margin-right:8px;
}

.thumb2 {
	float:left;
	padding:5px;
	border:1px solid #B6BABF;
	margin-right:10px;
}

#seocopy ul,
#web-design ul,
#seo-design ul,
#e-commerce ul,
#custom-design ul {
	margin-bottom:10px;
}

#bottom ul li,
#custom-design ul li,
#web-design ul li,
#seo-design ul li,
#e-commerce ul li,
#seocopy ul li,
#rightcolumn ul li,
#expandable ul li,
ul.pdbullet li {
	background:transparent url(images/arrow.png) no-repeat scroll 0 6px;
	line-height:18px;
	padding-left:14px;
	list-style-type:none;
}

li.quote {
	background:transparent url(images/quote.png) no-repeat scroll 0 4px;
	line-height:18px;
	padding-left:14px;
	list-style-type:none;
	padding-bottom:8px;
}

.quotes {
	margin-bottom:8px;
}

a.pdlink {
	background:transparent url(images/arrow.png) no-repeat scroll 0 4px;
	color:#464749;
	font-weight:bold;
	height:22px;
	line-height:22px;
	padding-left:12px;
}
a.pdlink:hover {
	color:#97999C;
}

.pdexample {
	margin-top:15px;
	float:left;
}

.pdexample p {
	font-size:11px;
	margin-bottom:3px;
}

.pdsep {
	float:left;
	height:100px;
	width:15px;
}


.heavy {
	font-weight:bold;
}

#page {
	width: 960px;
	margin: 0 auto;
	background:#fff;
}


#header {
	height:198px;
	background: url('images/dark-top.jpg') repeat-x 0 28px;
}

#headerline {
	height:28px;
	width:100%;
	display:block;
	background:#111;
}

p.right {
	padding:7px 28px 0 0;
	color:#fff;
	float:right;
	font-weight:bold;
}

p.left {
	padding:7px 0 0 28px;
	color:#222;
	float:left;
	font-weight:bold;
}

#paint {
	background: url('images/paint.png') repeat-x 0 0;
	display:block;
	float:right;
	width:491px;
	height:143px;
	position:relative;
	top:26px;
}

#rest {
	min-height:200px;
	clear:both;
	padding:10px 28px 0 17px;
}

.extend {
	margin-bottom:10px;
}

#logo {
	background: url('images/logo.png') no-repeat 0 0;
	height: 130px;
	width:427px;
	display: block;
	margin:37px 0 0 27px;
	float:left;
	clear:both;
	text-indent:-999em;
}

#menu {
	background: url('images/bg_menu.png') repeat-x 0 10px;
	width:904px;
	margin:4px 0 0 28px;
	border-top:1px solid #b6babf;
	height:42px;
}

#menu div {
	background:#FFFFFF none repeat scroll 0 0;
	float:left;
	height:31px;
	width:20px;
}


ul.topmenu li {
	float:left;
	font-size:16px;
	font-weight:bold;
	list-style-type:none;
	background:#fff;
	padding:7px 10px;
	position:relative;
	top:-1px;
	border-top:1px solid #B6BABF;
}

ul.topmenu li a {
	color:#464749;
}
ul.topmenu li:hover {
	background: url('images/current.png') no-repeat center top;
	border-top:none;
	padding:8px 10px;
}


#home ul.topmenu li.homenav,
#about ul.topmenu li.whonav,
#options ul.topmenu li.optionsnav,
#seo ul.topmenu li.seonav,
#portfolio ul.topmenu li.portfolionav,
#contact-us ul.topmenu li.contactnav{
	background: url('images/current.png') no-repeat center top;
	border-top:none;
	padding:8px 10px;
}

#home ul.topmenu li.homenav a,
#about ul.topmenu li.whonav a,
#seo ul.topmenu li.seonav a,
#portfolio ul.topmenu li.portfolionav a,
#options ul.topmenu li.optionsnav a {
	color:#97999c;
}

body#contact-us {
background: #fff url('images/bg-contact.jpg') no-repeat scroll center 0;
}

#leftcolumn {
	width:545px;
	float:left;	
}

#mid-left {
	float:left;
	margin-left:11px;
	width:200px;
}

#mid {
	float:left;
	margin-left:18px;
	width:420px;
}

#mid-right {
	float:right;
}

#visit-portfolio {
	background: url('images/portfolio.jpg') no-repeat left top;
	height:268px;
	display:block;
	position:relative;
}

#examples {
	float:right;
	width:678px;
}

#contactus {
	height:325px;
	min-height:325px;
	padding:0 10px;
	display:block;
}

#linkdiv {
	padding:0 10px;
	display:block;
}

#seocopy {
	padding:0 10px;
}

#halfhead {
	background: url('images/halfhead.jpg') no-repeat left top;
	height:268px;
	display:block;
}

#flash {
	height:253px;
	left:12px;
	position:relative;
	width:530px;
}

#viewportfolio {
	position:absolute;
	top:228px;
	left:387px;
	width:140px;
	background: transparent url(images/arrows.png) no-repeat scroll 110px 5px;
}

#viewportfolio a {
	color:#fff;
	font-weight:bold;
	display:block;
}

#tabcontent {
	float:right;
	width:352px;
	margin-left:18px;
}

#rightcolumn {
	float:right;
	width:352px;
}

#bottom {
	padding:40px 28px 0;
	background: transparent url(images/middle.png) repeat-x scroll top left;
	margin:10px 0;
}

#bottom1 {
	width:28%;
	float:left;
}

.divider {
	width:5%;
	height:304px;
	float:left;
	display:block;
	background: transparent url(images/divider.png) no-repeat scroll top center;
}
#bottom2 {
	width:31%;
	float:left;
}

#bottom3 {
	width:31%;
	float:left;
}

.section {
	padding-bottom:20px;
}

.readmore {	
	text-align:right;
}

.readmore a {
	font-weight:bold;
	background: transparent url(images/arrows.png) no-repeat scroll right 6px;
	padding-right:27px;
	display:block;
}

.morebutton {
	background:transparent url(images/option-button.png) no-repeat scroll 0 0;
	color:#FFFFFF;
	display:block;
	font-weight:bold;
	height:22px;
	line-height:21px;
	padding-left:18px;
	position:absolute;
	right:12px;
	text-indent:18px;
	top:127px;
	width:142px;
}

.morebutton:hover {
	background-position:0 100%;
}


#footer {
	background:#111 url(images/bg-footer.png) no-repeat scroll top right;
	width: 960px;
	margin: 0 auto;
	height: 42px;
	border-top:10px solid #012234;
}

#credit {
	float:right;
	padding:12px 28px 0 0;
	font-size:11px;
	font-weight:bold;
}

.credit a:link,
.credit a:visited,
.credit a:active {
	color:#97999c;
	font-size:11px;
}

.credit p {
	color:#97999c;
	font-size:11px;
}

#rightfoot {
	float:right;
	margin:25px 35px 0 0;
	width:395px;
}

#leftfoot {
	width:350px;
	float:left;
	margin:25px 35px 0;
}



/* portfolio expand */

.trigger {
	background:transparent url(images/toggle.png) no-repeat scroll 0 0;
	float:left;
	width:246px;
	height:28px;
	font-size:14px;
	font-weight:bold;
	text-align:center;
	display:block;
	margin:20px 87px 10px;
}
.trigger a, span.active a{
	display:block;
	padding-top:3px;
	color:#666;
}
.trigger a:hover, .trigger a:active, span.active:hover a, span.active:active a {
	color:#999;
}
span.active {
	background:transparent url(images/toggle.png) no-repeat scroll 0 bottom;
}
.toggle_container {
	float:left;
	margin-bottom:15px;
}