/* Colours:

Lime Green
	RGB: R=180; G=217; B=48		=> rgb(180,217,48)	or #b4d930	

Dark Lime Green (for headings only)
	RGB: R=172; G=211; B=30		=> rgb(172,211,30)	or #acd31e

Light Green Tint (menu bars and some button rollovers)
	RGB: R=228; G=242; B=175	=> rgb(228,242,175)	or #e4f2ac


Grey surround colour for whole web page:
	15% black (= 85% white)
	RGB: R=206; G=206; B=206	=> rgb(206,206,206)	or #cdcdcd

Fonts
	The body is Verdana
	The large heading font is Tahoma
	Sub-headings & Questions are Verdana

Padding/Margin Short-hand Syntax 
	padding: <top> <right> <bottom> <left>;
  eg	padding: 0px 5px 10px 5px;

*/


/***
/*** Set basic layout and incoroprate various fixes to known browser problems
/**/
/*body#main {background-color: rgb(85%,85%,85%); margin: 0; padding-top: 15px;*/ 
/* Set body background colour white here so that it is white while pages loads (later set to grey ) */
body#main {color: black; background-color: white; margin: 0; padding-top: 15px; 
	min-width: 800px; 	/* Fix for NS6 (no horiz scroll bar if window too narrow) */
	text-align: center; 	/* Fix for IE5.x/IE6 in quirks mode (auto margins don't work), part 1.. */
	}
#mainWrapper {width: 800px; margin: 0 auto; background: white url("../Images/bg.gif") repeat-y left top ; 
	text-align: left; 	/* .. Fix for IE5.x/IE6 in quirks mode (auto margins don't work), part 2 */
	}
#header {border-bottom: 2px solid white; 	/* As all content is floated, seem to need border here in order for background to work properly in IE6/NS6 */
	background: rgb(180,217,48) url("../Images/headerPhotoRight_bg.jpg") no-repeat right top; 	/* Right-hand image rendered as background to avoid "pixel-squeeze" causing image to wrap to new line */
	}
#menu {width: 112px; float: left; }
#content {float: right; width: 626px; 
	min-height: 316px;  /* To give overall height of 600px; */ 
	}
* html #content {height: 316px;} /* 'Star-hack' for IE5.x/IE6 which effectively implements 'heignt' as 'min-height' */
#textMenu {width: 626px; float: right; }
#footer {clear: both; }
#outerFooterWrapper {border-bottom: 2px solid rgb(85%,85%,85%); 	/* As all content is floated, seem to need border here in order for background to work properly in IE6/NS6 */
	background-color: rgb(85%,85%,85%); }				/* Need to set background-color to cover mainWrapper background image & colour */
#registeredDetails {width: 400px; float: left; }
#credits {width: 380px; float: right; }


/***
/*** Common (global) styles
/**/
body {font: 11px Verdana,sans-serif; color: #000000; 
	line-height: 1.5; } /* NOTE: 'normal' line-height may be browser-dependent but seems to be 1.2 for most browsers (ie NOT 1 !!)*/
select {font: 12px Verdana,sans-serif; }

h1, h2, h3 {line-height: 1; margin: 0; padding: 0; }
h1 {color: rgb(172,211,30); font-family: Tahoma,Verdana,sans-serif; font-size: 36px; font-weight: normal; margin-top: 32px; margin-bottom: 30px; }
/* h2 {color: rgb(172,211,30); font-size: 18px; font-weight: normal; margin-top: 32px; margin-bottom: 14px; } */
h2 {color: rgb(172,211,30); font-size: 18px; font-weight: normal; margin-top: 32px; margin-bottom: 17px; }
h2.black {color: black; margin-bottom: 0; }
h3 {color: black; font-size: 12px; font-weight: bold; margin-top: 2em; margin-bottom: -0.8em; } /* Negative bottom margin to place closer to following paragraph */
h3.red {color: red; margin-bottom: 0; }
body.faqs h3 {margin-top: 3em; line-height: 1.5; }
/* body.policySummary h1 {margin-top: 28px; padding-top: 4px; margin-bottom: 20px; padding-bottom: 10px; background: transparent url("../Images/keyfacts.gif") no-repeat 425px top; } */
body.policySummary h3 {margin-bottom: 0; }

.red {color: red; }
.black {color: black; }

p {padding: 0; margin: 20px 0 0 0; }
p.spaced {margin-top: 27px; margin-bottom: 25px; }
p.spaced2 {margin-top: 40px; margin-bottom: 30px; }
p.spaceAfter {margin-bottom: 40px; }

