/*reset*/
html,body,div,dl,dt,dd,ul,ol,li,h1,h2,h3,h4,h5,h6,pre,form,fieldset,input,p,blockquote,th,td{margin:0;padding:0;}img,body,html{border:0;}address,caption,cite,code,dfn,em,strong,th,var{font-style:normal;font-weight:normal;}ol,ul,menu {list-style:none;}caption,th {text-align:left;}h1,h2,h3,h4,h5,h6{font-size:100%;}q:before,q:after{content:'';}
html { width: 722px; height: 516px; }
body { font: 12px Arial, Helvetica, sans-serif; background: #fff; color: #999; line-height: 1.5em; }
.fl { float: left; }
.fr { float: right; }
#mask { display:none; position: absolute; top: 0; left: 0; z-index: 50; width: 722px; height: 516px; background: #000; -moz-border-radius: 5px; -webkit-border-radius: 5px; border-radius: 5px; }
#shutterWrapper { width: 720px; height: 515px; background: #fff; position: relative; overflow: hidden; -webkit-border-radius: 4px; -moz-border-radius: 4px; border-radius: 4px; }
#shutterWrapper #shutterHeader { display: none; width: 240px; height: 64px; position: absolute; z-index: 5; background: url(../img/title.png) 20px 17px no-repeat; }
#shutterWrapper #shutterSubheader { display: none; width: 720px; height: 70px; position: absolute; z-index: 5; top: 64px; background: url(../img/by_line.png) 0 0 no-repeat; }
#shutterWrapper #shutterLoader { margin: 220px auto 0; text-align: center; padding-right: 20px; font-size: 16px; }
#shutterWrapper .shutter { float: left; margin-right: -23px; position: absolute; width: 263px; background: url(../img/shutter-shadow.png) right top no-repeat; right: 743px; opacity: 1; }
#shutterWrapper .shutter img { float: left; }
#shutterWrapper #shutter1 { z-index: 3; }
#shutterWrapper #shutter2 { z-index: 2; }
#shutterWrapper #shutter3 { z-index: 1; background: none; -webkit-border-radius: 0 4px 4px 0; }
#shutterWrapper #yellowboxStart { display: none; width: 718px; height: 110px; left: 16px; top: 392px; position: absolute; z-index: 5; background: url(../img/box_yellow_start.png) 0 0 no-repeat; }
#shutterWrapper #disclaimer { display:none; position: absolute; top: 20px; left: 40px; z-index: 999; width: 600px; height: 415px; padding: 15px 20px; background: #fff; color: #333; border: 6px solid #004FB6; -moz-border-radius: 10px; -webkit-border-radius: 10px; border-radius: 10px; }
#shutterWrapper #disclaimer h1, .disclaimer h1 { font-size: 16px; padding: 0 0 10px 0; margin: 0; }
#shutterWrapper #disclaimer h2, .disclaimer h2 { font-size: 14px; padding: 10px 0 5px 0; }
#shutterWrapper #disclaimer p, .disclaimer p { font-size: 13px; line-height: 1.5; padding: 0 0 10px 0; }
#shutterWrapper #disclaimer .buttons { text-align: right; margin-top: 5px; }
#shutterWrapper #disclaimer .button { display: inline-block; float: none; }
.underline { border-bottom: 1px solid #EDC621}
.disclaimer { display:none; position: absolute; top: 15px; left: 40px; z-index: 999; width: 600px; height: 440px; padding: 15px 20px; background: #fff; color: #333; border: 6px solid #004FB6; -moz-border-radius: 10px; -webkit-border-radius: 10px; border-radius: 10px; }
.disclaimer_show { float: left; color: #ccc; font-size: 15px; font-weight: normal; margin-top: 0; width: 100%; text-decoration: underline; cursor: pointer;}
.disclaimer_show b { text-decoration: underline; cursor: pointer;}
.disclaimer_close {
background-image: url("../img/buttons/btn-close.png");
margin: 0;
background-position: 0 -52px;
background-repeat: no-repeat;
border: medium none;
cursor: pointer;
float: right;
height: 51px;
outline: medium none;
width: 98px; text-indent: -500px; color: #fff
}
#links_holder { float: left}
#wrapper .unit-options #fund_name { font-size: 17px; height: 47px}
.disclaimer_close:hover { background-position: 0 0; }
#widget-holder { display: none; }
.widget-holder { width:720px; border:1px solid #d5d5d5; position: absolute; top: 0; left: 0; -webkit-border-radius: 4px; -moz-border-radius: 4px; border-radius: 4px; }
.widget-holder #header { background:url(../img/header.jpg) 0 0 no-repeat; height:64px; position:relative; z-index: 5; -moz-border-radius: 4px 4px 0 0; -webkit-border-radius: 4px 4px 0 0; border-radius: 4px 4px 0 0; }
.widget-holder #header #GoHome { float: left; height: 62px; margin: 0 0 -10px; position: relative; width: 240px; }
.tabs {position:absolute; right: 20px; height: 33px; bottom: -2px; }
.tabs li { float:left; padding: 8px 0 0; width: 33px; height: 23px; text-align: center; cursor: default; margin-left:6px; color:#fff; font-weight:bold; font-size:18px; background: url(../img/tabs.gif) 0 0 no-repeat; -webkit-border-radius: 4px 4px 0 0; -moz-border-radius: 4px 4px 0 0; border-radius: 4px 4px 0 0; -moz-user-select: none; -khtml-user-select: none; -webkit-user-select:ignore; }
.tabs li.passed { background-position: 0 -64px; -moz-box-shadow: none; -webkit-box-shadow: none; box-shadow: none; cursor: pointer; }
.tabs li.current { background-position: 0 -32px; padding-bottom: 1px; -moz-box-shadow: none; -webkit-box-shadow: none; box-shadow: none; }
#resultTabs li { font-size: 15px; width: 134px; background: url(../img/outcome-tabs.gif) 0 0 no-repeat; }
#resultTabs li.current { background-position: 0 -32px; }
#wrapper { overflow: hidden; width: 720px; height: 450px; }
#wrapper .wrapper-content { overflow: hidden; }
#wrapperButtons { float: right; padding: 0; height: 60px; margin: -70px 14px 10px 0; position: relative; }
#wrapper .unit { width: 720px; float: left; position:relative; height:450px; }
#wrapper .unit p { -moz-user-select: none; -khtml-user-select: none; -webkit-user-select:ignore; }
#wrapper .unit h2 { font-size: 24px; color:#fff; background: #19bcf0; padding:15px 25px; font-weight:100; cursor:default; border: 1px solid #50CFF8; border-width: 1px 0; -moz-user-select: none; -khtml-user-select: none; -webkit-user-select:ignore; }
#wrapper .unit .subheader-table { background:#daeaf0; margin-bottom:30px; height: 50px; border-collapse: collapse; width: 100%; }
#wrapper .unit .subheader-table td { padding: 0 305px 0 25px; background:#daeaf0; margin-bottom:30px; height: 70px; }
#wrapper .unit h3 { font-weight: bold; font-size: 15px; line-height: 1.3; color:#2D7C95; padding: 0; margin:0; cursor:default; -moz-user-select: none; -khtml-user-select: none; -webkit-user-select:ignore; }
#wrapper .unit h3 em { font-weight: bold; }
#wrapper .unit .question span {font-weight:700; color:#777}
#wrapper .unit .img-holder { height: 300px; padding: 10px 31px; background: url(../img/questions/image_bg.png) 0 0 no-repeat; float: right; margin-top: -78px; }
#wrapper .unit p { color: #777; line-height: 1.5; padding: 0 0 0 23px; width: 380px; font-size: 13px; }
/* RADIO TEMPLATE */
#wrapper .unit .radiogroup { margin:0 0 20px 20px; width: 380px; }
#wrapper .unit .radiogroup label { color:#777; overflow: hidden; display: block; margin-bottom: 6px; padding: 5px 0 5px 26px; cursor: pointer; font-size: 13px; -moz-border-radius: 4px; -webkit-border-radius: 4px; border-radius: 4px; }
#wrapper .unit .radiogroup input { float:left; margin-left: -20px; margin-top: 2px; }
#wrapper .unit .radiogroup .radio-checked { font-weight: bold; }
/* SLIDER TEMPLATE */
#wrapper .unit .slider-option {width: 325px; margin: 0 0 35px 27px;}
#wrapper .unit .slider-option .slider-fields { height:40px; color:#8996ad; margin-bottom:20px; }
#wrapper .unit .slider-option .slider-fields .fl { color:#666; font-size:20px; line-height:40px}
#wrapper .unit .slider-option .slider-fields .fr label {font-size:20px; line-height:40px; color:#004fb6; text-align:right; }
#wrapper .unit .slider-option input.slider-value { display:none; background: transparent; border:0; font-size:22px; color:#666; text-align:right; }
#wrapper .ui-slider { height: 34px; cursor:pointer; background: none; border: none; }
#wrapper .ui-slider-range { background: none; border: none; }
#wrapper .ui-slider-handle { background:url(../img/slider_button.png) 0 0 no-repeat; margin-left:-13px; top: 4px; width:30px; height:30px; border:none; outline:none; cursor:pointer; }
#wrapper .slider-table { border-collapse: collapse; }
#wrapper .slider-table td { vertical-align: top; padding: 0; }
#wrapper .slider-table .plusminus { width: 30px; }
#wrapper .slider-table .plusminus div { width: 14px; height: 13px; float: left; margin: 19px 0 0; cursor: pointer; background-repeat: no-repeat; background-image: url(../img/plus-minus-sprite.png); }
#wrapper .slider-table .sliderContainer { background: url(../img/slider_bg.png) 0 0 no-repeat; padding: 10px 0; width: 340px; }
#wrapper .slider-table .plus div { background-position: 0 0; float: right; }
#wrapper .slider-table .plus:hover div { background-position: 0 -26px; }
#wrapper .slider-table .minus div { background-position: 0 -13px; }
#wrapper .slider-table .minus:hover div { background-position: 0 -39px; }
/* GRAPH TEMPLATE */
#wrapper .type-graph p { padding: 15px 25px; font-size: 14px; line-height: 1.6; width:auto; }
#wrapper .unit .graphbox { background: #DAEAF0; border: 1px solid #E6F1F5; margin: -4px 20px 0; padding: 20px 15px 30px; width: auto; overflow: hidden; -moz-border-radius: 8px; -webkit-border-radius: 8px; border-radius: 8px; }
#wrapper .unit .graphbox label { background: #fff; float: left; margin: 5px 25px -10px 0; padding: 7px 0 6px 21px; width: 120px; color: #004fb6; font-weight: bold; font-size: 14px;
-moz-border-radius: 6px; -webkit-border-radius: 8px; border-radius: 8px; -moz-box-shadow: 0 0 1px rgba(0,0,0,0.2); -webkit-box-shadow: 0 0 1px rgba(0,0,0,0.2); box-shadow: 0 0 1px rgba(0,0,0,0.2);
}
#wrapper .unit .graphbox label:last-of-type { margin-right: 0; }
#wrapper .unit .graphbox label:hover { -moz-box-shadow: 0 0 2px rgba(0,0,0,0.4); -webkit-box-shadow: 0 0 2px rgba(0,0,0,0.4); box-shadow: 0 0 2px rgba(0,0,0,0.4); }
#wrapper .unit .graphbox label input { margin-left: 0; margin-right: 7px; }
#wrapper .unit .graphbox .graph { height: 120px; }
#wrapper .unit .graphbox .legend { width: 110px; height: 31px; background: url(../img/graph-legend.png) 0 0 no-repeat; margin: -5px 5px -20px 0; float: right; }
/* RESULTS */
#resultTabs { display:none; }
#resultTabs li { cursor: pointer; }
#results { width: 1440px; }
#wrapper .result-profile .subheader-table { margin-bottom: 18px; }
#wrapper .result-profile .img-holder { margin-top: -66px; }
#wrapper .result-profile .yellowbox-small { position: absolute; top: 355px; }
#wrapper #profileGraph { width: 244px; height: 210px; background: url(../img/risk-reward-graph-bg.png) 0 0 no-repeat; }
#wrapper #profileGraphSlider { margin: 5px 0 0; width: 172px; background: url(../img/slider_small_bg.png) 0 0 no-repeat; }
#wrapper #profileGraphSlider .ui-slider-handle { top: 8px; }
#wrapper #profileGraphNav { width: 230px; margin: 0 auto; border-collapse: collapse; }
#wrapper #profileGraphNav td { vertical-align: top; padding: 0; }
#wrapper #profileGraphNav td.plusminus a { width: 14px; height: 13px; display: block; margin-top: 19px; cursor: pointer; }
#wrapper #profileGraphNav td.profileSlider { padding: 0 15px; }
#wrapper #profileGraphPlus { background: url(../img/plus-minus-sprite.png) 0 0 no-repeat; width: 14px; height: 13px; }
#wrapper #profileGraphPlus:hover { background-position: 0 -26px; }
#wrapper #profileGraphMinus { background: url(../img/plus-minus-sprite.png) 0 -13px no-repeat; width: 14px; height: 13px; }
#wrapper #profileGraphMinus:hover { background-position: 0 -39px; }
#wrapper .unit-options h3 { color: #004FB6; font-size: 24px; font-weight: normal; }
#wrapper .unit-options h3 em { font-weight: bold; }
#wrapper .unit-options .img-holder h4 { color: #004FB6; font-size: 15px; position: relative; z-index: 10; }
#wrapper .unit-options .img-holder #portfolioMixChart { width: 294px; height: 270px; margin: -25px -25px 0; }
#wrapper .unit-options .yellowbox-small { margin-top: 0; margin-bottom: 22px; position: relative; z-index: 10; }
#wrapper .unit-options .yellowbox-small-content p { font-size: 13px !important; }
#wrapper .unit-options .yellowbox-small-content .button { margin: -8px 0 -7px -3px; width: 220px; height: 45px; display: inline-block; float: none; }
#wrapper .unit-options .yellowbox-small-content .branch-combo { float: left; }
/*** BUTTONS ****************************************************************************************************************************/
.button { float:right; width: 140px; height: 52px; background-position: 0 -52px; background-repeat: no-repeat; outline: none; border: none; cursor: pointer; }
.button:hover { background-position: 0 0; }
.button:active { background-position: 0 -52px; }
.btn-back { background-image: url(../img/buttons/btn-back.png); }
.btn-print { background-image: url(../img/buttons/btn-print.png); display: none; }
.btn-next { background-image: url(../img/buttons/btn-next.png); }
.btn-next-inactive { background-position: 0 -104px !important; cursor: default; }
.btn-cancel { background-image: url(../img/buttons/btn-cancel.png); }
.btn-accept { background-image: url(../img/buttons/btn-accept.png); }
.btn-start { background-image: url(../img/buttons/btn-start.png); margin: 29px 54px 0 0; }
.btn-options { background-image: url(../img/buttons/btn-options.png); width: 180px; float: right; margin: -8px -8px -8px 0; position: relative; z-index: 10; }
.btn-options, .btn-options:hover, .btn-options:active { background-position: 0 0; }
.btn-mbu { background-image: url(../img/buttons/btn-mbu.png); background-position: 0 0; }
.btn-mby { background-image: url(../img/buttons/btn-mby.png); background-position: 0 0; width: 350px !important; }
#wrapper .unit-options .yellowbox-small-content .btn-send { width: 105px; height: 21px; display: inline-block; float: none; margin: -4px -1px 0 2px; vertical-align: middle; text-decoration: none;
font-size: 16px; padding: 9px 5px 7px 0; text-align: center; color: #004FB6; font-weight: bold; background: url(../img/buttons/btn-bg.png) 0 0 no-repeat;
}
#wrapper .unit-options .yellowbox-small-content .button:active { background-position: 0 0; }
.next-tooltip { display:none; position: absolute; right: 4px; top: -48px; text-align: center; width: 134px; height: 47px; padding-top: 7px; color: #222; text-shadow: 1px 1px 1px #fff; line-height: 1.2; background: url(../img/tool-tip.gif) 0 0 no-repeat; -moz-user-select: none; -khtml-user-select: none; -webkit-user-select:ignore; }
/****************************************************************************************************************************************/
/*** Small yellow box *******************************************************************************************************************/
.yellowbox-small { width: 380px; margin: 17px 0 0 20px; }
.yellowbox-small-top, .yellowbox-small-bottom, .yellowbox-small-content { background-image: url(../img/yellowbox-small.png); }
.yellowbox-small-top, .yellowbox-small-bottom { background-repeat: no-repeat; height: 10px; }
.yellowbox-small-top { background-position: 0 0; }
.yellowbox-small-bottom { background-position: -380px 0; }
.yellowbox-small-content { background-position: -760px 0; background-repeat: repeat-y; min-height: 10px; padding: 3px 15px 0; }
.link_wrapper { min-height: 38px;}
#wrapper .unit .yellowbox-small-content h4 { font-size: 14px; font-weight: bold; color: #004FB6; padding: 0 0 2px 5px; }
#wrapper .unit .yellowbox-small-content p { font-size: 14px; color: #004FB6; padding: 0 5px 10px; width: auto; }
#wrapper .unit .yellowbox-small-content p em { font-weight: bold; font-size: 14px; }
/****************************************************************************************************************************************/
.yellowbox-small-content .row { padding-top: 5px; }
.yellowbox-small-content #call { vertical-align: text-top; margin: 0 7px 0 5px; }
.yellowbox-small-content label { color: #004FB6; font-size: 13px; }
.yellowbox-small-content .textfield { border: none; width: 155px; height: 25px; padding: 0 8px; margin: 6px 0 0 2px; text-align: left; vertical-align: top; color: #004FB6; font-size: 14px; background: url(../img/textfield-bg.png) left top no-repeat; }
.yellowbox-small-content #usercontact { margin-left: 0; }
.combobox { background: url("../img/buttons/combo.png") no-repeat top left; font-size:16px; width: 235px !important; outline: none; display: inline-block; }
.combobox .styleSelect_item { border: 1px solid #888; width: 221px; }
.combobox .styleSelect_item_content { height: 150px; overflow-x: hidden; overflow-y: scroll; background:#fff; }
.combobox .passiveSelect,.combobox .activeSelect{ display:block; cursor:pointer; padding:9px 10px; height:20px; color: #004FB6; }
.combobox ul, .combobox li { padding:0; margin:0; list-style:none; cursor:pointer; font-weight:normal; color:#666; font-size: 13px; }
.combobox li { padding: 2px 0 2px 12px; }
.combobox li:hover { color:#004FB6; background: #ddd; }
.combobox .selected { color:#333; font-weight: bold; }
#returnBox { display: none; }
.mtgbroker #resultTabs,
.mtgbroker #optionsYellowbox { visibility: hidden; }
.mtgbroker #returnBox { display: block; }
#returnButton { background: url(../img/buttons/btn-mtgbroker.png) 0 0 no-repeat; width: 358px; height: 52px; display: block; margin: -9px 0 -5px -7px; }
/*** Modal Window ***********************************************************************************************************************/
.modal { position: fixed; top: 100px; left: 100px; width: 720px; z-index: 101; display: none; }
.modal .modal-closer { background: url(../img/modal/closer.png) center no-repeat; width: 54px; height: 53px; float:right; margin: -20px -23px -33px 0; outline: none; position:relative; }
.modal .modal-frame { border-collapse: collapse; width: 100%; }
.modal .modal-frame .l, .modal .modal-frame .c, .modal .modal-frame .r { padding: 0; background-position: 0 0; background-repeat: repeat; }
.modal .modal-frame .t td, .modal .modal-frame .b td { height: 15px; background-image: url(../img/modal/t-b.png); }
.modal .modal-frame tr .l, .modal .modal-frame tr .r { width: 15px; background-image: url(../img/modal/corners.png); }
.modal .modal-frame .m .l, .modal .modal-frame .m .r { background-image: url(../img/modal/l-r.png); }
.modal .modal-frame .m .c { background: #fff; padding: 10px; }
.modal .modal-frame .b .l, .modal .modal-frame .b .c { background-position: 0 -15px; }
.modal .modal-frame .t .r, .modal .modal-frame .m .r { background-position: -15px 0; }
.modal .modal-frame .b .r { background-position: -15px -15px; }
/****************************************************************************************************************************************/
/*UPDATES 2014 02*/
.hidden { display: none; }
.legend { float: left; width: 370px; margin: -10px 0 0 20px; }
.legend_op { float: left; margin: 5px 0 21px 0; }
.legend_op li { margin-bottom: 5px; margin-top: 6px; height: 19.5px}
.legend_colors { width: 16px; height: 16px; float: left; }
#wrapper .legend_op p { padding: 0 0 0 13px; width: 340px; float: left; }
.color1 { background-color: #5887b4;}
.color2 { background-color: #b85c57;}
.color3 { background-color: #9ab165;}
.color4 { background-color: #846f9f;}
.color5 { background-color: #53a8bc;}
.color6 { background-color: #e29654;}
.color7 { background-color: #a4b9d7;}
.op1 b { color: #5887b4;}
.op2 b { color: #b85c57;}
.op3 b { color: #9ab165;}
.op4 b { color: #846f9f;}
.op5 b { color: #53a8bc;}
.op6 b { color: #e29654;}
.op7 b { color: #a4b9d7;}
body #wrapper #learn_more { float: left; margin: 9px 0 0 0; }
body #wrapper #learn_more h4 { font-size: 1.7em; padding: 7px 0; font-weight: normal;}
body #wrapper #learn_more b { font-weight: bold; color: #004FB6}
/*NEW RESULT TABS*/
.result_tabs { }
.r_tabs { background: #DAEAF0; height: 70px; padding: 0 0 0 23px;}
.r_tabs li { float: left; padding: 9px 27.5px; background: #389bba; margin: 34px 5px 0 0; color: #FFFFFF; font-size: 16px; }
.r_tabs li:hover { cursor: pointer; }
.r_tabs li.active { background: #fff; color: #389bba }
.t_goal { }
.t_experience { }
.t_expectations { }
.goal { }
.experience { }
.expectations { }
.rounded_corners {
-moz-border-radius: 5px 5px 0 0;
-webkit-border-radius: 5px 5px 0 0;
-khtml-border-radius: 5px 5px 0 0;
border-radius: 5px 5px 0 0;
}
.boxes { float: left; margin-top: 20px; }
.boxes h4 { font-size: 20px; font-weight: normal; color: #389bba; margin:0 0 10px 23px; }
#wrapper .boxes h3 { margin: 0px 0 0 23px; color: #777777; width: 380px;}
.hide { display: none}
.show { display: block;}
.more_info { float: left; }
#link_more { float: left; margin-left: 10px}
#wrapper #goal_box h3 { font-weight: normal; font-size: 13px; }
.piba_logo p, .iba_logo p {
float: right;
width: 195px !important;
}