/*
	@green:				#65a632
	@light_green:		#7bb74b
	@green_highlight:	#8cbc66
	
	@brown:				#424b36
	
	@peach:				#a66632
	@light_peach:		#d7833f
	
	@gray:				#dedfdd
	@gray_bg:			#eeeeee
*/

html, body {
	margin: 0 !important; padding: 0 !important;
	background: #454a37;
}

.highwhite { color: #fff; }
.highpink { color: #9a2638; }
.med { font-size: 1.17em; }
.big { font-size: 1.5em; }
.small-margin { margin-bottom: 0.5em; }
.divider { height: 20px; clear: both; }

.left { float: left; }
.right { float: right; }

.intro { font-size: 14px; }

.border { border: 2px solid #a66632; }
	img.border { padding: 2px; }

.hr { background: url(../img/divider-horizontal-gray.png) no-repeat center center; height: 2px; clear: both; }
	.hr.divider { margin: 0 0 28px 0; }
	.span-4 .hr { background-image: url(../img/divider-horizontal-small.png); }
		.span-4 .hr.divider { height: 20px; margin: 0 0 5px 0; }
.hrv { background: url(../img/divider-vertical-white.png) no-repeat center center; width: 2px; height: 99%; }

p.last, ul.last { margin-bottom: 0; }

#container { border-top: 4px solid #65a632; }
	.holder { width: 960px; margin: 0 auto; overflow: hidden; }

#header {
	border-top: 1px solid #8cbc66;
	border-bottom: 1px solid #8cbc66;
	background: #fff;
}
	#header .holder {
		height: 115px;
		background: url(../img/header-bg.png) no-repeat top left;
	}
	#header a {
		display: block;
		float: left;
		
		width: 251px;
		height: 78px;
		text-indent: -9999px;
		background: url(../img/header-logo.png) no-repeat;
		margin: 17px 0px 0px 15px;
	}
	

#menu {
	background: #65a632;
	height: 40px;
	border-bottom: 1px solid #8cbc66;
}
	#menu ul.menu {
		float: left;
		list-style-type: none;
		margin: 18px 0 0 0;
	}
		#menu ul.menu li {
			float: left;
			margin: 0;
		}
			#menu ul.menu li a {
				display: block;
				text-indent: -9999px;
				height: 41px;
				
				background: #424b36 url(../img/menu-sprite-tastic.png) no-repeat;
				
				color: #fff;
				font-size: 24px;
				text-decoration: none;
			}
				#menu ul.menu li a.home { width: 88px; background-position: 0px -41px; }
					#menu ul.menu li a.home:hover { background-position: 0px 0px; }
					#menu ul.menu li a.home.on, #menu ul.menu li a.home:active { background-position: 0px -82px; }
				
				#menu ul.menu li a.work { width: 129px; background-position: -88px -41px; }
					#menu ul.menu li a.work:hover { background-position: -88px 0px; }
					#menu ul.menu li a.work.on, #menu ul.menu li a.work:active { background-position: -88px -82px; }
					
				#menu ul.menu li a.blog { width: 78px; background-position: -217px -41px; }
					#menu ul.menu li a.blog:hover { background-position: -217px 0px; }
					#menu ul.menu li a.blog.on, #menu ul.menu li a.blog:active { background-position: -217px -82px; }
				
				#menu ul.menu li a.about { width: 124px; background-position: -295px -41px; }
					#menu ul.menu li a.about:hover { background-position: -295px 0px; }
					#menu ul.menu li a.about.on, #menu ul.menu li a.about:active { background-position: -295px -82px; }
					
				#menu ul.menu li a.contact { width: 109px; background-position: -419px -41px; }
					#menu ul.menu li a.contact:hover { background-position: -419px 0px; }
					#menu ul.menu li a.contact.on, #menu ul.menu li a.contact:active { background-position: -419px -82px; }
				
				#menu ul.menu li a.on, #menu ul.menu li a:active {
					background-color: #fff;
					color: #424b36;
				}

.banner {
	background: #fff;
	padding: 20px 0px;
	border-bottom: 1px solid #dedfdd;
}
	.banner .splitter {
		height: 60px;
		background: url(../img/divider-white.png) no-repeat center center;
		text-indent: -9999px;
	}
	.banner .phrase {
		margin: 15px 0 0 0;
		width: 632px;
		height: 36px;
		text-indent: -9999px;
		background: url(../img/banner-about.png) no-repeat;
	}
	.banner .button-talktous {
		display: block;
		height: 60px;
		text-indent: -9999px;
		background: url(../img/banner-button-contact.png) no-repeat center right;
	}
	
	.banner a.button {
		float: left;
		
		height: 40px;
		
		margin: 0 10px 0 0;
	}
		.banner a.latest {
			width: 113px;
			
			background: url(../img/blog-button-latest.png) no-repeat;
		}
		.banner a.popular {
			width: 137px;
			
			background: url(../img/blog-button-popular.png) no-repeat;
		}
		.banner a.browse {
			width: 121px;
			
			background: url(../img/blog-button-browse.png) no-repeat;
		}
		
	#search {
		position: relative;
	}
		#query {
			width: 250px;
			height: 28px;
			
			padding: 12px 0 0 10px;
			
			line-height: 29px;
			color: #fff;
			font-size: 18px;
			text-shadow: #52862a 0px 1px 0px;
			
			border: 0;
			background: url(../img/blog-search-bg.png) no-repeat left center;
		}
		#submit {
			position: absolute;
			top: 6px;
			right: 7px;
			
			width: 29px;
			height: 31px;
			
			text-indent: -9999px;
			
			cursor: pointer;
			border: 0;
			background: url(../img/blog-search-button.png) no-repeat top right;
		}
			#search:hover #submit { background-position: top left; }

