@charset "utf-8";
/*
Theme Name: Colui
Theme URI: http://www.stevebluck.co.uk
Description: Colui | A designers portfolio
Version: 1.0
Author: Stephen Bluck
Tags: colui, themeforest colui, template
*/

a{
	text-decoration:none;
}

a:hover{
	text-decoration:none;
}

#TopBg{
	width:100%;
	height:133px;
}

#PreLoad{
	display:none;
}


/*Navigation*/


#Nav.grid_16{
	width:1005px;
	position:absolute;
	margin-top:-37px;
	z-index:3;
}

	#NavLeft{
		width:25px;
		height:75px;
		float:left;
	}
	
	#NavRight{
		width:64px;
		height:79px;
		float:left;
	}

	#NavBg{
		height:75px;
		width:910px;
		float:left;
	}
	#NavBg ul{
		margin:0;
		padding:0;
		list-style:none;
	}
	
	#NavBg li{
		margin:0;
		padding:0;
		list-style:none;
		font-size:18px;
		float:left;
	}
	
	#NavBg li a{
		display:block;
		height:52px;
		padding:23px 20px 0 20px;
		text-decoration:none;
		float:left;
	}
	
	#NavBg li.current_page_item a{
		background:none;
		border:none;
	}
	
	#NavBg li a:hover{
	}
	
	#NavBg li a span{
		font-size:11px;
	}
	
	#NavBg img{
		float:left;
		cursor:pointer;
	}

/* Search */
#Search{
	float:right;
	margin:25px 0 0 10px;
}

	.SearchBg{
		width:173px;
		height:24px;
		border:none;
		padding-top:5px;
		padding-left:7px;
		padding-right:7px;
		vertical-align:middle;
	}

	.SearchBtn{
		vertical-align:middle;
		margin-top:-3px;
	}

/* The large banner on the homepage */

#BannerBg{
	height:335px;
	width:100%;
}

	#BannerImage{
		height:334px;
		width:1118px;
		position:absolute;
		margin-left:-140px;
		z-index:2;
	}

/* Featured Cycle Plugin */

#Featured{
	width:483px;
	height:334px;
	float:right;
	position:absolute;
	margin:0 0 0 130px;
	z-index:2;
}

	#Cycle{
		position:absolute;
		margin:70px 0 0 160px;
		z-index:1;
		overflow:hidden;
		height:234px;
		width:383px;
	}

	.FeaturedImage{
		width:378px;
		height:223px;
	}

	#BtnUp{
		position:absolute;
		margin:38px 0 0 330px;
		z-index:3;
	}
	
	#BtnDown{
		position:absolute;
		margin:300px 0 0 330px;
		z-index:3;
	}
	
	#Design{
		position:absolute;
		margin:-1px 0 0 550px;
		z-index:3;
		width:520px;
		height:336px;
	}

/* The four slide */	

.slides-nav{
		width:1000px;
	}
	
	.slides-nav ul{
		margin:0;
		padding:0;
		list-style:none;
		float:left;
	}
	
	.slides-nav li{
		margin:0;
		margin-left:10px;
		margin-right:10px;
		padding:0;
		list-style:none;
		float:left;
		text-align:left;
	}
	

	.Icon{
		position:absolute;
		margin: -8px 0 0 -82px;
		vertical-align:text-top;
	}
	
	.slides-nav a{
		height:68px;
		display:block;
		width:120px;
		padding:26px 0 0 100px;
		margin-bottom:10px;
	}
	
	.slides-nav span{
		font-size:12px;
		float:left;
		width:120px;
		line-height:14px;
	}
	
	.slides{
		float:left;
		width:940px;
		height:323px;
		overflow:hidden;
		margin:0 0px 0 10px;
	}
	
	.slides ul li{
		margin:0 0 0 0;
	}
	

	#slideshow {
		width: 960px;
		float:left;
		margin:25px 0 25px 0;
	}
	
	#slideshow ul {
		margin: 0;
		padding: 0;
		list-style-type: none;
		float:left;
	}
	
	#slideshow ul li{
		float:left;
	}
	
	.Bg1, .Bg2, .Bg3, .Bg4{
		width:940px;
		height:323px;
		float:left;
	}

	.SlideLeft{
		width:500px;
		float:left;
	}
	
	.SlideRight{
		width:415px;
		float:left;
		padding:20px 25px 0px 0;
	}

	.SlideRight h2{
		font-size:36px;
		font-weight:normal;
		margin:0 0 20px 0;
		padding:0;
		line-height:40px;
	}
	
	.SlideRight p{
		font-size:12px;
		line-height:18px;
		margin:0 0 20px 0;
	}
	
	.BtnPink, .BtnAqua{
		text-align:center;
		text-transform:capitalize;
		float:left;
		
	}

	.SlideRight .BtnAqua{
		float:right;
	}
	
	.BtnPink a, .BtnAqua a{
		display:block;
		width:188px;
		height:29px;
		padding-top:12px;
	}
	
