/* 	SCREEN CSS   */
/*  http://joyfullcreations.com */
/*  v4.0 | 20081110 */

/*	-------------------------------------------------------------
	Global Reset
	- - - - - - - - - - - - - - - - - - - - - - - - - - - - - - -	*/

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, b, u, i, center, 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-size: 100%;
	vertical-align: baseline;
	background: transparent;
}

body {
	line-height: 1;
}

ol, ul {
	list-style: none;
}

blockquote, q {
	quotes: none;
}

blockquote:before, blockquote:after, q:before, q:after {
	content: '';
	content: none;
}


table {
	border-collapse: collapse;
	border-spacing: 0;
	/* tables still need 'cellspacing="0"' in the markup */
}

a img, img {
	border: 0px;
}


/*	-------------------------------------------------------------
	Position
	- - - - - - - - - - - - - - - - - - - - - - - - - - - - - - -	*/
	
body {
	text-align: center;
	color: #333;
	background: #FFF;
	font: 0.8125em "Lucida Grande", Lucida, Verdana, sans-serif;
}

#wrapper {
	position: relative;
	width: 850px;
	height:100%;
	margin-right: auto;
	margin-left: auto;
	text-align: left;
	background-color: white;
}


/*	-------------------------------------------------------------
	Global Styles
	- - - - - - - - - - - - - - - - - - - - - - - - - - - - - - -	*/
	
p {
	margin-bottom:15px;
	line-height:1.3;
}
	
h2 {
	margin-bottom:10px;
	font-size: 1.1em;
}

h3 {
	margin-bottom:10px;
	font: 1.4em Georgia, "Times New Roman", Times, serif;
	}

.h3small {
	font-size:.6em;
}

a, a:visited {
	color:#3C6E5F;
	text-decoration:underline;
 }

a:hover{
	color:#529A85;
}
  
.error {
	color:#FF3300;
}

.clear {
	clear:both;
}


/*	-------------------------------------------------------------
	Header
	- - - - - - - - - - - - - - - - - - - - - - - - - - - - - - -	*/
	
#header {
	position: relative;
	height:100px;
	width:850px;
	text-align: left;
}

#logo {
	position: absolute;
	height:34px;
	width:242px;
	left:0px;
	bottom: 5px;
	background: url(../images/jc_logo.jpg) no-repeat;
}

#tagline {
	position: absolute;
	right:5px;
	bottom: 12px;
	color: #498674;
}

.hide{
	display: none;
}


/*	-------------------------------------------------------------
	Splash Graphic
	- - - - - - - - - - - - - - - - - - - - - - - - - - - - - - -	*/

#stripe {
	position: absolute;
	width: 100%;
	background: #F14B1B	url(../images/bgstripe.jpg) repeat-x;
	top:100px;
	height:260px;
	z-index:-1;
}

#splash {
	position:relative;
	height:260px;
	text-align:center;
	z-index:0;
}

body.index #splash {
	background: white url(../images/splash_main.jpg) no-repeat;
}

body.about #splash {
	background: white url(../images/splash_about.jpg) no-repeat;
}

body.services #splash {
	background: white url(../images/splash_services.jpg) no-repeat;
}

body.clients #splash {
	background: white url(../images/splash_clients.jpg) no-repeat;
}

body.portfolio #splash {
	background: white url(../images/splash_portfolio.jpg) no-repeat;
}

body.contact #splash {
	background: white url(../images/splash_contact.jpg) no-repeat;
}

body.christmas #splash {
	background: white url(../images/splash_christmas.jpg) no-repeat;
}

body.blog #splash {
	background: white url(../images/splash_contact.jpg) no-repeat;
}


/*	-------------------------------------------------------------
	Navigation
	- - - - - - - - - - - - - - - - - - - - - - - - - - - - - - -	*/

#wrapper_nav {
	position:relative;
	height:40px;
	width: 848px;
	border-right:solid 1px #2C2C2A;
	border-left:solid 1px #2C2C2A;
	overflow:hidden;
}

.nav {
    width: 850px;
    height: 40px;
    background: url(../images/nav.png) no-repeat;
    position: absolute;
    top: 0;
    left: 0;
}

.nav li {
	display: inline;
}

.nav li a:link, .nav li a:visited {
	position: absolute;
	top: 0;
	height: 40px;
	text-indent: -9000px;
	overflow: hidden;
	z-index: 10;
}

.nav .home a:link, .nav .home a:visited {
	left: 161px;
	width: 89px;
}

.nav .home a:hover, .nav .home a:focus {
	background: url(../images/nav.png) no-repeat -161px -43px;
}

.nav .home a:active {
	background: url(../images/nav.png) no-repeat -161px -86px;
}

