@charset "UTF-8";
/* CSS Document */
* {
	margin: 0;
	padding: 0;
}
body{
	background-color:#FFF;
	text-align:center;
	font-size:76%;
	font-family:Nunito Sans;
}

.hidden {
	text-indent 	: -90000px; /* accessible visibility:hidden - read by screenreaders  */
}

.removed {
	display:none;
}

.wideLabel{
	color:#000;
	font-size:1em;
	margin: 0 1em 0 10px;
	width:85%;
	text-align: left;
	float: left;
}

.wideInput {
	float: right;
	margin-top: 5px;
}

.pm_addressChoice_menu {
	width: 39em;
	float: right;
}

.pm_postcode_search {
	clear: none;
	float: left;
}

.pm_addrStatusContainer {
	clear: none;
	float: right;
	width: 14em;
}

#waitWhileLoading {
	position: absolute;
	left: 0;
	top: 0;
	height: 100%;
	z-index: 100;
	background-color: #fff;
	opacity: 0.75;
	text-align: left;
}	

/* LAYOUT */
#pruMailWrapper {
	text-align: left;
	margin-left: auto;
	margin-right: auto;
	background-color:#FFF;
	padding-bottom:30px;
	padding-top:5px;
	width:645px;
	height: auto;
   }
#pruMailHeader,pruMailTab{
	width:645px;
	height: 120px;
	margin-top: 35px;
}
#pruMailLogo{
	width:268px;
	margin: 0 0 0 0px;
	float: left;
	padding-top: 5px;
}
/* STYLING */
h1{
	font-size:2.5em;
	color: #db0909;
	margin:12px 0 15px 0;
	line-height:1em;
	padding:0;
}


h1,h2,h3,h4,h5,h6{margin:0;padding:0;}
h1{
	font-size:2.5em;
	color: #17b0ad;
	margin-bottom: 18px;
	margin-top: 15px;
}


h5{margin:0px;
font-size:1.1em;
}

h6 {
	margin-left: 0.8em;
	font-size: 1em;
	margin-top: 1em;
}

/* ANCHORS */
a{
color: #1f4c79; text-decoration: none;}
a:hover{color:#277cc5;}
a:active, a:focus{color:#277cc5;}
p a {text-decoration: underline;}
p a:hover, p a:active, p a:focus {text-decoration: none;}
a img{
    border:none;
}
p,blockquote{margin:0;padding:0 0 1em 0;line-height:1.3em;}

/* CLOSE BUTTON */
#pruMailCloseBtnWrapper{
	width:150px;
	float: right;
	font-size: 0.9em;
	height: 20px;
	min-height: 20px;
	text-align: right;
	margin: 0 0 5px 5px;
}
.pruMailCloseTxt{
	padding-right:25px;
}



.pruMailCloseBtn a:link{
	border:0px;
	width:100px;
	background-image:url(../images/btn_close_sm_blue.gif);
	background-repeat:no-repeat;
	background-position:right;
}
.pruMailCloseBtn a:hover{
	border:0px;
	background-image:url(../images/btn_closehelp_sm_blue.gif);
	background-repeat:no-repeat;
	background-position:right;
}
.pruMailCloseHelpBtnWrapper{
	width:100px;
	float: right;
	font-size: 0.9em;
	height: 20px;
	min-height: 20px;
	text-align: right;
	margin: 0 0 5px 5px;
	clear:both;
}
.pruMailCloseHelpBtn a:link{
	border:0px;
	padding-right:30px;
	background-image:url(../images/btn_closehelp_sm_blue.gif);
	background-repeat:no-repeat;
	background-position:right;
}
.pruMailCloseHelpBtn a:hover{
	border:0px;
	background-image:url(../images/btn_closehelp_sm_blue.gif);
	background-repeat:no-repeat;
	background-position:right;
}
/* PRUMAIL HEADER */
/*#pruMailTabsHeader{
	width:635px;
	background-image:url(../images/bg_prumail_header.jpg);
	background-repeat:no-repeat;
	display: block;
	height:70px;
	min-height:70px;
	padding-left:10px;
}*/

/* ************  NEW CSS for tabbed navigation ***************** */

/* Content Buttons */
.pruMailTabWrapper{ /* Container you can use to surround a CSS button to clear float */
	overflow: hidden; /*See: http://www.quirksmode.org/css/clearing.html */
	width: 500px;
	margin-right:10px;
}

a.pruMailTabOff{
display: block;
float: left;
line-height: 70px; 
height: 70px; 
padding-left: 10px; 
text-decoration: none;
font-size:.95em;
color: #1f4c79;
}

a.pruMailTabOff span{
	background:url(../images/bg-nav-li.gif);
	background-position:bottom right;
	background-repeat:no-repeat;
	display: block;
	padding: 0 10px 0 0px;
	height:67px;
}


a:hover.pruMailTabOff{
	text-decoration:underline;
	color:#277cc5;
}


a.pruMailTabOffNoLine{
display: block;
float: left;
line-height: 70px; 
height: 70px; 
padding-left: 10px; 
text-decoration: none;
font-size:.95em;
color: #1f4c79;
}
a.pruMailTabOffNoLine span{
display: block;
padding: 0 10px 0 0px;
height:67px;
}
a:hover.pruMailTabOffNoLine{
	text-decoration:underline;
	color:#277cc5;
}




#pruMailTopTabTxt{
	width:80px;
	height:40px;
	min-height:40px;
	margin:0 10px 0px 30px;
	color: #FFF;
	text-align: center;
	font-size: 1.2em;
	padding-top: 30px;
}
.logOutBtn{
	float:right;
	margin-top: 20px;
	padding-right: 20px;
	width: 100px;
	margin-right: 10px;
	height: 40px;
}
#pruMailIntroTxt{
	width:565px;
	margin: 0 0 0 40px;
}
.pruMailFormTopFlat{
	background-image:url(../images/bg_form_top_01.gif);
	background-repeat:no-repeat;
	padding-top:11px;
}

