/* ===============================================================================
	COLOURS

	Blue			#1b95d4
	Blue (light) 	#8dcae9
	Purple			#931173
	Orange			#f29400
	Red				#ce003c
	Silver			#d5dede


================================================================================*/
/***** Global Settings *****/
html, body {
	border:0;
	margin:0;
	padding:0;
	}
body {
	font:90%/1.25 verdana,arial,helvetica,sans-serif;
	color:#696969;
	background:#EBF7FC;
	}
.div,.table {
	padding:8px;
	border:1px dotted #c00;
	}
/* ===============================================================================*/
/***** Common Formatting *****/
h1, h2, h3, h4, h5, h6 {
	margin:0;
	padding:0;
	font-weight:normal;
	}
h1 {
	padding:0 0 25px 0;
	letter-spacing:-1px;
	font-size:1.8em;
	color:#1b95d4;
	}
h2 {
	padding:0 0 15px 0;
	letter-spacing:-1px;
	font-size:1.5em;
	}
h3 {
	padding:10px 0 0 0;
	font-size:1em;
	font-weight:bold;
	margin-bottom:.4em;
	}
h4 {
	padding:10px 0 0 0;
	color:#1b95d4;
	font-size:1em;
	font-weight:bold;
	margin-bottom:.4em;
	}
p, ul, ol {
	margin:0;
	padding:0 0 1em 0;
	}
ul, ol {
	list-style:none;
	padding:0 0 1em 40px;
	}
blockquote {
	margin:22px 40px;
	padding:0;
	}
small {
	font-size:0.85em;
	}
img {
	border:0;
	}
sup {
	position:relative;
	bottom:0.3em;
	vertical-align:baseline;
	}
sub {
	position:relative;
	bottom:-0.2em;
	vertical-align:baseline;
	}
acronym, abbr {
	cursor:help;
	letter-spacing:1px;
	border-bottom:1px dashed;
	}

/* ===============================================================================*/
/***** Links *****/

a,a:visited {
	color:#696969;
	text-decoration:none;
	border-bottom:1px solid #ccc;
	}
a:hover {
	color:#000;
	}
a.img,#logo a,.noborder {
	border:0 !important;
	}
/* ===============================================================================*/
/***** Forms *****/
form {
	margin:0;
	padding:0;
	display:inline;
	}
input, select, textarea {
	font-size:1em;
	}
textarea {
	line-height:1.25;
	}
label {
	cursor:pointer;
	}

/***** Tables *****/
table {
	border:0;
	margin:0 0 18px 0;
	padding:0;
	}
table tr td {
	padding:2px;
	}

/* ===============================================================================*/
/*****  ThinkAdmin CMS styles for pictures/reveals  *****/
.taPicStyleLeft 	{ float:left; padding:0 10px 10px 0; }
.taPicStyleRight 	{ float:right; padding:0 0 10px 10px; }
.taBox {
	}
.taSheetHeading a {
	color:#63225d;
	}
.taSheet {
	display:none;
	height:100%;
	}
.taHL,.taHL a {
	background-color:#f2ffa0 !important;
	}
#topOfPage {
	border-top:1px solid #3ea9bd;
	font-size:.8em;
	margin-top:3em;
	padding-top:.5em;
	}
#skip {
	/*display:none; if you use display none, it gets left out by screen readers!!*/
	position:absolute;
	left:-900px;
	width:1px;
	height:1px;
	display:none;
	}


/* ===============================================================================*/
/* ===============================================================================*/
/* -----------   CLIENT STYLES START HERE   -------------*/

/* EVERYTHING is inside this, and this is centered */
#container {
	width:100%;
	/*border: 1px solid #f00;*/
	}
/* containing div Holds content of page */
#content,#endOfPage {
	/*border:1px solid #c00;*/
	background-color:#fff;
	position:relative;
	width:960px;
	height:100%;
	padding:22px 22px 0 22px;
	background:url(images/bg_page.png) repeat-y;
	}
#endOfPage { /* provides bottom drop-shadow to page area */
	/*border: 1px solid #c00;*/
	background:url(images/bg_page_bottom.png) no-repeat;
	height:12px;
	}
#logo {
	position:absolute;
	top:80px; /* add #content padding value */
	left:20px; /* add #content padding value */
	width:309px;
	height:78px;
	}
#logoClip {
	position:absolute;
	top:11px; /* add #content padding value */
	right:4px; /* add #content padding value */
	width:287px;
	height:135px;
	background:url(images/logos.png) no-repeat;
	}
#headerPicture {
	position:absolute;
	top:10px; /* add #content padding value */
	left:480px; /* add #content padding value */
	width:235px;
	height:149px;
	z-index:1000;
	background:url(images/header_picture.png) no-repeat;
	}
	/* 	
	Utility menu is absolutely positioned (like most of the header) due to the 
	design! The utiity menu links (there are currently 2) are not next to each other
	and need to sit in specific positions. Buttons are utility_1 -> utility_2..	
	The buttons have a higher z-index than the header image, which is absolutely
	positioned too. It covers the links if it's higher
	*/