img {border: 0; }

form {padding: 0; margin: 0; }
select {margin-bottom: 0px; }

table {border-collapse: collapse; }
td, th {text-align: left; vertical-align: top; }
td.nowrap, th.nowrap {white-space: nowrap; }

br.clear {clear: both; }
div.clear {clear: both; }
div.clear.border {border-bottom: 1px solid white; } /* In some cases(eg NS6), need a border to make it clear properly (or to stop margins from for some reason collapsing to nothing) */ 

ol ul {list-style-type: disc; margin-top: -5px; }
ul.noBullets {list-style: none; }
/* Remove indent from lists: */
ul, ol {padding: 0; margin: 10px 0 0 0; }
ul {margin-left: 15px; }
ul.noBullets {margin-left: 0px; }
* html ul {margin-left: 20px; } /* 'Star-hack' for IE5.x/IE6 which needs more margin to left-justify lists */
ol {margin-left: 25px; }
* html ol {margin-left: 30px; } /* 'Star-hack' for IE5.x/IE6 which needs more margin to left-justify lists */
ol h3 {color: rgb(172,211,30); margin-left: -25px; margin-top: 2em; margin-bottom: 1em; }
* html ol h3 {margin-left: -30px; } /* 'Star-hack' for IE5.x/IE6 which needs more margin to left-justify lists */
/* Need more margin if index reaches double figures:
ol {margin-left: 30px; }
etc.
/*

ul.noIndent {padding: 0; margin-left: 15px; }
ol.noIndent {padding: 0; margin-left: 25px; }
* html ul.noIndent {margin-left: 20px; } /* 'Star-hack' for IE5.x/IE6 which needs more margin to left-justify bullets 
* html ol.noIndent {margin-left: 30px; } /* 'Star-hack' for IE5.x/IE6 which needs more margin to left-justify bullets 
*/

ul.spaced li, ol.spaced li {margin-bottom: 10px; margin-top: 10px; }
ol.spaced ul li {margin-bottom: 5px; margin-top: 5px; }

/* Make bullets green: */
ul {color: rgb(172,211,30); }
ul span, ul.noBullets {color: #000; }

.bold {font-weight: bold; }

a:link, a:visited {color: black; text-decoration: underline; }
a:hover {text-decoration: none; }
a.hoverUnderline:link, a.hoverUnderline:visited {text-decoration: none; }
a.hoverUnderline:hover {text-decoration: underline; }

/***
/*** HEADER styles
/**/
/*#header {border-bottom: white 2px solid; background-color: rgb(180,217,48); }*/
#header img {float: left; border-right: white 2px solid; border-bottom: white 2px solid; }
/*
* html #header img {margin-left: -6px; ma\rgin-left: 0; }
* html #header img.left {margin-left: -3px; ma\rgin-left: 0; }
*/
#header img.left {border-bottom: 0; }
#header img.right {border-right: 0; }
/*#header div {clear: both; }*/


/***
/*** MENU styles
/**/
#menu {font-size: 10px; background-color: rgb(228,242,175); }
#menu ul {list-style: none; padding: 0; margin: 0; }
#menu li {padding: 0; margin: 0; }
#menu ul.submenu {display: none; }

/* #menu a:link, #menu a:visited {display: block; line-height: 20px; width: 100%; */
#menu a:link, #menu a:visited {display: block; line-height: 12px; width: 100%; padding: 4px 0; 
	border-bottom: white 2px solid; color: #000; text-align: right; text-decoration: none; 
	}
#menu a:hover {background-color: rgb(180,217,48); }
#menu ul.submenu a:link, #menu ul.submenu a:visited {color: white; background-color: black; }
#menu ul.submenu a:hover {color: rgb(180,217,48); background: black url("../Images/submenuBg.gif") no-repeat left top; }


/*** Highlight active top-level menu item (when page itself, or any of its submenu pages, are displayed): ***/
body.home #menu a.home,
body.register #menu a.register,
/*body.makeClaim #menu a.makeClaim,*/
body.phLogin #menu a.phLogin,
/*	body.changeDetails #menu a.phLogin,		/* Submenu of: policyholder login */
	body.updateDetails #menu a.phLogin,		/* Submenu of: policyholder login */
	body.amendCover #menu a.phLogin,
	body.changeAddress #menu a.phLogin,
	body.makeClaim #menu a.makeClaim,
	body.changePassword #menu a.phLogin,
