@charset "utf-8";
/* CSS Document */
/*

	~"~"~ ICONIFY ~"~"~ XHTML Template by palpaldal
	
	TABLE OF CONTENTS ------------------

		1.	Common Theme Elements (usually inline elements)
		2.	Theme Structure
		3.	Pages Common Content's Styles
			a.	Header
			b.	Menu
			c.	Breadcrumbs
			d.	Footer
			e.	Sidebar
			f.	Pagination
		4.	Pagewise Styles
			a.	Home
			b.	Portfolio
				i.	Column 2
				ii.	Column 3
				iii.Column 4
			c.	Blog
				ii.	Comments
				iii.Comment Form
			d.	Contact
				i.	Contact Form
		5.	Others
			
*/

/* <<<<<<<<<<	1. Common Theme Elements (usually inline elements)	>>>>>>>>>> */

.border{border: 1px solid #b9b9b9;}

.list{margin: 18px 0;}

.list li{
	display: block;
	line-height: 18px;
	margin-bottom: 4px;
}

.list li a{color: #7c7c7c;}

.list li a:focus,
.list li a:hover{color: #eaa000;}

.btn{line-height: 18px;}

/* <<<<<<<<<<	2. Theme Structure	>>>>>>>>>> */

#header{
	background: #f1f1f1;
	border: 1px solid #cdcdcd;
	-moz-border-radius-bottomleft: 10px;
	-webkit-border-bottom-left-radius: 10px;
	border-bottom-left-radius: 10px;
	-moz-border-radius-bottomright: 10px;
	-webkit-border-bottom-right-radius: 10px;
	border-bottom-right-radius: 10px;
	border-top: none;
	padding: 0 10px;
	margin-bottom: 20px;
}

	#header .inner{
		border: 1px solid #f9f9f9;
		-moz-border-radius-bottomleft: 10px;
		-webkit-border-bottom-left-radius: 10px;
		border-bottom-left-radius: 10px;
		-moz-border-radius-bottomright: 10px;
		-webkit-border-bottom-right-radius: 10px;
		border-bottom-right-radius: 10px;
		border-top: none;
		margin: 0 -10px;
		padding: 0 20px;
	}

#content{
	background: #f1f1f1;
	border: 1px solid #cdcdcd;
	-moz-border-radius: 10px;
	-webkit-border-radius: 10px;
	border-radius: 10px;
	margin-bottom: 20px;
	margin-top: 20px;
	padding: 0 10px;
}

	#content .inner{
		border: 1px solid #f9f9f9;
		-moz-border-radius: 10px;
		-webkit-border-radius: 10px;
		border-radius: 10px;
		margin: 0 -10px;
		padding: 40px 20px;
	}

#footer{
	background: #f1f1f1;
	border: 1px solid #cdcdcd;
	-moz-border-radius-topleft: 10px;
	-webkit-border-top-left-radius: 10px;
	border-top-left-radius: 10px;
	-moz-border-radius-topright: 10px;
	-webkit-border-top-right-radius: 10px;
	border-top-right-radius: 10px;
	border-bottom: none;
	margin-top: 20px;
	padding: 0 10px;
}

	#footer .inner{
		border: 1px solid #f9f9f9;
		-moz-border-radius-topleft: 10px;
		-webkit-border-top-left-radius: 10px;
		border-top-left-radius: 10px;
		-moz-border-radius-topright: 10px;
		-webkit-border-top-right-radius: 10px;
		border-top-right-radius: 10px;
		border-bottom: none;
		margin: 0 -10px;
		padding: 1px 20px;
	}

#primary{
	background: transparent url(../../images/v-bdr-bg.png) right top repeat-y;
	padding-right: 20px;
	margin: 0 20px 0 0;
	width: 630px;
}

#secondary{
	background: transparent url(../../images/v-bdr-bg.png) left top repeat-y;
	padding-left: 20px;
	margin: 0 0 0 -23px;
	width: 271px;
}

/* <<<<<<<<<<	3. Pages Common Content's Styles	>>>>>>>>>> */

	/* <<<<<<<<<<	a. Header	>>>>>>>>>> */

#header .top{
	background: transparent url(../../images/bdr-bg.png) left bottom repeat-x;
	overflow: hidden;
	padding: 10px 0 13px 552px;
}

#header .top li{
	color: #ababab;
	display: block;
	float: left;
	line-height: 24px;
	margin-right: 10px;
}

#header .top li a{
	border: none;
	border-left: 1px solid #d0d0d0;
	color: #ababab;
	padding: 0 0 0 10px;
}