.pruMailFormTop{
	background-image:url(../images/bg_form_01.gif);
	background-repeat:no-repeat;
	padding-top:11px;
}
.pruMailFormTopError{
	background-image:url(../images/bg_form_error_bot_01.gif);
	background-repeat:no-repeat;
	padding-top:11px;
}
#pruMailFormRequired{
	background-image:url(../images/bg_form_top_01_v2.gif);
	background-repeat:no-repeat;
	margin-left: 40px;
	width: 565px;
}
#pruMailErrorMssgTxt{
	background-image:url(../images/bg_form_error_topcurve_02.gif);
	background-repeat:no-repeat;
	height: 27px;
	margin-left: 40px;
	width: 565px;
	height:auto;
}
#pruMailErrorMssgTxt ul {
	width:525px;
	margin-left:40px;
	padding-top:10px;
	color:#17b0ad;
	list-style-image: url(../images/icon_error.gif);
	list-style-position: outside;
	font-weight: bold;
}

#pruMailErrorMssgTxt ul ul {
	padding-top: 0;
	list-style-image: none;
	list-style-type: circle;
	font-weight: normal;
}

#pruMailFormBottom{
	background-image:url(../images/bg_form_02.gif);
	background-repeat:no-repeat;
	background-position:bottom left;
	padding-bottom: 10px;
}
 
#pruMailFormContent{
	margin:0 20px 0 20px;
	padding-bottom: 30px;
}
form{
	padding-bottom: 10px;
	width:565px;
	padding-left:40px;
}
.pruMailRequiredTxt{
	margin-left:20px;
	line-height:27px;
	color:#17b0ad;
}

/* HELP TAB */
#pruMailHelpBtnTabWrapper{
	width:47px;
	margin-right:25px;
	padding-top:5px;
	float: right;
	background-image:url(../images/btn_tab_help_v2.gif);
	background-repeat:no-repeat;
	background-position:0px 1px;
	min-height:24px;
}
.pruMailHelpTabBtn{
	margin-top:2px;
	height: 27px;
	min-height: 27px;
	font-size: 0.9em;
}
.pruMailHelpTabTxt{
	color:#FFF;
	padding:10px 10px 10px 12px;
	font-size:1.1em;
}
.pruMailHelpTabBtn a:link{
	border:0px;
	color:#fff;
}
.pruMailHelpTabBtn a:hover{
	border:0px;
	background-image:url(../images/btn_tab_help_v2.gif);
	background-repeat:no-repeat;
	background-position:0px 5px;
	color:#17b0ad;
}
.pruMailHelpTabBtn a:active{
	color:#fff;
}

