body {
	margin: 3px auto 0 auto; 
	padding:0;
	font-family: Arial, Verdana, sans-serif; 
	font-size: small; 
	text-align:center;
	background: #ffffff url(bg.jpg) top left;
	
}

#container {
	margin: 0 auto 0 auto;
	padding:0;
	background: url(byborder.jpg) top left repeat-y;
	width: 773px;
}

#header {
	margin:0;
	padding:0;
	width: 773px;
	height: 173px;
	background: url(header.jpg) top left no-repeat;
}

p.sidecontact {
	margin: 5px 0 5px 0;
	padding: 0;
	font-weight: bold;
	font-size: 85%;
	
}

em {
	font-weight: normal;
}

p.sidecontact a {
	font-weight: bold;
	color: #003664;
	text-decoration: none;
}

p.sidecontact a:hover {
	text-decoration: underline;
}

/* navigation styles
--------------------------------------------------------------*/

#navigation {
	display: inline;
	width: 763px;
	margin: 0 0 0 5px;
	padding: 0;
	list-style: none;
	height: 26px;
	float: left;
}

#navigation li {
	margin: 0; 
	padding: 0;
        list-style: none;
	float: left;
}

#navigation a {
	float: left;
	padding: 26px 0 0 0;
	overflow: hidden;
	height: 0px !important; 
	height /**/:26px; /* for IE5/Win only */
}

#navigation a:hover {
	background-position: 0 -26px;
}

#navigation a:active {
	background-position: 0 -26px;
}

#navigation a.selected {
	background-position: 0 -26px;
}

#navabout a{
	width: 85px;
	background: url(navabout.jpg) top left no-repeat;
}

#navupgrading a{
	width: 134px;
	background: url(navupgrading.jpg) top left no-repeat;
}

#navportfolio a{
	width: 106px;
	background: url(navportfolio.jpg) top left no-repeat;
}

#navrenovation a{
	width: 182px;
	background: url(navrenovation.jpg) top left no-repeat;
}

#navtuning a{
	width: 156px;
	background: url(navtuning.jpg) top left no-repeat;
}

#navcontact a{
	width: 100px;
	background: url(navcontact.jpg) top left no-repeat;
}

/* #right and #left sections defined
--------------------------------------------------------------*/

#left {
	width: 254px;
	margin:5px 0 0 0;
	padding:0;
	float: left;
}

#right {
	width: 509px;
	margin:0 5px 0 0;
	padding:0;
	float: right;
	background: url(div.jpg) top left no-repeat;
	text-align: left;
}

/* news & announcement box 
--------------------------------------------------------------*/

#newsbox {
	padding:0;
	margin: 0 0 0 10px;
	width: 241px;
	background: url(newsbottom.jpg) bottom left no-repeat;
}

#newsbox ul{
	font-size: 85%;
	list-style: none;
	margin:0;
	padding:0 8px 0 7px;
	text-align: left;
}

#newsbox ul li{
	list-style: none;
	margin:0;
	padding:0px 0px 15px 0px;
}

#newsbox ul li h4{
	display: inline;
	font-size: 100%;
	margin:0;
	padding:0 13px 0 0;
	background: url(pages.gif) 100% 50% no-repeat;
	
}

#newsbox ul li h4 a{
	color: #222;
	text-decoration: none;
}

#newsbox ul li h4 a:hover{
	color: #003663;
	text-decoration: none;
}

#newsbox ul li a{
	text-decoration: none;
	color: #003663;
}

#newsbox ul li a:hover{
	color: red;
	text-decoration: underline;
}

#newsbox p.hclass {
	margin:0;
	padding:0;
	height: 9px;
	width: 241px;
	background: url(newstop.jpg) top left no-repeat;	
}

/* free quote box 
--------------------------------------------------------------*/

/* Hides from IE-mac \*/
* html #quotebox {height: 1%;}
/* End hide from IE-mac */

#quotebox:after {
    content: "."; 
    display: block; 
    height: 0; 
    clear: both; 
    visibility: hidden;
}


#quotebox {
	padding:0;
	margin: 5px 0 0 10px;
	width: 241px;
	background: url(quotebottom.jpg) bottom left no-repeat;
}


#quotebox p.hclass {
	margin: 0;
	padding:0;
	height: 9px;
	width: 241px;
	background: url(quotetop.jpg) top left no-repeat;
}

#quotebox p.quotebody{
	text-align: left;
	margin:0;
	padding:0 10px 10px 0;
	color: #000;
	font-size: 85%;
	width: 145px;
	float: right;
}





#quotebox a.click{
	font-size: 100%;
	color: #000;
	font-weight: bold;
	
}

#quotebox a.click:hover{
	color: red;
	text-decoration: underline;
}