#header .top li:last-child{margin: 0;}

#header .top li:first-child a{border: none; padding:0;}

#header .top li a:focus,
#header .top li a:hover{color: #eaa000;}

#header .top form{
	margin-left: 10px;
	position: relative;
}

#header .top legend{display: none;}

#header .top input[type="text"]{
	background: #d8d8d8;
	border: 1px solid #bdbdbd;
	height: 14px;
	width: 160px;
	padding: 4px;
	font-size: 12px;
	line-height: 12px;
}

#header .top label{
	display: none;
	left: 8px;
	position: absolute;
	top: 0px;
}

#header .top input[type="submit"]{
	background: transparent url(../../images/srch-btn.png) 0 0 no-repeat;
	border: none;
	display: block;
	font-size: 0;
	height: 15px;
	padding: 0;
	position: absolute;
	right: 4px;
	text-indent: -999px; /* some browser shows 1px height texts like Safari even with font-size: 0 */
	top: 4px;
	width: 19px;
}

#header .top input[type="submit"]:focus,
#header .top input[type="submit"]:hover{background-position: -19px 0;}

#nav{padding: 20px 0;}

#logo a{border: none;}

	/* <<<<<<<<<<	b. Menu	>>>>>>>>>> */

#menu{
	padding: 16px 0 0 290px;
	width: 350px;
	z-index: 999;
}

#menu li{
	color: #0f5193;
	font-size: 14px;
	font-weight: bold;
	margin-left: 14px;
	position: relative;
}

#menu li.active a,
#menu li a:focus,
#menu li a:hover{border-bottom: 1px solid #88afd5;}

#menu>li.dropdown>a{
	border: none;
	background: transparent url(../../images/drop-arrow.png) right center no-repeat;
	padding-right: 10px;
}

#menu>li.dropdown.active>a{border-bottom: 1px solid #88afd5;}

#menu li a{color: #0f5193;}

#menu ul{
	background: #e4e4e4;
	border: 1px solid #b7b7b7;
	-moz-border-radius: 4px;
	-webkit-border-radius: 4px;
	border-radius: 4px;
	position: absolute;
	top: -999px;
	margin: 0;
	padding: 1px 11px;
	left: 0;
	width: 100px;
	z-index: 999;
}

#menu ul li{
	background: #d5d5d5;
	display: block;
	font-size: 12px;
	font-weight: normal;
	line-height: 1.6;
	margin: 0 -10px;
	padding: 4px 10px 0;
}

#menu ul li span{font-size: 14px;}


#menu ul li:first-child{padding-top: 8px;}

#menu ul li:last-child{padding-bottom: 6px;}

#menu li:hover ul{top: 16px;}

#menu li:hover li ul,
#menu li li:hover li ul,
#menu li li li:hover li ul,
#menu li li li li:hover li ul{top: -999px;}

#menu li li:hover ul,
#menu li li li:hover ul,
#menu li li li li:hover ul,
#menu li li li li li:hover ul{
	left: 121px;
	top: -2px;
}

#menu li li:hover ul{margin-left: 37px;}

#menu li li li:hover ul,
#menu li li li li:hover ul,
#menu li li li li li:hover ul{margin-left: 21px;}

#menu li li:hover>a{border-bottom: 1px solid #88afd5;}

	/* <<<<<<<<<<	c. Breadcrumbs	>>>>>>>>>> */

.breadcrumbs{margin: -20px 0 20px 0;}

	.breadcrumbs li{
		font-size: 14px;
		line-height: 18px;
	}

	.breadcrumbs li:last-child{font-weight: bold;}

		.breadcrumbs li a{
			font-size: 11px;
			color: #7c7c7c;
		}

		.breadcrumbs li a:focus,
		.breadcrumbs li a:hover{color: #eaa000;}

	/* <<<<<<<<<<	d. Footer	>>>>>>>>>> */

#footer .top{
	background: transparent url(../../images/bdr-bg.png) left bottom repeat-x;
	overflow: hidden;
	padding-bottom: 33px;
	width: 940px;
}

#twitter{
	background: transparent url(../../images/twitter-bird.png) 0 center no-repeat;
	margin-top: 30px;
	padding-left: 50px;
	width: 570px;
}


	#twitter h2,
	#twitter .profileLink{display: none;}

	#twitter li{
		display: block;
		line-height: 18px;
	}