#utilityMenu {
	height:30px;
	width:960px;
	border-bottom:1px solid #fff;
	background:url(images/bg_utility.jpg) no-repeat;
	}
#utilityMenu .utility_1 {
	position:absolute;
	top:22px; /* add #content padding value */
	left:300px; /* add #content padding value */
	width:220px;
	height:30px;
	z-index:1001;
	}
#utilityMenu .utility_2 {
	/*border: 1px solid #c00;*/
	position:absolute;
	top:22px; /* add #content padding value */
	left:620px; /* add #content padding value */
	width:91px;
	height:30px;
	z-index:1002;
	}
#utilityMenu a {
	border:0;
	text-decoration:none;
	}
#header {
	/*border: 1px solid #c00;*/
	width:960px;
	height:137px;
	background:url(images/bg_header.png) repeat-x 0 31px;
	background-color:#83D0F0;
	margin-bottom:3px;
	}
/*	#searchTitle: puts the word Search and a magnifying glass on the search strip
	This has to sit behind the search field (which fits into the magnifying glass)
	yet float over the header bar below ! */
#searchTitle {
	position:absolute;
	top:22px; /* add #content padding value */
	left:22px; /* add #content padding value */
	width:97px;
	height:39px;
	background:url(images/bg_search.png) no-repeat;
	}
#searchbar {
	display:inline;
	position:relative;
	}
#searchbar .formbutton 	{ 
	position:absolute;
	top:5px;
	left:230px;
	}
#searchbar .forminput	{ 
	position:absolute;
	top:5px; /* add #content padding value */
	left:80px; /* add #content padding value */
	width:160px;
	height:16px;
	border:0;
	font-size:11px;
	padding:2px;
	}

	
#menubar {
	width:961px;
	overflow:hidden;
	}
#menubar img {
	margin-right:1px;
	}
#menubar a {
	border:0;
	}

/* left/right margins */
#homepage,#header,#utilityMenu,#columns,#footer,#copyright,#lastupdated {
	/*margin:auto 10px;*/
	}
#breadcrumbs {
	/*border:1px solid #00c;*/
	clear:both;
	color:#696969;
	width:960px;
	font-size:.7em;
	border-bottom:1px solid #ccc;
	margin-bottom:10px;
	padding:6px 0;
	}
#breadcrumbs a {
	text-decoration:none;
	color:#999;
	}
#breadcrumbs a:hover {
	text-decoration:underline;
	background:none;
	}

#columns {
	position:relative;
	}
#left {
	float:left;
	width:140px;
	}
#right,#home_adverts {
	/*border:1px solid #00c;*/
	float:right;
	width:230px;
	}
#right h3 {
	color:#1b95d4;
	}
#right p {
	font-size:0.8em;
	}
	
#main,#home {
	/*border-right:1px solid #0c0;*/
	border-left:1px solid #ddd;
	margin-left:150px;
	padding-left:10px;
	width:540px;
	}
#full_page {
	position:relative;
	}
#home {
	border:1px solid #00c;
	margin-left:0;
	padding:16px;
	width:640px;
	border:0;
	background:url(images/bg_home_fade.jpg) repeat-x 0 0;
	}
#home .corner {
	background:url(images/corner.png) no-repeat 0 0;
	padding-top:0;
	position:absolute;
	top:0;
	left:0;
	z-index:1000;
	width:20px;
	height:20px;
	}
#home h1 {
	color:#fff;
	}
#home,#home a {
	color:#1b95d4;
	}
#home a {
	border-bottom:1px solid #1b95d4;
	}
#home_adverts {
	/*border:1px solid #00c;*/
	width:278px;
	}

/* ----------------- HOME PAGE ADVERTS ---------------------*/

.homepage_advert {
	/*border:1px solid #00c;*/
	padding-bottom:8px;
	margin-bottom:10px;
	}
.homepage_advert h2,.homepage_advert p {
	margin:0;
	padding:0 0 .5em 7px;
	}
.homepage_advert h2 {
	font-size:1.2em;
	line-height:1.1em;
	font-weight:normal;
	}
.homepage_advert p {
	/*border:1px solid #00c;*/
	font-size:0.9em;
	}

