/*General*/
body {	font-family: Verdana, Arial, sans-serif;  font-size: 13px; line-height: 1.4em; background: #E1E1E1;	margin: auto;}

h1 {line-height: 1.3em;}
h5 {font-weight: bold;}
p{	margin: 1em 0em;}
ul {margin: 0.25em 0em 0.5em 1em; padding: 0em 0em 0em 1em;}
li {margin: 0.5em 0em; padding: 0px;}
input:focus, select:focus {/*border:2px solid #06F;*/ /*background: #FFC;*/}
table { border-collapse: collapse; border-spacing: 0; }

a:link, a:visited, a:hover, a:active {    color: #025;	outline: none;     text-decoration: underline;}
a:hover, a:active  { 	color: #C00; text-decoration: underline; }

/*Don't let there be a hover or focus effect on disabled tabs.*/
.ui-widget-content .ui-state-disabled a:hover, .ui-widget-content .ui-state-disabled a:focus  {background: #0078AE}
.ui-state-hover a{background-color: transparent;}
.nav-tabs > li     {text-decoration:none; border-top: 1px solid #CCC; border-right: 1px solid #CCC; border-left: 1px solid #CCC; margin: 0px 0px -1px 10px;border-radius: 7px 7px 0px 0px;}
.nav-tabs > li > a {text-decoration:none; margin-right: 0px;border-radius: 4px 4px 0px 0px;}

/*This is special overrides for the jQueryUI buttons to match the styles above.*/
/*This needs to work for hover and IE6, IE7, etc.*/
.ui-widget-content button.ui-button {
	background: #006699 /*url(../images/button-overlay2.png)  repeat-x top left*/;
	border: 2px solid rgba(51, 102, 204, 0.75);
	}
.ui-button .ui-button-text {padding: 0px;}

.ui-widget-content button.ui-button.ui-state-hover,
.ui-widget-content button.ui-button.ui-state-focus {
	background: #7CE none;
	color: #069;
	} 


/*a.btn:focus, a.assumptions_predefinedBtn:focus {
	border-color: #036;
	background: #27B url(../images/button-overlay2XXX.png)  repeat-x top left;
	box-shadow: 0 3px 5px rgba(0,0,0,0.25);
}
* html a.btn:focus, * html a.assumptions_predefinedBtn:focus {
	border-color: #036;
	box-shadow: 0 3px 5px rgba(0,0,0,0.25);
}
*/
a.btn.ui-button {padding-left: 32px;}
/*.ui-tabs-nav a:focus {background: #red; color: #0066BB;}*/
/*.ui-tabs .ui-tabs-nav li.ui-state-disabled a:focus {background: #A6CAE6; color: #A6CAE6; opacity: 0.35;}*/
/*.ui-tabs .ui-tabs-nav li.ui-state-disabled a:focus {background: #535353; color: #535353; opacity: 0.35;}*/
/*.ui-tabs-nav .ui-state-active a:focus {background: red; color: #0066BB;}*/


/* No need to have the skip link appear 
a.skipToMain:hover, a.skipToMain:focus {position: absolute; left:auto; top: 10px; z-index: 1000;}*/
.alignCenter {text-align: center;}
.alignRight {text-align: right;}
/*.alignRight {text-align: center;}*/
/*
.ui-state-default a:focus {color: red; background-color: #0078AE}
.ui-tabs-selected a:focus {color: red; url("../images/bg_panel_blue2_small.png") repeat-x scroll left -90px transparent;}
*/



/*Structural classes*/

#bodyWrapper {
	background: #FFF;
	max-width: 1000px;
/*	border: 2px solid #0066BB;  */
	border: 2px solid #535353;
	/* border-radius: 5px 5px 5px 5px; */
	text-align: left;
	margin-left: auto;
	margin-right: auto;
	margin-top: 0px;
	margin-bottom: 30px;
	position: relative;
}



.ie6 #container {
	width: 950px;
	padding-left: 10px;
}

#curtain {
	z-index: 9000;
	padding: 0px 0px 0px 0px;
	width: 100%;
	height: 1200px;
	opacity: 1;
	position: absolute;
	top: 0px;
	left: 0px;
	background: #A4A4A4;
	color: #EEE;
	font: bold 36px "Lucida Sans Unicode", "Lucida Grande", sans-serif;
}

#curtain .content{
	text-align: center;
	margin: 5em auto;
}

header {
	clear: both;
	border-bottom: 1px solid #0066BB;	
	padding-bottom: 0px;
	background: #FFF;
	/* padding-left: 2em; */
	
}

#debugger {
	width: 250px;
	position: fixed;
	right: 5px;
	top: 5px;
	border: 1px solid #900;
	background: #FF6;
	padding: 5px;
	margin: 5px;
	font-size: 11px;
	opacity: .8;
	text-align: left;
}

#debugger.smallDebugger {
	width: 10px;
	height: 10px;
}


body.debugging #container{
	margin-left: 100px;
}

.debuggingOnly{
	display: none;
}

body.debugging .debuggingOnly{
	display: block;
}

/* #bannerBar classes*/
#bannerBar {
	height: 80px;
	position: relative;
	background: transparent;
}

#bannerBar #logo {
	/*position: absolute;
	left: 0px;
	top: 0px;
	height: 50px;
	width: 200px;*/
}

#bannerBar #logo img {width: 700px; margin:10px 0px 0px 20px;}
#bannerBar #logo2 img {width: 700px; margin:10px 0px 0px 20px;}

#bannerBar #logo_fr {
	position: absolute;
	left: 520px;
	top: 15px;
	height: 50px;
	width: 200px;
}