/* HELP BUTTON */

.pruMailHelpBtn{
	border: 0;
	margin-right:15px;
}

/* FOOTER */
.pruMailFooter{
	width:645px;
	background-image:url(../images/bg_prumail_footer.gif);
	background-repeat:no-repeat;
	height:35px;
	min-height:35px;
	padding-top: 10px;
	margin-top: 10px;
}
.pruMailFooterSpacing{
	display:block; 
	float: left; 
	margin:0;padding:0 13px; 
	background: url(../images/bg_footer_bar.gif) right center no-repeat;
	color:#40668c;
}
.pruMailFooterSpacing a:link{color:#40668c;}


/* FORM STYLING */
fieldset {
	margin: 0 0 20px 0;
	border: 0;
}
legend {  
margin-left: 1em;  
color: #000000;  
font-weight: bold;
}
fieldset ol {  
padding:0;  
list-style: none;
}
fieldset li {
	background-image:url(../images/lines.gif);
	background-repeat:no-repeat;
	background-position:bottom;
	padding: 7px 0 7px 0;
	width: 525px;
	overflow:auto;
}
.infoSection {
	
	padding: 7px 0px 7px 0px;
	width: 525px;
	overflow:auto;
}
.pruMailNextButton {
	width: 65px;
	height: 24px;
	background-image: url(../images/btn_next.gif);
	background-repeat: no-repeat;
	background-position: 0px 0px;
	float: right;
	clear: right;
	margin-right: 20px;
}
.pruMailNextButton:hover {
	background-image: url(../images/btn_next.gif);
}

.pruMailHomeButton {
	clear: right;
	float: right;
	margin-right: 20px;
}
.pruMailNonNextButton {
	clear: none;
	float: left;
	margin-left: 20px;
}

.pruMailDropdowns {  
	width:auto;
}

.pruMailErrorInput{
	background-color:#ffdf7f;
}

.pruMailRequired{
	color:#17b0ad;
}

.form_absolute_clear{
	margin:0;
	padding:0;
	height:1px;
	clear:both;
	line-height:0;
}
.pmLegend{
	background:url(../images/bg_fieldsetname.jpg);
	background-repeat:repeat-y;
	width:520px;
	padding: 5px 0 5px 0;
	font-weight: bold;
	border-bottom: 1px solid #e1e3e4;
	border-top: 1px solid #f0f1f1;
	font-size:1.1em;
}

.pmLegendText{
	width:48%;
	text-align: right;
}
#pruMailCrumbtrail{
	width:620px;
	margin: 0 0 10px 25px;
}
.pruMailCrumbCurrent{
	color:#17b0ad;
}
.pruMailHelpWrapper{
	width:520px;
	margin: 0 0 5px 0;
	height: auto;
	background-image: url(../images/bg_help.jpg);
	background-repeat: repeat-x;
	background-color: #FFF;
	background-position: 0 0;
	padding-top: 5px;
	padding-bottom: 10px;
	border: 1px solid #99adc2;
}
.pruMailHelpText{
	width:500px;
	margin-left:10px;
}
.pruMailHelpHeader{
	width:500px;
	margin-left:10px;
	min-height:20px;
	border-bottom: 1px solid #99adc2;
	margin-bottom: 5px;
}
#prumailHelpTop{
	width:565px;
	background-image:url(../images/bg_help_top.gif);
	background-repeat:repeat-y;
}
.prumailhelpTopText{
	width:545px;
	height: auto;
	display: block;
	padding: 5px 0 5px 0;
	background-image: url(../images/bg_help.jpg);
	background-repeat: repeat-x;
	margin: 0 10px 5px 10px;
	border: 1px solid #99adc2;
}
.prumailhelpTopTextInner{
	margin:10px;
}
/* FORM SPECIFIC STYLING */
label{
	color:#000;
	font-size:1em;
	margin-right: 1em;
	width:48%;
	text-align: right;
	float: left;
	padding: 3px 0 3px 0;
}
input:focus, textarea:focus{
	background-color: #fff0e5;
	border-top:2px solid #ff8b33;
	border-left:2px solid #ff8b33;
	border-right:2px solid #ffa866;
	border-bottom:2px solid #ffa866;
	padding: 3px;
}