/*	body.viewDocuments #menu a.phLogin,
	body.cancelCover #menu a.phLogin,
	body.changePassword #menu a.phLogin,*/
body.quote #menu a.quote,
body.retrieveQuote #menu a.retrieveQuote,
body.aboutFP #menu a.aboutFP,
	body.whatsCovered #menu a.aboutFP,		/* Submenu of: about forces plan */
	body.whoCanBuy #menu a.aboutFP,
	body.policySummary #menu a.aboutFP,
	body.fullPolicy #menu a.aboutFP,
body.otherInsurance #menu a.otherInsurance,
body.help #menu a.help,
	body.faqs #menu a.help,				/* Submenu of: help */
	body.contentsHints #menu a.help,
	body.definitions #menu a.help,
body.aboutJAG #menu a.aboutJAG,
	body.terms #menu a.aboutJAG,			/* Submenu of: about JAG */
	body.complaints #menu a.aboutJAG,
body.regulation #menu a.regulation,
body.contact #menu a.contact,
	body.helplines #menu a.contact,		/* Submenu of: contact */
	body.claimsProcedure #menu a.contact
	{
	background-color: rgb(180,217,48);  
	}

/*** Hide cursor "link-indicator" behaviour of top-level menu item when corresponding page is displayed (NB link would still reload page if clicked): ***/ 
body.home #menu a.home,
body.register #menu a.register,
body.phLogin #menu a.phLogin,
body.quote #menu a.quote,
body.retrieveQuote #menu a.retrieveQuote,
/*body.makeClaim #menu a.makeClaim,*/
body.aboutFP #menu a.aboutFP,
body.otherInsurance #menu a.otherInsurance,
body.help #menu a.help,
body.aboutJAG #menu a.aboutJAG,
body.regulation #menu a.regulation,
body.contact #menu a.contact
	{
	cursor: default; 
	}

/*** Also hide cursor "link-indicator" behaviour for header images when home page is active: ***/
body.home #header a {cursor: default; }

/* Hide/show appropriate menu-item according to login status:  [*** NO LONGER USED ***]
#menu li.loggedIn,
body.loggedIn #menu li.loggedOut
	{
	display: none;
	}
*/

/*** Display sub-menu (if applicable): ***/
/*body.loggedIn #menu li.loggedIn, */
body.phLogin.loggedIn #menu ul.phLogin,
/*	body.changeDetails #menu ul.phLogin,	/* Submenu of: policyholder login */
	body.updateDetails.loggedIn #menu ul.phLogin,	/* Submenu of: policyholder login */
	body.amendCover.loggedIn #menu ul.phLogin,
	body.changeAddress.loggedIn #menu ul.phLogin,
	body.makeClaim.loggedIn #menu ul.phLogin,
	body.changePassword.loggedIn #menu ul.phLogin,
/*	body.viewDocuments #menu ul.phLogin,
	body.cancelCover #menu ul.phLogin,
	body.changePassword #menu ul.phLogin,*/
body.aboutFP #menu ul.aboutFP,
	body.whatsCovered #menu ul.aboutFP,		/* Submenu of: about forces plan */
	body.whoCanBuy #menu ul.aboutFP,
	body.policySummary #menu ul.aboutFP,
	body.fullPolicy #menu ul.aboutFP,
body.help #menu ul.help,
	body.faqs #menu ul.help,			/* Submenu of: help */
	body.contentsHints #menu ul.help,
	body.definitions #menu ul.help,
body.aboutJAG #menu ul.aboutJAG,
	body.terms #menu ul.aboutJAG,			/* Submenu of: about JAG */
	body.complaints #menu ul.aboutJAG,
body.contact #menu ul.contact,
	body.helplines #menu ul.contact,		/* Submenu of: contact */
	body.claimsProcedure #menu ul.contact
	{
	display: block; 
	}
	
/*** Highlight active sub-menu menu item (and hide cursor "link-indicator" behaviour): ***/
/*body.changeDetails #menu a.changeDetails,		/* Submenu of: policyholder login */
body.updateDetails #menu a.updateDetails,		/* Submenu of: policyholder login */
body.amendCover #menu a.amendCover,
body.changeAddress #menu a.changeAddress,
body.makeClaim #menu a.makeClaim,
body.changePassword #menu a.changePassword,
/*body.viewDocuments #menu a.viewDocuments,
body.cancelCover #menu a.cancelCover,
body.changePassword #menu a.changePassword,*/
body.whatsCovered #menu a.whatsCovered,		/* Submenu of: about forces plan */
body.whoCanBuy #menu a.whoCanBuy,
body.policySummary #menu a.policySummary,
body.fullPolicy #menu a.fullPolicy,
body.faqs #menu a.faqs,					/* Submenu of: help */
body.contentsHints #menu a.contentsHints,
body.definitions #menu a.definitions,
body.terms #menu a.terms,				/* Submenu of: about JAG */
body.complaints #menu a.complaints,
body.helplines #menu a.helplines,			/* Submenu of: contact */
body.claimsProcedure #menu a.claimsProcedure {
	color: rgb(180,217,48); background: black url("../Images/submenuBg.gif") no-repeat left top; cursor: default; 
	}