#bannerBar #globalNavBar {
	position: absolute;
	right: 15px;
	top: 10px;
	color: #666;
	margin: 0px 0px;
	padding: 0px 0px;
	text-align: right;
}

#bannerBar #globalNavBar a:link, #bannerBar #globalNavBar a:visited, #bannerBar #globalNavBar a:hover, #bannerBar #globalNavBar a:active {
	text-decoration: none;
	color: #0066BB;
	padding: 5px 3px 5px 3px;
}

#bannerBar #globalNavBar a:hover, #bannerBar #globalNavBar a:active {
	text-decoration: underline;
	color: #333;
}

#bannerBar #welcomeText {
	position: absolute;
	right: 15px;
	top: 40px;
	color: #666;
}
#banner_callCenter {color: #666; font-size: 12px; margin-left: 20px;}

/*bannerBar2: New banner based on designer's mockup */
#bannerBar2 {clear:both; width: 100%; margin-bottom: 20px; }
#bannerBar2 tr{padding: 0px; margin: 0px;}
#bannerBar2 td{padding: 0px; margin: 0px;}
#bannerBar2 .picture {width: 180px !important;}
#bannerBar2 .pictureWrapper {width: 180px !important;}
#bannerBar2 .picture img {width: 100%; border-right: 5px solid #025;}
#bannerBar2 .logo {padding-left: 25px; height: 50px; padding-top: 20px; text-align: left; padding-bottom: 20px;}
#bannerBar2 .logo img {width: 100%; max-width: 700px;} 
#bannerBar2 .tagline {padding-left: 25px !important;  height: 0px; color: #333; font-size: 11px; padding-left: 0px;padding-top: 3px;padding-bottom: 10px;}
#bannerBar2 .mercerLogo {text-align:right; float: right; height: 50px; padding-right: 80px;}
#bannerBar2 .mercerLogo img{opacity: 0.5;height: 20px}
#bannerBar2 .globalNav {display: none; text-align: right; height: 20px;/* padding-right: 1em; */width: 100%;}
#bannerBar2 .globalNav a {
	text-decoration: none; font-weight: normal; font-size: 13px;
	padding: 0px 0.5em 0em 0.5em; color: #025;}
#bannerBar2 .globalNav a:hover {color: #C00; }	
#bannerBar2 .globalNav a i {font-size: 15px;}
#bannerBar2_mainNav {border-bottom: 10px solid #036;}
#bannerBar2 .mainNav {display: none; background: #888; vertical-align: bottom;/* padding-left: 15px; */height: 56px;width: 100%;/* border-bottom: 5px solid #036; */}
#bannerBar2 .mainNav a {
 width: 150px; padding: 19px 0px; float:left; transition: 0.5s all;
 border-right: 1px solid #FFF; 
 color: #FFF; font-weight: bold; font-size: 15px; text-align: center;  text-decoration: none;
}
#bannerBar2 .mainNav a:hover {background: #036;}
#bannerBar2 .mainNav a.selectedLink {background: #036;}
.verticalDivider {padding: 0em 0em;}
/*End of bannerBar2 */



#welcomeText a:link, #welcomeText a:visited, #welcomeText a:hover, #welcomeText a:active{
	/*color: #FFF;*/
	text-decoration: ;
}

#welcomeText a:hover{
	/*color: #0066CC; */
	text-decoration: none;
}

#container.glossaryContent {width: 700px; padding: 0px 20px 20px 20px; border:1px solid #CCC;}
.glossaryContent .closeThisWindowLink { margin: 5px 0px 20px 0px; text-align:right !important;}
.glossaryContent .closeThisWindowLink a:link{display: none; }
#container.glossaryContent #glossary h2 {margin-top: 2em;}
#container.glossaryContent #glossary .closeThisWindowLink  {display: none;}


#container.helpContent { width: 700px; padding: 0px 20px 20px 20px; border:1px solid #CCC;}
#container.helpContent H3 {margin-top: 30px;}



/* #topNavBar classes*/
#topNavBar {
	background-color: #336;
	background: #336 url(../images/topNav.png) top left repeat-x;
	clear: both;
	width: 100%;
	height: 38px;
	padding: 1px 0px 0px 0px;
	border-bottom: 1px solid #442266;
}

#topNavBar a:link, #topNavBar a:visited, #topNavBar a:hover, #topNavBar a:active {
	background: #336 url(../images/topNav.png) top left repeat-x;
	color: #FFF;
	text-decoration: none;
	font-size: 14px;
	font-weight: bold;
	padding: 10px 15px;
	margin: 0px 0px 0px 0px;
	border-right: 1px solid #FFF;
	float: left;
	border-bottom: 1px solid #442266;
}

#topNavBar a:hover, #topNavBar a:active {
	color: #336;
	background: #FFCC00;
	text-decoration: none;
	border-right: 1px solid #FFF;
	border-bottom: 1px solid #442266;
}

#topNavBar a.selected {
	background: #FFCC00;
}


/* #main classes*/
#main{
	background: transparent ;
	clear: both;
	padding: 0px 0px 0px 0px;
	margin: 20px 20px 20px 20px;
}

.projectionsContainer header {
	margin-bottom: 0px;
	border-bottom: 0px solid #FFF;
  clear:both;
}

.projectionsContainer #main {margin: 0px 0px 0px 0px;}

#mainLeft {
	background: transparent;
	float: left;
	width: 300px;
	padding: 0px 0px 0px 0px;
	margin: 0px 0px 20px 0px;
}

#mainRight {
	background: transparent;
	float: left;
	width: 620px;
	margin: 0px 10px 20px 10px;
	padding: 0px 0px 0px 0px;
}

