/*
	NHS Creative 2009 site CSS: main v1.0
	Born: 12 Nov 2009
	
	-- History --
	12 Nov 2009 - work begins
	11 Dec 2009 - Gallery fixes for IE's benefit
	----
*/

/* IE6 WARNING */
p#iewarning { position:absolute; z-index:5; display:block; height:30px; background-color:#dff73e; padding: 10px 16%; }

/* TOOLS */
.hide { position:relative; left:-999em; }
.collapse { display:none; }
.clear { clear:both; }

/* BASICS  */
body {
	font: 16px/1.25em /*16px/20px*/ Helvetica, Arial, sans-serif;
	color:#0b2700;
	background:#1c4705 url(../images/body-bck.jpg) top center no-repeat;
}

#page {
	margin: 0 auto;
	width: 940px;
	background:#1c4705 url(../images/page-bck.jpg) top center no-repeat;
}

.left { float:left; width:380px; }
.right { float:right; width:380px; }

/* typography */
	p { font-size:0.875em /*14px*/; line-height:1.4em; margin-bottom:0.5em; }
	
	h1 { font-size:1.53em; }
	h2 { font-size:1.313em; }
	h3 { font-size:1.203em; }
	h4 { font-size:1.05em; }
	h5 { font-size:1.1em; }
	h6 { font-size:1em; }
	
	a, a:link { font-weight:bold; color:#011e00; }
	a:hover { color:#133712; }
	
	abbr { border-bottom:1px dotted; cursor:help;}

/* HEADER */
#header { position:relative; width:940px; height:180px; }

	h1#logo {
		position:absolute;
		display:block;
		width:101px;
		height:64px;
		right:79px;
		top:25px;
		background: url(../images/logo.jpg) top right no-repeat;
	}
	
	h2#tagline {
		position:absolute;
		display:block;
		width:341px;
		height:148px;
		left:83px;
		top:31px;
		background: url(../images/tagline.jpg) top left no-repeat;
	}

/* MAIN */
#main {
	position:relative;
	margin: 0 auto;
	width:820px;
	background: #205e07 url(../images/main-repeat.gif) top center repeat-y;
}
	span#main_corners {
		display:block;
		width:820px;
		height:19px;
		background: #205e07 url(../images/main-corners.gif) top center no-repeat;
	}
	
	#wrap {
		position:relative;
		left:20px;
		width:780px;
		padding-bottom:20px;
	}
	
/* FOOTER */
#footer {
	position:relative;
	margin: 0 auto 20px;
	width:820px;
	background: #205e07 url(../images/main-repeat.gif) top center repeat-y;
	/*text*/
	color:#feff94;
}

	h3#contact {
		display:block;
		margin: 0 0 8px 20px;
		width:780px;
		height:26px;
		background: #103500 url(../images/contact_us-bck.gif) top center no-repeat;
		/*text*/
		font-size:1.05em;
		color:#dff73e;
	}
		h3#contact span { position:absolute; padding:4px 5px;}
		#footer a { color:#feff94; font-weight:bold; }
			#footer a:hover { color:#e0e17a; }

/* details */	
	#details {
		margin:auto 20px;
		font-size:0.875em /*14px*/;
	}
		img#map-button { float:left; padding-right:6px; }
		#details ul { font-size:0.875em; }
		h4#email_toggle { position:relative; top:-16px; width:380px; background:url(../images/footer_email-triangle.gif) 132px 5px no-repeat; font-size:0.875em; text-decoration:underline; }
			h4#email_toggle:hover { cursor:pointer; }
			span#email_icon { position:relative; display:block; width:22px; height:16px; float:left; top:3px; padding-right:5px; background:url(../images/footer_email-icon.gif) top left no-repeat; }

/* email form */	
	#email_form {
		display:none;
		height:230px;
		background:#103500 url(../images/form_bck.gif) top center no-repeat;
		padding:20px;
	}
		#email_form p { margin-bottom:8px; }
		#email_form label { display:block; float:left; width:160px; font:bold 0.875em /*14px*/ Helvetica, Arial, sans-serif; }
		#email_form div.right label { display:block; float:left; width:80px; }
		#email_form input { width:212px; padding:6px 4px; margin:0; border:0; height:18px; background-color:#feff97; font:12px Helvetica, Arial, sans-serif; }
			#email_form input.fmverify { width:80px; height:12px; text-transform:uppercase; font-weight:bold; text-align:center; }
		#email_form textarea { width:292px; padding:4px; margin:0; border:0; height:150px; background-color:#feff97; font:12px Helvetica, Arial, sans-serif; }
			#button-row { position:relative; left:80px; width:300px; }
			input#form-submit { position:relative; width:140px; height:32px; right:-16px; margin:0; border:0; padding:0; background: #f5f958 url(../images/form_send-button.gif) no-repeat; color:#103500; font:bold 14px Helvetica, Arial, sans-serif; }
			input#form-cancel { width:140px; height:32px; margin:0; border:0; padding:0; background: #8ab33c url(../images/form_cancel-button.gif) no-repeat; color:#103500; font:bold 14px Helvetica, Arial, sans-serif; }
				#email_form input:focus, #email_form textarea:focus { background-color:white; }
				input#form-submit:hover, input#form-cancel:hover { cursor:pointer; }
		#email_form img {margin-right:6px; float:left; padding-right:18px; background:url(../images/form_image-verify-bck.gif) top right no-repeat; }
	
	#email_form_sent { display:block; height:36px; padding:20px; background:#103500 url(../images/form_bck.gif) top center no-repeat; }
		#form_sent { text-align:center; padding:0 25%; }

