body { 
  	background: url(images/bg.gif) repeat-x;
	font: 12px "Century Gothic", "Trebuchet MS", Arial, Helvetica, sans-serif;
	margin: 0;
}
div {	
}
a { 
	font: 12px "Century Gothic", "Trebuchet MS", Arial, Helvetica, sans-serif;
	color: #333;
}
/*--- Frame ----------------------------------*/
#frame {
	width: 960px;	
	margin: 0px;
}
/*--- Pre Banner Navigation ----------------------------------*/
#topleft {
	float: left;
	width: 520px;
	height: 65px;
	margin: 0px;
	background: url(images/top_left.gif) no-repeat;
}
/*--- Navigation ----------------------------------*/
#navigation {
	height: 65px;
	width: 440px;
	background: white;
	float: left;
	margin: 0px;
	display: block;
	overflow: hidden;
	background: url(images/top_right.gif) no-repeat;
}
#nav {
	margin:0;
	padding:0;
	float:left;
}
#nav li {
	display:inline;
	padding:0;
	margin:0;
}
#nav a {
	font: 12px "Century Gothic", "Trebuchet MS", Arial, Helvetica, sans-serif;
}
		
#home a {background:url(images/top_home.gif) no-repeat;}
#home a:link, #home a:visited {
	float:left;
	width:100px;
	height:65px;
	margin: 0px;
}
#home a:hover, #home a:active {
	background:url(images/top_home_active.gif) no-repeat;}		
#homenow a, #homenow a:link, #homenow a:visited,
#homenow a:hover, #homenow a:active {
	background:url(images/top_home_active.gif) no-repeat;
	float:left;
	width:100px;
	height:65px;
	margin: 0px;
}
#about a {background:url(images/top_about.gif) no-repeat;}
#about a:link, #about a:visited {
		float:left;
		width:100px;
		height:65px;
		margin: 0px;
		background:url(images/top_about.gif) no-repeat;}
#about a:hover, #about a:active {
	background:url(images/top_about_active.gif) no-repeat;	
}
.aboutnow {
	background:url(images/top_about_active.gif) no-repeat;	
}

#aboutnow a, #aboutnow a:link, #aboutnow a:visited,
#aboutnow a:hover, #aboutnow a:active {
	background:url(images/top_about_active.gif) no-repeat;
	float:left;
	width:100px;
	height:65px;
	margin: 0px;
}

#portfolio a {background:url(images/top_portfolio.gif) no-repeat;}
#portfolio a:link, 
#portfolio a:visited {
	float:left;
	width:100px;
	height:65px;
	margin: 0px;
	background:url(images/top_portfolio.gif) no-repeat;}
#portfolio a:hover,
#portfolio a:active {
	background:url(images/top_portfolio_active.gif) no-repeat;
}
#portfolionow a, #portfolionow a:link, #portfolionow a:visited,
#portfolionow a:hover, #portfolionow a:active {
	background:url(images/top_portfolio_active.gif) no-repeat;
	float:left;
	width:100px;
	height:65px;
	margin: 0px;
}
#blog a {background:url(images/top_blog.gif) no-repeat;}
#blog a:link, 
#blog a:visited {
	float:left;
	width:100px;
	height:65px;
	margin: 0px;
	background:url(images/top_blog.gif) no-repeat;}
#blog a:hover,
#blog a:active {
	background:url(images/top_blog_active.gif) no-repeat;
}
#blognow a, #blognow a:link, #blognow a:visited,
#blognow a:hover, #blognow a:active {
	background:url(images/top_blog_active.gif) no-repeat;
	float:left;
	width:100px;
	height:65px;
	margin: 0px;
}

/*---Banner ----------------------------------*/
#bannerleft {
		float: left;
		width: 520px;
		height: 305px;
		margin: 0px;
		border: none;
		display: block;
		background: url(images/banner_left.gif) no-repeat;
}
#bannerframe {
	margin-left: 90px;
	margin-top: 250px;
	float:left;
}
#bannerframe li {
	display:inline;
	padding:0;
	margin:0;
}

#contact a {
	float:left;
	width:140px;
	height:35px;
	display: block;
	background:url(images/contact.gif) no-repeat;
	border: 0px;
}
#contact a:hover {
	float:left;
	width:140px;
	height:35px;
	display: block;
	background:url(images/contact_active.gif) no-repeat;
	border: 0px;}	
	
#view a {
	float:left;
	width:140px;
	height:35px;
	display: block;
	margin-left: 40px;
	background:url(images/view.gif) no-repeat;
	border: 0px;
}
#view a:hover {
	float:left;
	width:140px;
	height:35px;
	display: block;
	margin-left: 40px;
	background:url(images/view_active.gif) no-repeat;
		border: 0px;}	

#bannerright {
		width: 440px;
		height: 305px;
		background: red;
		float: left;
		margin: 0px;
		background: url(images/banner_right.jpg) no-repeat;
		border: 0px;
}


/*--- Body ----------------------------------*/
#bodyframe	{
	background: url(images/mid_bg.gif) repeat-y;
	width: 960px;
	overflow: hidden;
}
#midframe	{
	background: inherit;
	width: 720px;
	margin-left: 120px;
	overflow: hidden;
}