#chartBlock.offScreen {
	position: absolute;
	top: -9999px;
	left: 100px;
}


#mainRight a:hover {
	text-decoration: ;
}

#userAgreement_content {
	/*width: 90%; 
	border: 1px solid #000; 
	margin-top: 20px; 
	padding: 20px; 
	height: 150px; 
	overflow: auto; 
	display: block; 
	text-align: left;
	*/
}


#introBlock {padding: 0em 1em;}
#eeProfileBlock {padding: 0em 1em;}
/*#projectionsBlock {padding: 0em 0em;}*/

#eeProfileTbl {
	background: #FFF; 

	border-top: 1px solid #CCC; 
	border-right: 0px solid #CCC; border-bottom:1px solid #CCC; 
	border-left: 0px solid #EEE; 

	/* margin: 5px 5px; */ 
}
/*#eeProfileTbl tr{display:none;}*/
#eeProfileTbl td {padding: 7px 20px;}

/* SCENARIO 1 
uncomment the following 3 lines if you want to have regular text on the leftside for the description */
.eeProfile_question {font-weight: bold; text-align:right;}
.eeProfile_description {display: block; color: #666; font-weight:normal;}
.personalData_description {display: none;}
/**/

/* SCENARIO 2 
uncomment the following 3 lines if you want to have hover effect on the rightside for the description */
/*.eeProfile_description {display: none;}
.personalData_description {display: block; position: absolute; left: -9999px;}
tr:hover div.personalData_description {position: absolute; left: 500px; width: 290px; background:#FFC; border:1px solid #06F; padding: 5px 10px;}/**/
                  


#validationError_intro {display: none; color: #E00; background: #FF9; padding: 0px 0px 0px 20px; font-weight:bold; border:1px solid #E00;}
#validationError_intro a:link, #validationError_intro a:visited, #validationError_intro a:hover, #validationError_intro a:active{
	color: #E00; font-weight:normal;
}
.validationError.validationError_display {}

.validationError {display: none; }
.validationError {color :#E00; background:url(../images/alert_tiny.gif) 0px 0px no-repeat; padding: 2px 0px 2px 20px;}
span.validationError { margin-left: 10px;}



#projectionsContent {margin: 10px 0px 0px 0px; position: ; left:;}
/*TODO: hide this so IE7 doesn't have stretched out panel when starting projections.htm*/
/*#projectionsContent.offScreenMode {position: absolute; left: -9999px;} */

#noDataMessage {
	float: right;
	width: 400px;
	padding: 20px 50px 20px 50px;
	margin: 20px 60px 20px 60px;
	border: 1px solid #F90;
	color: #F90;
	background: #FFC;
	font-size: 14px;
	font-weight: bold;
}



#sampleUsers{
	position: absolute;
	top: 55px;
	right: 0px;
}

#sampleUsers a.sampleUser {
	padding: 3px 5px;
	border-left: 1px solid #444;
	cursor: pointer;
}

#personalDataBlock, #assumptionsBlock{
	padding-bottom: 15px;
}

.tblBorders {
	border-bottom: 1px solid #FFF;
	margin-bottom: 5px;
}

.introText {
	/* font-weight: bold; */
	color: #222;
	padding: 1em 2em 1em 0em;
}

#projectionsBlock {padding: 0em 0em;}

.inHomeEligibleBlock0 {margin-top: 40px; border-bottom: 1px solid #CCC; padding-bottom:5px;}

.inHomeEligibleTrue {
	display: none;
	border-top: 1px solid #CCC;
	background: transparent url(../images/house.gif) 0px 10px no-repeat;
	margin: 10px 0px 0px 0px;
	padding: 10px 0px 0px 40px;
}

.inHomeEligibleFalse {
	display: none;
	border-top: 1px solid #CCC;
	background: transparent url(../images/house.gif) 0px 10px no-repeat;
	margin: 10px 0px 0px 0px;
	padding: 10px 0px 0px 40px;
}

#araField {
	border-top: 1px solid #FFF;
	margin-top: 5px;
	padding-top: 5px;
}

.personalData_description {color: #777;}

.field {
	margin: 0px 0px 10px 0px;
	display: block;
	line-height: 1.4em;
	transition: all 0.5s;
}
    .field label, label {
        /* transition: all 1s; */
    }

    .field.ng-hide *{
        color: red; background: #666;
    }

.spouseCoverageField {	color: #000; transition: all 2s all; }
.noSpouseCoverage .spouseCoverageField  {
    transition: all 2s all; 
    color: #FFF; 
    display: none; 
}
.noSpouseCoverage #chartPersonPicker {color: #CCC;}

.hasOriginalSpouse {	transition: all 0.5s;}
.hasOriginalSpouse .hasOriginalSpouseField { display: none; }

.retireeField{	transition: all 0.5s;}
.thisIsRetiree .retireeField {display: none;}

.showDuringDebuggingMode {display: none;}
    .debuggingMode .showDuringDebuggingMode {  display: block;    }


.unselectedField {
	border: 0px solid #06F; 
	color: #666;
	padding: 5px 5px;
}

.unselectedField:hover {
	color: #333;
	background: #FFD;
}

div.selectedField {
	border: 1px solid #3E5DA9; 
	color: #000;
	background: #FFD;
}

.unselectedField3 {
	border: 0px solid #06F; 
	color: #666;
	padding: 5px 5px;
}

.unselectedField3:hover {
	border-top: 1px solid #999; 
	border-bottom: 1px solid #999; 
	color: #333;
	background: #FFD;
}

div.selectedField3 {
	border-top: 1px solid #999; 
	border-bottom: 1px solid #999; 
	color: #000;
	background: #FFD;
	font-weight:bold;
}
	
.unselectedField2 {
	border: 0px solid #06F; 
	color: #EEE;
	padding: 5px 5px;
}

.unselectedField2:hover {
	color: #EEE;
	background#3E5DA9;
}

.selectedField2 {
	border: 1px solid #3E5DA9; 
	color: #FFF;
	background: #3E5DA9;
}


.disabledField {
	color: #666;
	display: none;
}

.fieldSeperator {
	margin: 0px 0px;
	padding: 10px 0px;
	border-top: 1px solid #FFFFFF;
}

.fieldInput {padding-left: 10px;}
.fieldFootnote {color: #555; padding-left: 5px;}

.slider {
	width: 220px;
	margin-top: 5px;
	margin-left: 15px;
	cursor: col-resize;
}

.slider2 {width: 330px;}

.sliderOut {
	font-weight: bold;
}

table.sliderScale {}

table.sliderScale td {
	padding: 0px;
	color: #222;
}



#goToProjectionsTabWrapper {
	clear: both;
	margin-top: 10px;
	padding-top: 10px;
	text-align:right;
}

#goToDistTab {
	display: ;
	margin-top: 10px;
}

#goToAcctBalanceTab {
	display: ;
	margin-top: 10px;
}