/* endpiece */	
	#endpiece {
		position:relative;
		display:block;
		width:820px;
		height:70px;
		background: #205e07 url(../images/footer-endpiece.gif) top center no-repeat;
	}
		#endpiece p#credit { position:absolute; bottom:7px; right:104px; font-size:0.65em; margin-bottom:0; }
		span#nhshampshire {
			display:block;
			position:absolute;
			width:68px;
			height:34px;
			bottom:10px;
			right:20px;
			background: #205e07 url(../images/footer-nhshampshire.gif) top right no-repeat;
		}

/*-- HOME --*/

/* gal_panel */
#gal_panel { position:relative; height:423px; background:#205e07 url(../images/gal_panel-bck.gif) top center no-repeat; }
	#gal_panel ul {}
	#gal_panel li { padding-bottom:3px; }
	#gal_panel a { position:relative; display:block; width:380px; height:138px; overflow:hidden; text-decoration:none; }
		#gal_panel li.one a:hover { background:#205e07 url(../images/home_gal_1-ON.jpg) top left no-repeat; }
		#gal_panel li.two a:hover { background:#205e07 url(../images/home_gal_2-ON.jpg) top left no-repeat; }
		#gal_panel li.three a:hover { background:#205e07 url(../images/home_gal_3-ON.jpg) top left no-repeat; }
	#gal_panel img { position:absolute; left:0; top:0; }
		#gal_panel a img:hover { position:absolute; }
	#gal_panel span.gal-context { position:absolute; right:-162px; top:2px; display:block; width:160px; height:136px; color:#fff; background:url(../images/gal_roll.png) top right no-repeat; }
	#gal_panel span.gal-tease { position:absolute; top:10px; left:20px; width:120px; font-size:0.75em /*12px*/; line-height:1.4em; font-weight: normal; }
	#gal_panel span.gal-tease strong { display:block; font-size:1.5em /*24px*/; line-height:1.2em; margin-bottom:5px; }

/* preview_box */
#preview_box { position:relative; }
	
/* tab_list */
#tab_list { position:relative; display: block; overflow:hidden; height:112px; background:#205e07 url(../images/home_tab-list-bck.gif) top center no-repeat; }
	#tab_list li { display:inline; }
	#tab_list a { display:block; width:126px; height:112px; float:left; text-decoration:none; }
	#tab_list li.one a, #tab_list li.two a { margin-right:1px; }
		#tab_list li.one a, #tab_list li.one a:link { background:#6ea307 url(../images/home_tab-list-1.gif) 0 0 no-repeat; }
			#tab_list li.one a:hover, #tab_list li.one a.on { background:#feff97 url(../images/home_tab-list-1.gif) 0 -112px no-repeat; }
		#tab_list li.two a, #tab_list li.two a:link { background:#6ea307 url(../images/home_tab-list-2.gif) 0 0 no-repeat; }
			#tab_list li.two a:hover, #tab_list li.two a.on { background:#feff97 url(../images/home_tab-list-2.gif) 0 -112px no-repeat; }
		#tab_list li.three a, #tab_list li.three a:link { background:#6ea307 url(../images/home_tab-list-3.gif) top left no-repeat; }
			#tab_list li.three a:hover, #tab_list li.three a.on { background:#feff97 url(../images/home_tab-list-3.gif) 0 -112px no-repeat; }

/* tab_frame */
#tab_frame { position:relative; display:block; overflow:hidden; width:380px; height:308px; background:#C6DE28 url(../images/home_tab-frame-bck.gif) top center no-repeat; }
	.tab_frame_content { margin:2px 10px 10px 10px; height:296px; }
	.tab_frame_content p { color:#0b2700; }
	
	#blog_tease { margin-top:20px; }
		#blog_tease h4#ourblog { display:block; visibility:visible; width:359px; height:26px; background:#205e07 url(../images/home_blog-tease-h3-bck.gif) top left no-repeat; color:#dff73e; font-size:1.065em /*17px*/; }
			#blog_tease h4#ourblog span { position:absolute; padding:4px 5px; }
		#blog_tease h4 { font-size:1em /*16px*/; margin:6px 0 4px 0; }
		#blog_tease p { font-size:0.75em /*12px*/; }
		
	#how {}
		#how span.arrow { display:block; width:50px; height:306px; float:left; margin-right:10px; background:transparent url(../images/home_how-arrow.gif) center 31px no-repeat; }
		#how p { font-size:1em /*16px*/; }
		
/*-- SIMPLE NAV --*/

/* simple_nav */
ul#simple_nav { position:relative; margin-bottom:-4px; top:-19px; width:820px; height:30px; font-size:0.875em; }
	ul#simple_nav li a { 
		display:block;
		margin:0 auto;
		padding-top:3px;
		text-align:center;
		width:251px;
		height:30px;
		background: #205e07 url(../images/simple_nav-bck.gif) top center no-repeat;
		color:#feff94;
		font-weight:bold;
	}
		#ul#simple_nav li a:hover { color:#e0e17a; }
		
