/* Reset */
	h1, h2, h3, h4, p, legend, label, fieldset, li, td, form, a, body {
						margin:0; padding:0; border:none; 
						font:normal 12px/1.5 Verdana, sans-serif; color:#333; }
	a {					color:#000; font-weight:bold; text-decoration:none; }
	a:hover {			text-decoration:underline; }
	h1 {				padding:0; margin:1em 0;
						font-size:18px; font-weight:normal;
						color:#555; }
	h2 {				padding:0 0 0.5em; margin:0;
						font-size:16px; font-weight:normal;
						color:#333; }
	hr {				color: #999; background-color:#999; margin:0; }


/*	Preview message		*/
	div#PreviewInfo {	position:fixed; top:1px; left:25%; z-index:100;
						width:50%; text-align:center; padding:5px 0;
						border:1px solid #999; background:#ffc; 
						border-radius:5px; }


	body {				background:#fff;
						border-top:1px solid #fefefe; }

/*
	#MainContainer
		#TopBanner
		#FormContainer
			<form>
				<h1>heading</h1>
				#MainForm
					<asp:views>
				#SnapInfo
		#Footer
*/

	#MainContainer {	max-width:500px;
						_width:500px; /* consession to IE6 */
						margin:0 auto; padding:0; }
	#FormContainer {	overflow:hidden;	/* clear container */  
						zoom:1;				/* concession to IE6 */
						margin:0 auto;		/*	Centre */
						padding:0 0 26px; min-width:500px;
						background:#fff;
						border:none; }
	#MainForm {			width:490px; /* form width */
						float:left; 
						border:1px solid #d7d7d7; }
	#MainForm p {		position:relative; /* enable abs pos */
						width:100%;
						overflow:hidden; clear:both;
						margin:0.5em 0; }



	/*	TopBanner EXAMPLE styling */
	#TopBanner {		height:84px /* match body background */; 
						margin:0; padding:0 20px; }
	#TopBanner img {	margin-top:16px; }
	#TopBanner h1 {		
						width:auto; text-align:center; 
						padding:0 0 0.5em; }




	/*	The branch info on RHS	*/
	#SnapInfo {			float:right; width:190px; margin:0 auto; }
	#SnapInfo h1 {		margin-top:0.5em; }
	#SnapInfo p {		margin-bottom:1em; }
	#SnapInfo p a {		font-weight:normal; text-decoration:underline;
						display:block; padding-left:10px; background:url(/Clients/_Template/images/arrow_link.gif) 0 0.5em no-repeat; }
	#SnapInfo p.Snap {		margin:60px 0 10px; padding:10px 0 0; position:relative; border-top:1px dotted #ddd; }
	#SnapInfo p.Snap a {	line-height:1; color:#666; padding:5px 0 0; background-image:none; text-decoration:none; font-size:11px; }
	#SnapInfo p.Snap a:hover {	text-decoration:underline;}
	#SnapInfo p.Snap img {	float:left; display:inline/* IE DFMB */; border:none; margin:0 7px 10px 0; }




	/*	Footer */
	.Footer {			clear:both; font-size:0.8em; line-height:1.1; color:#80868e; text-align:center; margin:0; padding:1em 0 0.5em; }
	.Footer a {			color:#70767e; font-size:1em; text-decoration:none; }
	.Footer a:hover {	text-decoration:underline; }








	/*	Fieldset */
	.FSWrap {			margin:1.5em 0; }
	fieldset {			margin:0; padding:0;
						position:relative; /* abs pos legend */
						border:none; }
	legend {			padding:0; margin:0; position:absolute; top:3px; left:10px;
						font-size:14px; font-weight:normal;
						color:#333; }
	fieldset div {		border:1px solid #e0e0e0; border-radius:1px;  background:#f7f7f7;
						overflow:hidden; /* clear */
						padding:32px 10px 10px;}
	fieldset div div {	padding:0; border:none; border-radius:0; background:none; }

	label, 
	.Label {			float:left;	
						width:148px; margin-left:0; margin-right:20px; 
						text-align:right; }
	.WideLabel {		float:none; width:auto; margin:1em 0; }
	label i, 
	.Label i {			/* use italic to set as normal font */
						font-style:normal; font-weight:normal; white-space:nowrap; }
	
	#ProductSelection {	/* span */ display:block; overflow:hidden; }
	#ProductSelection input {	float:left; clear:left; }
	#ProductSelection label {	float:none; display:block; margin-left:30px; width:auto; text-align:left;  }
	
	
	.FullWidthCheckbox label {	float:none; width:auto; margin:0 30px 0 0; 
								/* override the default label settings */ 
								font:normal normal 1em/1.5 Verdana, sans-serif; text-align:left;  }
	.FullWidthCheckbox input {	float:right; margin-bottom:1em; }

	
	em {			/*	Mandatory field - asterisk */	
						position:absolute; left:152px; top:2px;
						font:normal 1.8em/1 Times, serif; }


	.txtWide,
	select.txtWide {	width:230px; }
	.txtMedium ,
	select.txtMedium {	width:110px; /* fit two into the space of one wide one */ }
	.txtNarrow,
	select.txtNarrow {	width:70px; /* fit three into one */ }
	.txtVNarrow {		width:34px; }
	select.txtVNarrow {	width:34px; }
	.AddressList {		margin-left:60px; width:300px; }
	
	.Indent {			margin-left:160px; display:block; }
	
	input, 
	select {			float:left; padding-left:0;                
						box-sizing:border-box; -moz-box-sizing:border-box; -webkit-box-sizing:border-box; }
	select.txtNarrow,
	select.txtMedium {	margin-right:10px; }
	select.Last {		margin-right:0; /* YoB */ } 
	.WideSelect {		margin:1em 0; width:100%; }

	.RadioCheckLabel {	width:auto; margin-left:0; }
	.RadioCheckLabel input {  }
	.RadioCheckLabel label { margin-left:0; margin-right:2em; width:auto; }

	.AddressList,
	.txtWide,
	.txtMedium,
	.txtNarrow,
	.txtVNarrow {		padding:4px 1px; background:#fff; 
						border:1px solid #999999; border-radius:1px; }
	input[type=text] {	padding-left:4px; }


	.Error,
	.WideError {		margin:0.5em 0; border:2px solid #c00; border-radius:5px; padding:3px 10px; 
						color:#a00 !important; font-weight:bold; background:#fce6e2; zoom:1/*IE*/; }
	p.Error,
	.WideError[style*="inline"] {
						display:block !important; box-sizing:border-box; width:100%; clear:both;
						box-sizing:border-box; -moz-box-sizing:border-box; -webkit-box-sizing:border-box; }
	#MainForm p.Error
	#MainForm .WideError {	width:auto; }
	.Error li,
	.Error p {			color:#a00; }
	.Error input {		background:#fce6e2; border:1px solid #c00; }
	.Error strong {		color:#a00; }
	.Error {			float:left; clear:left; margin-left:168px; width:197px; }
	div.ErrorSummary {	color:#a00; font-weight:bold; display:none; }
	.ErrorSummary ul {	margin:0; }
	.ErrorSummary li {	 }
	p.ErrorText {		color:#a00; font-weight:bold; margin:0.5em 0; }
	
	/*	For override errors	*/
	.ErrorMessage {		border:1px solid #c00; background:#fff; padding:0.5em 1em; }
	.ErrorMessage p,
	.ErrorMessage li {	color:#f33; font-weight:bold; }

	textarea {			font:small Arial, sans-serif; }

	
	p.Buttons {							text-align:right; clear:both; }
	p.Buttons input {					float:none; padding:3px 10px; }
	p.Buttons .btnSecondary {			float:right; margin-right:1em; margin-top:1em; background:none; border:none; cursor:pointer; }
	p.Buttons .btnNext,
	p.Buttons .btnNext_Disabled,
	p.Buttons .btnConfirm,
	p.Buttons .btnConfirm_Disabled {	float:right; margin-top:1em; }
    p.Buttons .btnConfirm_Disabled,
	p.Buttons .btnNext_Disabled {		opacity: .3;
										filter: alpha(opacity=30);	/* for IE5-7 */
										-ms-filter:"progid:DXImageTransform.Microsoft.Alpha(Opacity=30)"; /* IE8 */ }


	table {				clear:left; border-collapse:collapse; }
	table p {			width:100% !important/* override paragraph settings */; }
	td {				padding:0.4em 0; vertical-align:top; }
	td.Left {			padding-right:30px; width:66%; }
	td.Right {			padding-left:0; width:33%; }
	tr.TwoCols {		/* border-bottom:1px dotted #aaa; Doesn't work on exploder 7 */
						background:url(/Clients/_Template/images/line_dotted.gif) 0 bottom repeat-x; }
	
	td.Wide {			width:230px; }
	td.Medium {			width:130px; }
	td.HalfL {			width:48%; padding-right:2%; }
	td.HalfR {			width:48%; padding-left:2%; }
	ul.DDGuar {			clear:left; margin-left:0; padding-left:5px; }
	ul.DDGuar li {		clear:left; margin-left:10px; padding-left:0; list-style:disc outside none; }
	ul.DDGuar ul {		margin-left:10px; padding-left:10px; }
	
	
	
	
	/*	accordion progress widget styling	*/
	h2.Head, h2.Current, h2.Foot {
						clear:both; margin:0; padding:1em 10px; 
						font: bold 0.92em Verdana, sans-serif; color:#333; }
	h2.Head b, h2.Current b, h2.Foot b {
						padding:1px 0.33em; color:#fff; font: bold 0.85em Verdana, sans-serif; }
	h2.Head {			background:#fff url(../_MasterDocs/Images/tick_green.png) right 1em no-repeat; color:#b0b0b0; border-bottom:1px solid #CED5E5; 
						padding-right:40px; padding-left:32px; text-indent:-22px; }
	h2.Head b {			background:#bbb; }
	h2.Current {		background:#f3f3f3; border-bottom:1px solid #CED5E5; 
						font-size:1em; }
	h2.Current b {		background:#3B3B53 url(../_Controls/Images/NumberBackground.gif) 0 0 no-repeat; font-size:0.85em; }
	#CurrentView {		clear:both; overflow:hidden /* clear contents */; padding:15px 30px; background:#fff; }
	h2.Foot {			background:#f7f7f7; color:#999; border-top:1px solid #CED5E5;  }
	h2.Foot b {			background:#999; }





	span.Slash {		float:left; padding-right:1em; }
	
	
	
	.Disabled {			color:#ccc; cursor:default; }
	.Disabled:hover {	text-decoration:none !important; }


	/*	v2 styling	*/
	.Panel {				margin:0; padding:0; }
	#AddressResults {		margin:0; padding:1em 0 0.5em; display:none;}
	.AddressContainer {		/* needed for IE6 */ 
							clear:both; float:left; }
	#AddressResults select {	width:100%; padding:4px 1px; border:1px solid #999999; border-radius:3px;}
	#AddressResults span {	padding-left:166px; }
	#FindAddress {			position:relative; top:3px; 
							margin:0 0 0 10px; padding: 3px 9px;
							font:normal 12px Arial, Helvetica, sans-serif;
							color: #292929;
							border: 1px solid #949494;
							border-radius:3px;
							background: #d4d0c8; }
	#FindAddress:hover {	background:#a6f4fe; border-color:#26a0da; text-decoration:none; }
	#FindAddress:focus {	outline:none; }
	.AddressFieldWrapper {	display:block; /* inline to block */ float:left; }
	.AddressFieldWrapper input { clear:both; }
	.AddressFieldWrapper .Error {	margin-left:0; }
	#Address1 {				border-bottom-width:0; border-radius:0; border-top-left-radius:1px; border-top-right-radius:1px; margin-bottom:0; }
	#Address2, #Address3, #Address4 {	
							border-bottom-width:0; border-top-color:#ccc; border-radius:0; margin-top:0; margin-bottom:0; }
	#Address5 {				border-top-color:#ccc; border-radius:0; border-bottom-left-radius:1px; border-bottom-right-radius:1px; margin-top:0; }

	.LHCheckbox label {		width:auto; }
	.LHCheckbox span {		clear:both; width:95%; margin:0;}
	.DDLogo {				float:right; border:none; padding:0; margin:0 0 0 30px; }
	.DDLogoAbPos {			position:absolute; top:10px; right:10px; }


	#btnShowOverrideForm {	float:none; display:block; margin:0 auto; }
	#btnLogoff {			float:none; }


	/*	ThreeDeeSecure
		Some grief with iOS6+ which removed IFrame scrolling...  Needs a container around the IFrame */
	#ThreeDIFrameContainer {		-webkit-overflow-scrolling:touch; overflow:scroll; }
	#ThreeDIFrame {				width:100%;  min-width:600px; height:900px;}

	.CheckOptsList {	padding:0 2em;	}
	.CheckOptsList label {	float:left; text-align:left; padding-left:0.5em; width:auto;  }
	.CheckOptsList input {	float:left; clear:left; }
	

@media only screen and (max-width: 500px) {
	h1, h2, h3, h4, p, legend, label, fieldset, li, td, form, a, body, div {
							font-size:16px; line-height:1.3em; min-width:0 !important; }
	body {					min-width:300px !important; }
	#FormContainer>form>h1 {	margin:1em 10px; }
	#MainContainer,
	#TopBanner,
	#FormContainer,
	#MainForm,
	#SnapInfo {				float:none; margin:0; padding:0; width:auto; }
	#SnapInfo p.Snap {		display:none;}
	#SnapInfo,
	#CurrentView {			padding:1em 8px; }
	#TopBanner {			padding-left:10px; }

	#MainForm p.Buttons {	width:95%; padding:0 2%; }
	p, p.Text, p.Text label {	padding:5px 1%; width:98%; }
	p.Text select,
	.txtWide {				width:86%; margin-left:8%; margin-right:2%; }
	.txtMedium {			width:38%; margin-left:8%; margin-right:2%; }
	.txtNarrow {			width:20%; margin-left:8%; margin-right:2%; }
	fieldset {				float:none; }
	fieldset em {			left:10px; top:auto; bottom:0; font-size:24px; }
	span.Error {			width:auto; margin-left:20px; }
	label, .Label {			text-align:left; display:block; width:96%;}
	div.FSWrap {			float:none; padding:10px 1% 0; margin:6px 0 0; width:auto; clear:both; }
	fieldset div {			border:none; }
	fieldset legend {		padding:5px; }
	.RadioCheckLabel {			display:block; margin-left:8%;}
	.RadioCheckLabel label {	margin-left:5px;}
	div.Error {				color:#f33; margin:1%; width:98%; }
	.Buttons input {		font-size:16px; }
	
	
	
	/*	form tweaks	*/
	#TitleOther, #dob_m, #dob_y, 
	#JointMemberTitleOther, #JointMemberDob_m, #JointMemberDob_y {	margin-left:0; }
	.AddressContainer em {	bottom:auto; top:1.3em; }
	.AddressFieldWrapper {	float:none; }




/*	body, .FSWrap { background:cyan !important; }	*/
}