#resultsColumns {/* background: #F6F6F6; */ /* border-top: 6px solid #025; */ /* min-height: 820px; */ }
#resultsLeftColumn {/* float: left; */ /* left: 0px; */ width: 610px; border: 1px solid #CCC; margin-left: 1em; margin-bottom: 0px; /* border-right: 6px solid #025; */ padding-bottom: 10px;  min-height: 920px;}
#resultsRightColumn {
	/* float: left; */ 
	background: #EEE; right:; left: 630px; width: 290px; 
	border: 1px solid #069; 
	padding: 10px 10px 10px 10px; 
	position:absolute; 
	 
	/* min-height: 900px; */
}
#resultsRightColumn h4 {margin: 0.5em 0em;}

#chartBlock {width: auto; background: #FFF; border:1px solid #CCC; padding-top: 10px; position:relative; clear: both;min-height: 720px;}
.chartIntro {text-align: right;}


#contBlock, #assBlock, #assBlock2, #chartViewingOptionsBlock {
	margin-top: 0px;
	background: none;
	padding: 5px 0px;
	width: auto;
	clear: both;
}
#assBlock3 {
    border-top: 1px solid #666; border-bottom: 1px solid #666;
}

#chartViewingOptionsBlock {width: auto;}
.chartViewingOptions {position: relative; z-index:1000; right:0px; width: 250px; width: 820px;}
a.chartViewingOptions_link {position: relative; z-index:1002; height:; padding: 5px; display: none;}
.chartViewingOptions_details {display: block ;  z-index:1001; text-align: left; background: #FFC; padding: 10px 10px; border:1px solid #06C; opacity: .9; width: 20em;}
.chartViewingOptions_details H3 {}
.chartViewingOptions:hover .chartViewingOptions_link {
	/*background: #FFC; border-top:1px solid #06C; border-right:1px solid #06C; border-left:1px solid #06C; text-decoration:none;*/
}
.viewingOption  { border-bottom: 0px solid #DDDDDD; padding: 0px 0px 0px 0px; margin: 0px 0px 0px 0px;}
.viewingOption input {margin-left: 10px;}


#assBlock {z-index:100; /* background: #EEE; */ /* border:1px solid #069; */}
/* #assBlock label {display: block; transition: all 1s;} */
#assBlock .ui-slider {float: left; margin-right: 10px;}
/*#assBlock input {float: left;}*/



#contBlock {}
.buttonBar {text-align: right; padding: 10px 10px 10px 10px;}

.contPlan {font-weight: bold; border-bottom:1px solid #DDD; padding: 0px 0px 5px 0px;}
.contPlan_selected {color: #000;}
.contPlan_unselected {color: #06C;}
.contPlan_disabled {color: #999;}

.contPlan_selected .contPlan_details{ display: block;}
.contPlan_unselected .contPlan_details{display: none;}
.contPlan_disabled .contPlan_details{}

.contPlan_details {margin-left: 20px; font-weight: normal;}

.contPlan_details_disabled {
	color: #33F;
	font-weight: normal;
	transition: all 1s ease;
}

.contPlan_details_disabled label: hover {}
/*works for FF only*/
.contPlan_details_disabled label.contPlan_details_hover{
	color: #000;
	cursor: pointer;
}
/*Works for IE also*/
.contPlan_details_disabled .contPlan_details_extras{
	display: none;
}

.contPlan_details_enabled {
	color: #000;
}

.contPlan_details_enabled .contPlan_details_extras{
	display: block;
	margin: 0px 0px 0px 10px;
	color: #000;
	font-weight: ;
}

#assumptions_predefinedBtn_table .assumptions_predefinedLink {}
#assumptions_predefinedBtn{
	border-top: 1px solid #CCC; border-bottom: 1px solid #CCC;padding-bottom:10px;
}






#tranxBlock .field{
	line-height: 1.3em;
	margin: 7px 0;
}

#tabs  {
	border: none;
	background: none;
}
#resultsTabs {
	border: none;
	background: none;	
}

#resultsGraph  {
	background: transparent;
	color: #fff;
	margin: 0px 0px 0px 2px;
	padding: 0px 0px 0px 0px;
	font: 300 100.1% "Helvetica Neue", Helvetica, "Arial Unicode MS", Arial, sans-serif;
	border-top: 0px solid #666;
	border-right: 0px solid #CCC;
	border-bottom: 0px solid #CCC;
	border-top: 0px solid #666;
}

#resultsGraph #holder {
	height: 280px;
	width: 600px;
}

