/* 
'''''''''''''''''''''''''''''''''''''''''''''''''''''''''''''''''''''''''''''''''''
CSS Stylesheet: Calculator
This stylesheet defines:
1.  Styles for classes used on the calculator, the FAQ, and the sample problems.
'''''''''''''''''''''''''''''''''''''''''''''''''''''''''''''''''''''''''''''''''''
*/

/* Mortgage Calculator  */
div.Calculator {border: #6699cc 2px solid; background-color: #dcdcdc; color: Black;
    margin-left:auto; margin-right:auto; width:98%; 
    font-size: 8pt; font-weight: normal; }

div.CalcHead {clear: left; width: 100%; background-color: #6699cc; color: #ffffff; 
    font-size:10pt; font-weight:bold; text-align: center;
    margin-bottom: 10px;} 

div.Calc {float:left; width: 36%; min-width: 36%; max-width: 36%;  
    background-color: #dcdcdc; color: #000000;
    font-size: 8pt; padding-right:5px;} 

div.Calc1 {float:left; width: 30%; min-width: 30%; max-width: 30%;  
    background-color: #dcdcdc; color: #000000;
    font-size: 8pt; padding-bottom: 5px;} 

div.Calc2 {float:left; width: 27%; min-width: 27%; max-width: 27%;  
    background-color: #dcdcdc; color: #000000;
    font-size: 8pt; padding-bottom: 5px;} 

div.Calc3 {float:left; width: 5%; min-width: 5%; max-width: 5%;  
    background-color: #dcdcdc; color: #000000;
    font-size: 8pt; padding-bottom: 5px;} 

div.CalcRow {clear:left; width: 100%; 
    background-color: #dcdcdc; color: #ffffff;
    font-size: 8pt; padding-bottom: 5px;} 

