html, body, div, span, applet, object, iframe,
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
a, abbr, acronym, address, big, cite, code,
del, dfn, em, font, img, ins, kbd, q, s, samp,
small, strike, strong, sub, sup, tt, var,
dl, dt, dd, ol, ul, li,
fieldset, form, label, legend,
table, caption, tbody, tfoot, thead, tr, th, td {
	margin: 0;
	padding: 0;
	border: 0;
	outline: 0;
	font-weight: normal;
	font-style: normal;
	font-size: 100%;
	font-family: inherit;
	/*vertical-align: baseline;*/
	}
	
/* remember to define focus styles! */
:focus {
	outline: 0;
	}
	
body {
	/*line-height: 1;*/
	color: black;
	background: white;
	}
	
ol, ul {
	list-style: none;
	}
	
/* tables still need 'cellspacing="0"' in the markup */
table {
	border-collapse: separate;
	border-spacing: 0;
	}
	
caption, th, td {
	text-align: left;
	font-weight: normal;
	}
	
blockquote:before, blockquote:after,
q:before, q:after {
	content: "";
	}
	
blockquote, q {
	quotes: "" "";
	}

*.cb{
	clear:both;
	

}

/* END RESET */

body {
	font-family: "Trebuchet MS", Arial, Helvetica, sans-serif;
	font-size:14px;
	background-position:center -50px;
	background-repeat: no-repeat;
	color:#606060;	
	background-image:url(../images/grunge-bg.jpg);
	background-color:#000;
	margin:0;
	padding:0;
}
/*img, div { behavior: url(js/iepngfix.htc) }*/

h1{ font-size:30px;}
h2{ font-size:28px;}
h3{ font-size:24px;}
h4{ font-size:20px; margin-bottom:10px;}
h5{ font-size:16px;}
h6  a{
	font-size:14px;
	font-weight:bold;
}


small{
	font-size:12px;}

p{
	padding-bottom:20px;
	line-height:24px;
	}
small{
	font-size:11px;
	}
strong{
	font-weight:bold;
	}
i, em{
	font-style:italic;
}

.large-text{font-size:20px;
}
#content ul, ol{
	position:relative;
	margin:10px 0px;
	}
#content ul li, ol li{
	padding:5px 0 0 5px;
	margin:0 0 0 30px;
	}
#content ul li{
	list-style-type:disc;
	}
#content ol li{
	list-style-type: decimal;
	}

#content table{
	width:100%;
	border-collapse:collapse;
	margin-top:10px;
	}
#content table tr th{
	background-color:#5B5B5B;
	color:#FFF;
	padding:5px;
	text-align:center;
	border:1px #d6d6d6 solid;
	}	
#content table tr td{
	background-color:#FFFFFF;
	padding:5px;
	text-align:left;
	border:1px #d6d6d6 solid;
	}	

.line{ padding:0 0 10px 0; margin-bottom:10px; border-bottom:1px #999 dotted; }

/********************************************************************************************** GLOABAL STYLES */
#main-container{
	width:960px;
	margin: 15px auto 20px auto;
	display:block;
	}

	/*** style for buttons ***/
.block_link_light{ color:#FFF; font-size:13px; display:block; padding:5px 10px; float:left; text-decoration:none; margin:10px 5px 0px 0px;}
.block_link_dark{ color:#000; font-size:13px; display:block; padding:5px 10px; float:left; text-decoration:none; margin:10px 5px 0px 0px;}
/*** style for links hover ***/
.block_link_light:hover,.block_link_dark:hover{ color:#FFF;}

/*** standard template colors for buttons etc. ***/
.dark_tempcolor{
	background-color:#666666;
}
.light_tempcolor{
	background-color:#999;
}
.white_tempcolor{ background-color:#FFF;}

a.dark_tempcolor:hover,a.light_tempcolor:hover,a.white_tempcolor:hover{ background-color:#000;}

/*** color for feature title ***/
.tempcolor{
	color:#666666;
}
.black{ color:#000;}

/*** main colors for links ***/
a{
	color:#666666;
	text-decoration:underline;
}
a:hover{ color:#000000;	text-decoration: none; }

/********************************************************************************************** Header */
#header{
	position:relative;
	display:block;
	width:960px;
	height:127px;
	margin:0px auto;
	background:left bottom repeat-x url('../images/header_bg.jpg');
	}
#client{
	position:absolute;
	top:50px;
	right:20px;
	display: inline-block;
	}

.clilog{font-weight:bold; text-align:right;}
	
input{
	display: inline-block;
	border:1px #a0a0a0 solid;
	background-color:#eeeeee;
	padding:3px;
	vertical-align:middle;
	margin-bottom:2px;
	}
input#searchsubmit{
	display: inline-block;
	background-color:#575757;
	color:#FFF;
	font-size:12px;
	padding:3px 5px;
	}
input#searchsubmit:hover{
	background-color:#000;
	cursor:pointer;
	}

	/********************************************************************************************** LOGO DIV IMAGE */

#logo{
	display:block;
	width:460px;
	height:127px;
	position:absolute;
	top:0px;
	left:20px;
	background:left url('../images/logo.png') no-repeat;
}

#logo strong{margin-left:-9999px;}

/* hire me button text color */
#menu a.quote{
	color:#FFF; font-weight:bold;
	}
#menu a.quote:hover{
	background-color:#000;
	color:#fff;
	}
	
