﻿@import url("splash-reset.css");

/* -- Global element styles -- */

body {
	font: 12px/1.8em 'Droid Sans', 'DroidSans', Arial,Sans-Serif;
	color: #777;
	background: #fff;
	border-top: 4px solid #106289;
}

body.homepage { background: url("/splashimages/bodybg.png") no-repeat center 310px #fff; }

h1, h2, h3, h4, h5, h6 {
	font: normal 1em/normal 'Sari', Arial, Sans-Serif;
	margin: 0 0 20px;
}

h1 {
	font-size: 30px;
	color: #4e4e4e;
	letter-spacing: -2px;
}

h2 {
	font: italic 14px/1.5em Arial, sans-serif;
	color: #00a2e5;
}

h3 { font-size: 14px; }

h4 {
	font-size: 14px;
	font-weight: bold;
}

h5 {
	font-size: 12px;
	font-weight: bold;
}

h6 { font-weight: bold; }
h1 a, h2 a, h3 a, h4 a, h5 a { text-decoration: none; }

a {color: #106289;}

a:hover {
	color: #333;
	text-decoration: none;
}

.styled-link {
	display: inline-block;
	text-align: center;
	padding: 5px 10px;
	color: #fff;
	text-decoration: none;
	font-family: Arial;
	font-weight: bold;
	line-height: normal;
	cursor: pointer;
	border: none;
	
	border-radius: 3px;
	box-shadow: 0px 0px 1px rgba(0,0,0,0.25),
				inset 0px 0px 1px rgba(255,255,255,1);	
	background: #009ce0; /* Old browsers */
	background: -moz-linear-gradient(top, rgba(0,156,224,1) 0%, rgba(0,99,170,1) 100%); /* FF3.6+ */
	background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,rgba(0,156,224,1)), color-stop(100%,rgba(0,99,170,1))); /* Chrome,Safari4+ */
	background: -webkit-linear-gradient(top, rgba(0,156,224,1) 0%,rgba(0,99,170,1) 100%); /* Chrome10+,Safari5.1+ */
	background: -o-linear-gradient(top, rgba(0,156,224,1) 0%,rgba(0,99,170,1) 100%); /* Opera11.10+ */
	background: -ms-linear-gradient(top, rgba(0,156,224,1) 0%,rgba(0,99,170,1) 100%); /* IE10+ */
	filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#009ce0', endColorstr='#0063aa',GradientType=0 ); /* IE6-9 */
	background: linear-gradient(top, rgba(0,156,224,1) 0%,rgba(0,99,170,1) 100%); /* W3C */
}

.styled-link:hover {
	color: #fff;
	background: #0063aa; /* Old browsers */
	background: -moz-linear-gradient(top, rgba(0,99,170,1) 0%, rgba(0,156,224,1) 100%); /* FF3.6+ */
	background: -webkit-gradient(linear, left top, left bottom, color-stop(100%,rgba(0,99,170,1)), color-stop(0%,rgba(0,156,224,1))); /* Chrome,Safari4+ */
	background: -webkit-linear-gradient(top,rgba(0,99,170,1) 0%, rgba(0,156,224,1) 100%); /* Chrome10+,Safari5.1+ */
	background: -o-linear-gradient(top, rgba(0,99,170,1) 0%, rgba(0,156,224,1) 100%); /* Opera11.10+ */
	background: -ms-linear-gradient(top, rgba(0,99,170,1) 0%,rgba(0,156,224,1) 100%); /* IE10+ */
	filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#0063aa', endColorstr='#009ce0',GradientType=0 ); /* IE6-9 */
	background: linear-gradient(top,rgba(0,99,170,1) 0%,rgba(0,156,224,1)  100%); /* W3C */
}

.errorStyle {
	color: #c00;
	font-weight:bold;
	vertical-align: top;
}

/* -- default form styles -- */

.page-form label {
	display: inline-block;
	vertical-align: top;
	width: 120px;
	margin: 0 0 10px;
}

.page-form input[type="text"], .page-form textarea {
	border: none;
	box-shadow: inset 1px 1px 2px #aaa;
	font: italic 12px/20px Arial,Sans-Serif;
	color: #666;
	width: 180px;
	padding: 3px 10px;
	margin: 0 0 10px;
}

.page-form input[type="text"]:focus, .page-form textarea:focus {
	box-shadow: inset 1px 1px 2px #444;
}

.no-boxshadow .page-form input[type="text"],
.no-boxshadow .page-form textarea {
	border: 1px solid #ccc;
}

.page-form input[type="text"] { height: 20px }

.page-form textarea {
	height: 80px;
	line-height: 1.5em;
	padding: 10px
}

#page-title, .raised-title {
    background: none repeat scroll 0 0 #FFFFFF;
    color: #666666;
    display: inline-block;
    font: bold 16px/1.5em Arial,sans-serif;
    letter-spacing: 0;
    margin: 0 0 -10px;
    padding: 0 20px 0 0;
    position: relative;
    top: -13px;
}

.checkbox-group strong {
	 display: inline-block;
	 width: 110px;
}

/* -- Global layouts (container, header + footer) -- */

