/*Main styles for new Fourhats*/

@import "http://yui.yahooapis.com/2.4.0/build/reset/reset-min.css";
@import "http://yui.yahooapis.com/2.4.0/build/base/base-min.css";
@import "http://yui.yahooapis.com/2.4.0/build/fonts/fonts-min.css";

h2 {font-family: Georgia, Times, serif; font-weight: normal; font-size: 1.6em; padding: 5px 0;}
.home #content_sub h3 a {font-family: Georgia, Times, serif; font-weight: normal; font-size: 1.3em; padding: 5px 0;}
h4 {font-family: Verdana,Geneva,Arial,Helvetica,sans-serif; font-weight: normal;}

.home #content_sub a, .knowledge #content_sub a {color: #008491;}

dl {margin-left:2em;}
dt {margin-bottom:0.25em;}
.resourcing dd {background:transparent url(/images/images/arrow-resourcing.gif) no-repeat scroll left 50%; margin-bottom:1em; padding-left:2em;}
.home dd {background:transparent url(/images/images/arrow-home.gif) no-repeat scroll left 50%; margin-bottom:1em; padding-left:2em;}

body{color:#666666; font-family:Verdana,Geneva,Arial,Helvetica,sans-serif; line-height: 1.3em;}
#nav_access{
	position: absolute;
	left:-999em;
}

.container{
	margin:0 auto;
	position:relative;
	max-width:950px;
	width:auto;
}

#branding .container{
	position:relative;
	height: 46px;
}

#branding h1{margin:0;}

#branding h1 a{
	display:block;
	text-indent: -999em;
	background:url(/images/images/fourhats.gif);
	width:208px;
	height: 69px;
	position:absolute;
	right:0;
	outline:none;
	z-index:50;
}

a{text-decoration:none;}

a:hover{text-decoration:underline;}

abbr{border:0;}

legend{font-weight:bold;}

form dl, form dt, form dd{
	margin:0;
	padding:0;
}

form dl input, form dl input[type=text], form dl textarea{
	width:100%;
	border:1px solid #dadada;
}

/* #nav_main */
	#nav_main h4{
		display: none;
	}

	#nav_main ul li{
		float:left;
		height:39px;
		z-index:20;
		position:relative;
		top:0px;
	}

	#nav_sub{
		border-top:1px solid #4aadb7;
	}

	.websites #nav_sub{
		border-top-color: #25d4e2;
	}
	
	.resourcing #nav_sub{
		border-top-color: #a125d2;
	}
	
	.consulting #nav_sub{
		border-top-color: #ea943c;
	}
	
	.development #nav_sub{
		border-top-color: #1eca4d;
	}
	
	#nav_main ul li, #nav_main ul{
		list-style-type: none;
		margin:0;
		padding:0;
	}
	
	#nav_main a{
		display:block;
		background:#eee;
		margin:0;
		height:41px;
		float:left;
		outline:none;
		text-indent:-999em;
	}
	
	#nav_main .home a, #nav_main .home {
		background: url(/images/images/tab_home.gif) no-repeat 0 -43px;
		width: 96px;
	}

	#nav_main .websites a, #nav_main .websites{
		background: url(/images/images/tab_web_dev.gif) no-repeat 0 -43px;
		width: 147px
	}
	
	#nav_main .development a, #nav_main .development{
		background: url(/images/images/tab_development.gif) no-repeat 0 -43px;
		width: 130px;
	}
	
	#nav_main .consulting a, #nav_main .consulting{
		background: url(/images/images/tab_consulting.gif) no-repeat 0 -43px;
		width:111px;
	}
	
	#nav_main .resourcing a, #nav_main .resourcing{
		background: url(/images/images/tab_resourcing.gif) no-repeat 0 -43px; 
		width: 115px;
	}
	
	body.home #nav_main .home a,
	body.websites #nav_main .websites a,
	body.development #nav_main .development a,
	body.consulting #nav_main .consulting a,
	body.resourcing #nav_main .resourcing a{
		background-position: 0 0;
	}

	#nav_main .home,
	#nav_main .websites,
	#nav_main .development,
	#nav_main .consulting,
	#nav_main .resourcing{
		background-position: 0 -43px;
	}
	
	body.home #nav_main .home,
	body.websites #nav_main .websites,
	body.development #nav_main .development,
	body.consulting #nav_main .consulting,
	body.resourcing #nav_main .resourcing{
		z-index:5000;
		position:relative;
	
	}

	#nav_main  a:hover{
		background-position: 0 -86px;
	}
	
	