/********************************************************************************************** Newsletter */

#newsletter{}

#newsletter input{}

#newssubmit{display: inline-block;
	background-color:#575757;
	color:#FFF;
	font-size:12px;
	padding:3px 5px;}

.newslog{font-weight:bold; text-align:right;}
	
/********************************************************************************************** Menu */
#menu_wrap{
	display:block;
	width:960px;
	height:43px;
	padding:13px 0px 0px 0px;
	background-color:#FFFFFF;
	}
#menu{
	display:block;
	width:920px;
	margin:0px auto;
	height:30px;
	background-color:#575757;
	}
#menu ul li a.current {
 background-color:#000;
	}

#menu a.quote{
	display:block;
	height:23px;
	padding:7px 10px 0px 10px;
	border-left:1px #FFF solid;
	float:right;
	text-decoration:none;
	font-size:12px;
	}
/********************************************************************************************** HOME PAGE BANNER TEXT AREA STYLES */
#banner #text{	
	position:relative;
	font-size:24px;
	color:#FFF;
	display:block;
	width:415px;
	padding:20px 0px 0px 30px;
	font-weight:bold;
	}
#banner #text .big{
	font-size:72px;
	color:#FFF;
	font-weight:bold;
	}
	
/********************************************************************************************** Home Content */
#additional_top_wrap{
	display:block;
	width:920px;
	padding:0px 20px 10px 20px;
	background-color:#FFF;
	}
#banner{
	position:relative;
	display:block;
	width:920px;
	height:210px;
	border-bottom:1px #333 dotted;
	}

.clear_banner{
	position:relative;
	clear:both;
	display:block;
	width:415px;
	height:20px;
	}		
	
#banner #mygallery{
	position:absolute;
	right:40px;
	top:1px;
	z-index:80;
	}
.stepcarousel{
	position: relative; /*leave this value alone*/
	border: 4px solid #FFF;
	overflow: scroll; /*leave this value alone*/
	width: 390px; /*Width of Carousel Viewer itself*/
	height: 255px; /*Height should enough to fit largest content's height*/
}

.stepcarousel .belt{
	position: absolute; /*leave this value alone*/
	left: 0;
	top: 0;
}

.stepcarousel .panel{
	float: left; /*leave this value alone*/
	overflow: hidden; /*clip content that go outside dimensions of holding panel DIV*/
	margin:0px; /*margin around each panel*/
	width: 390px; /*Width of each panel holding each content. If removed, widths should be individually defined on each content DIV then. */
}	
	
	
#feature_sections{
	position:relative;
	display:block;
	width:920px;
	padding:0px;	
	border-bottom:1px #999 dotted;
	}
#feature_sections .block{
	display:inline;
	float:left;
	width:300px;
	margin:10px 10px 0px 0px;
	background-color:#DFDFDF;
	padding:15px 0px 0px 0px;
	}
#feature_sections .last{
	margin-right:0px!important;
	}
#feature_sections .block .title{
	font-size:18px;
	}
#feature_sections .block .description{
	padding:0px 15px 10px 15px;
	}