.social{
	background: transparent url(../../images/v-bdr-bg.png) 1px 0 repeat-y;
	height: 32px;
	margin: 30px 0 0 0;
	padding: 0 0 0 10px;
	overflow: hidden;
}

	.social li{
		display: block;
		float: left;
		line-height: 18px;
		margin-right: 10px;
	}

	.social li:last-child{margin-right: 0;}

	.social h5{
		color: #7c7c7c;
		font-size: 14px;
		font-weight: normal;
		line-height: 32px;
		margin: 0 0 0 62px;
		width: 70px;
	}
	
	.social a{border: none;}

#footer .content{
	margin-top: 30px;
	width: 940px;
	overflow: hidden;
}

	#footer .content .grid_4{
		background: transparent url(../../images/v-bdr-bg.png) right top repeat-y;
		width: 287px;
		padding-bottom: 500px;
		padding-right: 20px;
		margin-bottom: -500px;
	}

	#footer .content li:last-child{
		padding-right: 0;
		background: none;
		width: 286px;
	}

		#footer .content h5{
			color: #7c7c7c;
			margin-top: 0;
		}

		#footer .blogList li{
			display: block;
			line-height: 18px;
			margin-bottom: 20px;
		}

		#footer .blogList li:last-child{margin: 0;}

			#footer .blogList img{
				display: block;
				float: left;
				margin: 0 10px 4px 0;
			}
			
			#footer .blogList h5{
				color: #0f5193;
				margin: 0;
			}

			#footer .blogList p{margin: 10px 0;}

#toTop{
	background: transparent url(../../images/to-top.png) 0 0 no-repeat;
	border: none;
	cursor: pointer;
	display: block;
	height: 10px;
	margin: 20px auto;
	width: 11px;
}

#toTop:focus,
#toTop:hover{background-position: -11px 0;}


	/* <<<<<<<<<<	e. Sidebar	>>>>>>>>>> */

#secondary>li{
	background: transparent url(../../images/bdr-bg.png) left bottom repeat-x;
	display: block;
	line-height: 18px;
	padding-bottom: 18px;
	margin-bottom: 20px;
}

#secondary>li:last-child{background: none;}

	#secondary>li h5{
		font-size: 18px;
		margin-top: 0;
		color: #7c7c7c;
	}

	/* <<<<<<<<<<	f. Pagination	>>>>>>>>>> */

.pager{margin: 20px 0;}

	.pager li{
		line-height: 18px;
		margin-right: 6px;
	}

/* <<<<<<<<<<	4. Pagewise Styles	>>>>>>>>>> */

	/* <<<<<<<<<<	a. Home	>>>>>>>>>> */

#slider{
	background: #b5b5b5;
	border: 1px solid #f8f8f8;
	height: 336px;
	margin-top: 10px;
	padding: 1px;
	width: 936px;
	overflow: hidden;
	position: relative;
}

#cyclePager{
	position: absolute;
	height: 18px;
	overflow: hidden;
	right: 20px;
	bottom: 20px;
	z-index: 99;
}

	#cyclePager a{
		background: transparent url(../../images/cycle-pager.png) 0 0 no-repeat;
		display: block;
		float: left;
		height: 18px;
		margin-left: 10px;
		text-indent: -9999px;
		width: 18px;
	}

	#cyclePager a:hover,
	#cyclePager a.activeSlide{background-position: -18px 0;}

.promo-col-4{margin: 30px 0 40px;}

	.promo-col-4 li{
		display: block;
		overflow: hidden;
	}

		.promo-col-4 li img{
			display: block;
			float: left;
			margin-right: 10px;
		}

		.promo-col-4 li h5{margin: 4px 0;}

.promo-col-3{margin: 40px 0;}

.testimonial{margin: 40px 0;}

	#content .testimonial .inner{
		border: 1px solid #f3f3f3;
		-moz-border-radius: 0;
		-webkit-border-radius: 0;
		border-radius: 0;
		padding: 0;
		position: relative;
		margin: 0;
	}

		.testimonial blockquote{
			background: #e5e5e5;
			border: 1px solid #d9d9d9;
			margin: 0;
			padding: 20px;
		}

			.testimonial .arrow{
				background: transparent url(../../images/testi-arrow.png) 0 0 no-repeat;
				bottom: -10px;
				display: block;
				height: 12px;
				position: absolute;
				right: 20px;
				width: 16px;
			}

#recentProjects .bar{
	border: 1px solid #e5e5e5;
	margin: 0 0 18px 0;
}

	#recentProjects h5{
		color: #7c7c7c;
		background: #f3f3f3;
		border: 1px solid #f9f9f9;
		margin: 0;
		height: 38px;
		text-align: center;
		font-size: 14px;
		line-height: 36px;
	}


	/* <<<<<<<<<<	b. Portfolio	>>>>>>>>>> */