#quotebox p strong{
	color: #003663;	
	font-size: 110%;
}

#quotebox img {
	margin: 0 0 0 5px;
	padding: 0 0px 10px 0;
	width: 76px;
	height: 69px;
	float: left;
}

/* listen to music box 
--------------------------------------------------------------*/

/* Hides from IE-mac \*/
* html #listenbox {height: 1%;}
/* End hide from IE-mac */

#listenbox:after {
    content: "."; 
    display: block; 
    height: 0; 
    clear: both; 
    visibility: hidden;
}


#listenbox {
	padding:0;
	margin: 5px 0 0 10px;
	width: 241px;
	background: url(listenbottom.jpg) bottom left no-repeat;
}


#listenbox p.hclass {
	margin: 0;
	padding:0;
	height: 9px;
	width: 241px;
	background: url(listentop.jpg) top left no-repeat;
}

#listenbox p.listenbody{
	text-align: left;
	margin:0;
	padding:0 10px 10px 0;
	color: #000;
	font-size: 85%;
	width: 145px;
	float: right;
}


#listenbox a.click{
	color: #000;
	font-weight: bold;
	
}

#listenbox a.click:hover{
	color: red;
	text-decoration: underline;
}

#listenbox p strong{
	
	color: #003663;	
	font-size: 110%;
}

#listenbox img {
	margin: 0 0 0 5px;
	padding: 0 0px 10px 0;
	width: 76px;
	height: 44px;
	float: left;
}


/* about us box / president
--------------------------------------------------------------*/

/* Hides from IE-mac \*/
* html #presidentbox {height: 1%;}
/* End hide from IE-mac */

#presidentbox:after {
    content: "."; 
    display: block; 
    height: 0; 
    clear: both; 
    visibility: hidden;
}


#presidentbox {
	padding:0;
	margin: 5px 0 0 10px;
	width: 241px;
	background: url(presidentbottom.jpg) bottom left no-repeat;
}


#presidentbox p.hclass {
	margin: 0;
	padding:0;
	height: 9px;
	width: 241px;
	background: url(presidenttop.jpg) top left no-repeat;
}

#presidentbox p.presidentbody{
	text-align: left;
	margin:0;
	padding:0 10px 10px 0;
	color: #000;
	font-size: 85%;
	width: 145px;
	float: right;
}


#presidentbox a.click{
	color: #000;
	font-weight: bold;
	
}

#presidentbox a.click:hover{
	color: red;
	text-decoration: underline;
}

#presidentbox p strong{
	
	color: #003663;	
	font-size: 110%;
}

#presidentbox img {
	margin: 0 0 0 5px;
	padding: 0 0px 10px 0;
	width: 76px;
	height: 69px;
	float: left;
}


#inspirationbox {
	padding:0;
	margin: 5px 0 0 10px;
	width: 241px;
}

#inspirationbox img {
	border: 0;
}

#right p.portfoliointro {
	padding:3px 0 0 0;
	margin:5px 0 0 13px;
	font-size: 110%;
}

#right p.pagecontent {
	font-size: 110%;
	padding:3px 0 0 0;
	margin:5px 15px 20px 13px;
}

#right p.pagecontent strong {
	color: #111;
	
}

#right p.pagecontent span.quote {
	font-family: "Times New Roman";
	font-style: italic;
	font-size: 130%;
	color: 000;
}



#right p.pagecontentsmall {
	padding:3px 0 0 0;
	margin:5px 0 20px 13px;
	font-size: 100%;
	font-weight: bold;
	color: #000;
}

#right p.inspirationcontent {
	font-size: 120%;
	padding:3px 0 0 0;
	margin:5px 15px 20px 13px;
	font-style: italic;
}

#right p.inspirationcontent strong {
	font-size: 90%;
	color: #111;

}

#right p.project{
	padding:3px 0 0 0;
	margin:0 0 0 13px;
	font-size: 110%;
}



#right p.project strong {
	color: #003663;	
	font-family: 'Times New Roman', Arial, sans-serif;
	font-size: 125%;
	font-weight: bold;
}

#right .smallblue {
	color: #003663;	
	font-weight: bold;
	font-size: 100%;
	font-style: italic;
}

#right p.project em {
	font-weight: bold;
	font-size: 85%;
	font-style: normal;
	
}

#right p.project img {
	margin: 3px 0 0 0;
}

#leftlist {
	display: inline;
	float: left;
	width: 44%;
	padding:0;
	margin:0px 0 0 13px;
}


#rightlist {
	display: inline;
	float: right;
	width: 44%;
	padding:0;
	margin:0px 0 0 13px;
}