#feature_sections .block .block_link{
	display:block;
	width:270px;
	background-color:#575757;
	padding:5px 15px;
	color:#FFF;
	text-decoration:none;
	}
#feature_sections .block .block_link:hover{
	background-color:#000;
	}	

.clear{
	position:relative;
	clear:both;
	display:block;
	width:920px;
	height:10px;
	}
/********************************************************************************************** Global Content */
#content_wrap{
	display:block;
	width:920px;
	padding:0 20px 20px 20px;
	background-color:#FFFFFF;
	}
#content_portfolio_wrap{
	display:block;
	width:940px;
	padding:20px 0px 20px 20px;
	background-color:#FFFFFF;
	}

#widebox {margin-right:25px;}
#widebox h2{margin:0 0 20px 0;}
#widebox h3{font-size:18px;margin:0 0 20px 0;}
#widebox {margin-right:25px;}
/********************************************************************************************** Content */
#content{
	display: inline;
	float:left;
	width:610px;
	padding:0px;
	background-color:#FFFFFF;
	}

#content_portfolio{
	position:relative;
	display:block;
	width:940px;
	padding:0px;
	}
#content_portfolio .project-box{
	display: inline;
	width:289px;
	float:left;
	margin-right:24px;
	margin-bottom:10px;
	}
#content_portfolio .project-box a img{
	border:4px #CCC solid;
	margin-bottom:5px;
	}

	#content_portfolio .project-box a:hover img{
	border:4px #bababa solid;
	}
	
.tagline{
	display:block;
	width:920px;
	line-height:45px;
	padding:20px 0px 40px 0px;
	background: url('../images/tagbg.jpg') repeat-x;
	font-size:48px;
	color:#fff;
	margin-bottom:15px;
	}
.tagline table tr td{
	vertical-align:top;
	padding:10px 0px;
	}
#submenu{
	display:block;
	width:920px;
	background-color:#EEEEEE;
	color:#000;
	height:30px;
	border-bottom:1px #333 dotted;
	}
#submenu a.sub-title{
	background-color:#575757;
	color:#FFF;
	text-align:center;
	}
#submenu a{
	text-align:center;
	font-size:13px;
	float:left;
	display:block;
	height:25px;
	padding:5px 25px 0px 25px;
	text-decoration:none;
	}
#submenu a.on{
	text-align:center;
	font-size:13px;
	float:left;
	display:block;
	height:25px;
	padding:5px 25px 0px 25px;
	color:#000;
	}
.key{height:25px; padding:4px 25px 0px 25px; margin-left:100px;}
.keybox{float:right; margin-left:3px;}
#submenu img{margin:0 0 -5px 0;}

.post{	margin-bottom:25px;}
.post img{ border:4px #DFDFDF solid;}
.post .entry_link{
	text-align:center;
	display:block;
	width:100px;
	padding:1px 0px;
	margin-top:10px;
	}
.post .entry_link:hover{
	color:#FFF;
	}
.post .date{
	width: 50px;
	height: 50px;
	background-color:#333;
	float:left;
	margin-right: 15px;
	text-align:center;
	padding-top:3px;
	color:#FFF;
	}
.post .date span{
	font-size:20px;
	display:block;
	}
.post .title{
	width: 478px;
	float:left;
	vertical-align:text-top;
	}
small span {
	color:#000;}
.post .comments{
	width: 52px;
	height: 41px;
	background: url(../images/comment.jpg) no-repeat;
	float:right;
	margin-right: 15px;
	font-size:22px;
	color:#FFF;
	text-align:center;
	padding-top:3px;
	}
.post .comments:hover{
	background: url(../images/comment_hover.jpg) no-repeat;
	color:#FFF;
	}
.post-clear{ 
	clear:both;
	display:block;
	width:610px;
	height:1px;
}
.post .entry{
	display:block;
	padding:20px 0px 25px 0px;
	border-bottom: 1px dotted #333333;
	font-size: 13px;
	line-height:24px;
	}

	.post .entry_link{
	color:#FFF;
	}
	
/********************************************************************************************** Images */
.latest{	
	border:4px #CCC solid;
	margin-bottom:5px;
}

.fleft{ float:left;}
.fright{ float:right;}

.alignright{
	float:right;
	margin: 3px 0px 10px 10px;
	padding:4px;
	border:1px dotted #999;
	}

.alignright-nb{
	float:right;
	margin: 3px 0px 10px 10px;
	}
	
.alignleft{
	float:left;
	margin: 3px 10px 10px 0px;
	padding:4px;
	border:1px dotted #999;
	}

.alignleft-nb{
	float:left;
	margin: 3px 10px 10px 0px;
	}
	
.iconleft{
	float:left;
	margin: 3px 10px 10px 10px;
	}
	
.toppic{
	position:relative; margin:-20px 20px -40px 10px;
}

.image-left{
	float:left;
}

.image-right{
	float:left;
}

/********************************************************************************************** Contact Form */
span.red{
	color:#F00;}
.message{
	display:block;
	width:90%;
	padding:10px;
	margin:0px auto;
	background-color:#C5C5C5;
	border:1px #999 solid;
	text-align:center;
	font-size:16px;
	}	
#commentForm { 
	width: 563px; 
	}
#commentForm label.error { 
	width: 250px; text-align:left;  color: #F00; font-size:12px;
	}
#commentForm label.error{
	display:block;
	}

	#commentForm input.submit {
	display:block;
	background-color:#666666;
	color:#FFF;
	height:35px;
	padding:0px 10px 3px 10px;
	}
	