.content {
	padding: 20px 0px 20px 0px;
	background: #eeeeee;
	border-bottom: solid #DEDFDD 1px;
}

  .content.last {
    border-bottom: 0;
  }

	.content h2, .content h3, .content h4 {
		color: #a66632;
		text-shadow: #fff 0px 1px 0px;
		text-transform: uppercase;
		font-weight: normal;
		margin: 0;
		line-height: 1em;
	}
		.content h2 { font-size: 28px; font-weight: bold; }
		.content h3 { font-size: 24px; }
		.content h4 { font-size: 18px; }
	
	.date { font-style: italic; }
	
	.button { display: block; text-indent: -9999px; }
		#btn-viewmore {
			float: right;
			width: 158px;
			height: 46px;
			
			margin: -6px 0 0 0;
			
			background: url(../img/button-viewmore.png) no-repeat center center;
		}
	
	#we-are {
		display: block;
		width: 260px;
		height: 90px;
		
		margin: 0 0 20px 0;
		
		background: url(../img/content-weare.png) no-repeat center center;
		text-indent: -9999px;
	}
	
	ul.list-boxes {
		margin: 0 0;
		padding: 0;
		
		list-style-type: none;
	}
		ul.list-boxes li { margin: 0 0 5px 0; }
		ul.list-boxes .bg {
			padding: 10px 0 0 0;
			
			background: url(../img/content-article-box.png) no-repeat top center;
		}
		ul.list-boxes li .bg {
			padding: 0 12px 10px 12px;
			
			background-position: bottom center;
		}
			ul.list-boxes a {
				display: block;
				
				padding: 0 0 0 38px;
				
				background: url(../img/content-article-icon-off.png) no-repeat left center;
				text-decoration: none;
			}
				ul.list-boxes a:hover { background-image: url(../img/content-article-icon-on.png); }
			ul.list-boxes h4 {
				margin: 0;
				
				font-size: 16px;
				color: #424b36 !important;
				font-weight: bold;
				text-transform: none !important;
			}
			ul.list-boxes .caption {
				font-style: italic;
				color: #999;
			}
				ul.list-boxes .caption span { color: #a66632; }
	
	#intro div {
		height: 55px;
		width: 255px;
		
		margin-bottom: 30px;
		padding: 5px 0 0 70px;
		
		background: url(../img/content-technologies.png) no-repeat;
	}
		#intro h3 {
			color: #424b36;
			line-height: 26px;
		}
		#intro p {
			font-size: 14px;
			line-height: 18px;
			margin: 0;
		}
		#intro #idea { background-position: 0px 0px !important; }
		#intro #ruby { background-position: 0px -210px !important; }
		#intro #iphone { background-position: 0px -70px !important; }
		#intro #wildcard { background-position: 0px -140px !important; }
		
	#project { }
		#project h3 { margin: 0; }
	
	#badges { }
		#badges span {
			float: left;
			height: 23px;
				
			margin: 0 5px 0 0;
			
			text-indent: -9999px;
			
			background: url(../img/ourwork-badges.png) no-repeat;
		}
			#badges span.badge-rails { width: 65px; background-position: 0px -100px; }
			#badges span.badge-facebook { width: 89px; background-position: 0px -75px; }
			#badges span.badge-ning { width: 60px; background-position: 0px -50px; }
			#badges span.badge-iphone { width: 73px; background-position: 0px -25px; }
			#badges span.badge-javascript { width: 97px; background-position: 0px 0px; }
	
	#portfolio {
		list-style-type: none;
		overflow: hidden;
		margin: 0 0 -10px 0;
		padding: 0 20px;
	}
		#portfolio li { width: 230px; float: left; margin: 0 0 10px 0; }
			#portfolio li a {
				display: block;
				
				width: 215px;
				height: 56px;
				
				padding: 5px 0 0 5px;
				
				overflow: hidden;
				
				text-decoration: none;
				
				background: url(../img/ourwork-bg.png) no-repeat;
			}
				#portfolio li a img {
					float: left;
					margin: 0 10px 0 0;
				}
				#portfolio li a h4 { 
					color: #343b2b;
					font-size: 18px;
					margin: 4px 0 0 0;
				}
				#portfolio li a p {
					margin: 0;
					font-weight: bold;
					color: #a66632;
				}
				
				
	.blog { }
		.blog p { font-size: 14px; text-align: justify; }
		.blog img.left { margin-right: 10px; }
		.blog img.right { margin-left: 10px; }
		
		.comment {
			position: relative;
			
			width: 240px;
			
			margin: 0 0 5px 0;
			padding: 20px 10px 20px 10px;
			
			background: url(../img/blog-comment.png) no-repeat top center;
		}
			.comment .author {
				position: absolute;
				bottom: 0; left: 0;
				
				width: 240px;
				height: 20px;
				
				padding: 0 10px 5px 10px;
				
				text-align: right;
				font-style: italic;
				font-size: 11px;
				color: #999;
				
				background: url(../img/blog-comment.png) no-repeat bottom center;
			}
				.comment .author a { text-decoration: none; }
				
		.comment.c2c, .comment.c2c .author { background-image: url(../img/blog-comment-c2c.png); }
			.comment.c2c p, .comment.c2c .author { color: #fff !important; }
			.comment.c2c a { color: #fff; font-weight: bold; }
		
		#add-comment {
			margin: 5px 0 0 0;
		}
			#add-comment p {
				margin: 0 0 5px 0;
			}
			#add-comment label {
				float: left;
				
				width: 70px;
				
				margin: 0 10px 0 0;
				clear: left;
				
				font-size: 14px;
				color: #65a632;
				line-height: 28px;
			}
			#add-comment input, #add-comment textarea {
				width: 168px;
				
				border: 1px solid #DEDFDD;
				-moz-border-radius: 3px;
				-webkit-border-radius: 3px;
				
				padding: 5px;
				
				font-size: 14px;
			}
				#add-comment input:focus, #add-comment textarea:focus { border: 1px solid #65a632; }
				#add-comment textarea {
					width: 248px;
				}
			#add-comment #send {
				float: right;
				
				width: 130px;
				height: 30px;
				
				text-indent: -9999px;
				
				border: 0;
				cursor: pointer;
				background: url(../img/blog-button-addcomment.png) no-repeat;
			}
		
				
	.contact { }
		.contact h3#logo {
			width: 270px;
			height: 25px;
			
			margin: 0 0 5px 0;
			
			text-indent: -9999px;
			
			background: url(../img/contact-codetocustomer.png) no-repeat;
		}
		.contact h4 {
			margin: 0 0 5px 0;
			
			text-transform: none !important;
		}
		.contact .intro {
			margin: 0;
			
			font-weight: bold;
		}
		
	.nik {
		width: 173px;
		height: 77px;
		
		padding: 0 0 0 87px;
		
		background: url(../img/contact-what.png) no-repeat;
	}
		.nik h3 {
			height: 17px;
			
			margin: 8px 0 5px 0 !important;
			
			text-indent: -9999px;
		
			background: url(../img/contact-who.png) no-repeat;
		}
		.nik h4 {
			font-size: 14px !important;
			text-transform: none !important;
			line-height: 18px !important;
		}
		.nik { background-position: top left; }
			.nik h3 { background-position: top left; }
	
	
				
