body {background:#fff url(jocobackground.jpg) repeat-y scroll left
 top;}

div#wrapper {text-align:center;}

body {font: 13px arial;clear:both; overflow:auto;}
p {font: 13px  Arial; clear:both; text-align: justify; margin: 0px 0px 6px 5px; color: #555555; line-height:130%;}

h1{font: 36px Arial; font-weight:bold; letter-spacing: -1px; color: #333333; margin-top: 0px; margin-bottom: 33px;}
h2{font: 22px Arial; font-weight:bold; letter-spacing: -1px; color: #222222; margin: 3px 0px 5px 1px; clear:both;}
h3{font: 17px Arial; font-weight:normal; letter-spacing: 0px; color: #333333; margin-top: 0px; margin-bottom: 3px; margin-left: 1px;}

h4{font: 11px Arial; font-weight:bold; color:#000; margin: 0px 0px 0px 0px;}
h5{font: 11px Arial; font-weight:bold; color:#000; padding:0px; margin: 0px 5px 2px 5px;}
h6 {font: 11px arial;  text-align: justify; margin-top: 0px; margin-left: 0px;}


p.testimonialquote {font: 31px Arial; font-weight:bold; letter-spacing: -1px; color: #666666; margin-top: 0px; margin-bottom: 10px;}


a {text-decoration: none; color:#3A3A3A;}


/*Top Banners Section */

#scrolldown
      {
    background:url("portfoliotab2.png") no-repeat scroll 0 0 transparent;
height:300px;
right:0px;
position:fixed;
top:148px;
width:36px;
      }



div#topbanner {height:150px;
margin-top:50px;
text-align:left;}
img.topbanner {margin-left:3px; margin-top:10px;}

div#middlebanner {height:300px; width: 960px; text-align:center;}

div#pagetitle {margin-left:0px;; height: 60px; text-align:left; margin-bottom:22px;}



/* Side Navigation */ 


a.frontrollover {
	display: block;
	width: 314px;
	height: 22px;
	text-decoration: none;
	background: url("showrollover.jpg");
	float:right;
margin-right:5px;
clear:both;
	}

a.frontrollover:hover {
	background-position: 0px -22px;
	}

a.frontrollover:active {
	background-position: 0px -22px;
	}



a.aboutrollover {
	display: block;
	width: 200px;
	height: 28px;
	text-decoration: none;
	background: url("aboutbutton.jpg");
	float:right;
	margin-right:19px;
	margin-top:27px;
	}

a.aboutrollover:hover {
	background-position: 0px -28px;
	}

a.aboutrollover:active {
	background-position: 0px -28px;
	}


a.portfoliorollover {
	display: block;
	width: 200px;
	height: 28px;
	text-decoration: none;
	background: url("portfoliobutton.jpg");
	float:right;
	margin-right:19px;
	}

a.portfoliorollover:hover {
	background-position: 0px -28px;
	}

a.portfoliorollover:active {
	background-position: 0px -28px;
	}


a.newsrollover {
	display: block;
	width: 200px;
	height: 28px;
	text-decoration: none;
	background: url("newsbutton.jpg");
	float:right;
	margin-right:19px;
	}

a.newsrollover:hover {
	background-position: 0px -28px;
	}

a.newsrollover:active {
	background-position: 0px -28px;
	}


a.clientsrollover {
	display: block;
	width: 200px;
	height: 28px;
	text-decoration: none;
	background: url("clientsbutton.jpg");
	float:right;
	margin-right:19px;
	}

a.clientsrollover:hover {
	background-position: 0px -28px;
	}

a.clientsrollover:active {
	background-position: 0px -28px;
	}


a.testimonialsrollover {
	display: block;
	width: 200px;
	height: 28px;
	text-decoration: none;
	background: url("testimonialsbutton.jpg");
	float:right;
	margin-right:19px;
	}

a.testimonialsrollover:hover {
	background-position: 0px -28px;
	}

a.testimonialsrollover:active {
	background-position: 0px -28px;
	}

a.blogrollover {
	display: block;
	width: 200px;
	height: 28px;
	text-decoration: none;
	background: url("blogbutton.jpg");
	float:right;
	margin-right:19px;
	}

a.blogrollover:hover {
	background-position: 0px -28px;
	}

a.blogrollover:active {
	background-position: 0px -28px;
	}

a.contactrollover {
	display: block;
	width: 200px;
	height: 28px;
	text-decoration: none;
	background: url("contactbutton.jpg");
	float:right;
	margin-right:19px;
	margin-bottom:110px;}

a.contactrollover:hover {
	background-position: 0px -28px;
	}

a.contactrollover:active {
	background-position: 0px -28px;
	}


a.logosrollover {
	display: block;
	width: 150px;
	height: 21.5px;
	text-decoration: none;
	background: url("logosbutton.jpg");
	float:right;
	margin-right:26px;
	margin-top:10px;}

a.logosrollover:hover {
	background-position: 0px -21.5px;
	}

a.logosrollover:active {
	background-position: 0px -21.5px;
	}

a.corporateidrollover {
	display: block;
	width: 150px;
	height: 21.5px;
	text-decoration: none;
	background: url("corporateidbutton.jpg");
	float:right;
	margin-right:26px;}

a.corporateidrollover:hover {
	background-position: 0px -21.5px;
	}

a.corporateidrollover:active {
	background-position: 0px -21.5px;
	}

a.webdesignrollover {
	display: block;
	width: 150px;
	height: 21.5px;
	text-decoration: none;
	background: url("webdesignbutton.jpg");
	float:right;
	margin-right:26px;}

a.webdesignrollover:hover {
	background-position: 0px -21.5px;
	}

a.webdesignrollover:active {
	background-position: 0px -21.5px;
	}


a.postersrollover {
	display: block;
	width: 150px;
	height: 21.5px;
	text-decoration: none;
	background: url("postersbutton.jpg");
	float:right;
	margin-right:26px;}

a.postersrollover:hover {
	background-position: 0px -21.5px;
	}

a.postersrollover:active {
	background-position: 0px -21.5px;
	}

a.illustrationsrollover {
	display: block;
	width: 150px;
	height: 21.5px;
	text-decoration: none;
	background: url("illustrationsbutton.jpg");
	float:right;
	margin-right:26px;}

a.illustrationsrollover:hover {
	background-position: 0px -21.5px;
	}

a.illustrationsrollover:active {
	background-position: 0px -21.5px;
	}

a.scrapbookrollover {
	display: block;
	width: 150px;
	height: 21.5px;
	text-decoration: none;
	background: url("scrapbookbutton.jpg");
	float:right;
	margin-right:26px;margin-bottom:10px;}

a.scrapbookrollover:hover {
	background-position: 0px -21.5px;
	}

a.scrapbookrollover:active {
	background-position: 0px -21.5px;
	}



/* BLog Navigation */

a.aboutblogrollover {
	display: block;
	width: 69px;
	height: 28px;
	text-decoration: none;
	background: url("aboutblogbutton.jpg") no-repeat scroll 0 0 transparent;
	float:left;
margin-left:47px;
	margin-right:19px;
	margin-top:110px;
	}

a.aboutblogrollover:hover {
	background-position: 0px -28px;
	}

a.aboutblogrollover:active {
	background-position: 0px -28px;
	}


a.portfolioblogrollover {
	display: block;
	width: 95px;
	height: 28px;
	text-decoration: none;
	background: url("portfolioblogbutton.jpg") no-repeat scroll 0 0 transparent;
		float:left;
	margin-right:19px;
	margin-top:111px;
	}

a.portfolioblogrollover:hover {
	background-position: 0px -28px;
	}

a.portfolioblogrollover:active {
	background-position: 0px -28px;
	}


a.newsblogrollover {
	display: block;
	width: 60px;
	height: 28px;
	text-decoration: none;
	background: url("newsblogbutton.jpg") no-repeat scroll 0 0 transparent;
		float:left;
	margin-right:19px;
	margin-top:110px;	}

a.newsblogrollover:hover {
	background-position: 0px -28px;
	}

a.newsblogrollover:active {
	background-position: 0px -28px;
	}


a.clientsblogrollover {
	display: block;
	width: 74px;
	height: 28px;
	text-decoration: none;
	background: url("clientsblogbutton.jpg") no-repeat scroll 0 0 transparent;
		float:left;
	margin-right:19px;
	margin-top:110px;
	}

a.clientsblogrollover:hover {
	background-position: 0px -28px;
	}

a.clientsblogrollover:active {
	background-position: 0px -28px;
	}


a.testimonialsblogrollover {
	display: block;
	width: 138px;
	height: 28px;
	text-decoration: none;
	background: url("testimonialsblogbutton.jpg") no-repeat scroll 0 0 transparent;
		float:left;
	margin-right:19px;
	margin-top:110px;	}

a.testimonialsblogrollover:hover {
	background-position: 0px -28px;
	}

a.testimonialsblogrollover:active {
	background-position: 0px -28px;
	}

a.blogblogrollover {
	display: block;
	width: 51px;
	height: 28px;
	text-decoration: none;
	background: url("blogblogbutton.jpg") no-repeat scroll 0 0 transparent;
	float:left;
	margin-right:19px;
	margin-top:110px;
	}

a.blogblogrollover:hover {
	background-position: 0px -28px;
	}

a.blogblogrollover:active {
	background-position: 0px -28px;
	}

a.contactblogrollover {
	display: block;
	width: 86px;
	height: 28px;
	text-decoration: none;
	background: url("contactblogbutton.jpg") no-repeat scroll 0 0 transparent;
		float:left;
	margin-right:19px;
	margin-top:110px;}

a.contactblogrollover:hover {
	background-position: 0px -28px;
	}

a.contactblogrollover:active {
	background-position: 0px -28px;
	}



.displace {
	position: absolute;
	left: -5000px;
	}





/* Main Content */ 

div#maincontentleft {text-align:left; top:20px; margin: 130px 10px 50px 17px; }


div#navigation {text-align:left; top:20px; margin: 50px 10px 50px 38px; height:332px;}



div#maincontentright {float:right;
margin-bottom:20px;
margin-right:65px;
margin-top:0px;
text-align:left;
top:20px;}

ul#twitter_update_list { width: 200px; padding: 0; margin: 0; overflow: hidden; }
ul#twitter_update_list li { width: 195px; padding: 5px 0 5px 0; border-bottom: solid 1px #808080; list-style: none; }
 
div#newslettersub {margin-left: 10px; color: #999999;}


div#servicesleft{text-align:left; top:20px; margin: 0px 10px 50px 10px; height:332px; width:250px; position:relative; float:left;}



div#servicesright{text-align:left; top:20px; margin: 0px 10px 50px 10px; height:332px; width:250px; position:relative; float:left;}


p.testimonialfooter {font: 16px Arial; font-weight:normal; letter-spacing: 0px; color: #777777; margin-top: 0px; margin-bottom: 16px; margin-left:10px;}


/* Contact */ 

table.contact td {font-size: 12px; border: none;
vertical-align: top; padding: 7px; font-weight: bold; }

/* PDF links */

div#pdflink {height:80px; width:100px;
margin:20px;
position:relative;
text-align:center;
}

div#pdflink a{background:none;}

div#pdflink a:hover{background:none;}
div#pdflink a:hover:visited {background:none;}

img.pdflink {width:100px; text-align:center;}

p.pdflink {font: 15px arial; color: #FFFFFF; clear:both; text-align: center; margin: 0px 0px 10px 5px; font-weight:bold;}


/* Gallery */


img.gallerythumbnail {width:70px; margin: 0px 0px 20px 5px; float:left; border:1px solid  #ff6666; } 

img.gallerypicture {width:400px; text-align:center; margin: 0px 0px 20px 5px; } 



/* Admin */

div#adminnavigation
{border:1px solid #999999;
display:block;
padding:10px;
position:relative;
text-align:left;
top:20px;
margin-left:30px;} 


div#adminright
{text-align:left; top:20px; margin-right:10px; margin-bottom:300px; margin-left: 30px; margin-top:20px; } 

p.adminnav {font-size:11px;}

/*Footer */ 
div#footer {height:80px;
margin:140px 0 31px 74px;
position:relative;
text-align:center;
width:860px;}

div#footerleft {height:50px;
margin:0px;
position:relative;
text-align:left;
float:left; }



div#footerright {height:50px;
margin:0px;
position:relative;
text-align:right;
float:right;}
p.addthis {margin: 5px 0px 20px 5px}


img.socialiconfooter {height:42px; margin: 1px; float:right;}

div#topbannerbottom {margin: 50px 40px 0px 0px;}

p.footertext {font: 9px Helvetica, Arial; color: #555555; clear:both; text-align: right; margin: 0px 0px 10px 5px;}