#commentForm input.submit:hover { 
 	background-color:#000000;
	}	
table.quote-form {
	margin:20px 0px;

	}
table.quote-form tr td{
	border:0px!important;
	}
table.quote-form tr td.field-name{
	width:150px;
	padding:12px;
	text-align:right;	

	}
table.quote-form input, table.quote-form select, table.quote-form textarea{
	width:330px;
	background-color:#E9E9E9;
	border:1px #C5C5C5 solid;
	padding:5px;
	}
table.quote-form select{
	width:342px;
	background-color:#E9E9E9;
	}
table.quote-form textarea{
	width:330px;
	height:200px;
	background-color:#E9E9E9;
	border:1px #C5C5C5 solid;
	padding:5px;
	}
table.quote-form .submit{
	width:79px;
	height:25px;
	display:block;
	border:0px;
	padding:0px;
	background:top left url('../images/submit.jpg') no-repeat;
	cursor:pointer;
	}
table.quote-form .submit:hover{
	background:top left url('../images/submit_on.jpg') no-repeat;
	
	}	
	

/********************************************************************************************** Sidebar*/
#sidebar{
	display: inline;
	float:right;
	width:270px;
	padding:0px;
	background-color:#FFFFFF;
	}
	
#worksheets {margin:0 0 20px 0; padding:0;
	}
#worksheets p{margin:10px 0 0 0; padding:0;
	}
	
#worksheets a{text-decoration:underline;
	}

#latest_projects{min-height:310px;}

#contact_info {margin:0 0 20px 0; padding:0;
	}

	
#contact_info table tr td{
	padding:2px 20px 0px 0px;
	vertical-align:top;
	}
.in-date{margin-top:-255px;}

.input-arrow {
	border:0 none;
	float:left;
	height:21px;
	position:relative;
	left:-3px;
	width:21px;
	text-indent:-9000px; /* this hides the default text that comes on a submit input */
	background:#8b8979 url(../images/input_arrow.gif) no-repeat 2px 2px;
	}

.input-arrow:hover { /* read more button hover styles */
	background:#a5a390 url(../images/input_arrow.gif) no-repeat 2px 2px;
}
	
.accordionButton {	
	width: 270px;
	float: left;
	border-bottom: 1px solid #FFFFFF;
	cursor: pointer;
	}
	
.accordionContent {	
	width: 270px;
	float: left;
	display: none;
	}

/********************************************************************************************** Footer */
#footer_wrap{
	display:block;
	width:960px;
	}
	
#top_footer{
	position:relative;
	display:block;
	width:940px;
	background-color:#575757;
	padding:0px 0px 0px 20px;
	color:#FFF;
	}
.links_block{
	display:block;
	width:215px;
	float:left;
	margin:20px 20px 20px 0;
	}
.twitter_block{
	display:block;
	width:290px;
	float:right;
	margin:20px 0 20px 20px;
	}