#container {
	width: 940px;
	margin: 0 auto;
	background: url("/splashimages/containerbg.jpg") left bottom no-repeat;
}

	#header {
		height: 173px;
		margin: 0 0 25px;
		padding: 15px 0 0;
		position: relative;
		border-bottom: 1px solid #d8d8d8;

	}
	
		#logo {
			width: 401px;
			height: 88px;
			background: url("/splashimages/logo.png");
			float: left;
			margin: 0 0 35px;
			position: relative;
			top: 15px;
		}
		
		.sitelink  {
			float: right;
			clear: right;
			font: 21px/1.5em 'Sari', Arial, sans-serif;
			color: #888;
			text-decoration: none;
		}
		
		#social-btns {
			bottom: 20px;
			position: absolute;
			right: 0;
		}
		
			#social-btns a {
				background-image: url("/splashimages/social.png");
				float: left;
				height: 24px;
				margin: 0 4px;
				width: 24px;
			}
			
			#fb { background-position: left top; }
			#tw { background-position: -24px top; }
			#yt { background-position: right top; }
			

		#top-nav {
			height: 50px;
			clear: both;
			margin: 0;
			padding: 0;
			list-style: none;
		}

			#top-nav li {
				float: left;
			}
			
			#top-nav a {
				display: block;
				text-align: center;
				font-size: 13px;
				line-height: 50px;
				padding: 0 10px;
				color: #7e7e7e;
				text-decoration: none;
			}
			
			#top-nav li:first-child a { padding: 0 10px 0 0 }
			
			#top-nav a:hover { color: #005881 }
			
			#top-nav li.selected a  {
				color: #004180;
				padding-bottom: 5px;
				background: url("/splashimages/nav-diamond.jpg") no-repeat center bottom;
			}
			
			#top-nav li.selected:first-child a {
				background: url("/splashimages/nav-diamond.jpg") no-repeat 13px bottom;
			}
		

/* footer logos */	
		
#logo-bar {
	padding: 10px 0;
	margin: 0 0 30px;
	border-top: 1px solid #ddd;
	border-bottom: 1px solid #ddd;
	clear: both;
	text-align: center;
}

	#logo-bar .ir {
		display: inline-block;
		vertical-align: middle;
		margin: 0 30px
	}

	#logo-1 {
		width: 225px;
		height: 27px;
		background: url("/splashimages/logo-nurture-lakeland.png");
	}
	
	#logo-2 {
		width: 60px;
		height: 60px;
		background: url("/splashimages/logo-bhhpa.jpg");
	}
	
	#logo-3 {
		width: 44px;
		height: 66px;
		background: url("/splashimages/logo-enjoy-england.jpg");
	}
	
	#logo-4 {
		width: 60px;
		height: 65px;
		background: url("/splashimages/logo-wildlife-trusts.jpg");
	}
	
	#logo-5 {
		width: 41px;
		height: 73px;
		background: url("/splashimages/logo-bhhpa-gold.jpg");
	}
	
	#logo-6 {
		width: 100px;
		height: 51px;
		background: url("/splashimages/logo-securitymetrics.jpg");
	}

/* footer main */			
	
#footer-wrap {
	background: url("/splashimages/footer-bg.jpg") no-repeat center bottom #005880;
	color: #fff;
}

	#footer {
		width: 940px;
		margin: 0 auto;
		padding: 30px 0 20px;
	}
	
		#footer a { color: #fff }
	
		#footer ul, #footer .contact-details {
			width: 235px;
			float: left;
			margin: 0 0 20px;
			padding: 0;
			list-style: none;
		}
		
			#footer li:first-child {
				font: bold 16px/1em Arial, sans-serif;
				color: #66bef2;
				margin: 0 0 15px;
				padding: 0;
				background: none;
			}
		
			#footer li {
				background: url("/splashimages/orangeArrows.png") no-repeat left 9px;
				padding: 0 0 0 10px;
			}
		
		#footer .contact-details {
			text-align: right;
			line-height: 1.3em
		}
		
			.contact-details .logo {
				width: 181px;
				height: 40px;
				background: url("/splashimages/logo-small-white.png");
				margin: -10px 0 10px 56px;
			}
			
		#copyright {
			text-align: center;
			clear: both;
			margin: 0;	
		}
		
/* homepage styles */

#home-ctas { margin: 0 0 20px; }

	#home-ctas .cta-img {
		float: left;
	}
	
	#home-ctas .cta-img + .cta-img {
		margin: 0 0 0 20px;
	}

#home-left, #home-right {
	width: 460px;
	float: left;
	margin: 0 0 20px;
	border-top: 1px solid #D8D8D8;
}

#home-left {
	margin: 0 20px 20px 0;
}

/* further page styles */

#content-left {
	width: 600px;
	float: left;
	margin: 0 0 20px;
}

	#cms-content {
		border-top: 1px solid #D8D8D8;
	}

#content-right {
	width: 300px;
	float: right;
	margin: 0 0 20px;
	padding: 0 0 0 25px;
	background: url("/splashimages/rightcol-shadow.jpg") no-repeat left center;
}

	.cta-img {
		display: block;
		margin: 0 0 20px;
	}
	
/* job vacancies pages */

.vacancy {
	background: none repeat scroll 0 0 #F3F3F3;
    border-bottom: 3px solid #CCCCCC;
    margin: 0 0 10px;
    padding: 10px;
}

	.vacancy h2 {
		margin: -10px 0 10px -10px;
		padding: 10px;
		width: 100%;
		color: #fff;
		background: #2BADE7;
		border-bottom: 2px solid #0F7AA8;
		font: 24px/1.5em 'Sari',Arial,sans-serif;
		letter-spacing: -1px;
	}
	
	.vacancy h3 {
		 font-size: 18px;
		margin: 20px 0;
	}