.hideLabel{
	display:none;
}
.clearDiv{
	clear:both;
}

.pruMailFormTxt{
	width:500px;
	margin: 15px 0 0 25px;
}
.labelListLeft{
	color:#000;
	font-size:1em;
	margin-right: 1em;
	width:48%;
	text-align: right;
	float: left;
	padding: 3px 0 3px 0;
}
.labelListRight{
	color:#000;
	font-size:1em;
	margin-right: 1em;
	width:40%;
	text-align: left;
	float: left;
	padding: 3px 0 3px 0;
}

/* ************  NEW BUTTON CODE FOR LOG IN/LOG OUT BUTTON ***************** */


/* Content Buttons */
.pruMailButtonWrapper{ /* Container you can use to surround a CSS button to clear float */
	overflow: hidden; /*See: http://www.quirksmode.org/css/clearing.html */
	width: 100px;
	float: left;
}
.pruMailButtonWrapperBottom{ /* Container you can use to surround a CSS button to clear float */
	overflow: hidden;
	width: 100px;
	float: right;
}
/* blue button with red hover sitting on a grey background */
a.blueButtonRedHovOnGrey{
	background:url(../images/btn_tab_help_v2.gif);
	background-repeat:no-repeat;
	background-position:top left;
	display: block;
	float: right;
	line-height: 30px; /* This value + 4px + 4px (top and bottom padding of SPAN) must equal height of button background (default is 24px) */
	height: 30px; /* Height of button background height */
	padding-left: 12px; /* Width of left menu image */
	text-decoration: none;
	font-size:0.95em;
}


a.blueButtonRedHovOnGrey span{
background:url(../images/btn_tab_help_v2.gif);
background-repeat:no-repeat;
background-position:top right;
display: block;
color:#FFF;
padding: 0 25px 0 0px; /*Set 11px below to match value of 'padding-left' value above*/
}


/* back button sitting at the top of the page */
/* blue button with red hover sitting on a grey background */
a.blueButtonRedHovBackTop{
background:url(../images/btn_tab_help_v2.gif);
background-repeat:no-repeat;
background-position:top left;
display: block;
float: left;
line-height: 30px; /* This value + 4px + 4px (top and bottom padding of SPAN) must equal height of button background (default is 24px) */
height: 30px; /* Height of button background height */
padding-left: 18px; /* Width of left menu image */
text-decoration: none;
font-size:.95em;
}

a:link .blueButtonRedHovBackTop{
color: #ffffff; /*button text color*/
}

a.blueButtonRedHovBackTop span{
background:url(../images/btn_tab_help_v2.gif);
background-repeat:no-repeat;
background-position:top right;
display: block;
color:#FFF;
padding: 0 25px 0 12px; 
}


/* blue button with red hover sitting on a grey background - no arrow */
a.blueButtonRedHovOnGreyNoArrow{
	background:url(../images/btn_tab_help_v2.gif);
	background-position:top left;
	display: block;
	float: right;
	line-height: 30px; /* This value + 4px + 4px (top and bottom padding of SPAN) must equal height of button background (default is 24px) */
	height: 30px; /* Height of button background height */
	padding-left: 12px; /* Width of left menu image */
	text-decoration: none;
	font-size:0.95em;
}

a:link .blueButtonRedHovOnGreyNoArrow{
color: #ffffff; /*button text color*/
}

a.blueButtonRedHovOnGreyNoArrow span{
background:url(../images/btn_tab_help_v2.gif);
background-repeat:no-repeat;
background-position:top right;
display: block;
color:#FFF;
padding: 0 25px 0 0px; 
}



a.blueButtonRedHovOnGreyNoArrow:hover span{ /* Hover state CSS */
background:url(../images/btn_tab_help_v2.gif);
background-repeat:no-repeat;
background-position:right -35px;
color:#FFF;
}


