/* adjust spacing of superscripts */
small.sup { position: relative; top: -0.4em; font-size: 0.8em; line-height: 1em; }
h1#homepagetitle small.sup { top: -0.9em; font-size: 0.6em; line-height: 1em; }

/* tabs */
.primarytabs {
    position: relative;
}

#homeline-calculator-tabs li {
    background-image: url(../images/level1-tab-lightblue-bg.gif);
}

#homeline-calculator-tabs li span {
    text-align: center;
    width: 93px;
    height: 6.9em;
    padding-top: 4px;
    padding-bottom: 8px;
    background-image: url(../images/level1-tab-lightblue-bg.gif);
}

#homeline-calculator-tabs li span a {
    font-weight: bold;
    text-decoration: none;
}

/* tab tooltips */
.primarytabs .tooltip {
    display: none;
    width: 300px;
    position: absolute;
    top: auto;
    bottom: 76.5%;
    font-size: 1.2em;
}

* html .tooltip {
    margin-left: 3px;
}

#car-tooltip {
    left: 3px;
}

#homereno-tooltip {
    left: 123px;
}

#rrsp-tooltip {
    left: 253px;
}

#investment-tooltip {
    left: 373px;
}

#education-tooltip {
    left: 345px;
}

#other-tooltip {
    left: 465px;
}

/*
 * override UOS tabs' method of showing/hiding tab panels; avoid dynamically setting display,
 * position, or overflow because that causes SWFs to reload to initial state in FF/Chrome/Safari
 */
.primarytabs-tabbedcontent {
    display: block;
    /*display: none;*/ /* set to block via JS when tabs are initialized, only once per tab, so SWFs load after the first tab is shown, allowing chart animation to be seen (!!!NOT CURRENTLY APPLIED SINCE FF4 STILL REQUIRES MOUSE MOVE TO LOAD SWFs!!!) */
    visibility: hidden;
    width: 0;
    height: 0;
    overflow-y: hidden;
}

.primarytabs-tabbedcontent.msie {
    display: none;
}

.primarytabs-tabbedcontent embed,
.primarytabs-tabbedcontent object {
    position: absolute;
    left: -9999px;
}

.primarytabs-tabbedcontent.visible {
    visibility: visible;
    width: auto;
    height: auto;
}

.primarytabs-tabbedcontent.msie.visible {
    display: block;
}

.primarytabs-tabbedcontent.visible embed,
.primarytabs-tabbedcontent.visible object {
    left: auto;
}

/* vertical divider */
#calculator-tab-panels {
    padding-bottom: 8px;
}
.primarytabs-tabbedcontent {
    background: url(../images/v-div.gif) repeat-y 432px 0;
}

/* intro-panel */
#intro-panel {
    display: block;
    visibility: visible;
    padding: 16px 0 20px 0;
    width: auto;
    height: auto !important;
    height: 177px;
    min-height: 177px; /* 213px - 36px padding */
    background: url(../images/arbie-bkd.gif) no-repeat 280px bottom;
}

#intro-panel .copy {
    width: 563px;
}

/* chart-container */
.chart-container {
    float: right;
    width: 290px;
    height: 160px;
}

/* amount, years */
.amount, .years {
    clear: left;
    float: left;
    padding-bottom: 8px;
    margin-bottom: 8px;
    width: 428px;
}

.amount .callout,
.years .callout {
    z-index: 9 !important;
}

/* labels */
.label {
    float: left;
    margin-right: 6px;
    width: 115px;
    font-size: 0.845em;
    font-weight: bold;
    line-height: 1.2em;
}

/* sliders */
.slider {
    float: left;
    margin-right: 6px;
    width: 185px;
}

.amount .slider {
    margin-top: 16px;
}

.years .slider {
    margin-top: 8px;
}

.slider .min,
.slider .max,
.slider .step,
.slider .value {
    display: none;
}

.ui-slider {
    width: 185px;
    height: 16px;
    border: 0;
    background: url(../images/slider-rail.gif) no-repeat center center;
}

.ui-slider .ui-slider-handle {
    top: 0px;
    margin-left: -6px;
    width: 12px;
    height: 16px;
    background: url(../images/slider-handle.gif) no-repeat;
    border: 0;
}

.ui-slider:hover .ui-slider-handle {
    background-position: -12px 0;
    cursor: e-resize;
}

/* output */
.amount .output-prefix,
.amount .output,
.amount .output-suffix {
    margin-top: 16px;
}

.amount .output {
    width: 75px;
}

.years .output-prefix,
.years .output,
.years .output-suffix {
    margin-top: 8px;
}

.years .output {
    width: 25px;
}

.output-prefix {
    float: left;
    width: 6px;
    text-align: center;
}

.output {
    float: left;
    margin-right: 6px;
}

.output-suffix {
}

/* results */
.results {
    clear: left;
    float: left;
    margin-top: 12px;
    width: 412px;
}

.results .callout {
    float: right;
    padding-left: 12px;
    width: 170px;
}

.results .callout .savings.callout-content {
    padding-top: 20px;
    padding-bottom: 20px;
    height: auto !important;
    height: 24px;
    min-height: 24px;
    text-align: center;
    font-weight: bold;
    font-size: 1.1em;
}

/* errors */
#car-error,
#homereno-error,
#rrsp-error,
#investment-error,
#education-error,
#other-error,
.amount-error,
.years-error {
    display: none;
}

.amount.error,
.years.error {
    margin-left: -8px;
    padding-left: 8px;
    margin-top: -4px;
    padding-top: 4px;
    padding-bottom: 4px;
    background-color: #f1e5e5;
}

* html .amount.error,
* html .years.error {
    position: relative;
    margin-left: -4px;
    margin-top: -2px;
}

.amount.error .output,
.years.error .output {
    border: 1px solid #9c0000;
}

.amount.error .amount-error,
.years.error .years-error {
    display: block;
    clear: both;
    color: #9c0000;
    font-size: 11px;
}

/* after-tabs */
#after-tabs {
    display: none;
}