/* nav_sub */
	#nav_sub{
		clear:both;
		background:#eee;
		position:relative;
		height:2.2em;
		line-height: 2.2em;
		border-bottom:1px solid #fff;
		z-index:25;
	}
	
	#nav_sub ul{
		margin:0;
		padding:0;
	}
	
	#nav_sub li{
		list-style-type: none;
		float:left;
	}
	
	#nav_sub li.first a{border-left:none;}
	
	#nav_sub li.last a{border-right:none;}
	
	#nav_sub li a{
		color: #000;
		border-right:1px solid #fff;
		border-left: 1px dashed #c3c3c3;
		padding:0 10px;
	}
	
	#nav_sub form{
		position:absolute;
		right:0;
		top:0;
		text-align: right;
		font-size:.8em;
	}
	
	#nav_sub form .textfield{width:7.5em;}

/*Breadcrumb*/
	#breadcrumb{
		text-align:right;
		color:#777;
		padding-top:.5em;
		margin-bottom:-1em;
		position:relative;
		z-index:50;
	}

	#breadcrumb span{color:#000;}

	#breadcrumb .container{
		position:relative;
		right:20px;
	}

	
/* content_main */
	#content_main{
		background: #000101 url(/images/images/bg_topbar_home.gif) repeat-x top;
		border-top:1px solid #dcdcdc;
		height:226px;
	}

	#content_main, #content_main .container{
		height:17.5em;
		min-height:226px;
	}
	
	#breadcrumb{clear:both;}

	#content_main .container{
		background: #000202 url(/images/images/bg_topbar_home_light.gif) repeat-x top;
	}
	
	#content_main .one, #content_main .two, #content_main .three{
		float:left;
		margin:0;
		padding:0 2%;
		width:29%;
		height: 226px;
		border-left:1px solid #4d8f96;
		border-right:1px solid #005860;
		color:#fff;
	}
	
	#content_main .container:after{
		content: "."; 
		display: block; 
		height: 0; 
		clear: both; 
		visibility: hidden;
	}

	#content_main a{
		color: #fff;
	}
	
	#content_main .one {border-left:none;}
	
	#content_main .three{
		border-right: none;
	}
	
	#content_main h2{margin-bottom:0;}
	
	.home #content_main .one span{
		background:url(/images/images/icon_home.jpg) no-repeat top;
		height:249px;
		margin-bottom:-23px;
		display:block;
		width:100%;
	}
	
	.websites #content_main{
		background: #018d98 url(/images/images/bg_topbar_blue.gif) repeat-x top;
	}
	
	.websites #content_main .container{
		background: #018e99 url(/images/images/bg_topbar_blue_light.gif) repeat-x top;
	}
	
	.resourcing #content_main {
		background: #7c019b url(/images/images/bg_topbar_purple.gif) repeat-x top;
	}
	
	.resourcing #content_main .container{
		background: #8b03a6 url(/images/images/bg_topbar_purple_light.gif) repeat-x top;
	}
	
	.consulting #content_main{
		background: #c66604 url(/images/images/bg_topbar_orange.gif) repeat-x top;
	}
	
	.consulting #content_main .container{
		background: #cd7607 url(/images/images/bg_topbar_orange_light.gif) repeat-x top;
	}
	
	.development #content_main {
		background: #0c6216 url(/images/images/bg_topbar_green.gif) repeat-x top;
	}
	
	.development #content_main .container {
		background: #0e6618 url(/images/images/bg_topbar_green_light.gif) repeat-x top;
	}
	
	.websites #content_main .one, .websites #content_main .two, .websites #content_main .three{
		border-right-color: #42bdc7;
		border-left-color: #59e5ed;
	}
	
	.resourcing #content_main .one, .resourcing #content_main .two, .resourcing #content_main .three{
		border-right-color: #6805a3;
		border-left-color: #b957d6;
	}
	
	.consulting #content_main .one, .consulting #content_main .two, .consulting #content_main .three{
		border-right-color: #d7933b;
		border-left-color: #f4b65b;
	}
	
	.development #content_main .one, .development #content_main .two, .development #content_main .three{
		border-right-color: #2e9a30;
		border-left-color: #46cd3f;
	}
	
	.websites #content_main .has-image {
		background:url(/images/images/icon_web_design.jpg) no-repeat top;
	}
	
	.resourcing #content_main .has-image{
		background:url(/images/images/icon_resourcing.jpg) no-repeat top;
	}
	
	.consulting #content_main .has-image{
		background:url(/images/images/icon_consulting.jpg) no-repeat top;
	}
	
	.development #content_main .has-image{
		background:url(/images/images/icon_development.jpg) no-repeat top;
	}
	
	.knowledge #content_main .has-image{
		background:url(/images/images/icon_knowledge.jpg) no-repeat top;
	}

	#content_main .wider{
		width:60%;
		border-right:none;
	}
	
	.websites .bold, .websites a, .websites h4{color:#069da9;}
	
	.consulting .bold, .consulting a, .consulting h4, .consulting strong em, .consulting abbr{
		color: #ef8600;
	}
	
	.feature abbr, strong em{
		font-weight:bold;
		font-style: normal;
	}
	
	.resourcing .bold, .resourcing a, .resourcing h4{
		color: #9412ac;
	}
	
	.development .bold, .development a, .development h4, .development strong em, .development abbr{
		color: #0ba731;
	}

/* content_sub */	
	#content_sub .one, #content_sub .two{padding:3%;}
	
	#content_sub .one{
		width:50%;
		float:left;
	}
	
	#content_sub .two {
		float:right;
		width:33%;
	}
	
	#content_sub .two .inner1{
		background:url(/images/images/bg_box_tl.gif) no-repeat top left;
	}
	
	#content_sub .two .inner2{
		background:url(/images/images/bg_box_tr.gif) no-repeat top right;
	}
	
	#content_sub .two .inner3{
		background:url(/images/images/bg_box_bl.gif) no-repeat bottom left;
	}
	
	#content_sub .two .inner4{
		background:url(/images/images/bg_box_br.gif) no-repeat bottom right;
		padding:45px 35px 45px 45px;
	}

	#content_sub .two .inner1, #content_sub .two .inner2, #content_sub .two .inner3, #content_sub .two .inner4{min-height:1px;}
	
	#content_sub .one .one, #content_sub .one .two{
		width:50%;
		padding:0;
	}

	#content_sub h2{
		background: url(/images/images/bg_h2.gif) no-repeat bottom right;
	}

	#content_sub h3{
		font-size:1em;
		margin-bottom:0;
	}
	
	#content_sub h4{
		margin-bottom: 1em;
	}
	
	#content_sub blockquote{
		margin:0;
		padding:0;
		font-style: italic;
	}
	
	#content_sub blockquote cite{
		color: #069da9;
	}
	
	#content_sub blockquote cite strong{
		display: block;
		font-weight: normal;
		color:#333;
	}
	
	/*Knowledge base link*/
		.knowledge-link, .knowledge-link:hover{
			display:block;
			background:url(/images/images/bg_knowledge_tl.jpg) no-repeat top left;
			text-decoration: none;
			margin-bottom: 1em;
			font-size:.9em;
		}
		
		.knowledge-link .inner{
			display: block;
			background:url(/images/images/bg_knowledge_tr.jpg) no-repeat top right;
		}
		
		.knowledge-link .inner .inner{
			background:url(/images/images/bg_knowledge_bl.gif) no-repeat bottom left;
		}
		
		.knowledge-link .inner .inner .inner{
			background:url(/images/images/bg_knowledge_br.gif) no-repeat bottom right;
			padding:10px 90px 10px 10px;
			color:#fff;
			min-height:123px;
		}
		
		.knowledge-link strong{
			display:block;
			border-bottom:1px solid #fff;
			font-weight: normal;
			font-family:"Lucida Grande", "Lucida Sans Unicode";
			background:url(/images/images/bg_knowledge_underline.gif) no-repeat bottom right;
			padding:0 0 5px;
			margin-bottom: 5px;
			font-size: 1.2em;	
		}

		#content_sub .knowledge-link strong span{color:#fff;}
		
		.hide{
			/* position: absolute; */
			font-size:1px;
		}
		
		.bold{
			font-weight: bold;
		}
		
	/*Feature box*/
		.feature{
			background: url(/images/images/bg_box_inner_tl.gif) no-repeat top left;
			text-align: center;
			margin-bottom:1em;
		}
		
		.feature .inner{
			background: url(/images/images/bg_box_inner_tr.gif) no-repeat top right;
		}
		
		.feature .inner .inner{
			background: url(/images/images/bg_box_inner_bl.gif) no-repeat bottom left;
		}
		
		.feature .inner .inner .inner{
			background: url(/images/images/bg_box_inner_br.gif) no-repeat bottom right;
			padding:12px;
		}
		
		.feature img{
			border:1px solid #dadada;
			margin-bottom:1em;
		}
		
		.feature p, .feature h3, .feature h4, .feature dl, .feature ul{
			text-align: left;
		}
		
		#content_sub .two h2{
			font-size:1.3em;
			background:none;
			margin:0;
		}

		#content_sub .two h3{margin:0;}

		#content_sub .one .two h3{margin-top:1em;}
		
		#content_sub .two h2.bar-above{
			background:url(/images/images/divide.gif) no-repeat top;
			padding:12px 0 0;
			margin-bottom:.5em;
		}
		
		#content_sub .two h2 .bold{color:#666;}
	