.current-home .home a:link, .current-home .home a:visited {
	background: url(../images/nav.png) no-repeat -161px -129px;
	cursor: default;
}

.nav-home, .nav-home-click {
	position: absolute;
	top: 0;
	left: 161px;
	width: 89px;
	height: 40px;
	background: url(../images/nav.png) no-repeat -161px -43px;
}

.nav-home-click {
	background: url(../images/nav.png) no-repeat -161px -86px;
}

.nav .portfolio a:link, .nav .portfolio a:visited {
	left: 251px;
	width: 117px;
}

.nav .portfolio a:hover, .nav .portfolio a:focus {
	background: url(../images/nav.png) no-repeat -251px -43px;
}

.nav .portfolio a:active {
	background: url(../images/nav.png) no-repeat -251px -86px;
}

.current-portfolio .portfolio a:link, .current-portfolio .portfolio a:visited {
	background: url(../images/nav.png) no-repeat -251px -129px;
	cursor: default;
}

.nav-portfolio, .nav-portfolio-click {
	position: absolute;
	top: 0;
	left: 251px;
	width: 117px;
	height: 40px;
	background: url(../images/nav.png) no-repeat -251px -43px;
}

.nav-portfolio-click {
	background: url(../images/nav.png) no-repeat -252px -86px;
}

.nav .services a:link, .nav .services a:visited {
	left: 369px;
	width: 109px;
}

.nav .services a:hover, .nav .services a:focus {
	background: url(../images/nav.png) no-repeat -369px -43px;
}

.nav .services a:active {
	background: url(../images/nav.png) no-repeat -369px -86px;
} 

.current-services .services a:link, .current-services .services a:visited {
	background: url(../images/nav.png) no-repeat -369px -129px;
	cursor: default;
}

.nav-services, .nav-services-click {
	position: absolute;
	top: 0;
	left: 369px;
	width: 109px;
	height: 40px;
	background: url(../images/nav.png) no-repeat -369px -43px;
}

.nav-services-click {
	background: url(../images/nav.png) no-repeat -369px -86px;
}

.nav .clients a:link, .nav .clients a:visited {
	left: 479px;
	width: 95px;
}

.nav .clients a:hover, .nav .clients a:focus {
	background: url(../images/nav.png) no-repeat -479px -43px;
}

.nav .clients a:active {
	background: url(../images/nav.png) no-repeat -479px -86px;
}

.current-clients .clients a:link, .current-clients .clients a:visited {
	background: url(../images/nav.png) no-repeat -479px -129px;
	cursor: default;
}

.nav-clients, .nav-clients-click {
	position: absolute;
	top: 0;
	left: 479px;
	width: 95px;
	height: 40px;
	background: url(../images/nav.png) no-repeat -479px -43px;
}

.nav-clients-click {
	background: url(../images/nav.png) no-repeat -479px -86px;
}

.nav .about a:link, .nav .about a:visited {
	left: 575px;
	width: 90px;
}

.nav .about a:hover, .nav .about a:focus {
	background: url(../images/nav.png) no-repeat -575px -43px;
}

.nav .about a:active {
	background: url(../images/nav.png) no-repeat -575px -86px;
}

.current-about .about a:link, .current-about .about a:visited {
	background: url(../images/nav.png) no-repeat -575px -129px;
	cursor: default;
}

.nav-about, .nav-about-click {
	position: absolute;
	top: 0;
	left: 575px;
	width: 90px;
	height: 40px;
	background: url(../images/nav.png) no-repeat -575px -43px;
}

.nav-about-click {
	background: url(../images/nav.png) no-repeat -576px -86px;
}

.nav .blog a:link, .nav .blog a:visited {
	left: 665px;
	width: 77px;
}

.nav .blog a:hover, .nav .blog a:focus {
	background: url(../images/nav.png) no-repeat -665px -43px;
}

.nav .blog a:active {
	background: url(../images/nav.png) no-repeat -665px -86px;
}

.current-blog .blog a:link, .current-blog .blog a:visited {
	background: url(../images/nav.png) no-repeat -665px -129px;
	cursor: default;
}

.nav-blog, .nav-blog-click {
	position: absolute;
	top: 0;
	left: 665px;
	width: 77px;
	height: 40px;
	background: url(../images/nav.png) no-repeat -665px -43px;
}

.nav-blog-click {
	background: url(../images/nav.png) no-repeat -665px -86px;
}

.nav .contact a:link, .nav .contact a:visited {
	left: 743px;
	width: 105px;
}

.nav .contact a:hover, .nav .contact a:focus {
	background: url(../images/nav.png) no-repeat -743px -43px;
}