/* Abiut us - on the homepage */

#About{
	margin-bottom:30px;
	line-height:22px
}

	#About h2{
		margin:0 0 10px 0;
	}

	#About p{
		font-size:12px;
	}
	
	#About ul{
		font-size:12px;
		margin:15px 0 15px 0px;
	}


	#About ul li{
		font-size:12px;
		list-style:none;
		padding-left:35px;
		height:30px;
		display:block;
		margin:5px 0 5px 10px;
	}

	.UnderlineBlue{
		width:100%;
		height:2;
		font-size:2px;
		margin-top:15px;
	}

/* Testimonials */

#Testimonial h2{
	margin:0px;
}

#Testimonials{
	font-size:12px;
	line-height:20px;
	margin:15px 0 0px 0;
}

	#Author{
		margin:5px 0 25px 0;
		font-size:14px;
	
	}
	
/* Footer */

#FooterTopBar{
	font-size:4px;
	width:100%;
	margin:0 0 2px 0;
}

	#FooterBottomBar{
		font-size:4px;
		width:100%;
		margin:0px 0 0px 0;
	}

	#Footer{
		width:100%;
		padding:30px 0 0px 0;
	}

	#Footer a{
		text-decoration:none;
	}

	#Footer ul{
		list-style:none;
		margin:0;
		padding:0;
	}
	
	#Footer li{
		list-style:none;
		margin:0;
		padding:0;
	}

	#Footer h2{
		font-weight:normal;
		font-size:14px;
	}
	
	
	.Underline{
		width:100%;
		font-size:2px;
		margin:7px 0 10px 0;
	}

	#WidgetOne, #WidgetTwo, #WidgetThree, #WidgetFour{
		margin-bottom:30px;
	}
	
	#WidgetOne a, #WidgetTwo a, #WidgetThree a, #WidgetFour a{
		font-weight:bold;
	}
	
/* Final footer */	

#FooterLast{
	font-size:12px;
	padding-top:10px;
	height:50px;
}

	#FooterLast img, #FooterLast p{
		float:left;
	}

	#FooterLast p{
		padding-top:12px;
		padding-left:20px;
	}
	
	#FooterLast ul{
		list-style:none;
		margin:0;
		padding:0;
		float:right;
	}
	
	#FooterLast ul li{
		float:left;
	}
	
	#FooterLast ul li a{
		float:left;
		padding:10px 0px 0 10px;
	}

/* Widget one */
#WidgetOne ul{
	margin:0;
	padding:0;
	list-style:none;
	font-size:10px;
	font-weight:normal;
}

	#WidgetOne li{
		margin:0;
		padding:0;
		list-style:none;
		height:65px;
	}
	
	#WidgetOne li a{
		display:block;
		float:left;
		width:100%;
	}
	
	#WidgetOne li a img{
		float:left;
		padding:3px;
		margin-right:10px;
	}
	
	#WidgetOne li a:hover img{
		float:left;
		padding:3px;
	}
	
	#WidgetOne .PostDate{
		font-style:italic;
	}
	
/* Widget two */

#WidgetTwo ul{
	margin:0;
	padding:0;
	list-style:none;
	font-size:10px;
	font-weight:normal;
}

	#WidgetTwo li{
		margin:0 0 10px 0;
		padding:0 0 5px 30px;
		font-style:italic;
	}
	
	#WidgetTwo li a{
		display:block;
		width:100%;
		font-style:normal;
	}
	
	#WidgetTwo li a span{
		font-weight:normal;
		font-style:normal;
	}

/* Widget three */

#WidgetThree ul{
	margin:0;
	padding:0;
	list-style:none;
	font-size:10px;
	font-weight:normal;
}

	#WidgetThree li{
		margin:0 0 10px 0;
		padding:0 0 5px 35px;
		font-style:italic;
	}
	
	#WidgetThree li a{
		display:block;
		width:100%;
		font-style:normal;
	}

/* Widget four */

#WidgetFour img{
	width:100px;
	height:100px;
	margin:3px;
}
		