#resultsGraph #copy {
	bottom: 0;
	position: absolute;
	right: 1em;
	text-align: right;
}

#resultsGraph #copy a {
	color: #f00;
}


#lineGraph {
	width: 580px;
	height: 350px;
}

/*#resultsTab1.ui-tabs-hide #lineGraph {
position: absolute;
top: -300px;
left: -300px;
display: block !important;
}
*/
#resultsTab1.ui-tabs-hide {
	position: absolute;
	top: -99999px;
	left: 0px;
	display: block !important;
}


#resultsTable  {
	background: transparent;
	color: #333;
	padding: 20px 30px 20px 30px;

	padding: 0px 0px 0px 0px;
	margin: 10px 0px 0px 0px;

	border-radius: 5px 5px 15px 15px;

	border-radius: 0px;
}

#resultsTableLayout {}

#resultsTableLayoutLeft {
	width: 300px;
	float: left;
}

#resultsTableLayoutRight {
	width: 240px;
	padding-left: 50px;
	float: right;
}

* html #resultsTableLayoutRight {
	width: 240px;
	padding-left: 30px;
}

#resultsTableLayoutRight table{}


#toggleDataBalanceTableWrapper {
	float: right;
	top: 60px;
	right: 10px;
	color: ;
	margin: 0px 10px 0px 0px;
	z-index: 1000000000;
}

#showDataBalanceTable {
	display: block;
}

#hideDataBalanceTable {
	display: none;
}

.showingDataBalanceTable #showDataBalanceTable {
	display: none;
}

.showingDataBalanceTable #hideDataBalanceTable {
	display: block;
}

a#toggleDataBalanceTable: link, a#toggleDataBalanceTable: visited, a#toggleDataBalanceTable: hover, a#toggleDataBalanceTable: active {
	display: block;
	background: transparent;
	font-size: ;
}

a#toggleDataBalanceTable: hover, a#toggleDataBalanceTable: active {
	color: #444;
	text-decoration: none;
}

#dataBalanceTable {}

#dataAnnuityTable {}

#dataDetailsTableWrapper {
	display: ;
	float: right;
	width: 300px;
}

#dataBalanceTableWrapper2 {
	text-align: center;
	display: ;
	float: left;
	width: 250px;
}

td.dataDetailsTable_withoutSpecialTranxColumn {
	text-align: right;
}

td.dataDetailsTable_withSpecialTranxColumn {
	text-align: right;
}