.nav .contact a:active {
	background: url(../images/nav.png) no-repeat -743px -86px;
}

.current-contact .contact a:link, .current-contact .contact a:visited {
	background: url(../images/nav.png) no-repeat -743px -129px;
	cursor: default;
}

.nav-contact, .nav-contact-click {
	position: absolute;
	top: 0;
	left: 743px;
	width: 105px;
	height: 40px;
	background: url(../images/nav.png) no-repeat -743px -43px;
}

.nav-contact-click {
	background: url(../images/nav.png) no-repeat -744px -86px;
}


/*	-------------------------------------------------------------
	Content
	- - - - - - - - - - - - - - - - - - - - - - - - - - - - - - -	*/

#wrap_content {
	width: 848px;
	border-right:solid 1px #2C2C2A;
	border-left:solid 1px #2C2C2A;
	background: url(../images/bkgd_sidebar.jpg) repeat-y right;
	text-align: left;
}

#wrap_clients {
	width: 848px;
	border-right:solid 1px #2C2C2A;
	border-left:solid 1px #2C2C2A;
	text-align: left;
}

#content_clients {
	margin:0;
	padding:15px;
}

#content {
	float:left;
	text-align:left;
	width:600px;
	margin:0;
	padding:15px 15px 45px 15px;	
}

#content h4 {
	margin-top: 10px;
	margin-bottom: 10px;
}

#content li {
	margin-bottom: 2px;
}

#content ul {
	list-style-type: none;
	padding-left: 0;
	float: left;
	width: 260px;
	margin: 10px 10px 0 0;
}

#content ul li {
	font-weight: bold;
	color: #0d1e38;
}

#content ul ul {
	margin-top: 0;
	float: none;
}

#content ul ul li {
	font-weight: normal;
	font-style: normal;
	color: #363636;
	font-size: .9em;
}

#content_main {
	text-align:left;
	margin:0 200px 0 230px;
	*margin:0 200px 0 220px;
	padding: 30px 0 0 0;
}


#content_main p {
	margin:0;
	padding: 10px 0 0 0;
}

#servicebutton01 {
	float:left;
	margin: 0 10px 0 0;
}

#servicebutton02 {
	float:left;
	margin: 0 10px 0 0;
}

#servicebutton03 {
	float:left;
	margin:0;
}

#sidebar_left {
	float:left;
	text-align:left;
	width:180px;
	margin:20px 30px 0 0;
	padding:0 25px 0 20px;
	border-right:dashed 1px #666;
}

#sidebar_right {
	float:right;
	text-align:left;
	width:160px;
	margin:20px 5px 0 0;
	padding:0 5px;
	font-size: 1em;
}

#sidebar_right h2 {
	padding: 0 0 5px 0;
	margin: 0;
	color: #0d1e38;
	border-bottom:solid 2px #fff;
}

#sidebar_right p {
	padding: 10px;
	line-height:1.125em;
}

#sidebar_right ul {
	padding: 0 0 0 15px;
}

.clearFloat {
	clear:both;	
}

.samples img:hover{
	border:solid;
	border-width:1px;
}

.sample {
	border:solid;
	border-width:1px;
	margin:15px;
	padding:5px;
}

.table_head1 {
	width:175px;
	background:#333333;
	color:#FFFFFF;
	font-weight:bold;
	float:left;
	padding: 5px;
	font-weight:bold;
}

.table_head2 {
	width:225px;
	background:#333333;
	color:#FFFFFF;
	font-weight:bold;
	float:left;
	padding: 5px;
}

.table_head3 {
	width:150px;
	background:#333333;
	color:#FFFFFF;
	font-weight:bold;
	float:left;
	padding: 5px;
	border-right: 2px solid #333;
}

.table_cell1 {
	width:175px;
	float:left;
	padding: 5px;
	border-top: 1px solid #999;
}

.table_cell2 {
	width:225px;
	float:left;
	padding: 5px;
	border-top: 1px solid #999;
	border-left: 1px solid #999;
	border-right: 1px solid #999;
}

.table_cell3 {
	width:150px;
	float:left;
	padding: 5px;
	border-top: 1px solid #999;
}

.table_cell4 {
	width:175px;
	float:left;
	padding: 5px;
	border-top: 1px solid #999;
}

.table_cell5 {
	width:225px;
	float:left;
	padding: 5px;
	border-top: 1px solid #999;
	border-left: 1px solid #999;
	border-right: 1px solid #999;
}

.table_cell6 {
	width:150px;
	float:left;
	padding: 2px;
	border-top: 1px solid #999;
}

.content_fee ul li {
	width: 600px;
	list-style-type: disc;
	margin: 0 0 0 20px;
	font-weight: normal;
}