#right ul {
	list-style: none;
	padding: 0;
	margin: 20px 0 0 0;
}

#right ul li{
	list-style: none;
	padding:0;
	margin: 0;
}

#right ul h4 {
	padding:0 0 5px 0;
	margin:0;
	font-size: 110%;
	color: #333;
	text-decoration: underline;
}

#right table.playlist {
	margin: 0;
	padding: 0px 0 0 8px;
	width: 100%;
	color: #222;
	font-weight: bold;
}

#right table.playlist span {
	font-weight: normal;
	color: #000;
	font-style: italic;
	line-height: 1.5em;
}


#right table.playlist td {
	margin: 0;
	padding: 5px 0 0 7px;
}

#right table.playlist td.play {
	padding: 0;
	margin: 0;
	width: 31px;
}

#right table.playlist img {
	border: 0;
	width: 31px;
	height: 39px;
}


ul#portfoliolist {
	padding:0;
	margin-left: 13px;
}


ul#portfoliolist a{
	color: #003663;
	font-weight: bold;
	padding: 0 0 0 20px;
	background: url(folder.gif) 0 50% no-repeat;
	text-decoration: none;
}

ul#portfoliolist a:hover{
	background: url(folder_open.gif) 0 50% no-repeat;
	text-decoration: underline;
}

ul#portfoliolist span{
	color: #003663;
	font-weight: bold;
	padding: 0 0 0 20px;
	background: url(foldergrey.gif) 0 50% no-repeat;
	text-decoration: none;
}



#thumbdesc {
	margin:7px 0 0 13px;
	padding:0;
	width: 460px;
}

#thumbs {
	width: 128px;
	float: left;
}

#thumbs img{
	border: 0;
	padding: 3px;
	background-color: #e1e1e1;

}

#thumbs a:hover img{
	background-color: #f9e9b9;

}

#photobox {
	margin: 0 0 0 25px;
	text-align: left;
}

#photobox img{
	margin: 0 7px 0 0;
	border: 0;
	padding: 3px;
	background-color: #e1e1e1;
}

#photobox a:hover img{
	background-color: #f9e9b9;
}

#desc {
	width: 332px;
	float: right;
}

#desc h3{
	margin:0 0 3px 0;
	padding:0 0 0 10px;
	font-size: 85%;
	color: #003663;
	font-weight: normal;
	
}

#desc h3 span a{
	color: #003663;
	padding: 0 0 0 20px;
	background: url(folder.gif) 0 50% no-repeat;
	text-decoration: none;
}

#desc h3 span a:hover{
	background: url(folder_open.gif) 0 50% no-repeat;
	text-decoration: none;
}

#desc h2{
	margin:10px 0 0 10px;
	padding:0 0 3px 0px;
	font-size: 85%;
	color: #000;
	font-weight: bold;
	border: none;
	border-bottom: 1px dotted #ccc;
}

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

/* form styles 
--------------------------------------------------------------*/

#footer {
	clear: both;
	width: 773px;
	height: 120px;
	margin:0 0 0 0;
	padding:0;
	background: url(footer.jpg) top left no-repeat;
}

#footer p {
	margin: 0 0 0 0;
	padding: 100px 0 0 0;
	font-size: 85%;
	color: #fff;
	font-weight: normal;
}

#footer span {
	font-weight: bold;
	padding-right: 20px;
}

#footer p a {
	color: #f9e9b9;
}


/* footer styles
--------------------------------------------------------------*/   



form {
	background: #ccc url(contacthead.jpg) top left no-repeat;
	width: 470px;
	margin: 0 0 0 15px;
	padding-top: 10px;

}

.namemailfield {
	width: 160px;
}

dt {
	margin-left: 25px;
	font-size: 85%;
	font-weight: bold;
}

dd {
	margin: 0 0 9px 25px;
}

.formclass {
	font-size: 90%;
	font-weight: bold;
	text-align: center;
	font-style: italic;
	padding: 5px 0 5px 0px;
	margin: 0;
	background: #ccc url(contactfoot.jpg) bottom left no-repeat;
}


blockquote {
	width: 473px;
	margin: 10px;
	background: #b6c6d3 url(quotetop_bg.jpg) top left no-repeat;
	padding: 0;
	padding-top: 10px;	
	font-style: italic;
	font-family: "Times New Roman";
	font-size: 140%;
	color: 000;
}

blockquote strong {
	display: block;
	text-align: right;
	font-style: normal;
	font-size: 90%;
	padding: 5px 25px 0 0;
}

blockquote div {
	background: #b6c6d3 url(quotebottom_bg.jpg) bottom left no-repeat;
	padding: 0 5px 10px 5px;
}

#blockquote div p {
	padding: 0;
	margin: 0;
}