#midnavigation {
	width: 720px;
	background: inherit;		
	margin: 0px;
	display: block;
	overflow: hidden;
}
#midnav {
	margin:0;
	padding:0;
	float:left;
}
#midnav li {
	display:inline;
	padding:0;
	margin:0;
}
#midnav a {
	font: 12px "Century Gothic", "Trebuchet MS", Arial, Helvetica, sans-serif;
	text-decoration: none;
	border: none;
}
#web a {background:url(images/mid_web.gif) no-repeat;}
#web a:link, #web a:visited {
	float:left;
	width:180px;
	height:70px;
	margin: 0px;
}
#web a:hover, #web a:active {
	background:url(images/mid_web_active.gif) no-repeat;}		
#webnow a, #webnow a:link, #webnow a:visited, 
#webnow a:hover, #webnow a:active {
	float:left;
	width:180px;
	height:70px;
	margin: 0px;
	background:url(images/mid_web_active.gif) no-repeat;	
}
#design a {background:url(images/mid_design.gif) no-repeat;}
#design a:link, #design a:visited {
	float:left;
	width:180px;
	height:70px;
	margin: 0px;
}
#design a:hover, #design a:active {
	background:url(images/mid_design_active.gif) no-repeat;}	
#designnow a, #designnow a:link, #designnow a:visited, 
#designnow a:hover, #designnow a:active {
	float:left;
	width:180px;
	height:70px;
	margin: 0px;
	background:url(images/mid_design_active.gif) no-repeat;	
}
#books a {background:url(images/mid_books.gif) no-repeat;}
#books a:link, #books a:visited {
	float:left;
	width:180px;
	height:70px;
	margin: 0px;
}
#books a:hover,#books a:active {
	background:url(images/mid_books_active.gif) no-repeat;}		
#booksnow a, #booksnow a:link, #booksnow a:visited, 
#booksnow a:hover, #booksnow a:active {
	float:left;
	width:180px;
	height:70px;
	margin: 0px;
	background:url(images/mid_books_active.gif) no-repeat;	
}
#port a {background:url(images/mid_port.gif) no-repeat;}
#port a:link, #port a:visited {
	float:left;
	width:180px;
	height:70px;
	margin: 0px;
}
#port a:hover, #port a:active {
	background:url(images/mid_port_active.gif) no-repeat;}		
#portnow a, #portnow a:link, #portnow a:visited, 
#portnow a:hover, #portnow a:active {
	float:left;
	width:180px;
	height:70px;
	margin: 0px;
	background:url(images/mid_port_active.gif) no-repeat;	
}
/*--- Content ----------------------------------*/
.content		{
		width: 720px;
		font: 12px "Century Gothic", "Trebuchet MS", Arial, Helvetica, sans-serif;
		color: #333;
		text-align: justify;
}
.content	h1	{
		font: 18px "Century Gothic", "Trebuchet MS", Arial, Helvetica, sans-serif;
		color: #000;
		margin: 0px;
}
.content	h2	{
		font: 14px "Century Gothic", "Trebuchet MS", Arial, Helvetica, sans-serif;
		color: #c60c0c;
		margin: 0px;
}
.content	h3	{
		font: bold 12px "Century Gothic", "Trebuchet MS", Arial, Helvetica, sans-serif;
		color: #006699;
		margin: 0px;
}
.content	h4	{
		font: italic bold 12px "Century Gothic", "Trebuchet MS", Arial, Helvetica, sans-serif;
		color: #333;
		margin: 0px;
}

.content a:link, a:visited, a:active, a:hover{
		font: 12px "Century Gothic", "Trebuchet MS", Arial, Helvetica, sans-serif;
		color: #333;
		border-bottom: 1px solid #333; 
		text-decoration:none;
}

.content a:visited{
		font: 12px "Century Gothic", "Trebuchet MS", Arial, Helvetica, sans-serif;
		color: #333;
		border-bottom: 1px solid #333; 
		text-decoration:none;
}
#container img {
		border: 0px;
		margin: 0px;
}

/*--- Footer ----------------------------------*/
                
#footer {
		width:960px;
		height:100%;
		margin: 0px;
		background: url(images/footer.gif) repeat-y;
}

#footercontainer {
		width:960px;
		margin-left: 0px;
		float:left;
		background: inherit;}

#footer a:link, a:visited, a:active, a:hover{
		font: 11px/14px "Century Gothic", "Trebuchet MS", Arial, Helvetica, sans-serif;
		color: #ccc; 
		text-decoration:none;
		border: none;
	border-bottom: 1px solid #999;
}
#footer h1 {
		font: 13px "Century Gothic", "Trebuchet MS", Arial, Helvetica, sans-serif;
		color: #fff;
}

.footerleft {
		width: 330px;
		float: left;
		font: 11px "Century Gothic", "Trebuchet MS", Arial, Helvetica, sans-serif;
		color: #ccc; 
		margin-left: 70px;
		padding: 5px 5px 5px 5px;
		text-align: left;
}
.footermid {
		width: 180px;
		float: left;
		font: 11px "Century Gothic", "Trebuchet MS", Arial, Helvetica, sans-serif;
		color: #ccc; 
		padding: 5px 5px 5px 5px;
		margin-left: 20px;
		text-align: left;
}
.footerright {
		width: 200px;
		float: right;
		font: 11px "Century Gothic", "Trebuchet MS", Arial, Helvetica, sans-serif;		
		color: #ccc; 
		text-align: left;
		margin-right: 70px;
		padding: 5px 5px 5px 5px;
}