/*-------------------------------------*/
/*  Main CSS Document - BannerDesignz
/*  Coded by Aziz Natour (azizgfx@gmail.com)
/*  © 2010. All rights reserved.
/*-------------------------------------*/
/* Global Properties ------------------*/

@import url("hax.css");

html, body {
	padding:0; 
	margin:0;
	height:100%;
}

	html {
		background:#224ba8 url('../images/ui/bg_grad.png') repeat-x;
	}

	body {
		background:transparent url('../images/ui/bg_main.jpg') no-repeat top center;
		text-align:center;
		color:#888;
		font-family: "Trebuchet MS", Arial, Helvetica, sans-serif;
		font-size:12px;
	}
	
		.clear {clear:both}
		
		.clearfix {clear:both; height:1px;}	
	
		a {text-decoration:none;}
		
			a:focus {outline:none;}
			
			a img {border:none;}
		
/*-------------------------------------*/
/* Main Elements ----------------------*/

#wrapper {
	width:968px;
	margin:0 auto;
	text-align:left;
}

/*-------------------------------------*/
/* Header -----------------------------*/

/* logo --------------------------*/

	#header #logo{
		padding-top:20px;
		position:relative;
		top:25px;
		left:30px;
	}
	
		#logo h1 {
			margin:0;
			padding:0;
		}
		
	/* navbar ------------------------*/	

	#navbar {
			float:right;
			position:relative;
			top:15px;
			right:52px;		
	}
	
		#navbar ul {
			margin:0;
			padding:0;
			list-style:none;
		}
		
			#navbar ul li {
				margin:0;
				padding:0;
				display:block;
				float:left;
			}
			
				#navbar ul li a {
					display:block;
					padding:0 15px;
					color:#5b5b5b;
					font-size:14px;
					line-height:1.5;
					text-shadow:-1px -1px 0px #FFF;
				}
				
				a.noborder {
					background:none !important;
					border-bottom:none !important;
				}
				
					#navbar ul li a:hover {
						color:#2b2b2b;
					}
					
					#navbar ul li a:active {
						line-height:1.7;
					}
					
					#home a.navlink1,
					#portfolio a.navlink2,
					#testimonials a.navlink3,
					#pricing a.navlink4,
					#order a.navlink5,
					#navbar ul li a.current {
						color:#3281c4 !important;
					}

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