/* footer */
	#siteinfo{
		clear:both;
		padding:2%;
		text-align: center;
		background: url(/images/images/bg_footer.gif) no-repeat top;
	}
	
	#siteinfo *{
		display:inline;
		text-decoration: none;
		color: #7b7b7b;
		font-size:.95em;
	}
	
	#siteinfo .org span{
		font-weight: bold;
	}
	
	#siteinfo .adr{
		border-left:1px solid #7b7b7b;
		border-right:1px solid #7b7b7b;
		margin:0 1em;
		padding: 0 1em;
	}
	
	#siteinfo .tel{
		border-right:1px solid #7b7b7b;
		padding-right:1em;
		margin-right:1em;
	}

/*Resolutions dependent  layout*/
.thin #content_main .has-image{ display: none; }

.thin #content_main .container div{width:45.5%;}
.thin #content_main .container .wider {width:90%;}

.thin #content_sub .one, .thin #content_sub .two, .thin #content_sub .one .one, .thin #content_sub .one .two{ float:none; width:auto; }

/*News pages*/
.news h3 a{
	font-size:1.4em;
	color:#666;
	text-decoration:none;
	font-family:"Lucida Grande","Lucida Sans Unicode",sans-serif;
	font-weight:normal;
}

/*Contact form*/
fieldset dt{
	float:left;
	width:40%;
	text-align:right;
	padding-right:2%;
}

fieldset dl dd{
	width:50%;
	float:left;
	padding:0 0 6px 2px;
	margin:0;
}

fieldset p.submit{text-align:left; padding-left:42%}

.clear { clear: both; }
p.right {text-align: right;}
p.center {text-align: center;}
img.left {float:left; padding-right: 20px; padding-bottom: 20px; }
img.right {float:right; padding-left: 20px; padding-bottom: 20px; }

/*Bullets*/
#content_main li, #content_sub li {list-style-image:url(/images/images/bullet.png);}


#content_sub ul ul{padding:0; margin-top:0.25em;}

#content_main li{list-style-image:url(/images/images/bullet_plus.gif)}

#content_main li{margin-bottom:1em;}

#wrapper #content_sub li li{margin-left:0; list-style-type:none; list-style-image: url(/images/images/bullet-minus.png);}
#content_sub li ul{margin-left:1em;}

/*Centering stuff in the top bar*/
#wrapper #content_main .outer {position: relative;}
#wrapper #content_main .outer {display: table; position: static;}
#wrapper #content_main .middle {display: table-cell; vertical-align: middle; position: static;}