/* Single Page Banner */	
#BannerBg2{
	height:130px;
	width:100%;
}
	
	#PageTitle h1{
		margin-top:70px;
		font-size:24px;
	}
	
	#PageDesc p{
		margin-top:70px;
		font-size:24px;
		text-align:right;
	}

/* Sidebars */

#SideBar{
	width:219px;
	padding:25px 0 25px 0;
	float:left;
	margin-right:10px;
}


	#SideBar h3{
		margin:0;
	}

	#SideBar li{
		margin:0;
		padding:0;
		list-style:none;
	}

	#SideBar a{
		display:block;
		width:210px;
		font-size:12px;	
		padding:10px 0 10px 10px;
		border-bottom: 1px solid #CCCCCC;
	}
	
	.current-cat a{
		background-color:#f8f8f8;
		border-right:1px solid #FFFFFF;													
		color:#152639;																				
	}
	
	.UnderlineBlueSideBar{
		width:200px;																																	
		height:2;
		font-size:2px;
		margin-top:10px;
		margin-bottom:10px;																																															
	}

/* News Items */
.NewsItem{
	float:left;
	margin:10px 0 5px 10px;
	width:100%;
	padding:0 0 25px 0;
}
	.NewsItem h1{
		margin:0;
		padding:0;
	}
	
	.NewsItem p{
		font-size:12px;
		margin:0;
		padding:0;
		line-height:20px;
	}
	
	.NewsItem a:hover{
		text-decoration:none;
	}
	

	p.PostDetails{
		font-size:10px;
		text-transform:uppercase;
		margin:0 0 5px 0;
		padding:5px;
	}

	img.PostContent {
		float:left;
		margin-top:5px;
		margin-right:15px;
		padding:5px;
	}

/* Single Page Wrapper */	
#Main{
	float:left;
	width:670px;
	margin:0 0px 0 10px;
}

	#Main h4{
		margin:10px 0 0 10px;
		padding:0;
		font-size: 12px;
	}

	a.more-link{
		display:block;
		padding:5px;
		font-weight:bold;
		text-align:center;
		width:150px;
		float:right;
		margin:15px 0 0 0;
		text-transform:uppercase;
	}
	
/*Comments*/
.commentlist li{
	margin:0 0 20px 0;
	padding:10px;
}

	.comment-gravatar{
		float:left;
		margin-right:10px;
		padding:5px;
	}
	
	.comment-text p{
		font-size:12px;
	}
	
	.comment-text h4{
		font-size:11px;
	}

/*comment reply*/
	#post-comment{
		float:left;
	}
	
	#post-comment form{
		float:left;
	}
	
	#post-comment input, #post-comment textarea{
		float:left;
		padding:5px;
		margin:0 20px 20px 0;
		font-family:Arial, Helvetica, sans-serif, "Arial Narrow";
	}
	
	input#comment-submit{
		padding:10px;
		border:none;
		margin:0 0 20px 0;
		float:none;
		cursor:pointer;
	}
	
	#comment-textarea{
		font-size:14px;
		width:600px;
	}

/* Portfolio */
	
.Folio a{
		display:block;
		padding:10px;
		height:150px;
		margin:10px 0 10px 0;
	}
	
	.SingleFolio a{
		display:block;
		padding:10px;
		height:250px;
		margin:10px 0 10px 0;
		float:left;
	}
	
	.FolioItem h4{
		margin:0;
		padding:0;	
	}
	
	#FolioCat ul{
		margin:0;
		padding:0;
		list-style:none;
	}
	
	#FolioCat ul li{
		margin:0;
		padding:0;
		list-style:none;
		float:left;
	}
	
	#FolioCat ul li a{
		display:block;
		padding:10px;
		margin:20px 10px 20px 0;
		float:left;
		font-weight:bold;
	}
	
	#FolioCat ul li a:hover{
		display:block;
		padding:10px;
	}
	
	h1.Search{
		margin:0;
		padding:0;
	}
	
	#BlackBar{
		float:left;
		width:700px;
		margin-bottom:20px;
	}
	
	.SectionL{
		padding:10px;
		float:left;
	}
	
	.SectionR{
		padding:10px;
		float:right;
	}

/* Next and Previous buttons */

	#Next a{
		display:block;
		padding:10px;
		float:right;
		margin-bottom:20px;
	}
	
	#Prev a{
		display:block;
		padding:10px;
		float:left;
		margin-bottom:20px;
	}