/* ----------------------

CSS validated 2.0 stylesheet for Directgov transactions
Greenhouse Design Ltd
DG palette:
	#CC0000		=	crimson
	#FF0000		=	red
	#FF3300		=	dark orange
	#FF6600		=	mid orange
	#FF9900		=	light orange
	#FFCC00		=	golden yellow
	#FFE581		=	yellow
	#FDE4A1		=	beige
	#FFFFCC		=	cream
	#999999		=	dark grey
	#CCCCCC		=	mid grey
	#E0E0E0		=	light grey

Notes:

There are six main id'd zones within the html:

	directGovBanner				=	page header with DG branding (seperate stylesheet)
	transactionContainer	=	contains all content except the header
		navigation				=	left hand column "step-by-step"
		bodyContent				=	centre column
		contextPanel			=	right hand column
			accreditation		=	contains the service-providing dept's logo
			helpConsole			=	contains a list of help questions with relation to the current page
	
*/
			
/*--- generic ---*/
body {font-size:101%;background:#FFF;font-family:verdana,arial,helvetica;}
img {border:none;}
h1 {font-size:.1em;margin:0;}

/*--- classes ---*/
.clear {clear:both;}
.center {text-align:center;}

/*--- holly hack needed to fix vertical scrolling in IE ---*/
* html #transactionContainer {height: 1%;} /* for IE/Win */
*>html #transactionContainer {he\ight: auto;} /* for IE5/Mac */ 

/*--- skip to main content links ---*/
a.noshow {position:absolute;left:-9999px;top:0;border:.1em solid #999;padding:0.3em;font-weight:bold;text-decoration:underline;}
a:focus.noshow, a:active.noshow{left:85%;color:#F60;z-index:10;background:#fff;}


/*--- main layout (more styles on these IDs follow) ---*/
#transactionContainer {position:relative;border:.1em solid #FFF;clear:both;}
#navigation {position:absolute;top:1.5em;left:1.5em;width:13.7em;}
#bodyContent {margin:1.5em 16.7em;}
#contextPanel {position:absolute;top:1.5em;right:1.5em;width:13.7em;}


/*--- step by step ---*/
#navigation  { padding-bottom: 1em; border: solid 0.1em #09f; outline-color: #09f }
#navigation h2  { color: #fff; font-size: 1em; font-weight: bold; background: #09f; margin: 0; padding: 0.7em }
#navigation p {margin: .7em;}
#navigation ul {margin:0;padding:0;list-style:none;}
#navigation ul li {font-weight:bold;}
#navigation ul li ul li {font-weight:normal;}
.navSelected  { background: #09f }
.navLevel1 a {padding:.2em;color:#666;text-decoration:none;}
.navLevel1 span.padder {padding:.2em;color:#666;text-decoration:none;}
.navLevel2 a {padding-left:2.6em;}
.navLevel2 span.padder {padding-left:2.6em;}
.navSelected a {color:#000;}
.navSelected .padder {color:#000;font-weight:bold;}
.navNumber {padding-left:.4em;}


/*--- main body content ---*/
#bodyContent h2 {margin:1.1em 0 0;font-size:1.7em;}
#bodyContent h3  { color: white; font-size: 1.5em; font-weight: normal; background: #547A00; margin: 0.5em 0; padding: 0.2em 0.2em 0.2em 0.4em }
#bodyContent h4 {margin:.5em 0;font-size:1.3em;font-weight:normal;}
#bodyContent p {margin-right:.7em;}


/* form elements */
#transactionForm fieldset {border:none;padding:0;margin:0;}
#transactionForm legend {padding:0;margin:0; color:#000;margin-left:-.4em;}
#transactionForm label {font-weight:bold;}
#transactionForm em {font-weight:normal;}
.formRowContainer {border:.1em solid #CCC;margin-bottom:.3em;}
.labelContainer {float:none;text-align:left;background:#FFF;padding:.3em .6em .3em .6em;}
.inputContainer {float:none;background:#FFF;padding:0 .6em .3em .6em;}


/* table elements */
div.tableContainer {width:100%;background:#FFF;}
.dataTable {background:#E0E0E0;margin:0 0 .6em 0;width:100%;}
.dataTable th {text-align:left;background:#FFF;width:30%;font-size:.8em;padding:.3em;border-bottom:1px solid #CCC;border-right:1px solid #CCC;}
.dataTable td {text-align:left;background:#FFF;width:70%;font-size:.8em;padding:.3em .6em;border-bottom:1px solid #CCC;}
h4.tableHeader {background:#E0E0E0;padding:.6em;}
h5.tableHeader {background:#E0E0E0;padding:.6em;margin:0;}
.multipleColumn td {border-right:.1em solid #CCC;}
.multipleColumn td.first {border-left:.1em solid #CCC;}
.greyHeader th {background:#E0E0E0;border-right:1px solid #FFF;border-top:1px solid #FFF;}
th.headerRowfin {border-right:0;}

/* help messages */
.helpmsgPara { clear:both;background:#ccc; height:auto; margin:0; padding:.5em; width:100%; display:block;}
.helpLinks {color:#547A00;text-decoration:none;font-weight:bold;padding-left:.8em;background: url(../images/helpArrowInPage.gif) no-repeat top left;}
.helpmsg  { line-height: 1.2em; background: silver; margin: 0; padding: 0.6em; clear: left; border-bottom: 0.3em solid #fff }
div.helpmsg p {margin:0;font-size:95%;} 
div.bar {overflow:auto;text-align:right;}
div.bar a {color:#000;}
.helpLinks {color:#547A00;text-decoration:none;font-weight:bold;padding-left:.8em;background: url(../images/helpArrowInPage.gif) no-repeat top left;}
.helpLinks:hover {text-decoration:underline; cursor:pointer}

/* submission buttons */
#formSubmit {width:99%;border-top:1px solid #999;padding-top:.6em;margin-top:.6em;}
#formSubmit ul {margin:0;padding:0;list-style:none;width:100%;text-align:center;border-top:.1em solid #F60;padding-top:.5em;}
#formSubmit li {display:inline;width:33%;}
.buttonLeft {float:left;width:34%;}
.buttonCenter {float:left;width:32%;text-align:center;}
.buttonRight {float:right;width:30%;text-align:right;}
.previousLink {background: #547A00 url(../images/butArrowLeft.gif)  no-repeat left; padding:.2em .5em .3em 2.3em;color:#FFF;text-decoration:none;font-weight:bold;border:none;width:8em;text-align:center; display:block;}
.cancelLink    { color: #fff; font-weight: bold; text-decoration: none; background: #547A00 url(../images/butCancel.gif) no-repeat right 50%; text-align: right; display: block; padding: 0.2em 2.3em 0.3em 0.5em; width: 7em; border: none }	
.nextButton     { color: #fff; font-weight: bold; text-decoration: none; background: #547A00 url(../images/butArrowRight.gif) no-repeat right 50%; text-align: right; display: block; padding: 0.2em 2.3em 0.3em 0.5em; width: 8em; border: none }

/* footer links */
#footerLinks {list-style:none;margin:1em 0 0;padding:0;text-align:center;}
#footerLinks li {display:inline;}
#footerLinks li a {color:#000;}

/* alert/validation messages/info */
.hazard {border:1px solid #F00;margin:1.2em 0;font-weight:bold;padding:.3em .3em .3em 2.9em;background: url(../images/error.gif) no-repeat left;}
.hazardInForm {margin:0;font-weight:bold;padding:.3em .3em .3em 2.9em;background: url(../images/error.gif) no-repeat left;}
.formRowContainerHazard {border:.1em solid #F00;margin-bottom:.3em;padding:0;}
.info {border:1px solid #F00;margin:1.2em 0;font-weight:bold;padding:.3em .3em .3em 2.9em;background: url(../images/info.gif) no-repeat left;}

/* address list styles */
.addressDetails {margin:0 0 .3em 0;height:1%;}
.addressDetails h5 {background:#E0E0E0;padding:.6em;margin:0;}
.addressDetails p, .addressDetails ul {padding:0 .5em;}

/* other content */
.optionsList {list-style:none;margin:.5em 0;padding:0;}
.radioEven  { background-image: none; background-repeat: repeat; background-attachment: scroll; background-position: 0 0; width: 98% }


/*--- right hand context panel ---*/
#accreditation  { text-align: center; margin-bottom: 1.5em; border: solid 0.1em #09f }
#accreditation h2  { color: #fff; font-size: 1em; background: #09f; text-align: center; margin: 0; padding: 0.7em }
#accreditation img {margin:1em 0 .6em 0;}
#helpConsole  { background: #09f; padding-bottom: 1em }
#helpConsole h2  { color: #fff; font-size: 1em; font-weight: bold; background: #ccc; margin: 0 0 0.6em; padding: 0.8em }
#helpConsole ul {list-style-position:outside;list-style:none;list-style-image: url(../images/helpArrow.gif);margin:0 .8em 0 1.1em; padding:0 .3em 0 .7em;}
#helpConsole ul li {margin-bottom:.6em;}
#helpConsole ul a {color:#c00;text-decoration:none;font-weight:bold;}
#helpConsole ul a:hover {text-decoration:underline;}
#helpConsole p {margin:.8em;}
/*------------ stylesheet notes 

	image tags used in the site header should have height and 
	width attributes in the CSS, not in the HTML
	
------------*/	

/*------------ generic classes ------------*/
body {margin:0;padding:0;font-size:80%;font-family:verdana,arial,helvetica,sans-serif;height:100%;}
html > body {height:100%}
.clear {clear:both;}
.floatLeft {float:left;}
.floatRight {float:right;}

/*------------ DirectGov Banner ------------*/
#directGovBanner  { background: #09f no-repeat right 50%; border-top: 1px solid #864f41; border-bottom: 1px solid #f00000 }
#directGovBanner .clear {clear:both;border-bottom:1px solid #ED3D00;}

/*------------ images ------------*/
.dgLogoScreen {width:445px;height:64px;display:block;border:none;}
.dgLogoPrint {display:none;}
.dgBanner {width:630px;height:64px;display:block;}