.links_block #twittme{
	position:absolute;
	display:block;
	width:200px;
	height:100px;
	right:20px;
	bottom:20px;
	cursor:pointer;
	background: bottom right url(../images/fox.png) no-repeat;
}
.links_block #twittme:hover{
	background: bottom right url(../images/fox.png) no-repeat;
}
#top_footer h4{
	color:#dadada;
	padding-bottom:0px;
	border-bottom:2px solid #fff;
	margin-bottom:10px;}
#top_footer a{
	color:#FFF;
	}	
#bottom_footer{
	position:relative;
	margin-top: 15px;
	display:block;
	width:890px;
	height:20px;
	background: url(../images/small_logo.jpg) no-repeat;
	padding:4px 0 0 70px;
	font-size:13px;
	color:#b3b3b3;
	}
#bottom_footer .footer_menu{
	position:absolute;
	right:0px;
	top:0px;
	}
#bottom_footer .footer_menu a{
	display:inline-block;
	float:right;
	color:#b3b3b3;
	padding:4px 0px 0px 20px ;
	}
#bottom_footer .footer_menu a:hover{
	color:#FFF;
	}

/********************************************************************************************** Panel */

.highlight {background-color:#FF9D9D;border-bottom:#F30 1px solid;border-top:#F30 1px solid;padding: 4px 10px}

/***** Main Layout ****/
#container {
  	width: 100%;
  	height: 100%;
  	text-align: center;/* IE fix to center the page */
}

#p_content {
  	width: 960px;
  	margin: 0 auto;/* center the page in Firefox */
  	text-align: left;
	padding: 20px;
}

/********************************************************************************************** Superfish */


/*** ESSENTIAL STYLES ***/
.sf-menu, .sf-menu * {
	margin:			0;
	padding:		0;
	list-style:		none;	z-index:		99;
}
.sf-menu {
	line-height:	1.0;	z-index:		99;
}
.sf-menu ul {
	position:		absolute;
	top:			-999em;
	width:			14em; /* left offset of submenus need to match (see below) */
}
.sf-menu ul li {
	width:			100%;
}
.sf-menu li:hover {
	visibility:		inherit; /* fixes IE7 'sticky bug' */
}
.sf-menu li {
	float:			left;
	position:		relative;
}
.sf-menu a {
	display:		block;
	position:		relative;
}
.sf-menu li:hover ul,
.sf-menu li.sfHover ul {
	left:			0;
	top:			2.2em; /* match top ul list item height */
	z-index:		99;
}
ul.sf-menu li:hover li ul,
ul.sf-menu li.sfHover li ul {
	top:			-999em;
}
ul.sf-menu li li:hover ul,
ul.sf-menu li li.sfHover ul {
	left:			14em; /* match ul width */
	top:			0;
}
ul.sf-menu li li:hover li ul,
ul.sf-menu li li.sfHover li ul {
	top:			-999em;
}
ul.sf-menu li li li:hover ul,
ul.sf-menu li li li.sfHover ul {
	left:			14em; /* match ul width */
	top:			0;
}

.last_item{
	border-bottom:1px solid #979797;
}

/*** DEMO SKIN ***/
.sf-menu {
	float:			left;
	margin-bottom:	1em;
	font-size:14px;
}

.sf-menu a {
	border-right:	1px solid #FFFFFF;
	padding: 		.55em 1.3em;
	text-decoration:none;
}

.sf-menu li li a {
	border-right:	1px solid #979797;
	border-left:	1px solid #979797;

}
.sf-menu a, .sf-menu a:visited  { /* visited pseudo selector so IE6 applies text colour*/
	color:			#FFF;
}
.sf-menu li {
	background:		#575757;

}
.sf-menu li li {
	background:		#575757;
	border-top:	1px solid #979797;
}
.sf-menu li li li {
	background:		#575757;
}
.sf-menu li:hover, .sf-menu li.sfHover,
.sf-menu a:focus, .sf-menu a:hover, .sf-menu a:active {
	background:		#000;
	outline:		0;
}