body.phLogin.loggedIn #menu a.makeClaimTop {
	display: none;
	}


/***
/*** TEXT-MENU styles
/**/
/*#textMenu {font-size: 10px; text-align: left; }*/
#textMenu {font-size: 10px; font-family: Tahoma,Verdana,sans-serif; text-align: left; }
#textMenu ul {float: left; list-style: none; text-align: center; padding: 0; margin: 52px 0 20px 0; }
/*#textMenu li {display: inline; line-height: 16px; margin: 0 10px 0 10px; }*/

#textMenu li {display: inline; line-height: 16px; margin: 0 14px; } /* RETURN MARGIN TO 8px WHEN 'site plan' RESTORED TO TEXT MENU */
#textMenu li.left {margin-left: 0; }
#textMenu li.right {margin-right: 0; }
#textMenu a:link, #textMenu a:visited {color: rgb(50%,50%,50%); text-decoration: none; }
#textMenu a:hover {text-decoration: underline; }

/* Hide/show appropriate menu-item according to login status: [*** NO LONGER USED ***] 
#textMenu li.loggedIn,
body.loggedIn #textMenu li.loggedOut
	{
	display: none;
	}
body.loggedIn #textMenu li.loggedIn
	{
	display: inline;
	}
*/


/***
/*** CONTENT styles (including INFOWRAPPER for floated info/help)
/**/
#content {margin-top: 20px; margin-bottom: 0px; }
body.policySummary #content {background: transparent url("../Images/keyfacts.gif") no-repeat 425px 32px; }
body.faqs h3, #content p, #content div.quoteBox, #content .displayBox {width: 533px; }

#content ul, #content ol {margin-right: 100px; } /* Right-margin used to reduce width (for some reason, using 'width' breaks listing style) */

#content p.alert, #content p.tip {width: 500px; }
#content p.alert, #content p.tip, #info p.alert, #info p.tip {padding-left: 33px; }
p.alert {background: transparent url("../Images/alertButton.gif") no-repeat 0px 3px; }
p.tip {background: transparent url("../Images/tipButton.gif") no-repeat 0px 3px; }
p.alert.extraParagraph, p.tip.extraParagraph {background: none; }
p.alert.oneline, p.tip.oneline {line-height: 3; }			/* Need to ensure single-line of text is tall enough to show whole icon.. */
p.alert.oneline, p.tip.oneline {background-position: left center; }	/* .. and that icon is vertically centred to text. */

#content p.note {width: 400px; margin: 0 0 12px 0; }
#content p.links {margin: 40px 0 40px 0; }
#content div.tight p, #content p.tight {margin-top: 10px; margin-bottom: 10px; } /* See also: #info p.tight */

#content table th {font-weight: bold; }
#content table td, #content table th {padding: 10px 20px 0 0; }

#content table.regulation {width: 578px; } /* Widened slightly (was 533px) to avoid sub-headings wrapping */
#content table.regulation td {padding: 0 50px 0 0; }
#content table.regulation th {padding: 32px 0 0 0; text-align: center; } /* To align icons with 'h2' headings */
body.regulation #content h1 {margin-bottom: 0; } /* Margin removed as it won't collapse with the following h2 'margin-top' inside a table */
#content table.regulation p {width: 100%; }

#content table.contact {width: 533px; margin: 20px 0; }
#content table.contact p {width: 100%; margin: 0 0 10px 0; }





/* COPY FOR REFERENCE:
body.buy #content label {display: inline; float: left; width: 300px; margin: 0; }
body.buy #content label.small {display: inline; /* For some reason, need to repeat 'display: inline' for NS /
	float: none; width: auto; 
	font-size: 11px; color: black; margin-left: 1em
	}
body.buy #content input {width: 200px; }
body.buy #content input.checkbox {width: auto; }
body.buy #content input.desc {width: 300px; }
body.buy #content input.value {width: 80px; }
body.buy #content input.char2 {width: 25px; }
body.buy #content div.indented {padding-left: 50px; }
body.buy #content div.indented label {width: 250px; }
body.buy #content h2 {margin-top: 40px; margin-bottom: -10px; }
*/