#content {
	azimuth:behind;
	/*lolwtf*/
}

	.cui {
		background:url('../images/ui/content_ui.png');
	}
	
		.ctop {
			height:55px;
		}
		
		.cbottom {
			height:14px;
			background-position:bottom left;
			margin-bottom:20px;
		}
		
		.ccon {
			background-position:top right;
			background-repeat:repeat-y;
		}
		
			.contentfix {
				width:910px;
				margin:0 auto;
				min-height:400px;
			}
						
		
			.vsep {
				background:url('../images/ui/sep_vertical.png') no-repeat;
				background-position:524px center;
			}
			
			h2 {
				font-size:24px;
				color:#000;
				margin:0;
				padding:0;
			}
		
	/*-------------------------------------*/
	/* Content - Subbnav ------------------*/
	
	.nosnav, .subnav, .subsep {
		background:url('../images/ui/subnav.png') no-repeat bottom center;
		width:958px;
		height:6px;
		margin:0 auto;
	}
	
	.subnav {
		height:45px;
	}
	
		.subnav ul, .subnav li {
			margin:0;
			padding:0;
			list-style:none;
		}
		
		.subnav ul {
			margin:8px 0 0 15px;
		}
	
		.subnav a {
			display:block;
			float:left;
			height:30px;
			padding:0 21px;
			margin:2px;
			background:#f5fafb;
			border-bottom:3px solid #cee9ee;
			color:#3ab4cd;
			line-height:2.7;
		}
		
			.subnav a.current,
			#d468x60 a.sn-1,
			#d234x60 a.sn-2,
			#d125x125 a.sn-3,
			#d120x90 a.sn-4,
			#d120x60 a.sn-5,
			#d160x600 a.sn-6,
			#d120x600 a.sn-7,
			#d728x90 a.sn-8,
			#d300x250 a.sn-9,
			#d300x600 a.sn-10,
			#d80x80 a.sn-11 {
				background:#e8f8fb;
				border-bottom:3px solid #75c7d6;
				color:#298b9f;
			}
			
			.subnav a:hover {
				background:#fbf5f5;
				border-bottom:3px solid #eed6ce;
				color:#cd3a3a;
			}

			.subnav a:active {
				background:#fbf5f5;
				border-bottom:3px solid #c28282;
				color:#8b2222;
			}

	/*-------------------------------------*/
	/* Content - Banners Showcase ---------*/
	
	.banners-showcase {
		margin:25px auto;
	}
	
		.banners-showcase img {
			margin:10px;
			padding:2px;
			border:1px solid #CCC;
		}

	/*-------------------------------------*/
	/* Content - Welcome Box --------------*/
	
	.wbox {
		background:url('../images/ui/bg_wlkm.jpg') no-repeat center right;
		height:250px;
	}
	
		.wbox h2 {
			margin:0;
			padding:38px 0 15px 0;
			font-size:24px;
			color:#000;
		}
		
		.wbox p {
			margin:0;
			padding:0;
			width:585px;
		}
		
		.wbox-right {
			float:right;
			color:#FFF;
			font-size:11px;
			position:relative;
			bottom:76px;
			right:136px;
			font-weight:bold;
		}
		
			.wbox-right span.price {
				color:#00b6d7;
				font-size:24px;
				display:block;
				text-indent:10px;
			}
		
		.wbox a.btn {
			float:left;
			margin:24px 10px 0 0px;
		}
		
		a.btn {
			display:block;
			width:193px;
			height:51px;
			background:url('../images/ui/btn_sprite.jpg');
			color:#FFF;
			font-size:18px;
			text-align:center;
			line-height:2.7;
		}
		
			a.btn:hover {
				background-position:center left;
			}
	
			a.btn:active {
				background-position:bottom left;
			}	
	
	/*-------------------------------------*/
	/* Content - Recent Work --------------*/
	
	.recent-work {
		width:507px;
		float:left;
	}
	
		.recent-work p {
			padding-bottom:10px;
		}
	
		.recent-work a.rw-banner {
			background:url('../images/ui/banner_shadow.png');
			height:78px;
			width:486px;
			margin:8px 0;
			text-align:center;
			display:block;
		}
		
			a.rw-banner img {
				margin-top:9px;
			}
	
	/*-------------------------------------*/
	/* Content - Testimonials -------------*/
	
	.testimonials {
		width:341px;
		float:right;
	}
	
		.tbox {
			height:268px;
			width:331px;
			margin:5px 0;
			background:url('../images/ui/testimonial_box.png');
		}
		
			.testimonial {
				width:303px;
				height:115px;
				margin:0 auto;
			}
			
				.testimonial blockquote {
					margin:0 0 0 26px;
					padding:28px 0 10px 8px;
					font-style:italic;
					width:250px;
					height:64px;
					line-height:1.1;
				}
				
					.testimonial blockquote p {
						margin:0;
						padding:0;
					}
				
				.testimonial span.client {
					display:block;
					color:#515151;
					font-size:10px;
					line-height:1;
				}
				
				.testimonial a.clienturl {
					color:#768c97;
					font-size:10px;
					line-height:1;
				}
				
				.t2 {
					position:relative;
					top:10px;
				}
				
					a.moar {
						color:#a80000;
						float:right;
						margin-right:25px;
						font-size:10px;
					}
					
						a.moar:hover {
							text-decoration:underline;
						}
						
						a.moar:active {
							color:#710000;
						}
	
/*-------------------------------------*/
/* Misc -------------------------------*/

.seperator, .seperator2 {
	background:url('../images/ui/sesprite.png');
	width:899px;
	height:26px;
	margin:15px auto;
	clear:both;
}

.seperator2 {
	background-position:bottom left;
}

#tooltip{
	position:absolute;
	border:1px solid #333;
	background:#f7f5d1;
	padding:2px 5px;
	color:#333;
	display:none;
}	

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

#footer {
	font-size:10px;
	margin:20px 0 5px;
}

	#footer .f-left {
		float:left;
		margin-left:20px;
	}
	
	#footer .f-right {
		float:right;
		margin-right:20px;
	}

		#footer .f-left p {
			margin:0;
			padding:0;
		}
		
		#footer a {
			color:#88a4b8;
		}		
		
			#footer a:hover {
				color:#3f688e;
			}
			
			#footer a:active {
				color:#2a455e;
			}

/*-------------------------------------*/
/* W3C Valid CSS 3.0
/* azizgfx@gmail.com
/*-------------------------------------*/