/* back button sitting at the bottom of the page */
/* blue button with red hover sitting on a grey background */
a.blueButtonRedHovBackBottom{
background:url(../images/btn_tab_help_v2.gif);
background-position:top left;
display: block;
float: left;
line-height: 30px; /* This value + 4px + 4px (top and bottom padding of SPAN) must equal height of button background (default is 24px) */
height: 30px; /* Height of button background height */
padding-left: 18px; /* Width of left menu image */
text-decoration: none;
font-size:.95em;
}

a:link .blueButtonRedHovBackBottom{
color: #ffffff; /*button text color*/
}

a.blueButtonRedHovBackBottom span{
background:url(../images/btn_tab_help_v2.gif);
background-repeat:no-repeat;
background-position:top right;
display: block;
color:#FFF;
padding: 0 25px 0 12px; 
}

a.blueButtonRedHovBackBottom:hover span{ /* Hover state CSS */
background:url(../images/btn_tab_help_v2.gif);
background-repeat:no-repeat;
background-position:right -35px;
color:#fff;
}
/* additional info txt */
.additionalInfoWrapper{
	width:520px;
	margin: 0 0 5px 0;
	height: auto;
	padding-top: 5px;
	padding-bottom: 10px;
	border: 1px solid #99adc2;
}
/* ************  NEW  CSS FOR SECURITY STATEMENT ***************** */
.footnote {
	width:560px;
	padding:10px 0 5px 0;
	margin-left: 45px;
	line-height:30px;
	font-size:.9em;
}
.pruMailSecurityIcon{
	margin-right:15px;
}

/* JT added new styles for input groups */
.controlGroup {
	clear: right;
}
.controlGroup label {
	display:inline;
	float:none;
	margin:0 3px 0 2px;
}
.textInputGroup {
	clear: right;
}
.textInputGroup label {
	left:-200em;
	position:absolute;
	top:-200em;
}
.exceptionalDetailFieldLabel {
	left:-200em;
	position:absolute;
	top:-200em;
}
.indicatesHelp{
	margin-left:20px;
	margin-right:5px;
}


.indicatesHelpText{
	margin-top: -10px;
}
.bottomBothButtonWrapper{
	width:525px;
	clear: both;
	text-align: left;
}
#pruMailTabsHeader #tabs {
	width: 400px;
}

/* Bhasker's special label for top-ups */
.bsLabel{
	color:#000;
	font-size:1em;
	margin-right: 1em;
	width:92%;
	text-align: left;
	float: left;
	padding: 3px 0 3px 0;
}

.pruMailHelpText li {
	width: 460px;
	overflow:visible;
	margin-left: 2px;
}

.pruMailHelpText ul {
	width: 460px;
	overflow:visible;
	list-style: disc outside none;
}

a.blueButtonRedHovOnGrey_new{
	background:url(../images/btn_tab_help_v2.gif);
	background-repeat:no-repeat;
    background-position:left 1px;
	display: block;
	float: left;
	line-height: 30px; /* This value + 4px + 4px (top and bottom padding of SPAN) must equal height of button background (default is 24px) */
	height: 30px; /* Height of button background height */
	padding-left: 18px; /* Width of left menu image */
	text-decoration: none;
	font-size:0.95em;
}

a:link .blueButtonRedHovOnGrey_new{
color: #ffffff; /*button text color*/
}

a.blueButtonRedHovOnGrey_new span{
background:url(../images/btn_tab_help_v2.gif);
background-repeat:no-repeat;
background-position:right 1px;
display: block;
color:#FFF;
padding: 0 25px 0 0px; /*Set 11px below to match value of 'padding-left' value above*/
}



a.blueButtonRedHovOnGrey_new:hover span{ /* Hover state CSS */
background:url(../images/btn_tab_help_v2.gif);
background-repeat:no-repeat;
background-position:right -35px;
color:#fff;
}

.New_Link{
	float:left;
	margin-top: 20px;
	padding-right: 20px;
	width: 400px;
	margin-right: 10px;
	height: 40px;	
}