.ii {position: relative; width:720px; font:12px Arial, Gotham, "Helvetica Neue", Helvetica, sans-serif;  border:1px solid #fff; 
	-moz-user-select: none; -khtml-user-select: none; -webkit-user-select: none;  user-select: none; -ms-user-select:none}
.header
	{position:absolute; top:0; left:0; right:0; margin:1px 7px 0 13px; z-index:2}
.header h3
	{font-size:30px; font-weight:normal;margin:8px 0 0 0; letter-spacing:.005em}
.header p
	{font-size:14px; margin:0 0 0 0; letter-spacing:-.005em}
.main	
	{position:relative; margin:14px 7px 0 13px;}
.hero
	{position:relative; display:block; height:329px; background:#fff url(bg_beach.jpg) bottom left repeat-x; border:1px solid #999}
.hero.landing
	{position:absolute; width:100%; z-index:90; background:#fff url(bg_landing2.jpg) top left no-repeat;}
.callout
	{position:absolute; top:50px; right:57px; width:250px;text-shadow: -1px 0 1px rgba(0,0,0,0.4);}
.callout h2
	{font-size:30px; font-weight:normal; margin:0;}
.callout p
	{font-size:14px; line-height:1.5em; margin:14px 0 18px;}
.callout .btn-begin
	{position:relative; width:213px; padding:8px 0; background:#388a41; text-align:center;  color:#fff; text-shadow: -1px 0 1px rgba(255,255,255,0.7);
	 font:bold 24px Helvetica, Gotham, "Helvetica Neue", Arial, sans-serif; cursor:pointer}
.couple-beach
	{position:absolute; bottom:0; left:0; width:180px; height:110px; background:url(bg_beach_couple.png) bottom left no-repeat; z-index:1;}
.legend	
	{position:absolute; bottom:10px; left:106px; z-index:2; }
.legend	ul
	{margin:0; padding:0}
.legend li
	{list-style:none; display:block; float:left; font-size:11px; letter-spacing:0.02em; margin-right:9px;}
.legend .wedge	
	{display:block; float: left; width:10px; height:11px; border:1px solid #fff; margin-right:5px;}
.view-by	
	{position:absolute; bottom:10px; right:10px; font-size:11px; letter-spacing:0.02em;}
.view-by a
	{text-decoration:none; color:#4a73b9;}
.view-by a:hover
	{text-decoration:underline}
.view-by a.on
	{text-decoration:none; color:#000; cursor:default}
.bars
	{position:absolute; top:100px; left:18px; width:95%; height:100px; border-left:1px solid #999; z-index:3}
.graph
	{position:relative; top:0; left: 0; width:100%; height:52px; margin-top:27px;}
.bar
	{position:relative; display:block; float:left; width:15%; height:52px; border-right:1px solid #fff; background:url(bg_bar_data.png) top left repeat; z-index:5}
.bar-ss  {background-color:#1b4471}
.bar-ira {background-color:#a17140}
.bar-hsa {background-color:#9ec3e8}
.bar-wps {background-color:#e66e2a}
.bar-gap, .bar-pig {background-color:#999;}
.bar-pig {position:absolute; left:0; width:70%; z-index:1;  border-right:1px solid #999;}
.bar-gap {display:none}
.wedge.bar-pig {position:relative;background-color:#999;}
.bar .hover
	{position:absolute; background:#fff; border:1px solid #666; font-size:12px; padding:5px 10px; display:none; text-align:center;
	-webkit-box-shadow: 2px 2px 5px 0px rgba(102,102,102,1);-moz-box-shadow: 2px 2px 5px 0px rgba(102,102,102,1);box-shadow: 2px 2px 5px 0px rgba(102,102,102,1);}
.bar-ss .hover strong
	{color:#1b4471}
.bar-ira .hover strong
	{color:#a17140}
.bar-hsa .hover strong
	{color:#9ec3e8}
.bar-wps .hover strong
	{color:#e66e2a}
.bar .hover strong
	{display:block; white-space:nowrap;}
.bar .hover span
	{font-style:normal; color:#333; font-size:18px; display:block}
.bar .hover em
	{display:none}
.bar-label
	{position:absolute; top:-55px; height:142px; border-right:1px solid #999; display:none}
.bar-label .bar-label-value
	{position:absolute; top:-4px; right:-1px; width:107px; height:41px; color:#fff; text-align:center; padding:5px 0 0;}
.bar-label .bar-label-value strong, .bar-label .bar-label-value span
	{font-size:18px; font-weight:normal}
.bar-label .bar-tag
	{position:absolute; top:41px; right:-2px; width:9px; height:14px;}
.bar-label-income .bar-label-value
	{background:#2a5baa}
.bar-label-income
	{z-index:6}
.bar-label-income .bar-tag
	{background:url(bg_data_pointer_blue.png) top right no-repeat}
.bar-label.bar-label-goal
	{top:0; height:118px; border-right:1px solid #666; z-index:8; }
.bar-label-goal .bar-label-value
	{position:absolute; background:#333; top:75px; right:-107px}
.bar-label-goal .bar-tag
	{top:auto; bottom:37px; right:-9px; height:20px; background:url(bg_data_pointer_black.png) top left no-repeat; z-index:2}
.bar-label-goal .bar-tag.rev
	{right:0;background:url(bg_data_pointer_black_rev.png) top left no-repeat;}
.bar-label-gap
	{top:59px; border:none; border-top:2px solid #cd2027; z-index:7}
.bar-label-gap .bar-label-value
	{background:#cd2027; top:14px; right:50%;}
.bar-label-gap .bar-tag
	{top:0; right:50%; background:url(bg_data_pointer_red.png) top left no-repeat}
.bar-label-gap .bar-label-value.green
	{right:inherit; left:50%; background:#388a41; z-index:2;}
.bar-label-gap .bar-tag.green
	{background:url(bg_data_pointer_green.png) top left no-repeat;right:inherit; left:50%;}
.bar-label .green
	{display:none}
	
.ui	{position:relative; width:100%; height:1px; overflow:hidden}
.ui-label
	{position:relative; display:block; float:left; height:20px;margin:10px 2px 2px 0; }
.ui-label div.value
	{position:absolute; top:0px; font-size:14px; font-weight:bold; padding:0 5px; margin:0 0 0 20%; background:#fff; z-index:2}
.ui-label div.bracket
	{position:absolute; top:9px; left:0; height:11px; width:99.5%;border:1px solid #999; border-bottom:none;  z-index:1}
.ui-label.time
	{width:230px;}
.ui-label.earn
	{width:466px;}
.ui-label.earn div.value
	{margin:0 0 0 28%}
.ui-label.method
	{width:100%}
.ui-label.method div.value
	{margin:0 0 0 40%}
.ui-row
	{clear:left; width:698px; background:url(bg_ui_row.gif) bottom left repeat-x; height:69px; border:1px solid #ccc;}
.ui-row .lever
	{position:relative; display:block; float:left; width:33%; border-left:1px solid #b6b7b9; height:69px; border-right:1px solid #e1e2df; cursor:pointer}
.ui-row.four .lever
	{width:33%;}
.ui-row .lever.first
	{border-left:none}
.ui-row .lever.last
	{border-right:none}
.ui-row .lever.on
	{cursor:default}
.ui-row .label
	{position:relative; top:15px; left: 65px; width: 140px; font-size:12px; text-align:center; color:#999; }
.ui-row.four .label
	{left:65px; width:140px;}
.ui-row .lever:hover .label, .ui-row .lever.on .label
	{color:#2a5baa}
.ui-row .label strong
	{font-weight:normal; font-size:20px; padding-top:5px; display:block}
.lever .icon
	{position:absolute; top:0; left:0; width:60px; height:100%; z-index:3}
.lever.age .icon
	{background:url(icon_cal.png) center center no-repeat;}
.lever.age:hover .icon, .lever.age.on .icon
	{background:url(icon_cal_on.png) center center no-repeat;}
.lever.retire .icon
	{background:url(icon_golfer.png) center center no-repeat;}
.lever.retire:hover .icon, .lever.retire.on .icon
	{background:url(icon_golfer_on.png) center center no-repeat;}
.lever.salary .icon
	{background:url(icon_hand.png) center center no-repeat;}
.lever.salary:hover .icon, .lever.salary.on .icon
	{background:url(icon_hand_on.png) center center no-repeat;}
.lever.growth .icon
	{background:url(icon_house.png) center center no-repeat;}
.lever.growth:hover .icon, .lever.growth.on .icon
	{background:url(icon_house_on.png) center center no-repeat;}
.lever.return-rate .icon
	{background:url(icon_trend.png) center center no-repeat;}
.lever.return-rate:hover .icon, .lever.return-rate.on .icon
	{background:url(icon_trend_on.png) center center no-repeat;}
.lever.deferral .icon
	{background:url(icon_bars.png) center center no-repeat;}
.lever.deferral:hover .icon, .lever.deferral.on .icon
	{background:url(icon_bars_on.png) center center no-repeat;}
.lever.contribute .icon
	{background:url(icon_handshake.png) center center no-repeat;}
.lever.contribute:hover .icon, .lever.contribute.on .icon
	{background:url(icon_handshake_on.png) center center no-repeat;}
.lever.ira .icon
	{background:url(icon_savings.png) center center no-repeat;}
.lever.ira:hover .icon, .lever.ira.on .icon
	{background:url(icon_savings_on.png) center center no-repeat;}
.lever.hsa .icon
	{background:url(icon_rx.png) center center no-repeat;}
.lever.hsa:hover .icon, .lever.hsa.on .icon
	{background:url(icon_rx_on.png) center center no-repeat;}
.slider
	{position:absolute; top:0; left:0; display:none; width:100%; height:100%; background:#fff; z-index:10}
.slider .icon
	{z-index:1}
.slider-label
	{position:relative; margin:6px 0 13px 80px; font-size:12px; text-align:center; width:180px; z-index:1}
.slider .bg
	{position:relative; width:180px; height:6px; margin:0 0 0 80px; background:url(bg_slider.png) top left repeat-x; border-left:1px solid #d9d9d9;
	 border-right:1px solid #c7c7c7; z-index:2; cursor:pointer}
.slider .bg .bg-on
	{position:relative; width:25%; height:6px; margin:0; background:url(bg_slider_on.png) top left repeat-x; z-index:1}
.slider .marker
	{position:absolute; top:-12px; left:25%; width:16px; height:23px; margin-left:-8px; background:url(bg_slider_pointer.png) center top no-repeat; cursor:url(openhand.cur), move; z-index:2}
.slider .marker.grabbing {cursor:url(closedhand.cur), move;}
.slider .tick
	{position:absolute; bottom:-24px; width:40px; margin-left:-20px; padding-top:8px; background:url(bg_slider_tick.gif) center top no-repeat; 
	 font-size:10px; text-align:center; color:#444;}
.footer 
	{position: relative; min-height:50px; margin:5px 7px 0 13px; color:#666; border-bottom:1px solid #231f20; z-index:100;}
.additional-disclosure
	{display:none; width:68%}
.btn-legal
	{position: absolute; top:0; right:0px; width:209px;  text-align:center; padding:7px 0; border:1px solid #ccc; background:#f5f5f0; color:#868582; 
	 font-weight:bold; cursor:pointer;}
.legal
	{position:absolute; bottom:0; width:100%; height:0px; padding:0 1px; overflow:auto; z-index:2; background:#fff; border-top:1px solid #231f20}
.btn-close
	{position:absolute; top:10px; right:10px; width:20px; text-align:center; font-weight:bold; font-size:18px; color:#999; padding:3px 3px; border:2px solid #999;  cursor:pointer}
.btn-close:hover
	{color:#444; border-color:#444}