/*-- SERVICES --*/
#design, #recruitment, #social, #web { display:block; height:284px; background:#c6de28 url(../images/services_box-bottom.gif) center bottom no-repeat; }
#design, #recruitment {margin-bottom:20px;}
	#design h3, #recruitment h3, #social h3, #web h3 { display:block; height:37px; background:#dff73e url(../images/services_h3-bck.gif) center top no-repeat; font-size:1.375em /*22px*/; color:#000; }
		#design h3 span, #recruitment h3 span, #social h3 span, #web h3 span { position:relative; top:10px; left:10px; }
		#design p, #recruitment p, #social p, #web p { color:#0b2700; }
		#design img, #recruitment img, #social img, #web img { float:right; margin:0 0 10px 10px; }
		.service_pad { padding:10px; }
		
/*-- GALLERY --*/

/* gal_tabs */
ul#gal_tabs { position: relative; width:780px; height:111px; overflow:hidden; background:transparent url(../images/gallery_gal-tab-bck.gif) top center no-repeat; }
	ul#gal_tabs li { display:inline; }
	ul#gal_tabs a { display:block; width:246px; height:111px; float:left; text-decoration:none;  }
	ul#gal_tabs li.one a, ul#gal_tabs li.two a { margin-right:21px; }
		#gal_tabs li.one a, #gal_tabs li.one a:link { background:url(../images/gallery_tab-list-1.jpg) 0 0 no-repeat; }
			#gal_tabs li.one a:hover { background:url(../images/gallery_tab-list-1.jpg) 0 -111px no-repeat; }
			#gal_tabs li.one a.on, #gal_tabs li.one a.on:hover { background:url(../images/gallery_tab-list-1.jpg) 0 -222px no-repeat; }
		#gal_tabs li.two a, #gal_tabs li.two a:link { background:url(../images/gallery_tab-list-2.jpg) 0 0 no-repeat; }
			#gal_tabs li.two a:hover { background:url(../images/gallery_tab-list-2.jpg) 0 -111px no-repeat; }
			#gal_tabs li.two a.on, #gal_tabs li.two a.on:hover { background:url(../images/gallery_tab-list-2.jpg) 0 -222px no-repeat; }
		#gal_tabs li.three a, #gal_tabs li.three a:link { background:url(../images/gallery_tab-list-3.jpg) 0 0 no-repeat; }
			#gal_tabs li.three a:hover { background:url(../images/gallery_tab-list-3.jpg) 0 -111px no-repeat; }
			#gal_tabs li.three a.on, #gal_tabs li.three a.on:hover { background:url(../images/gallery_tab-list-3.jpg) 0 -222px no-repeat; }

/* gal_frame */		
#gal_frame { position:relative; width:780px; height:404px; overflow:hidden; background:#053202 url(../images/gallery_gal-frame-bck.gif) top left no-repeat; }
#gal_container { width:2346px; }

#gal_one, #gal_two, #gal_three { position:relative; padding:10px; width:760px; /*height:404px;*/ float:left; display:inline; }

	.gal_feature { position:relative; width:760px; }
		.gal_feature img { float:left; }
	.gal_description { position:relative; width:370px; height:284px; float:right; background:#c6de28 url(../images/gallery_description-bck.gif) top left no-repeat; }
		.gal_wrap { margin:10px; }
			.gal_description h3 { font-size:1.375em /*22px*/; line-height:1.1em /*24px*/; margin-bottom:0.5em; color:#011e00; }
			.gal_description h4 { font-size:1em /*16px*/; margin-bottom:0.5em; color:#011e00; }
	ol.extra_pics { position:relative; padding-top:10px; width:760px; height:90px; clear:both; }
		ol.extra_pics li { display:inline; }
		ol.extra_pics a { display:block; width:175px; height:90px; float:left; }
		ol.extra_pics li.one a, ol.extra_pics li.two a, ol.extra_pics li.three a, ol.extra_pics li.four a { padding-right:20px; }

/*-- ERROR --*/
#error {
	display:block;
	margin:0 auto;
	width:620px;
	background:#adcc22 url(../images/error_box-bottom.gif) bottom center no-repeat;
}
	#error h3 { display:block; height:37px; background:#dff73e url(../images/error_h3-bck.gif) top center no-repeat;}
		#error h3 span { position:relative; top:10px; left:10px; }
	.error_pad { padding:10px; }
	.error_icon {display:block; margin:10px 0 0 0; height:50px; background:#adcc22 url(../images/error_icon.gif) bottom right no-repeat;}