div.CalcLastRow {clear:left; width: 100%; background-color: #dcdcdc; } 

table.Calc {border: #6699cc 1px solid; background-color: #cccccc; color: Black;
    margin-left:auto; margin-right:auto; width:98%;
    font-size: 8pt; font-weight: normal;}

tr.CalcHead {width: 100%; background-color: #6699cc; line-height:2em; } 

td.CalcHead {width: 100%; text-align: center;
    background-color: #6699cc; color: White;
    font-size: 10pt; font-weight:bold;}
    
tr.Calc {width: 100%; background-color: #6699cc; line-height:2em;} 

td.Calc {padding: .5em; background-color: #dcdcdc; color: Black;
    font-size: 8pt;}
    
a.Calc:link, a.Calc:visited, a.Calc:active
{text-decoration: none; color: #b22222; font-weight: normal; font-size: 10pt;
    font-family: 'Trebuchet MS' , Verdana, Arial, Helvetica, Sans-Serif; }
		
a.Calc:hover
{text-decoration: underline; color: #b22222; font-weight: normal; font-size: 10pt;
    font-family: 'Trebuchet MS' , Verdana, Arial, Helvetica, Sans-Serif; }
    
.HideElement {position:absolute; top:0; z-index:-1; visibility:hidden;}

.ShowElement {position: static;} 

/* Case Study Mortgage Calculator  */
div.SmallCalculator {border: #6699cc 2px solid; background-color: #dcdcdc; color: Black;
    margin-left:auto; margin-right:auto; width:90%; 
    font-size: 7pt; font-weight: normal; }

div.SmallCalcHead {clear: left; width: 100%; background-color: #6699cc; color: #ffffff; 
    font-size:8pt; font-weight:bold; text-align: center;
    margin-bottom: 4px;} 

div.SmallCalc {float:left; width: 36%; min-width: 36%; max-width: 36%;  
    background-color: #dcdcdc; color: #000000;
    font-size: 7pt; padding-right:5px;} 

div.SmallCalc1 {float:left; width: 32%; min-width: 32%; max-width: 32%;  
    background-color: #dcdcdc; color: #000000;
    font-size: 7pt; padding-bottom: 4px;} 

div.SmallCalc2 {float:left; width: 29%; min-width: 29%; max-width: 29%;  
    background-color: #dcdcdc; color: #000000;
    font-size: 7pt; padding-bottom: 4px;} 

div.SmallCalcRow {clear:left; width: 100%; 
    background-color: #dcdcdc; color: #ffffff;
    font-size: 7pt; } 

div.SmallCalcLastRow {clear:left; width: 100%; background-color: #dcdcdc; } 

    
/* CSS style for frequently-asked questions  */
p.Question {background-color: white;  color: black;
    font-family: 'Trebuchet MS' , Verdana, Arial, Helvetica, Sans-Serif;
    font-size: 9pt; font-weight: bold; letter-spacing: normal;}

p.Answer {background-color: white; color: black;
    font-family: 'Trebuchet MS' , Verdana, Arial, Helvetica, Sans-Serif;
    font-size: 9pt; font-weight: normal; margin-left:2em; }
    
/* CSS style for calculator sample problems  */
hr.sampleproblemrule{color:#b22222; background-color:#b22222; 
    width:50%; border:solid 1px #b22222; 
    text-align: center; margin-left:auto; margin-right:auto;
    margin-top:0pt; margin-bottom:0pt;}
    
/* Head styles */
div.HeadStyle1      /* Blue background */
{width: 100%; border: #000099 1px solid; background-color: #000099;}

h1.HeadStyle1 {text-align: center; font-size: 10pt; color: white; vertical-align: middle;
	font-family: 'Trebuchet MS', Trebuchet, Verdana, Arial, Helvetica, sans-serif;
	padding: 0; margin: 0; }

/* Misc classes */
span.HelpIcon {background-color: #6699cc; color: #ffffff; cursor: pointer; 
    font-weight: bold; border-style: outset; border-width: 2px;}
hr.hr50{background-color:#6699cc; width:50%; text-align:center;}


/* 
'''''''''''''''''''''''''''''''''''''''''''''''''''''''''''''''''''''''''
CSS Stylesheet: Key Findings report style
'''''''''''''''''''''''''''''''''''''''''''''''''''''''''''''''''''''''''
*/

table.KeyFindings
{
    border: gray 2px solid;
    width:100%;
} 

tr.KeyFindings
{
    padding:5px;
}  

td.KeyFindings
{
    font-size:8pt;
	font-family: 'Trebuchet MS' , Verdana, Arial, Helvetica, Sans-Serif;
    font-weight: normal;
    color: Black;
    padding-left:.5em;
    text-align:left;
    vertical-align:top;
} 

td.KeyFindingsLabel
{
    font-size:8pt;
	font-family: 'Trebuchet MS' , Verdana, Arial, Helvetica, Sans-Serif;
    font-weight: normal;
    color: Black;
    padding-right:.5em;
    text-align:right;
} 

td.KeyFindingsHeader
{
    border: #dcdcdc 1px solid;
    background-color: #6699cc;
    font-size:9pt;
	font-family: 'Trebuchet MS' , Verdana, Arial, Helvetica, Sans-Serif;
    font-weight: bold;
    color: white;
    padding:5px;
    text-align:center;
}
  

h3.KeyFindings
{
    text-align:center;
}

p.KeyFindingsTableFootnote
{
    text-align:left;
    font-size:8pt;
    font-family: 'Trebuchet MS' , Verdana, Arial, Helvetica, Sans-Serif;
    margin-top:-1em;
}
/* 
'''''''''''''''''''''''''''''''''''''''''''''''''''''''''''''''''''''''''
CSS Stylesheet: Amortization report style
'''''''''''''''''''''''''''''''''''''''''''''''''''''''''''''''''''''''''
*/

table.Amortization
{
    border: gray 2px solid;
    margin-left:auto;
    margin-right:auto;
} 

tr.Amortization
{
    padding:5px;
}  

td.Amortization
{
    font-size:9pt;
	font-family: 'Trebuchet MS' , Verdana, Arial, Helvetica, Sans-Serif;
    font-weight: normal;
    color: Black;
    margin-left:auto;
    margin-right:auto;
    padding-left:1em;
} 

td.AmortizationHeader
{
    border: #dcdcdc 1px solid;
    background-color: #6699cc;
    font-size:9pt;
	font-family: 'Trebuchet MS' , Verdana, Arial, Helvetica, Sans-Serif;
    font-weight: bold;
    color: white;
    margin-left:auto;
    margin-right:auto;
    padding:5px;
}
  
td.Amortization2
{
    font-size:8pt;
	font-family: 'Trebuchet MS' , Verdana, Arial, Helvetica, Sans-Serif;
    font-weight: normal;
    color: Black;
    margin-left:auto;
    margin-right:auto;
    padding-left:1em;
} 

td.AmortizationHeader2
{
    border: #dcdcdc 1px solid;
    background-color: #6699cc;
    font-size:8pt;
	font-family: 'Trebuchet MS' , Verdana, Arial, Helvetica, Sans-Serif;
    font-weight: bold;
    color: white;
    margin-left:auto;
    margin-right:auto;
    padding:5px;
}

/* 
'''''''''''''''''''''''''''''''''''''''''''''''''''''''''''''''''''''''''
CSS Stylesheet: Calculator help
'''''''''''''''''''''''''''''''''''''''''''''''''''''''''''''''''''''''''
*/

ul.calchelp, li.calchelp  {
	margin-left: 15px;
	padding: 0px;
	list-style-type:square;
	color:#b22222;
}

li.calchelp {color:#000000;}

div.calchelp {padding:0px;
    border:solid 2px #6699cc;
    background-color: #f5f5f5;
    min-width: 150px;
    width: 150px;
    padding-bottom:5px;}
    
h2.calchelp {text-align:center; margin-top:10px;}

span.HelpIcon, span.calchelp {background-color: #6699cc; color: #ffffff; cursor: pointer; 
    font-weight: bold; border-style: outset; border-width: 2px;}

span.calchelp{vertical-align:text-top;}

a.calchelp:link, a.calchelp:visited, a.calchelp:active 
{text-decoration:none; color:#000000;}
a.calchelp:hover {color:#b22222;}


/* 
'''''''''''''''''''''''''''''''''''''''''''''''''''''''''''''''''''''''''
Styles for free calculators: Monthly payment calculator and Amortization
calculator.
'''''''''''''''''''''''''''''''''''''''''''''''''''''''''''''''''''''''''
*/
table.freecalc, table.freecalc1{border:solid 1px #006699; width: 300px; margin:auto;
    font-size: 8pt; font-family: verdana, helvetica, arial, sans-serif;} 
table.freecalc1 {border:solid 1px #0033cc;}
    
th.freecalc, th.freecalc1 {background-color:#006699; color:#ffffff; font-size:10pt; 
    font-family:arial, Sans-Serif; font-weight:bold; padding: 10px; text-align:center;} 
th.freecalc1 {background-color:#0033cc;}
    
td.freecalc1{width:45%; text-align:right; padding: 10px 3px 3px 3px;}
td.freecalc2{text-align:left;  padding: 10px 3px 3px 3px;}
td.freecalc3{padding: 10px 10px 3px 3px;} 
td.freecalcbutton{text-align:center; padding:10px 3px 10px 3px}
td.freecalclasthelp{padding: 10px 10px 10px 3px;}

span.freecalc, span.freecalc1{background-color:#006699; color: #ffffff; cursor: pointer; 
    font-weight: bold; border-style: outset; border-width: 2px;}   
span.freecalc1{background-color:#0033cc;}
    
div.freecalcfootnote{font-size:8pt; text-align:left; width:300px; margin:auto;} 

div.snippet, div.snippet1{margin:auto; width:90%; border: solid 1px #006699;
    padding:10px;}
div.snippet1{border: solid 1px #0033cc;}

div.amortizationTable{display:block; margin:auto; padding:10px; width: 300px;
    font-size: 8pt; font-family: verdana, helvetica, arial, sans-serif; 
    border: solid 1px #0033cc;}
    
txt.txtAmortizationTable{display:block; margin:auto; padding:10px; width: 300px;
    font-size: 20pt; font-family: verdana, helvetica, arial, sans-serif; 
    border: solid 1px #0033cc;}