/*** arrows **/
.sf-menu a.sf-with-ul {
	padding-right: 	2.25em;
	min-width:		1px; /* trigger IE7 hasLayout so spans position accurately */
}
.sf-sub-indicator {
	position:		absolute;
	display:		block;
	right:			.75em;
	top:			0.9em; /* IE6 only 1.05*/
	width:			10px;
	height:			10px;
	text-indent: 	-999em;
	overflow:		hidden;
	background:		url('../images/arrows-ffffff.png') no-repeat -10px -100px; /* 8-bit indexed alpha png. IE6 gets solid image only */
}
a > .sf-sub-indicator {  /* give all except IE6 the correct values */
	top:			.8em;
	background-position: 0 -100px; /* use translucent arrow for modern browsers*/
}
/* apply hovers to modern browsers */
a:focus > .sf-sub-indicator,
a:hover > .sf-sub-indicator,
a:active > .sf-sub-indicator,
li:hover > a > .sf-sub-indicator,
li.sfHover > a > .sf-sub-indicator {
	background-position: -10px -100px; /* arrow hovers for modern browsers*/
}

/* point right for anchors in subs */
.sf-menu ul .sf-sub-indicator { background-position:  -10px 0; }
.sf-menu ul a > .sf-sub-indicator { background-position:  0 0; }
/* apply hovers to modern browsers */
.sf-menu ul a:focus > .sf-sub-indicator,
.sf-menu ul a:hover > .sf-sub-indicator,
.sf-menu ul a:active > .sf-sub-indicator,
.sf-menu ul li:hover > a > .sf-sub-indicator,
.sf-menu ul li.sfHover > a > .sf-sub-indicator {
	background-position: -10px 0; /* arrow hovers for modern browsers*/
}

/*** shadows for all but IE6 ***/
.sf-shadow ul {
	background:	url('../images/shadow.png') no-repeat bottom right;
	padding: 0 8px 9px 0;
/*	-moz-border-radius-bottomleft: 17px;
	-moz-border-radius-topright: 17px;
	-webkit-border-top-right-radius: 17px;
	-webkit-border-bottom-left-radius: 17px;
*/

}
.sf-shadow ul.sf-shadow-off {
	background: transparent;
}

/* INPUT FIELD CSS Copy this to your style sheet
------------------------------------------------------------- */
#contactform {
	width:270px;
	-moz-border-radius:5px;
	margin-left:auto;
	margin-right:auto;
}
#contactform form {
	font:normal 11px/18px Verdana,Tahoma;
	margin:0 0;
	padding:0;
	margin-top:20px;
	width:100%;
}
#contactform fieldset {
	padding:10px 0;
	margin:0 0 15px 0;
	background:#fff;
	border:1px solid #ddd;
	-moz-border-radius:5px
}


#contactform fieldset legend {
	font:normal bold 18px/26px "Trebuchet MS",Verdana,Tahoma;
	padding:3px 25px;
	margin-left:30px;
	text-transform:uppercase;
	border:0px solid #ddd;
}
#contactform fieldset legend span {
	font:normal 10px/18px Arial,Verdana,Tahoma;
	text-transform:uppercase;
	display:block;
}
#contactform form label {
	display:block;
	float:left;
	width:150px;
	padding:6px 10px 0 0;
	margin:0px;
	text-align:right;
}
#contactform input.inpt, #contactform textarea, #contactform select {
	width:260px;
	font:normal 11px/18px Verdana,Tahoma;
	padding:5px;
	margin:5px 0 5px 0;
	background:#f5f5f5;
	border:1px solid #ddd;
}

form br {
	clear:left;
}

#contactform input.required {
	background:#f5f5f5 url('../images/required.gif') center right no-repeat;
	
}

#contactform .select select:focus {
	border-color: #9b9b9b;
}
#contactform form input.btn
	{
		background:none;
		border:none;
	}

form.c1 input:hover,textarea:hover
	{
		border:1px solid #d8d8d8;
	}

/* Error / Success / Notice 
------------------------------------------------------------- */

.notes		{ background:#f0f0f0; border:1px solid #b8b8b8; }
.success	{ background:#ccfcd1; border:1px solid #60a400; }
.error		{ background:#f9e3e3; border:1px solid #e79e9e; }
.notice		{ background:#fcf0cc; border:1px solid #ecc735; }

.notes,.notice,.success,.error
			{
				padding:10px;
				font-size:12px;
				color:#000;
			}

.notes span,.notice span,.success span,.error span 
			{
				font-weight:bold;
				font-size:1.2em;
			}

.notes p,.success p,.error p,.notice p
			{
				margin:0px;
				padding:0px;
			}

#note {width:100%;margin:0 auto; }