#footer {
	padding: 20px 0;
	margin-bottom: -20px;
	
	border-top: 1px solid #fff;
	
	background: #424b36 url(../img/footer-bg.png) repeat-x top left;
	color: #fff;
}
	#footer p { font-size: 14px; }
		#footer p a { color: #80d23f; text-decoration: none; }
		
	#footer h3 { text-transform: uppercase; text-shadow: #252c1d 0px 1px 0px; }
	
	#footer #contact-box {
		width: 658px;
		height: 39px;
	}
		#contact-box a { color: #fff; }
		#contact-box .email, #contact-box .call, #contact-box .more {
			display: block;
			float: left;
			
			height: 39px;
			
			line-height: 38px;
			text-align: center;
			color: #fff;
			font-size: 14px;
			font-weight: bold;
			
		  text-transform: none !important;
			text-shadow: #90592b 0px 1px 0px;
			
			background: url(../img/footer-contact.png) no-repeat;
		}
			#contact-box .email { background-position: top left; width: 297px; }
			#contact-box .call { background-position: -297px 0px; width: 218px; }
			#contact-box .more {
				background-position: top right;
				width: 143px;
				text-transform: uppercase;
				text-shadow: #568d2a 0px 1px 0px;
			}
			
	#footer #stats {
		margin: 0 0 25px 0;
	}
		#stats strong {
			float: left;
			
			width: 140px;
			
			color: #d7833f;
			text-shadow: #252c1d 0px 1px 0px;
			
			clear: left;
		}
	
	


/* Web Design by Bandit.co.nz */
#bandit {
	display: block;
	float: right;
	
	text-indent: -9999px;
	
	width: 64px;
	height: 39px;
	
	background: url(../img/footer-bandit-sprite.png) no-repeat top left;
}
	#bandit:hover { background-position: top right; }

.project-list .holder .inner {
  
  margin-top: 20px;
  padding: 10px;
  
}

  .project-list .holder .inner:hover {
    background: #dedfdd;
    -webkit-border-radius: 10px;
  }
  
  .project h3 {
    color: #424b36;
    margin-bottom: 4px;
  }
  
  .project h4 {
    font-size: 14px;
    margin-bottom: 5px;
  }