#content label {display: block;  
	font-size: 18px; font-weight: normal; color: rgb(172,211,30); 
	padding: 0; margin: 32px 0 14px 0; 
	}

body.form2col #content p {clear: both; }

body.form2col #content p label {display: inline; float: left; width: 300px; margin: 0; }
body.form2col #content p label.small {float: left; font-size: 11px; color: black; width: 500px; }
body.form2col #content p input {width: 200px; }
body.form2col #content p textarea {width: 100%; height: 150px; }
body.form2col #content p input.narrow {width: 130px; float: left; }
body.form2col #content input.checkbox {width: auto; }
body.form2col #content input.char2 {width: 25px; }
body.form2col #content input.char4 {width: 50px; }
body.form2col #content input.left {float: left; margin-top: 4px; margin-right: 10px; }
* html body.form2col #content input.left {margin-top: 0; } /* 'Star-hack' for IE5.x/IE6 which doesn't ened any top margin */
body.form2col #content p span {float: left; width: 70px; padding-top: 3px; }

/*** 2-column format when displayed as list (ie not form fields):							*/
/*** (need to use different method to space out entries so that text doesn't wrap underneath label)	*/ 
/*body.form2col #content div.listForm p {margin-top: 5px; }*/
body.form2col #content div.listForm p {margin-top: 0px; }
body.form2col #content div.listForm p label {padding-bottom: 10px; }

body.form2col #content h2 label.small {display: inline; /* For some reason, need to repeat 'display: inline' for NS */
	float: none; width: auto; 
	font-size: 11px; color: black; margin-left: 1em
	}

body.form2col.yourDetails #content p label,
body.form2col.changePassword #content p label,
body.form2col.updateDetails #content p label,
body.form2col.changeAddress #content p label,
body.form2col.makeClaim #content p label
	{color: black; font-size: 12px; font-weight: bold;  width: 200px; }
body.form2col.makeClaim #content p label {font-weight: normal; line-height: 1.3; width: 310px; margin-right: 10px; }
/* NB LABEL WIDTH, WAS: 315px BUT 314px MAX for IE6 to avoid wrapping (so make 310px to give some margin) 
*/
body.form2col.updateDetails #content p label {width: 250px; }
body.form2col.makeClaim #content p label.wide, 
body.form2col.yourDetails #content p label.wide 
	{width: auto; }

body.form2col.additionalInfo #content input.desc {width: 300px; }
body.form2col.additionalInfo #content input.value {width: 80px; }
body.form2col.additionalInfo #content th, body.buy #content td {vertical-align: middle; }
body.form2col.additionalInfo #content thead th {text-align: center; }
body.form2col.additionalInfo #content tbody th {text-align: right; font-weight: normal; }

body.form2col.importantInfo #content ol select {display: block; margin: 10px 0 20px 0; }




#content label a:link, #content label a:visited, #content h2 a:link, #content h2 a:visited {font-size: 11px; font-weight: normal; color: black; 
	text-decoration: underline; margin-left: 1em; 
	}
#content label a:hover, #content h2 a:hover {text-decoration: none; }
body.form2col #content p label.small a:link {margin-left: 0; }

#content .displayBox {border: 2px solid rgb(180,217,48); padding-bottom: 32px; }
#content .displayBox h2, #content .displayBox h3, #content .displayBox p {width: auto; margin-left: 20px; margin-right: 20px; }

#content div.nextButton {clear: both; margin-top: 38px; margin-bottom: 0px; }
#content div.nextButton.floated {clear: none; float: left; margin-top: 175px; margin-left: 25px; }
#content div.nextButton.floated.outsideQuotebox {margin-top: 25px; margin-left: 0; }
/*#content div.nextButton.centred {text-align: center; margin-top: 10px; margin-bottom: 30px; }*/
#content div.quoteBox div.nextButton {text-align: center; margin-top: 10px; margin-bottom: 30px; }

#content div.nextButton a:link, #content div.nextButton a:visited {font-size: 17px; line-height: 30px; font-weight: normal; 
	color: black; text-decoration: none; padding: 5px 40px 7px 0; margin: 20px 0;  
	background: transparent url("../Images/arrowButton.gif") no-repeat right center; 
	}