.promoText{
	border: 1px solid #e5e5e5;
	margin: 20px 0 40px;
}

.promoText h3{
	border: 1px solid #f9f9f9;
	background: #f3f3f3;
	color: #7c7c7c;
	font-size: 20px;
	margin: 0;
	text-align: center;
	padding: 20px;
}

.prettyItemHover{
	background: transparent url(../../images/prettyPhoto/pretty-item-h-bg.png) 0 0 repeat;
	cursor: pointer;
	left: 2px;
	position: absolute;
	top: 2px;
	visibility: hidden;
}

	.prettyItemHover img{
		background: none!important;
		display: block;
		padding: 0!important;
	}

		/* <<<<<<<<<<	i. Column 2	>>>>>>>>>> */

.port-col-2{
	overflow: hidden;
	margin-right: -22px;
}

	.port-col-2 li{
		display: block;
		float: left;
		line-height: 18px;
		margin: 0 20px 30px 0;
		width: 460px;
	}

.port-col-2 .prettyItemHover{
	height: 296px;
	width: 456px;
}

	.port-col-2 .prettyItemHover img{margin: 120px auto;}

		/* <<<<<<<<<<	ii. Column 3	>>>>>>>>>> */

.port-col-3{
	overflow: hidden;
	margin-right: -22px;
}

	.port-col-3 li{
		display: block;
		float: left;
		line-height: 18px;
		margin: 0 20px 30px 0;
		width: 300px;
	}

.port-col-3 .prettyItemHover{
	height: 196px;
	width: 296px;
}

	.port-col-3 .prettyItemHover img{margin: 80px auto;}

		/* <<<<<<<<<<	iii. Column 4	>>>>>>>>>> */

.port-col-4{
	overflow: hidden;
	margin-right: -22px;
}

	.port-col-4 li{
		display: block;
		float: left;
		line-height: 18px;
		margin: 0 20px 30px 0;
		width: 220px;
	}

.port-col-4 .prettyItemHover{
	height: 136px;
	width: 216px;
}

	.port-col-4 .prettyItemHover img{margin: 50px auto;}

	/* <<<<<<<<<<	c. Blog	>>>>>>>>>> */

.blogs li{
	display: block;
	line-height: 18px;
	background: transparent url(../../images/bdr-bg.png) left bottom repeat-x;
	padding-bottom: 20px;
	margin-bottom: 20px;
}

.blogs li:last-child{background: none;}

	.meta{margin-top: -12px;}
	
		.meta big{font-weight: bold;}

.popularPost{
	background: #f3f3f3;
	border: 1px solid #e5e5e5;
	margin: 40px 0;
}

#primary .popularPost .inner{
		border: 1px solid #f9f9f9;
		-moz-border-radius: 0;
		-webkit-border-radius: 0;
		border-radius: 0;
		margin: 0;
		padding: 20px;
	}
	
	.popularPost hr{
		background-color: #dedede;
		border-bottom-color: #f7f7f7;
		border-top-collr: #f7f7f7;
		margin: 9px 0 20px 0;
	}

		.popularPost h4{
			color: #7c7c7c;
			font-size: 18px;
			margin: 0;
		}
	
		.popularPost ul{overflow: hidden;}

		.popularPost ul li{
			display: block;
			line-height: 18px;
			float: left;
			width: 285px;
			margin-right: 16px;
		}

		.popularPost ul li:last-child{margin-right: 0;}
		
		.popularPost ul li img{
			display: block;
			float: left;
			margin: 0 10px 10px 0;
		}
		
		.popularPost ul li h5{margin-top: 0;}
		
		.popularPost ul li p{margin-bottom: 0;}


		/* <<<<<<<<<<	i. Comments	>>>>>>>>>> */

