/************************************************************** Print styles for the myFICO Loan Center Copyright (c) 2006 Fair Isaac Corporation ***************************************************************/ /*** import the style sheet for the Informa loan rate widget */ @import url(/css/ratewidget.css); /*** Override base styles on these elements ***/ html, body { background-image: none; font-size: 11pt; } #container { padding: 0; width: 6.25in; } #primenav { display: none; } #content.none { padding: 0; margin: 0; margin-left: 10px; } #content h1 { font-size: 12pt; } #footer { display: none; } /*** Loan Center pages are wrapped in this div, giving us a hook to descend from ***/ #loancenter { position: relative; margin: 1em 0; width: 100%; } #loancenter h2 { border: none; background: transparent; padding: 0; margin: 0; color: #333; font-size: 140%; line-height: 1.3; } /*** Links ***/ #loancenter a:link { color: #004696; text-decoration: underline; } #loancenter a:visited { color: #004696; text-decoration: underline; } #loancenter a:hover { color: #004696; text-decoration: underline; } #loancenter a.moreinfo { display: none; } /*** Category main pages ***/ #flash { display: none; } #loancenter.home #intro { margin-left: 0; width: 100%; } /****** Request form start box ***/ #start { border: none; background-image: none; margin: 5px 0 0 0; } #start p { margin: 0 0 0 20px; font-size:90%; font-weight:bold; } #start div#call { font-size: 110%; font-weight: bold; float:right; text-align:center; margin: 10px 14px 15px 0; color:#f60; } #start div#call h5 { padding:0; margin:0; font-size:110%; line-height:1em; } #start select { margin: 5px 0; } #loancenter #start .button { position: relative; top: -5px; right: -5px; } #loancenter #start .button, #loancenter #application .button { border-color: #6fd665 #106F08 #106F08 #6fd665; background: #23901a; color: #fff; } /****** Steps ***/ #loancenter div.step { position: relative; height: 1%; margin: 35px 15px 15px 15px; background-image: none; } #loancenter div.step:after { content: "."; clear: both; display: block; height: 0; visibility: hidden; } #loancenter div.step h2 { padding: 5px 0; background-image: none; background-color: transparent; font-size: 120%; } #loancenter div.step h3 { float: left; margin: .8em 0 .4em 0; border: none; width: 370px; font-size: 100%; } #loancenter div.step img { float: left; margin: 10px 15px 10px 10px; } #loancenter div.step ol { float: left; list-style: none; margin: 0; padding: 0; width: 360px; } #loancenter div.step ol li { margin: .3em 0; padding-left: 12px; background-image: none; } /********* Calculators list ***/ #loancenter div.step div.calcs { float: right; font-size: 90%; width: 240px; margin: -1.5em 0 0 0; padding: 12px; padding-top: 0; background-image: none; } #loancenter div.step div.calcs h4 { font-size: 100%; margin: 0; color: #333; } #loancenter div.step div.calcs ul { margin: 0; padding: 0; list-style: none; } #loancenter div.step div.calcs li { padding-left: 0; margin: .3em 0; background-image: none; list-style-image: url(/images/loancenter/calcicon.png); } /****** Different background for each step ***/ #loancenter div.one { margin-top:15px; } #loancenter div.one h2, #loancenter div.two h2, #loancenter div.three h2, #loancenter div.four h2, #loancenter div.five h2, #loancenter div.six h2 { background-image: none; } /*** Customize the rate widget for Loan Center. Base styles are found in /css/ratewidget.css ***/ div#ratewidget { width: 100%; } div#ratewidget div#ratewrap { padding: 5px 12px; background: #fff; border: 1px solid #ccc; } /****** Widget heading looks different when it's in an article ***/ #loancenter #article div#ratewidget h3 { margin: 10px 0; } /****** Tabs to select loan type ***/ div#ratewidget ul#loanselect li { width: 19%; margin-right: 2px; font-size: 85%; text-align: center; background: #eee; border: 1px solid #e0e0e0; border-bottom: none; } div#ratewidget ul#loanselect li a { display: block; height: 2.2em; padding: 3px 4px; } div#ratewidget ul#loanselect li.current { margin-bottom: -1px; background: #fff; border: 1px solid #ccc; border-bottom: none; } div#ratewidget ul#loanselect li.current a { background-image: none; } ul#loanselect li a:link { color: #333; } ul#loanselect li a:visited { color: #333; } ul#loanselect li a:hover { color: #333; text-decoration: none; } ul#loanselect li.current a:link { color: #3C8EA2; } ul#loanselect li.current a:visited { color: #3C8EA2; } ul#loanselect li.current a:hover { color: #3C8EA2; text-decoration: none; } /****** Widget rate table ***/ div#ratewidget table thead th { background-image: none; padding: .4em 0; } div#ratewidget table tbody th { background: #fff; border-bottom: 1px solid #eee; padding: .2em 0; } div#ratewidget table td { background: #fff; border-bottom: 1px solid #eee; } div#ratewidget table tr.alt td, div#ratewidget table tr.alt th { background: #fff; } /*** Loan center main nav (top-level tabs) ***/ ul#lcnav { display: none; } /*** Loan Center subnav (left menu) ***/ #loancenter #subnav { display: none; } /*** Article pages ***/ #loancenter #article { width: 100%; line-height: 1.55; } #loancenter #article p.leader { font-size: 125%; line-height: 1.4; } #loancenter #article h3 { border: none; font-size: 115%; color: #333; margin: 2em 0 -1em 0; clear:left;} #loancenter #article ul { margin: 0 0 0 15px; padding: 0; } #loancenter #article ul li { margin: .2em 0; } #loancenter #article ul.checklist li { list-style-type: square; } /****** pullquotes ***/ #loancenter #article blockquote.pull { font-family: Georgia, "Times New Roman", Times, serif; width: 28%; padding: 15px; border: 3px double #ccc; border-width: 3px 0; text-align: center; } #loancenter #article blockquote.pull p { padding: 0; margin: 0; font-size: 125%; line-height: 1.2; } #loancenter #article blockquote.left { float: left; margin: 0 10px 10px 0; } #loancenter #article blockquote.right { float: right; margin: 0 0 10px 10px; } /****** Calculator box ***/ #loancenter #article div.calcbox { display: none; } /****** Images and captions ***/ #loancenter #article div.graphic { height: 1%; line-height: 1.4; width: 195px; padding: 4px; text-align: center; } #loancenter #article div.graphic img { padding: 3px; border: 1px solid #acbabd; } #loancenter #article div.graphic p { font-size: 90%; margin: 6px; text-align: center; } #loancenter #article div.alignright { float: right; clear: right; margin: 0 0 6px 9px; } #loancenter #article div.alignleft { float: left; margin: 0 9px 6px 0; } #loancenter #article div.centered { background: transparent; border: none; width: 100%; margin: 1em auto; } /****** previous and next links ***/ #loancenter #article p.prevnext { display: none; } /****** Request Form Start box ***/ #loancenter #article #application { display: none; } /****** Informa rate table (different from the widget) ***/ table#ratetable { width: 100%; border-collapse: collapse; border: 1px solid #eee; border-width: 1px 0 0 1px; } table#ratetable th { border-bottom: 1px solid #ccc; border-right: 1px solid #eee; } table#ratetable tbody th { font-weight: normal; } table#ratetable td { text-align: center; border-bottom: 1px solid #ccc; border-right: 1px solid #eee; } table#ratetable tr.alt td, table#ratetable tbody tr.alt th { } table#ratetable tfoot td { background: transparent; } /*** Calculator pages ***/ #loancenter.calculators h2 { margin-left: 15px; } #loancenter.calculators div.section { float: left; margin: 1em 15px; width: 90%; padding-bottom: 2em; border-bottom: 1px solid #d0dadc; } #loancenter.calculators div.section h3 { font-size: 1.2em; margin: .5em 0; border: none; } #loancenter.calculators div.section ul { list-style: none; margin: 1em 0; padding: 0; width: 48%; float: left; } #loancenter.calculators div.section ul li { margin-bottom: .5em; padding-left: 18px; background-image: none; list-style-image: url(/images/loancenter/calcicon.png); } #content #loancenter.calclist ul { margin: 1.5em 0; padding: 0; } #content #loancenter.calclist ul li { padding: 0; font-weight: bold; background-image: none; } #content #loancenter.calclist ul li ul { margin: .5em 0 1em 10px; } #content #loancenter.calclist ul li ul li { margin-bottom: .5em; font-weight: normal; padding-left: 18px; background-image: none; list-style-image: url(/images/loancenter/calcicon.png); } #content #loancenter.calculators div.other { border-bottom: none; } #content #loancenter.calculators div.other ul li { background-image: none; list-style-image: url(/images/loancenter/arrowbullet.png); } #baseTemplate_ifCalculator { width: 450px; display: block; clear: both; margin: 0 auto; } /*** Results ***/ #loancenter.result { border-top: none; background-image: none; } #loancenter.result h2 { margin-bottom: 1em; } #loancenter.result h3 { font-size: 120%; border: none; margin: 0; } #loancenter.result p.summary { font-size: 120%; } #lenderlist { float: left; clear: both; width: 750px; padding: 0 5px; } #lenderlist h3 { background-color: transparent; border: none; font-size: inherit; width: 744px; padding: 2px 4px; margin: 0; } #lenderlist dl { float: left; clear: both; border: 1px solid #ccc; width: 750px; margin: 6px 0 0 0; padding: 0; background-image: none; } #lenderlist dt { font-size: 120%; font-weight: bold; float: right; width: 530px; margin: 3px 0; } #lenderlist dd { float: right; width: 530px; } #lenderlist dd.contact { font-size: 90%; } #lenderlist dd.logo { background: #fff; float: left; display: inline; width: 194px; height: 60px; padding: 5px; margin: 0; } #lenderlist dd.logo a img { border: none; } #loancenter.result #evaltools { display: none; } /****** Loan type comparisons on the "Choose a Loan" pages ***/ #comparetypes { position: relative; } /********* Loan type tabs ***/ #comparetypes ul#tabswitch { display: none; } /********* this class is applied by JavaScript to hide and position the boxes ***/ #comparetypes div.moved { display: block; position: static; } #loancenter #comparetypes div.loantype { background-color: transparent; font-size: 90%; margin-bottom: 2em; padding: 20px 20px 0 20px; border-top: 3px double #ccc; } #loancenter #comparetypes div.loantype h3 { margin: 0; font-size: 130%; color: #333; } #loancenter #comparetypes div.loantype h4 { margin: 10px 0 5px 0; font-size: 110%; color: #555; } #loancenter #comparetypes div.loantype p { margin: 0; font-size: 110%; } /********* Who is this loan good for? ***/ #loancenter #comparetypes div.loantype div.goodfor { width: auto; background-color: transparent; margin: .5em 0; padding: 0 10px; border: 1px solid #eee; } #loancenter #comparetypes div.loantype div.goodfor p { margin: .6em 0; } /********* Calculator box in a loantype box ***/ #loancenter #comparetypes div.loantype div.calcbox { float: right; padding: 5px 0 5px 25px; margin: 10px 0 10px 10px; border-left: 1px solid #e6e9d8; font-size: 90%; background-color: transparent; background-position: 10px 6px; } #loancenter #comparetypes div.loantype div.calcbox h4 { background-image: none; font-weight: normal; margin: 0; padding: 0; line-height:1.4; } #loancenter #comparetypes div.loantype div.calcbox p { margin:0; } /********* Factors to consider ***/ #comparetypes table.factors { margin: 1.5em 0 0 0; clear: both; border-collapse: collapse;} #comparetypes table.factors thead th { line-height: 1.3; color:#555; background-color: #eee; border-right: 1px solid #ccc; text-align:left; padding: 4px 1.5%; } #comparetypes table.factors tbody td { width: 21%; padding: 6px 1.5% 20px 1.5%; vertical-align: top; background-color: transparent; border-right: 1px solid #ccc; line-height: 1.4; } /********* ARMs comparison table ***/ table.arms { width:95%; margin: 0; border-collapse: collapse; font-size:110%; border-top:solid 1px #e6e9d8; margin-top:10px; } table.arms th { width: 60px; padding: 5px; vertical-align: top; color:#555; } table.arms td { padding: 5px; } table.arms th, table.arms td { border-bottom:solid 1px #e6e9d8; } /****** PMI types are given the same tab treatment as loan types, but their content and layout differs ***/ #loancenter #comparetypes div.pmitype { background-color: transparent; font-size: 90%; margin-bottom: 2em; padding: 20px 20px 0 20px; border-top: 3px double #ccc; } #loancenter #comparetypes div.pmitype h3 { margin: 0; font-size: 130%; color: #333; } #loancenter #comparetypes div.pmitype h4 { margin: 10px 0 5px 0; font-size: 110%; color: #555; } #loancenter #comparetypes div.pmitype p { margin: 0; font-size: 110%; } #loancenter #comparetypes div.loantype div.pmirisk { width: auto; background-color: transparent; margin: .5em 0; padding: 0 10px; border: 1px solid #eee; } #loancenter #comparetypes div.loantype div.pmirisk p { margin: .6em 0; } #loancenter #comparetypes div.pmitype div.pmirisk h4 { color: #555; margin: 0 0 7px 0; font-size: 100%; } #loancenter #comparetypes div.pmitype div.pmirisk h4 span { font-weight: normal; margin-left: 12px; padding-left: 6px; } #loancenter #comparetypes div.pmitype div.pmirisk h4 span.high { color: #bf0000; border-left: 50px solid #bf0000; } #loancenter #comparetypes div.pmitype div.pmirisk h4 span.med { color: #d88200; border-left: 25px solid #d88200; } #loancenter #comparetypes div.pmitype div.pmirisk h4 span.low { color: #00991a; border-left: 5px solid #00991a; } /****** Comparison of loan choices ***/ #loancenter table.choices { background-color: #ccc; clear: both; margin: 1.5em 0; width: 100%; border-collapse: separate; } #loancenter table.choices thead th { font-size:110%; color: #555; background: #eee; } #loancenter table.choices tbody th, table.choices tbody td { line-height: 1.4; vertical-align: top; text-align: left; background: #fff; padding: 10px; font-size:90%; } /****** Descriptions of different penalties ***/ #loancenter dl.penalties { float: left; } #loancenter dl.penalties dt { background-image: none; font-size: 115%; padding-left: 0; } #loancenter dl.penalties dd { margin: 0 10px 0 0; } #loancenter dl.penalties dd.lookfor { margin: 0 0 20px 0; padding: 4px 0 20px 0; border-bottom: solid 1px #eee; } #loancenter dl.penalties dd.lookfor h4 { font-size: 100%; color: #555; display:inline; padding:0 10px 0 0; }