#content div.nextButton a.right:link, #content div.nextButton a.right:visited {margin-left: 200px; }
#content div.nextButton a:hover {text-decoration: underline; }

#content input.hiddenSubmitButton {	/* 'nextButton' actually used to submit form (via javascript) as actual form submit button cannot be styled to produce desired effect */
	position: absolute; 	/* However, need a real 'submit' button so that hitting return within a text field causes form to be submitted */
	left: -2000px; 		/* therefore, hide 'submit' button off page. NOTE 1: different combinations of left/right and +/-offset cause problems in some browers (eg IE) */
	width: 50px;		/* NOTE: for some browsers (eg IE7), need to define 'width' to prevent button extending width-ways right across visible screen */
	}

/* #infoWrapper {display: block; position: relative; width: 200px; } */
.infoWrapper {position: relative; width: 100%; border: none; } /* Need to define a width for IE to work */
/* .infoWrapper.button {margin-top: 38px; margin-bottom: 38px; } */
.infoWrapper div {width: 270px; position: absolute; right: 4000px; bottom: 20px; 
	background-color: rgb(180,217,48); padding: 0px; 
	}
* html .infoWrapper div {bottom: 34px; } /* 'Star-hack' for IE5.x/IE6 which positions the DIV lower */
/* Make this the standard (not 0px))
.infoWrapper div.raise {bottom: 20px; }
* html .infoWrapper div.raise {bottom: 34px; } /* 'Star-hack' for IE5.x/IE6 which positions the DIV lower */

.infoWrapper div.wide {width: 400px; }
.infoWrapper div.veryWide {width: 600px; }
/* NB The following lines need to include '#content' to ensure 'score' is high enough to out-weight earlier definitions: */
#content .infoWrapper div p, #info .infoWrapper div p {width: auto; font-weight: normal; margin: 10px 20px; }
#content .infoWrapper div p.alert, #info .infoWrapper div p.alert {padding-left: 33px; background: transparent url("../Images/alertButtonWhite.gif") no-repeat 0px 3px; }
#content .infoWrapper div h3, #info .infoWrapper div h3 {margin: 20px 20px 10px 20px; }
.infoWrapper div a.button:link, .infoWrapper div a.button:visited {display: block; line-height: 27px; width: 60px; 
	font-weight: normal; color: black; text-align: center; text-decoration: none; margin: 10px 105px; 
	background: transparent url("../Images/closeButton.gif") no-repeat center center; 
	}
.infoWrapper div.wide a.button:link, .infoWrapper div.wide a.button:visited {margin-right: 170px; margin-left: 170px; } /* To centre 'Close' button: margin = (<DIV width> - <A width>) / 2 */
.infoWrapper div.veryWide a.button:link, .infoWrapper div.veryWide a.button:visited {margin-right: 270px; margin-left: 270px; }
.infoWrapper div a.button:hover {text-decoration: underline; }

/*** Quote Stage 2 Selection Boxes ***/
#content .itemBox {float: left; /* position: relative;  CANNOT COMBINE 'float: left' & 'position: relative' (OK in IE & FF but not NS) */ 
	border: 2px solid rgb(180,217,48); margin: 30px 30px 0px 0; }
/*	border: 2px solid rgb(180,217,48); margin: 15px 30px 30px 0; } */
/* * html #content .itemBox {margin-bottom: 0px; } /* 'Star-hack' for IE5.x/IE6 which positions the subsequent element lower */
#content .itemBox h3 {font-size: 20px; font-weight: normal; line-height: 36px; color: white; background-color: rgb(180,217,48); 
	margin: 0; padding: 0 0 2px 10px; 
	}
#content .itemBox div {position: relative; width: 250px; min-height: 134px; } /* Height increasd from 120px to facilitate additional Building Insurance text */
* html #content .itemBox div {height: 134px; } /* 'Star-hack' for IE5.x/IE6 which effectively implements 'heignt' as 'min-height' */
#content .itemBox p {width: auto; font-size: 10px; padding: 8px 10px 34px 10px; margin: 0; }
/*
#content .itemBox label {position: absolute; right: 0; bottom: 0;  
	font-size: 16px; font-weight: bold; color: white; background: rgb(180,217,48) url("../Images/itemSelectBg.gif") no-repeat left top; 
	padding: 3px 0 3px 15px; /* Really want line-height = 25px (=> 27px height curved block inc 2px border) but doesn't work on IE when <input..> element included inside <label></label> tags * 
	margin: 0; 
	}
*/
#content .itemBox label {position: absolute; right: 0; bottom: 0;  
	font-size: 16px; font-weight: bold; color: white; background: rgb(180,217,48) url("../Images/itemSelectBg.gif") no-repeat left top; 
	padding: 2px 0; /* Really want line-height = 25px (=> 27px height curved block inc 2px border) but doesn't work on IE when <input..> element included inside <label></label> tags */ 
	margin: 0; 
	min-width: 153px; text-align: right; white-space: nowrap; 
	}