#comments{
	border: 1px solid #e5e5e5;
	margin-top: 40px;
}

	#comments .inner{
		background: #f3f3f3;
		border: 1px solid #f9f9f9;
		margin: 0;
		-moz-border-radius: 0;
		-webkit-border-radius: 0;
		border-radius: 0;
		padding: 20px 20px 30px;
	}
	
	#comments .top{margin-bottom: 30px;}
	
		#comments .top h4{
			color: #7c7c7c;
			display: inline;
			line-height: 24px
			text-align: left;
		}
		
		#comments .top a{
			font-weight: bold;
			line-height: 24px;
			text-align: right;
			margin-left: 351px;
		}

		.commentBoxes li{
			display: block;
			line-height: 18px;
			margin-bottom: 20px;
			overflow: hidden;
		}
		
		.commentBoxes li:last-child{margin-bottom: 0;}
		
		.commentBoxes li .avatar{
			float: left;
			width: 80px;
		}
		
		.commentBoxes li .avatar p{
			text-align: center;
			line-height: 14px;
			margin: 0;
		}

		
		.commentBoxes li .comment{
			border: 1px solid #f5f5f5;
			margin-left: 110px;
			width: 474px;
		}

		#comments .commentBoxes li .comment .inner{
			background: #f1f1f1;
			border: 1px solid #e5e5e5;
			padding: 0 20px 20px;
			position: relative;
			min-height: 100px;
		}
		
			.commentBoxes li .comment .arrow{
				background: transparent url(../../images/arrow.png) 0 0 no-repeat;
				display: block;
				height: 10px;
				left: -10px;
				position: absolute;
				top: 20px;
				width: 10px;
			}

			.commentBoxes li .comment .reply{
				bottom: 10px;
				right: 10px;
				position: absolute;
			}
			
			.commentBoxes li .comment .reply:focus,
			.commentBoxes li .comment .reply:hover{bottom: 9px;}
			
		.commentBoxes .level_1 .avatar{margin-left: 20px;}
		
		.commentBoxes .level_1 .comment{
			margin-left: 130px;
			width: 454px;
		}
		
		.commentBoxes .level_2 .avatar{margin-left: 40px;}
		
		.commentBoxes .level_2 .comment{
			margin-left: 150px;
			width: 434px;
		}

		.commentBoxes .level_3 .avatar{margin-left: 60px;}
		
		.commentBoxes .level_3 .comment{
			margin-left: 170px;
			width: 414px;
		}
		
		.commentBoxes .level_4 .avatar{margin-left: 80px;}
		
		.commentBoxes .level_4 .comment{
			margin-left: 190px;
			width: 394px;
		}

		/* <<<<<<<<<<	ii. Comment Form	>>>>>>>>>> */

#commentForm,
#contactForm{
	border: 1px solid #e5e5e5;
	margin-top: -1px;
}

#commentForm p,
#contactForm p{
	color: red;
	margin: 0;
}


	#commentForm .inner,
	#contactForm .inner{
		background: #f3f3f3;
		border: 1px solid #f9f9f9;
		margin: 0;
		-moz-border-radius: 0;
		-webkit-border-radius: 0;
		border-radius: 0;
		padding: 20px 20px 40px;
	}

	#commentForm h4{
		color: #7c7c7c;
		margin: 0;
	}
	
	#commentForm form{margin-top: 20px;}

		#commentForm legend{display: none;}

			#commentForm li,
			#contactForm li{
				display: block;
				line-height: 18px;
				margin-bottom: 20px;
				overflow: hidden;
			}
			
			#commentForm li:last-child,
			#contactForm li:last-child{margin-bottom: 0;}
			
				#commentForm li label,
				#contactForm li label{
					display: block;
					float: left;
					line-height: 30px;
					width: 80px;
				}
			
				#commentForm li span,
				#contactForm li span{
					border: 1px solid #f5f5f5;
					display: block;
					margin-left: 80px;
					width: 300px;
				}
			
				#commentForm input[type="text"],
				#commentForm textarea,
				#contactForm input[type="text"],
				#contactForm textarea{
					height: 14px;
					padding: 6px 10px;
					width: 298px;
				}
				
				#commentForm .cmntField span,
				#contactForm .cntField span{width: 400px;}
				
				#commentForm textarea,
				#contactForm textarea{
					height: 160px;
					padding: 10px;
					width: 398px;
				}
				
				#commentForm input[type="submit"],
				#contactForm input[type="submit"]{
					float: right;
					margin-right: 84px;
				}

	/* <<<<<<<<<<	d. Contact	>>>>>>>>>> */

.address li{
	display: block;
	line-height: 18px;
	margin-bottom: 4px;
}

		/* <<<<<<<<<<	i. Contact Form	>>>>>>>>>> */

#contactForm{margin-top: 40px;}

	#contactForm legend{
		font-size: 18px;
		font-weight: bold;
		display: block;
		line-height: 18px;
		padding-bottom: 20px; /* CHROME and SAFARI having trouble with margin*/
	}

/* PLEASE CHECK COMMENT FORM SECTION FOR OTHER STYLES OF CONTACT FORM */

/* <<<<<<<<<<	5. Others	>>>>>>>>>> */