/* 
 * Selector
 * Born: 25/05/2010
 * Define: @media screen, @media print
**/

html, body { height:101%; }
body { font:62.5%/1.4 Verdana, Arial, Helvetica, sans-serif; }
#selectorWrap { 
	width:772px;
	top:-30px;
	position:relative;
}

a { color:#000; }

.printCheckBox,
.printCheckBox * { display:none; }

#selectorControls { padding:0 15px 15px 0; height:20px; }
#selectorControls a {
	color:#333333;
	display:block;
	float:right;
	font-size:1.1em;
	font-weight:bold;
	line-height:20px;
	padding:0 0 0 25px;
	margin:0 0 0 18px;
	text-decoration:none;
}

#selectorControls a.print { background:url(/images/personal/selector-tool/btnPrint.gif) no-repeat 0 0 transparent; }
#selectorControls a.download { display: none; background:url(/images/personal/selector-tool/btnDownload.gif) no-repeat 0 0 transparent; }
#selectorControls a.download.loanProtectionCalculator {display:none !important;}
#ctl00_PageUpperContent_LoanProtectionCalculator1_lnkDownload {display:none !important;}
#startScreen { 
	background-color:#f8f3df;
	position:absolute;
	top:0; left:0;
	z-index:2;
	width:379px;
	margin:0 px;
	padding: 0opx;
	height:100% !important;
	visibility:visible;
}

#startScreen p {
	background:url(/images/personal/selector-tool/blkArrow.gif) 0 5px no-repeat;
	padding:0 0 0 10px;
	position:absolute;
	top:50%;
	left:30px;
	margin-top:-15px;
}

/* Steps */
.step {
	background-color:#efefef;
	padding:4px 10px 0;
	margin:0 0 10px 0;
	border:1px solid #e2e2e2;
	border-radius:5px;
	-moz-border-radius:5px;
	-webkit-border-radius:5px;
	position:relative;
}

.step,
#startScreen p { font-size:1.1em; }
.step ul.options {
	width:380px;
	float:left;
	margin:0; padding:4px 0 10px 6px;
	list-style-type:none;
	color:#000;
	font-size:1em;
	
}

.step ul.options li { display:inline; padding:0 15px 0 0; background:none; }

.step table { width:400px; float:left; text-align:left; }
.step table tr { float:left; }
#step1 .accountSelect { padding:8px 0 0 0; }
#step1 .accountSelect label,
#step1 .accountSelect input { display:block; float:left; }
#step1 .accountSelect input { margin:0 2px 0 0; }
#step1 .accountSelect label { padding:1px 14px 0 2px; }
#step1 .accountSelect br { display:none; }

td img.helpToolTip 
{
	text-align: right; 
	z-index: 100;
	width:13px;
	display:block;
	height:13px;
	position:absolute;
	top:50%;
	right:-20px;
	margin-top:-7px; /* offset half of img height */
}

* html td img.helpToolTip { right:4px; margin-top:-15px; }

.step h2,
#filtersAndProducts h2 { 
	background-position:top left;
	background-repeat:no-repeat;
	padding:0 0 0 32px;
	margin:0;
	text-indent:-999em;
	overflow:hidden;
	height:34px;
	clear:right;
}

#step1 h2 { background-image:url(/images/personal/selector-tool/h2Step1.gif); float:left; width:310px; }
#step2 h2 { background-image:url(/images/personal/selector-tool/h2Step2.gif);  float:left;width:310px; }
.step .hgroup h2 { float:left; width:345px; position:relative; margin-bottom:5px; left:6px; } 
h2#step3 {  background-image:url(/images/personal/selector-tool/h2Step3.gif); }
h2#step4 {  background-image:url(/images/personal/selector-tool/h2Step4.gif); }