* html #content .itemBox label {width: 153px;	/* 'Star-hack' for IE5.x/IE6 which effectively implements 'width' as 'min-width'.. */ 
	padding: 3px 0;}					/* .. also need slightly more padding above and below */
#content .itemBox input {margin-left: 10px; }
* html #content .itemBox input {margin-left: 5px; } /* 'Star-hack' for IE5.x/IE6 which has some margin built-in */

/*** Quote Stage 4 Quote Box ***/
/* WIDTH PART MOVED TO SINGLE 533px WIDTH LINE ABOVE
#content div.quoteBox {width: 533px; border: 2px solid rgb(180,217,48); padding: 0px; margin-top: 32px; }
*/
#content div.quoteBox {border: 2px solid rgb(180,217,48); padding: 0px; margin-top: 32px; }
#content p.loggedIn {font-size: 10px; height: 32px; vertical-align: top; margin-top: 0; }	/* "Logged in " text.. */
#content div.quoteBox.loggedIn {margin-top: 0; }					/* .. instead of margin". */
#content div.quoteBox h2 {margin: 20px 20px 10px 20px; }
/*
#content div.quoteBox h2 {margin: 20px; }
#content div.quoteBox h2 {margin-bottom: -10px; }		/* Reduce margin between header and first paragraph... */

/* html #content div.quoteBox h2 {margin-bottom: 20px; }	/* ... 'Star-hack' for IE5.x/IE6 which, for some reason, already renders a reduced margin */
#content div.quoteBox h2 em {color: rgb(172,211,30); font-size: 38px; font-style: normal; font-weight: bold; }
/*h3 {color: black; font-size: 12px; font-weight: bold; margin-top: 1em; margin-bottom: 1em; }*/
#content div.quoteBox h3 {font-size: 11px; font-weight: normal; margin: 30px 0 10px 20px; }
#content div.quoteBox p {width: auto; margin: 0 20px; }
#content div.quoteBox p.indented {padding-left: 20px; margin-top: 0; }
#content div.quoteBox p.spaced {margin-bottom: 20px;}
#content div.quoteBox table {margin: 0 20px 20px 20px; }
/* <CAPTION> replaced by <P> as positioning of CAPTION too variable between browsers (can fix IE but still indents in MAC Safari)
#content div.quoteBox table caption {text-align: left; margin: 10px 20px 10px 20px; }
* html #content div.quoteBox table caption {padding: 10px 0; } /* 'Star-hack' for IE5.x/IE6 which applies the table margin to the caption */

#content div.quoteBox table.premium {width: 490px; line-height: 1.2; }
#content div.quoteBox table.premium tr {vertical-align: top; }
#content div.quoteBox table.premium th {font-weight: normal; padding: 15px 30px 5px 0; }
#content div.quoteBox table.premium thead th {font-weight: bold; padding-top: 5px; padding-bottom: 0; white-space: nowrap; }
#content div.quoteBox table.premium thead th.right {padding-right: 0; min-width: 100px; }	/* Set width of right-hand column in case cells are empty (no 'change cover' links).. */
* html #content div.quoteBox table.premium thead th.right {width: 100px; } /* .. 'Star-hack' for IE5.x/IE6 which effectively implements 'width' as 'min-width' */
#content div.quoteBox tr.mainItem td {padding: 15px 0 5px 0; }

#content div.quoteBox ul {margin-left: 35px; margin-right: 20px; }
#content div.quoteBox * html ul {margin-left: 40px; } /* 'Star-hack' for IE5.x/IE6 which needs more margin to left-justify bullets */

#content div.quoteBox table.tight td {padding-top: 2px; }
/*
#content div.quoteBox {width: 500px; border: 2px solid rgb(180,217,48); padding: 20px; }
#content div.quoteBox h2 {margin: 10px 0; }
#content div.quoteBox h2 em {color: rgb(172,211,30); font-size: 36px; font-style: normal; font-weight: normal; }
#content div.quoteBox p {width: auto; margin: 10px 0; }
#content div.quoteBox table {width: 100%; margin: 10px 0; }
#content div.quoteBox table caption {text-align: left; margin: 20px 0 10px 0; }
#content div.quoteBox td {padding-bottom: 10px; }
*/