.resumecontent {
	text-align:left;
	margin:0;
	width:620px;
	padding:15px 0 45px 25px;
	line-height:1.1em;
}

.resumecontent ul {
	margin:0 0 0 20px;
	padding:0;
	list-style:disc;
}

.resumecontent p {
	margin:0 0 15px 0;
	padding:0;	
}

#resumecontent h5 {
	font-size:1.25em;
}

.portfolio_box_rb {
	float:left;
	width:150px;
	border-right:1px dashed #999;
	margin:0;
	padding:0 20px;
	}
	
.portfolio_box_nb {
	float:left;
	width:150px;
	margin:0;
	padding:0 20px;
	}	

#wrap_portfolio {
	width: 848px;
	border-right:solid;
	border-right-width:1px;
	border-left:solid;
	border-left-width:1px;
	text-align: left;
	position:relative;
}

#content_portfolio {
	margin:0;
	padding:16px;
}

#content_portfolio ul {
	float:left;
	display: block;
	clear: both;
	margin: 0 0 0 -5px;
	width:100%;
}

#content_portfolio ul li{
	float:left;
	margin:7px;
	padding:8px;
	border:solid 1px #ccc;
}

#content_portfolio ul li:hover {
	border: solid 1px #FF6600;
}

#portfolio_img {
	float:left;
	margin:0;
	padding:20px;
	border:solid 1px #ccc;
	width:400px;	
}

#portfolio_copy {
	margin:0 0 0 35px;
	float:left;
	width:320px;
}

.portfolio_details_cell01 {
	float: left;
	padding:0;
	font-size:.7em;
	width:90px;
}

.portfolio_details_cell02 {
	font-size:.7em;
	float:left
}

#portfolio_crumbs {
	font-size:.7em;
	position:absolute;
	top:24px;
	right:28px;
}



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

#footer {
	clear:both;
	color:#fff;
	padding:10px;
	margin:0;
	height:10px;
	text-align:left;
	border-bottom:solid 1px #2C2C2A;
	background-color:#498674;
	font-size:9px;
}

#footer a, #footer a:hover{
	color:#fff;
}

#footer_left {
	float:left;
	margin:0;
	padding:0 0 10px 0;
}

#footer_right {
	float:right;
	margin:0;
	padding:0 0 10px 0;
}

#content_inside1 {
	font-size:12px;
	line-height:18px;
	border-right:1px solid #D6D6D6;
	border-left:1px solid #D6D6D6;
	border-bottom:1px solid #D6D6D6;
	margin: 0 auto 15px auto;
	padding:15px;
	text-align:left;
	position:relative;
}

/*- Tabed Navigation--------------------------- */ 

#tabnav
	{
		height: 20px;
		margin: 0;
		padding-left: 10px;
		background: url(../images/tab_bottom.gif) repeat-x bottom;
	}

#tabnav li
	{
		margin: 0; 
		padding: 0;
  		display: inline;
  		list-style-type: none;
  	}
	
#tabnav a:link, #tabnav a:visited
	{
		float: left;
		background: #f3f3f3;
		font-size: 10px;
		line-height: 14px;
		font-weight: bold;
		padding: 2px 10px 2px 10px;
		margin-right: 4px;
		border: 1px solid #ccc;
		text-decoration: none;
		color: #666;
	}

#tabnav a:link.active, #tabnav a:visited.active
	{
		border-bottom: 1px solid #fff;
		background: #fff;
		color: #000;
	}

#tabnav a:hover
	{
		background: #FFCC99;
		color:#000;
	}
	
#profile_warning{
	color:#FF3300;
	background-color:#FFCC99;
	margin:15px 0px;
	padding:15px;
	border:#FF3300 solid 1px;
}

#profile_warning a{
	color:#FF6600;
}

#profile_warning a:hover{
	color:#FF3300;
}

#profile_success{
	background-color:#99FF99;
	margin:15px 0px;
	padding:15px;
	border:#00CC00 solid 1px;
}

#profile_warning ul{
	padding:0px;
}

#profile_warning ul li{
	color:#000;
}

.small {
	font-size:10px;
}

.profile_error {
color:#FF0000;
font-size:10px;
}

.profile_error2 {
color:#FF0000;
}

#content_profile {
	font-size:12px;
	line-height:18px;
	border:1px solid #776655;
	margin:0px;
	padding:15px;
	text-align:left;
	position:relative;
}

.testimony {
	font-style:italic;
	font-size:.8em;	
}

.testimony_name{
	text-align:right;
	font-size:.6em;
}

.testimony_company{
	text-align:right;
	font-size:.6em;
}