.tbl {border: 1px solid #EEE; width: 100%;}
.tbl th {padding: 0.5em 1em; border-bottom: 1px solid #999; border-right: 1px solid #DDD; }
.tbl td {padding: 0.5em 1em; border-bottom: 1px solid #999; border-right: 1px solid #EEE;}

.tbl thead td {background: #CDE; color: #000; font-weight: bold;border-right: 1px solid #EEE;}
.tbl thead th {background: #025; color: #FFF;}

.tbl tbody {border-right: 0px solid #BBB;}
.tbl tbody tr th {background: #F6F6F6; }
.tbl tbody tr td:last {border-right:1px solid #BBB;}

.tbl tfoot {background: #E7E3D6; color: #000; }

.tbl.centeredCells td, .tbl.centeredCells th {text-align: center;}
.tbl .borderRight {border-right: 1px solid #999;}
.tbl td.hiddenCell {display: none;}
.tbl tr.hiddenRow {display: none;}
.showResultsDetails .tbl td.hiddenCell {display: table-cell;}
.showResultsDetails .tbl tr.hiddenRow {display: table-row;}
#resultsLeftColumn {}



.noLinesTbl {}
.noLinesTbl tr {}
.noLinesTbl tr td {border:  0px solid #FFF;}

.stripedTbl tr.evenRow td, .stripedTbl tr.evenRow th{
	background: #F6F4EF; 
	background: #FFF;
}

.stripedTbl tr.oddRow td, .stripedTbl tr.oddRow th{
	background: #F2F5F9;
	background: #EEE;
}

.evenRow {
	background: #F6F4EF; 
	background: #FFF;
}

.oddRow {
	background: #F2F5F9;
	background: #EEE;
}

.dataTbl {
	border-left: 1px solid #999;
	border-top: 1px solid #999;
	border-bottom: 1px solid #999;
	background: #EEE;
	border-collapse: collapse;
}

.dataTbl thead tr th {
	border-right: 1px solid #999;
	border-bottom: 1px solid #999;
	padding: 5px 10px;
	background: #CCC;
	line-height: 1.2em;
}

.dataTbl tbody tr {}

.dataTbl tbody tr th {
	border-right: 1px solid #999;
	border-top: 1px solid #CCC;
	padding: 5px 10px;
	line-height: 1.2em;
}

.dataTbl tbody tr td {
	border-right: 1px solid #999;
	border-top: 1px solid #CCC;
	padding: 5px 10px;
}

.dataTbl tbody tr td.currBalance, .dataTbl tbody tr td.currBalanceHouse {
	text-align: right;
}

.dataTbl tbody tr td.highlighter, .highlighter {
	background: #FF9;
	color: #900;
}





.amt {
	text-align: right;
}

.nobold {
	font-weight: 100;
}

.ui-dialog  {
	text-align: left;
}

.ui-dialog .introText {
	border-bottom: 1px solid #CCC;
	margin-bottom: 20px;
}

.ui-dialog .dataTbl {
	border-left: 1px solid #CCC;
	border-top: 1px solid #CCC;
	background: #FFF;
}

.ui-dialog .dataTbl thead tr th {
	border-right: 1px solid #999;
	border-bottom: 1px solid #CCC;
	padding: 5px 10px;
	background: #222;
	color: #FFF;
}

.ui-dialog .dataTbl tbody tr {}

.ui-dialog .dataTbl tbody tr th {
	border-right: 1px solid #999;
	border-bottom: 1px solid #CCC;
	padding: 5px 10px;
	background: #EEE;
}

.ui-dialog .dataTbl tbody tr td {
	border-right: 1px solid #999;
	border-bottom: 1px solid #CCC;
	padding: 5px 10px;
}

.ui-dialog .dataTbl tbody tr td.currBalance, .dataTbl tbody tr td.currBalanceHouse {
	text-align: right;
}

.ui-dialog .field {
	margin-top: 10px;
}

.ui-dialog .slider {
	width: 350px;
	margin-top: 5px;
	margin-left: 15px;
}



#distBox {}
#distBox_dataAnnuityTable {}
#distBox_dataAnnuityTable td{
	text-align: right;
}

#distBox_fields {
	margin-bottom: 10px;
	float: left;
	width: 470px;
	margin-right: 10px;
	margin-bottom: 0px;
}

.fieldsFloatLeft {}


.distBox_results{
	background: #EEE;
	border: 1px solid #CCC;

	padding: 5px 10px;
	margin: 30px 0px 0px 0px;
	clear: both;

	border-radius: 5px 5px 15px 15px;
}

.dist_userSelected_column {
	background: #EEE;
}


#prettyPrint {
	float: right;
}

#prettyPrint a:link, #prettyPrint a:visited, #prettyPrint a:hover, #prettyPrint a:active {
	color: #009;
	padding: 0px 3px;
}

#prettyPrint a:hover {
	color: #f90;
}

#ddd {
	width: 100%;
	height: 400px;
	font: 11px Calibri, Verdana, Geneva, sans-serif;
	padding: 5px;
	display: block;
	clear: both;
	background: #CCF;
}

.pushLeft {
	float: left;
}
.clearAll {
	clear: both;
}

.showResultsDetailsBtn {display:inline;}
.hideResultsDetailsBtn {display:none;}
.showResultsDetails .showResultsDetailsBtn {display:none;}
.showResultsDetails .hideResultsDetailsBtn {display:inline;}


.warningText {
	background: #FFC;     
	border: 1px solid #CCCCCC;
    margin: 5px 0;
    padding: 5px;}

.warningTextHidden {
	display: none;
}

/*** NEW RECALC MSG FUNCTIONALITY ***/
/*This version tries to cover up most of the chart*/
#recalculateMsg.largeNote {
	background: #EEE; 
	color: #000; 
	padding: 50px 50px 420px 50px;
	margin: 10px 0px 0px 10px;
	position: absolute;
	left: 0px;
	top: 0px;
	opacity: .9;
	font-weight:bold;
	font-size: 14px;
}

/*** NEW RECALC MSG FUNCTIONALITY ***/
/*This version doesn't cover the whole chart. It simply shows a small panel that partially covers the chart*/
#recalculateMsg.smallNote {
	background: #CCC; 
	color: #000; 
	padding: 50px 50px 50px 50px;
	margin: 100px 50px;
	position: absolute;
	left: 0px;
	top: 0px;
	opacity: .9;
	font-weight:bold;	
}

/*** NEW RECALC MSG FUNCTIONALITY ***/
/*hides the table below. If we hide both table and chart then the structure collapses.*/
#chartBlock.showRefreshMsg .tableBlock{
	position:absolute; left: -9999px;
}


a.assumptions_predefinedBtn:link, a.assumptions_predefinedBtn:visited, a.assumptions_predefinedBtn:hover, a.assumptions_predefinedBtn:active  {
	background-color: #090;
}


a.ACCESS_DATE_shortcut {margin: 2px 3px;}

.assetMixPanelTitle {font-weight: bold;}
.assetMixSliders {display: block;}
.assetMixTable {display: none;}
#assetMixPieChart {display: none;}
.showAssetMixTable .assetMixSliders {display: none;}
.showAssetMixTable .assetMixTable {display: table;}
.showAssetMixTable #assetMixPieChart {display: block;}

.assetMixTable thead th {background: #BCD;}
.assetMixTable tbody th {background: #DEF;}

.subHead {color: #666; font-weight: normal;}

.clearFix {clear: both;}
.rollover_panel label{margin-bottom:2px;}
.presetmix_panel label{margin-bottom:2px;}

input {outline: none;}

.additionalInfoBlurb {margin-top: 10px; font-style: italic; clear: both;}


.thickTableBorders {border-top: 10px solid #025; border-bottom: 10px solid #025;}
.thickTableBorders thead td{background: #025; color: #FFF;}

.introColumnLeft {width: 25%;  float: left; background-color: #FFC; border: 1px solid #000; padding-left: 10px; padding-right: 10px;}
.introColumnRight {width: 62%; margin-left: 10%; float: left;}

.introColumnLeft h3 {margin-top: 0px; padding-top: 15px; }

.well {padding: 1em; margin:3em 0em 2em 0em; width: 70%; background: #F6F6F6; border:1px solid #999; border-radius: 3px;}

.userAgreement_intro{}
.legalInfo {background: #F6F6F6; padding: 0em 2em 0em 2em; margin: 0em 1em 2em 0em; border: 1px solid #CCC; height: 220px; overflow: scroll; font-size: 0.9em;}

.buttonWrapper {clear: both; padding: 2em 0em 2em 0em; /* width: 90%; */}
.previousButtonWrapper { text-align: left; float: left; }
.nextButtonWrapper {text-align: right; }



/* 
OVERRIDES 
*/

/*Smaller fonts for widgets*/
/*.ui-widget { font-family: Verdana,Arial,sans-serif; font-size: 1.1em; } */
.ui-widget { font-family: Verdana,Arial,sans-serif; font-size: 1em; }

/*Active buttons show orange background instead of green background*/
.ui-state-active, .ui-widget-content .ui-state-active { background: #FFAA22 url(../Retirement%20Benefits%20Modeling_files/images/ui-bg_gloss-wave_45_e14f1c_500x100.png) 50% 50% repeat-x;} 

/*overlay with diagonal stripes for background*/
/*.ui-widget-overlay { background: #aaaaaa url(images/ui-bg_flat_75_aaaaaa_40x100.png) 50% 50% repeat-x; opacity: .30;filter:Alpha(Opacity=30); }*/
.ui-widget-overlay { background: #aaaaaa url(../Retirement%20Benefits%20Modeling_files/images/ui-bg_diagonals-thick_90_eeeeee_40x40.png) 50% 50% repeat; opacity: .60;filter:Alpha(Opacity=60); }

.ui-tooltip {text-align: left; min-width: 400px;}
.ui-icon {display: inline-block; opacity: 0.5;}
.ui-icon:hover {opacity: 1;}

/**************************************/
/*jquery ui style overrides for tabs*/
/**************************************/
.ui-tabs { padding: 0.0em; }
.ui-tabs .ui-tabs-panel {
	border-top: 0px solid #535353;
	border-radius: 0px 0px 0px 0px;
	padding: 0em 3em;
}
.ui-tabs .ui-tabs-nav li {
	margin: 0em 0em 1px 1em;
}
.ui-tabs .ui-tabs-nav li { top: 1px;  }

.ui-tabs .ui-tabs-nav li.ui-tabs-active,
.ui-tabs .ui-tabs-nav li.ui-tabs-active.ui-state-hover{
	background: url(../images/bg_panel_blue2_small.png) left -90px repeat-x;
	border: 1px solid #535353;
	border-bottom: 0px solid #FFF;  
	font-weight: bold;
}

.ui-tabs .ui-tabs-nav li.ui-tabs-active a, 
.ui-tabs .ui-tabs-nav li.ui-state-disabled a, 
.ui-tabs .ui-tabs-nav li.ui-state-processing a {
	color: #09D;
}
.ui-state-default, .ui-widget-content .ui-state-default {}
.ui-slider-handle {}
.ui-tabs .ui-tabs-nav {	background: none; border: 0 solid #4297D7;}
.ui-tabs.ui-widget-content {}



/*COLORS FOR TABS AND ACCORDIONS*/
.ui-state-default, 
.ui-widget-content .ui-state-default, 
.ui-widget-header .ui-state-default { 
	color: #FFF; 
	/*background: #EEE; */
    border: 1px solid #AAA;  
	font-weight: normal; }
.ui-state-default a, 
.ui-state-default a:link, 
.ui-state-default a:visited { 
	color: #09D; text-decoration: none; }

.ui-slider-horizontal .ui-slider-handle {background: #09D;}

.ui-state-hover, .ui-widget-content .ui-state-hover, .ui-widget-header .ui-state-hover, 
.ui-state-focus, .ui-widget-content .ui-state-focus, .ui-widget-header .ui-state-focus { 
	color: #0F0; border: 1px solid #448dae;  font-weight: normal; }
.ui-state-hover a:link, .ui-state-hover a:visited, .ui-state-hover a:hover, .ui-state-hover a:active,
.ui-state-focus a:link, .ui-state-focus a:visited, .ui-state-focus a:hover, .ui-state-focus a:active, .ui-state-focus a:focus { 
	color: #F00; text-decoration: none; }
.ui-state-hover a:hover, .ui-state-focus a:hover{ background: #09D; color: #fff;}	

/*white on green*/
.ui-state-active, .ui-widget-content .ui-state-active, .ui-widget-header .ui-state-active { 
	color: #FFF; 
	background: #09D; 
	border: 1px solid #2BF;  
	font-weight: bold;  }
.ui-state-active a, .ui-state-active a:link, .ui-state-active a:visited { 
	color: #FFF; text-decoration: none; }
.ui-state-active a:hover { 	/*background: #280; */}	
.ui-tabs-nav .ui-tabs-selected a:hover{background:transparent;}	

.ui-widget :active { outline: none; }
/*COLORS FOR TABS AND ACCORDIONS*/


.ui-dialog .ui-dialog-content {}
.ui-widget input {
	/*font-size: 11px;*/
	/*font-size: 3em;*/
}












body #container input.radioBtn {
	font-size: 1em;
}
body #container select {
	font-size: 1em; 
}
body #container option {
	font-size: 1em; 
}

.printTitle {
	display: none;
}

/* Default styles for banner for Welcome, userAgreement, disagreement, logout, etc. */
/* Projections page will have inline styles in the projections.cshtml to compensate. */
#main {margin-left: 180px; }
.mainNav, .globalNav {display: none;}
#bannerBar2 .picture img {width: 110px; }



/**************************************/
/* WELCOME */
/**************************************/
.welcomeContainer header {height: 110px;}
.welcomeContainer header #bannerBar2 .picture img{width: 100px;}
.welcomeContainer header #bannerBar2 .globalNav {display: none;}
.welcomeContainer header #bannerBar2 .mainNav {display: none;}

.welcomeContainer #main {width: 80%; margin-left: 200px; padding-top:2em;}

.welcomeContainer_step2Wrapper {opacity: 0.6;}
.welcomeContainer_step2Wrapper.fullOpacity {opacity: 1;}

.passwordBox {margin: 2em; padding: 1em; border:1px solid #EEE; background: #F6F6F6;clear: both;}

.welcomeContainer h3 {margin-bottom: 0px;}
.welcomeContainer p {margin-top: .5em;}



/**************************************/
/* disclaimer */
/**************************************/

.userAgreementContainer {}
.userAgreementContainer header {height: 110px;}
.userAgreementContainer header #bannerBar2 .picture img{width: 100px;}
.userAgreementContainer header #bannerBar2 .globalNav {display: none;}
.userAgreementContainer header #bannerBar2 .mainNav {display: none;}

.userAgreementContainer #main {margin-left: 200px;}

.warningWrapper {font-size: 12px;}

.warningWrapper h2 {
	line-height:1.4em; font-size: 15px;
}
.disc-mainList {margin-left:30px; }
.disc-mainList li{
	padding-bottom: 7px; 
}
.disc-mainList li p{
	padding: 0px 0px 4px 0px; 
}
.disc-mainList li ul li{
	list-style-type: disc; padding-bottom:1px;  
}

#disclaimerPrintOnly {
	display: none;
}

.validation-summary-errors, .field-validation-error {color: red;}
.subLabel {margin-top: -5px; color: #666;}

.ui-icon {cursor: help;}
.ui-widget-header .ui-icon {cursor: pointer;}

/**************************************/
/* calculatorPage */
/**************************************/

.calculatorPage #main {
  margin-left: 0px;
}

.calculatorPage .mainNav,
.calculatorPage .globalNav {
  display: block;
}

.calculatorPage #bannerBar2 .picture img {
  width: 180px;
}

.calculatorPage #bannerBar2 .logo,
.calculatorPage #bannerBar2 .tagline {
  padding-left: 40px;
}

.calculatorPage #bannerBar2 .mercerLogo {
  padding-right: 40px;
}

/**************************************/
/* Normal classes */
/**************************************/


.sideBar {
	margin: 20px 0px 20px 20px;
	border: 1px solid #666;
	padding: 2em;	
	background-color: #FFFFCC
}

.sideBar h4 {
	margin-top: 0px;
}


.recalculateMessage {
	color: #C00;
	font-weight: bold;
	display: block;
	background-color: #FFC;
	padding: 10px;	
}

.leftColumnResultsSection {
	width: 100px;
    height: 100px;
    position: relative;	
}


.chartTableBlock_offScreen {position: absolute; left: -9999px;}
.offScreen {position: absolute; left: -9999px;}
a.skipToMain {position: absolute; left: -9999px;}

.recalculateDiv {
	background-color: transparent;
	background-color:#FFC;	
	width: 100%;
    height: 100%;
    position: absolute;
    top: 0;
    left: 0;
	z-index: 10;
	background: rgba(255, 255, 153, 0.5);
}

.recalculateOverlay {
	width: 350px;
	display: block;
	background-color: #555;
	margin-top: 50px;
	margin-left: 120px;	
	padding: 10px;
	color: #FFF;
	font-size: 16px;
}

.tbl td.titleRow {border-bottom: 0px solid red;}
.tbl td.titleRow i {font-size: 16px; color: #999;}
.tbl td.titleRow:hover i {font-size: 16px; color: #069;}
.ui-datepicker-trigger{margin-left: 5px;}

.errorSummary { background:#FEF; color: #900; padding: 10px 10px 100px 10px;}
.error { background:#FEF; color: #900;}
input.ng-invalid, select.ng-invalid  {border:1px solid #900; background:#FEF;}  /*for IE*/

.navTable #navTable, 
.navGraph #navGraph {
    background: #EEE;
    /* margin-bottom: -10px; */
    /* z-index: 9999; */
}

.editableAssumptionsTitle {text-transform: uppercase; }

.offscreen {position: absolute; top:0px; left: 999999px;}
#drawdownTable table {margin-top: 20px;}

.errorMsg {background-color: #FFC; color: #900; padding: 0.5em;}

/****************************************************/
/****************************************************/
/****************************************************/

.container {max-width: 1000px;}
@media (min-width: 768px) {
	.container {width: 100%;}
}
.muted {color: #666; }
#editableAssumptions { background: #EEE;}
a.btn-primary {color: #FFF;}
.adminRow {background: #EEE;}
.resultsColumn { padding: 0em 2em;}
@media (min-width: 768px) {
    .modal-lg {width:auto; margin: 30px 30px;  }
}
@media (min-width: 992px) {
    .modal-lg {width:900px; margin: auto;  }
}



/* MAIN    *****************************************************************/ 
/* MAIN    *****************************************************************/ 
/* MAIN    *****************************************************************/ 

main {padding-bottom: 4em;}



/* FOOTER  *****************************************************************/ 
/* FOOTER  *****************************************************************/ 
/* FOOTER  *****************************************************************/ 

footer { border-top: 1px solid #CCC; margin: 1em 1em 1em 1em; padding: 1em 1em;	}
.footer_right {text-align:right;}
@media (max-width: 992px) {
    .footer_right {
        float:left; text-align: left;
    }
}


/******/
#tblSsoLogs th, 
#tblSsoLogs td {padding: 5px 10px; border-top: 1px solid #CCC;}