/*** Quote Stage 5-7 "Buy" Form fields ***/
/*** I DON'T THINK THESE ARE USED (see form2col above) ***/
body.buy #content label {display: inline; float: left; width: 300px; margin: 0; }
body.buy #content label.small {display: inline; /* For some reason, need to repeat 'display: inline' for NS */
	float: none; width: auto; 
	font-size: 11px; color: black; margin-left: 1em
	}
body.buy #content input {width: 200px; }
body.buy #content input.checkbox {width: auto; }
body.buy #content input.desc {width: 300px; }
body.buy #content input.value {width: 80px; }
body.buy #content input.char2 {width: 25px; }
body.buy #content div.indented {padding-left: 50px; }
body.buy #content div.indented label {width: 250px; }
body.buy #content h2 {margin-top: 40px; margin-bottom: -10px; }

body.buy #content th, body.buy #content td {vertical-align: middle; }
body.buy #content thead th {text-align: center; }
body.buy #content tbody th {text-align: right; font-weight: normal; }

body.buy #content ol.importantInfo select {display: block; margin: 10px 0 20px 0; } 


/*** Retrieve Quotes ***/
#content table.quotes {margin-top: 20px; }
#content table.quotes th {text-align: center; padding-top: 8px;}
#content table.quotes td, #content table.quotes th {vertical-align: middle; }
#content table.quotes tr.expired {color: rgb(60%,60%,60%); }
#content table.quotes input { }


/*** Demands and Needs ***/
body.demandsAndNeeds #content table {width: 520px; margin-top: 20px; }
body.demandsAndNeeds #content table td, body.demandsAndNeeds #content table th {width: 50%; text-align: left; padding: 5px; border: 2px solid rgb(180,217,48); }
body.demandsAndNeeds #content table th {vertical-align: middle; background-color: rgb(180,217,48); }



/***
/*** INFO styles (pop-up info/help window)
/**/
/* 
#info {padding: 0 20px 0px 20px; margin: 0px; } 
#info {padding: 0 10px; margin: 10px; }
*/
/* #info {padding: 0 10px; margin: 0 10px; } */
#info {padding: 0 20px 10px 20px; margin: 0; }
/* #info h2 {margin-top: 20px; margin-bottom: 20px; } */
/* #info p {padding: 0; margin: 15px 0; max-width: 520px; } */
#info p {padding: 0; margin-top: 15px; max-width: 520px; }
#info p.tight {margin-top: 10px; margin-bottom: 10px; }
#info ul.spaced li {margin-bottom: 7px; }
#info table {width: 520px; }
#info table.bordered td, #info table.bordered th {text-align: center; line-height: 1.3; padding: 5px; border: 2px solid rgb(180,217,48); }
#info table.bordered th {vertical-align: middle; background-color: rgb(180,217,48); }
/* Moved to Common section
#info table td {vertical-align: top; }
*/
#info table td.left {text-align: left; }

#info a.closeButton:link, #info a.closeButton:visited {display: block; line-height: 30px; width: 60px; 
	font-weight: normal; color: black; text-align: center; text-decoration: none; margin: 30px auto 10px auto; /* margin: 30px 0 10px 230px;  */
	background: transparent url("../Images/closeButtonWhite.gif") no-repeat center center; 
	}
#info a.closeButton:hover {text-decoration: underline; }


/***
/*** FOOTER styles
/**/
#footer {font-size: 11px; font-family: Tahoma,Verdana,sans-serif; text-align: center; line-height: 1.2; 
	background-color: rgb(180,217,48); padding: 7px 0; 
	border-top: 2px solid white; border-bottom: 4px solid black; 
	}
* html #footer {padding-top: 3px; } /* 'Star-hack' for IE5.x/IE6 where preceding floated element causes top-margin here to be 'doubled + 2px' */
/*
#footer p {padding: 0; margin: 8px 0; }
* html #footer p {margin-top: 6px; } /* 'Star-hack' for IE5.x/IE6 where additional 2px of top-margin added */


/***
/*** OUTER FOOTER (REGISTERED ADDRESS & CREDITS) styles
/**/
#outerFooterWrapper {line-height: 1.2; }
#registeredDetails, #credits {font-size: 10px; font-family: Tahoma,Verdana,sans-serif; padding-top: 10px; }
#registeredDetails {text-align: left; }
#credits {text-align: right; }