/* Filters n Products */
#filtersAndProducts { padding:4px 0 4px 4px; }
#filtersAndProducts #wrapFiltersAndProducts { background:url(/images/personal/selector-tool/filtersAndProductsBg.gif) top left repeat-y; height: 100%; }

	#filtersAndProducts #filterList { margin:0 4px 0 0; }
	#filtersAndProducts #filterList,
	#filtersAndProducts #productList {
		width:379px;
		padding:0 0 0 0;
		background-color:#fff;
		float:left;
		position:relative;
	}

	#filtersAndProducts #filterList #filters,
	#filtersAndProducts #productList #products { padding:4px; }

	#filtersAndProducts .item { border-top:1px solid #eee; }
	#filtersAndProducts .item .itemInner { 
		position:relative;
		background:url(/images/personal/selector-tool/itemBgTop.gif) top right no-repeat;
		padding:2px 15px 5px 5px;
		clear:both;
		
	}
	
	#filtersAndProducts .item .itemInner img { opacity:.5; filter:alpha(opacity=50); display:block; }
	#filtersAndProducts #filters .active img,
	#filtersAndProducts .item .itemInner .activeImg { opacity:1; filter:alpha(opacity=100); }
	
	#filtersAndProducts .item .itemInner span,
	#filtersAndProducts .item .itemInner img,
	#filtersAndProducts #filterList .item .itemInner .itemInfo,
	#filtersAndProducts #productList .item .itemInner .itemInfoWrap {
		display:block;
		float:left;
	}
	#filtersAndProducts .item .itemInner span { padding:5px 0 0 0; }
	#filtersAndProducts .item .itemInner .itemInfo { width:280px; padding:0 0 5px 0;}
	#filtersAndProducts .item .itemInner .itemInfo label {  display:block;}
	#filtersAndProducts .item .itemInner h3 { padding:6px 0; margin:0; font-size:1em; }
	
	

	/* filters */
	#filtersAndProducts #filterList .active { background:url(/images/personal/selector-tool/filterBg.gif) bottom right no-repeat; }
	* html #filtersAndProducts #filterList .active { position:relative; }
	#filtersAndProducts #filters .item .itemInner img,
	#filtersAndProducts #filters .item .itemInner .itemInfo,
	#filtersAndProducts #filters .item .itemInner .itemInfo label { cursor:pointer; }


	/* products */
	#filtersAndProducts #productList .item .itemInner span { padding-right:10px; }
	#filtersAndProducts #productList .active  { background:url(/images/personal/selector-tool/productBg.gif) bottom left no-repeat; }
	#filtersAndProducts #productList .tempActive {background:url(/images/personal/selector-tool/productBg.gif) bottom right no-repeat;  }
	
	#filtersAndProducts #products .item a.prodCta {
		display:block;
		position:absolute;
		bottom:15px;
		right:15px;
	}
	#filtersAndProducts #products .item ul { 
		list-style-type:none;
		margin:0;
		padding:5px 0 0 0;
	}
	#filtersAndProducts #products .item ul li { 
		float:left;
		display:block;
		margin:0; 
	}
	
	.selectorButtons { clear:both; padding:15px 15px 10px; background-color:#ebebeb; }
	.selectorButtons input,
	.selectorButtons a { float:right; margin:0 5px 0 0; }

	#selectorButtons { clear:both; padding:15px 15px 10px; background-color:#ebebeb; }
	#selectorButtons input,
	#selectorButtons a { float:right; margin:0 5px 0 0; }

	#selectorAll { clear:both; padding:15px 15px 10px; background-color:#ebebeb; }
	#selectorAll input,
	#selectorAll a { float:right; margin:0 5px 0 0; }
	
	#selectorCurrent input,
	#selectorCurrent a { float:right; margin:0 5px 0 0; }
	

/* 
 * Comparison Table 
**/

table.tableComparison { width:100%; table-layout:fixed; border-collapse:collapse; border:1px solid #ebebeb; } 
table.tableComparison tr {  border-collapse:collapse; }
table.tableComparison tr.highlight {  border-collapse:collapse; background-color: #fff5cb; }
table.tableComparison tr.lowLight {  border-collapse:collapse; background-color: #c0c0c0; }
table.tableComparison tr th {
	color:#fff;
	text-align:center;	
	vertical-align: top;
	padding:5px 5px 5px 0;
	background-color: #545454;
	position:relative;
}

table.tableComparison tr th.headerRowClose {
	text-align:center;	
	vertical-align: middle;
	margin: 0px;
	padding: 3px 0px 0px 0px;
	background-color: #545454;
	position:relative;	
	height: 18px;
}


table.tableComparison tr th span {
	border-right:1px solid #a1a1a1;
	display:block;
	padding:5px 0;
}

table.tableComparison tr td {
	color:#666666;
	text-align:center;
	padding:7px 12px;
	border: 1px solid #ebebeb;
}

table.tableComparison tr td td { border:none; }

table.tableComparison tr td a { color:#666666; }
table.tableComparison tr td.apply { padding:7px 12px 0; }
table.tableComparison tr td.info { padding:0 12px 7px;}
table.tableComparison tr td.apply a.apply { 
	display:block; 
	margin:0 auto; 
	background:url(/images/personal/selector-tool/btnApply.gif) top left no-repeat; 
	width:73px; 
	height:25px; 
	overflow:hidden;
	text-indent:-999em;
}

table.tableComparison tr td div.tooltip { display:none; } /* ______TEMPORARY______ */
table.tableComparison tr.trProperty { background-color:#ebebeb; }
table.tableComparison td.tdFeature { 
	text-align:left;
	font-weight:bold;
	padding-right:25px;
	border:none;
	border-top:1px solid #ebebeb;
}

table.tableComparison td.tdFeature div { position:relative; }

table.tableComparison th.tdClose
{
	width:13px;
	padding: 0px;
	margin: 0px;
}
table.tableComparison td.tdClose 
{
	width:13px;
	/*border-top: 1px solid #ebebeb;
	border-bottom: 1px solid #ebebeb;
	border-right: 1px solid #fff !important;
	border-left:1px solid #ebebeb;
	border-collapse:collapse;*/
	border-right:none;
	padding-left: 3px;
	padding-right:0px;
}

table.tableComparison td.tdCloseFeature
{
	width:13px;
	/*border-top: 1px solid #ebebeb;
	border-bottom: 1px solid #ebebeb;
	border-right: 1px solid #ebebeb;
	border-left:1px solid #ebebeb;
	border-collapse:collapse;*/
	padding-left: 3px;
	padding-right:0px;
}

.close {
	width:13px;
	height:13px;
	background:url(/images/personal/selector-tool/close.gif) top left no-repeat;
	cursor:pointer;
	position:relative;
	vertical-align:middle;
	text-align:center;
	z-index:5;

}

th .close {
	width:13px;
	height:13px;
	background:url(/images/personal/selector-tool/close.gif) top left no-repeat;
	cursor:pointer;
	position:relative;
	vertical-align:middle;
	text-align:center;
	margin: 0px auto 0px auto;

}
th .alt { background:url(/images/personal/selector-tool/closeDark.gif) top left no-repeat;}

table.tableComparison td.apply { border-bottom:1px solid #fff; vertical-align:bottom; border-collapse:collapse; }
table.tableComparison td.info { vertical-align:top;  border-top:1px solid #fff;}

/*.noBorderTop { border-bottom:0 !important; }*/
table.tableComparison td.tdFeature.noBorderTop { border-bottom:none !important; }

td.noBorderRight { border-right:none !important; }


.tip-wrap
{
	z-index: 13000;
	border: 1px solid #e2d08f;
	border-radius: 10px;
	border-top-left-radius: 0;
	-moz-border-radius: 10px;
	-webkit-border-radius: 10px;
	-khtml-border-radius: 10px;
	-moz-border-radius-topleft: 0;
	-webkit-border-top-left-radius: 0;
	-khtml-border-top-left-radius: 0;
	background: #feeca4;
	padding: 10px;
	text-align: left;
	font-size: 12px;
	max-width: 400px;
	display: none;
}

.promo {
	width:57px;
	height:43px;
	position:absolute;
	top:0;
	right:0;
	background:url(/images/personal/selector-tool/promoFlag.gif) top right no-repeat;
}

.off { display:none; }


 /* Clearing class */
.clearfix:after {
	content: "."; 
	display: block; 
	height: 0; 
	clear: both; 
	visibility: hidden;
}

.clearfix {display: inline-block;}

/* Hides from IE-mac \*/
* html .clearfix {height: 1%;}
.clearfix {display: block;}
/* End hide from IE-mac */

#highlightDifferences
{
	width:769px; 
	overflow:hidden;
	text-align: right;
	height: 44px;
	vertical-align:text-top;
	background-color: #ebebeb;
	padding-right: 3px;
	font-weight:normal;
}
#highlightDifferences h3
{
	padding-top:14px;
	width: 200px;
	float:right;
	padding-right:5px;	
	font-size: 11px;
	font-weight: bold;
}
#highlightDifferences img
{
	padding-top:10px;
	padding-right: 11px;
	float:right;
}

#aHighlight
{
	cursor:pointer;
}

#hideText
{
	display:none;
}