/* How surveys improve healthcare advert */
.orange {background:url(Filestore/images/bg_advert_clipboard.png) no-repeat 0 0; background-color:#ffdd92;}
.orange h2 {padding-top:8px;}
.orange h2,.orange p {margin-right:70px;}
.orange h2,.orange a {color:#f29400;}
.orange a {border-bottom:1px solid #f29400;}

/* Current surveys healthcare advert */
.grey {background:url(Filestore/images/bg_advert_grey.png) no-repeat 0 0; background-color:#f0d9e8;}
.grey h2 {color:#931173;padding-top:8px;}

/* Latest news advert */
.blue {border-bottom:4px solid #E6E6EA;}
.blue h2 {color:#1b95d4;}

/* Received a patient questionnaire advert */
.help {background:url(Filestore/images/bg_help.png) no-repeat 100% 90%;}
.help p {margin-right:80px;}
.help h2, .help a {color:#ce003c;}
.help a {border-bottom:1px solid #ce003c;}


#submenu {
	padding-bottom:1em;
	}
#submenu ul,
#main ul,
#home ul,
#surveyTree ul {
	margin:0 0 0.5em 0;
	padding:0;
	}
#main ol {
	padding:1.5em;
	}
#submenu li,#main ul li {
	list-style: none;
	}
#submenu li.last {
	}
#submenu li.main {
	}

#main li, #home li {
	margin-left:0;
	line-height:1.5em;
	padding-left:24px;
	background:url(images/bullet.png) no-repeat 0 50%;
	}
	
#submenu .here,
#submenu li ul li.here,
#main .here,
#main li ul li.here {
	font-weight:bold;
	}

/* clickable tree of survey path */
.catNav {
	background:#646567;
	background:url(images/bg_dark.png) repeat-x 0 100%;
	color:#fff;
	margin-bottom:0.5em;
	padding:3px;
	}
.catNav a {
	color:#fff;
	}
.catNav a.here {
	font-weight:bold;
	}
/* List of survey 'folders' */
#surveyTree h3 {

	}
ul#surveyTree {
	margin-bottom:1em;
	}
#surveyTree li {
	line-height:24px;
	padding-left:24px;
	background:url(images/iFolder_closed.png) no-repeat;
	}
/* List of survey 'files' */
li.doc {
	line-height:24px;
	padding-left:24px;
	background:url(images/iDoc.png) no-repeat !important;
	}
#surveyDetail table {
	width:400px;
	overflow:hidden;
	}
#surveyDetail th,#surveyDetail td {
	padding:4px;
	font-size:.9em;
	vertical-align:top;
	text-align:left;
	border-top:1px solid #fff;
	border-right:1px solid #fff;
	}

#surveyDetail th {
	background:#646567;
	background:url(images/bg_dark.png) repeat-x 0 100%;
	color:#fff;
	font-weight:bold;
	}
#surveyDetail td {
	background:#d5dede;
	}

div#reader {
	float:right;
	width:240px;
	margin-left:16px;
	border-top:2px solid #d5dede;
	border-bottom:2px solid #d5dede;
	padding-bottom:10px;
	}
#reader h3,#reader a {
	color:#ff8e00;
	}


#forms .formbutton 	{ vertical-align:middle;padding:2px 2px 2px 0;}
#forms .forminput	{ border:1px solid #1b95d4;height:16px;font-size:0.9em; }
#forms select.forminput	{ height:20px; }


#searchresults {
	}
#searchresults #results {
	border:1px solid #ccc;
	padding:.5em;
	margin-bottom:1em;
	color:#1b95d4;
	width:100%;
	}
#searchresults p.note {
	font-size:.8em;
	color:#666666;
	}
#searchresults h4 a {
	color:#1b95d4;
	border-bottom:1px solid #8dcae9;
	}


/* main menu link hover */
#submenu a {
	}
	
#footer {
	/*border:1px solid #00c;*/
	clear:both;
	color:#696969;
	width:960px;
	font-size:.7em;
	border-top:1px solid #999;
	margin-top:20px;
	padding:6px 0;
	}
/*#footer a {
	text-decoration:none;
	color:#999;
	}
#footer a:hover {
	color:#000;
	}*/

/* ===============================================================================*/
/* narrow strip just under menubar, for breadcrumbs */
#location {
	border-left:1px solid #74b736;
	border-right:1px solid #74b736;
	background-color:#f0f7e5;
	height:1em;
	border-bottom:1px solid #74b736;
	padding:.3em .3em .4em .7em;
	margin:0;
	font-size:.85em;
	}
#location .here {
	font-weight:bold;
	}
/* ===============================================================================*/
/* PHP Font Resize. Uses cookies, but NO javascript ----------------------------- */
#fontResize {
	display:inline;
	}
#fontResize a {
	border:1px solid #fff;
	margin:2px;
	padding:2px .3em 1px .3em;
	font-family:Verdana,Arial,sans-serif;
	font-weight:bold;
	}
#fontResize .one	{ font-size:.9em; }
#fontResize .two 	{ font-size:1.1em; }
#fontResize .three 	{ font-size:1.4em; }
/* ===============================================================================*/
/* Mootools Tool Tip styling */
.tool-tip {
	width:200px;
	background:#fff;
	border:1px solid #2D6E8C;
	padding:4px;
	z-index: 13000;
	}
.tool-title {
	color:#2D6E8C;
	font-weight: bold;
	margin-bottom:2px;
	} 
.tool-text {
	color:#666666;
	}

/* ===============================================================================*/
/* A div with a floated div inside will not expand to fill the contained div.  */
/* This fix deals with the matter. Apply class="clearfix" to the container div */
/* Thanks to http://positioniseverything.net/easyclearing.html */

.clearfix:after {
    content: "."; 
    display: block; 
    height: 0; 
    clear: both; 
    visibility: hidden;
	}
.clearfix {
	height:100%;
	}
/* ===============================================================================*/

.debug { display:none; }