﻿/*
    GetSmart Product Page Stylesheet
    Path: /gsroot/css/
    Author: clloyd

    FORMATTING STANDARDS
    // Ordering
    rule { width; height; padding; margin; float; border; display; background; font overrides; everything else }

    // Flags
    /* =Name of Rule Section
    ---------------------------------------------------------------------
    */

/*
*/


/* =Common
---------------------------------------------------------------------
*/
* { padding: 0; margin: 0 }
html { background: #d2e9b5 url("../images/brochureware/smartypants/html-bkg.gif") no-repeat center top }
body { background: url("../images/brochureware/smartypants/body-bkg.gif") repeat-x left top; font-size: 62.5%; font-family: Verdana, Arial, Helvetica, sans-serif; text-align: center }

a {	color: #00447c;	text-decoration: none; outline:none; }
a:hover { border-bottom: 1px dashed #e06c09; color: #e06c09 }
a.orange { color: #e06c09 }
a.orange:hover { border-bottom: 1px dashed #e06c09; color: #e06c09; text-decoration: none }
a.arrow { padding-left: 10px; background: url("../images/brochureware/smartypants/ul-arrow.gif") left 5px no-repeat; outline:none }
a.arrow:hover { border-bottom: 1px dashed #e06c09; color: #e06c09 }
a.gray { color: #9e9d9d }
a.gray:hover { color: #e06c09; border-bottom: 1px dashed #e06c09; text-decoration: none }
a.img-link:hover { border: none }
a.img { outline:none }

div#content p { margin-bottom: 10px; font-size: 1.2em; color: #000000; line-height: 1.4em }

p span.callout { padding: 2px; background: #fdfdd6 }

div#wrapper { width: 820px; height: 100%; padding-top: 15px; margin: 0 auto; text-align: left }

div#header { width: 820px; height: 71px; padding: 0 20px 15px 20px; position: relative }
* html div#header { padding: 0 20px 0 20px;}
/*div#header h1 { width: 181px; height: 82px; background: url("../images/brochureware/smartypants/logo.gif") no-repeat 0 0;float: left }
div#header h1 a { width: 181px; height: 70px; position: absolute; left:15px; top:0; display: block }
div#header h1 a:hover { border: none }*/

div#header h3 { width: 181px; height: 82px; background: url("../images/brochureware/smartypants/logo.gif") no-repeat 0 0;float: left }
div#header #logo { width: 181px; height: 82px; background: url("../images/brochureware/smartypants/logo.gif") no-repeat 0 0;float: left }

div#header h3#logoQM { width: 463px; height: 62px; background: url("../images/brochureware/QuickMatchDesign2/qm_logo2.gif") no-repeat 0 0;float: left }


div#header h3 a { width: 181px; height: 70px; position: absolute; left:15px; top:0; display: block }
div#header h3 a:hover { border: none }


div#header-right { padding-top: 12px; margin-left: 520px }
* html div#header-nav { padding-bottom: 6px }
div#header-nav a { font-size: 1.1em }

div#phone-number h3 { width: 187px; height: 39px; margin: 0 0 12px 65px; background: url("../images/brochureware/smartypants/phone-number.gif") no-repeat 0 0 }
div#phone-number h4 { display:none }

div#search-bar { height: 23px; padding-right: 25px; padding-top: 3px; background-color: #d1e8b2; font-size: 1.2em; text-align: right }
div#search-bar img { vertical-align: middle }
div#search-bar a:hover { border: none }
div#search-bar input { margin: 0 5px; font-size: 1.1em; vertical-align: middle }

div#content-wrapper { padding-bottom: 10px; border-top: 1px solid #c6c5c5; border-right: 1px solid #c6c5c5; border-left: 1px solid #c6c5c5; background-color: #ffffff; position: relative }

.alt { position: absolute;left: -9999px; overflow: auto }
.clear { height: 0; visibility: hidden; clear: both }
.breadcrumbs { padding:8px 0px 8px 25px; font-size: 100%; line-height: 14px }
sup { font-size:9px }



/* =Nav
---------------------------------------------------------------------
*/
ul#nav { height: 36px; background: url("../images/brochureware/smartypants/bkg_new_v2.gif") left bottom no-repeat; list-style: none }
ul#nav li{ float: left;position: relative }
ul#nav li a { height: 36px; border: none; display: block; background-repeat: no-repeat; background-position: 0 0 }
ul#nav #n_home, ul#nav #n_home_current { width: 72px; background-image: url("../images/brochureware/smartypants/home.gif"); outline:none }
ul#nav #n_refinance, ul#nav #n_refinance_current { width: 117px; background-image: url("../images/brochureware/smartypants/refinance.gif"); outline:none }
ul#nav #n_mortgage, ul#nav #n_mortgage_current { width: 115px; background-image: url("../images/brochureware/smartypants/mortgage.gif"); outline:none }
ul#nav #n_equity, ul#nav #n_equity_current { width: 135px; background-image: url("../images/brochureware/smartypants/equity.gif"); outline:none }
ul#nav #n_credit_cards, ul#nav #n_credit_cards_current {width: 100px;background-image: url("../images/brochureware/smartypants/credit-cards.gif") }
ul#nav #n_resources, ul#nav #n_resources_current { width: 120px; background-image: url("../images/brochureware/smartypants/resources.gif") }
ul#nav #n_credit, ul#nav #n_credit_current { width: 135px; background-image: url("../images/brochureware/smartypants/credit_new.gif") }
ul#nav #n_home:hover, ul#nav #n_refinance:hover, ul#nav #n_mortgage:hover, ul#nav #n_equity:hover,
ul#nav #n_debt:hover, ul#nav #n_resources:hover, ul#nav #n_credit_cards:hover, ul#nav #n_credit:hover { background-position: 0 -36px }
ul#nav #n_home_current, ul#nav #n_refinance_current, ul#nav #n_mortgage_current, ul#nav #n_equity_current, ul#nav #n_resources_current, ul#nav #n_credit_current, ul#nav #n_credit_cards_current { background-position: 0 -72px }



/* =Sidebar
---------------------------------------------------------------------
*/
div#sidebar-top { width: 209px; height:9px; margin: 0 20px 0 13px; background: #f5f6fe url("../images/brochureware/smartypants/sidebar-top.gif") left top no-repeat }
div#sidebar { width: 209px; min-height: 710px; padding:0; background: #f5f6fe url("../images/brochureware/smartypants/sidebar-bottom.gif") left bottom no-repeat; position: absolute; left: 13px; top: 36px }
* html div#sidebar { height: 710px }

div#homepage-sidebar-top { width: 209px; height:9px; margin: 13px 20px 0 13px; background: #f5f6fe url("../images/brochureware/smartypants/sidebar-top.gif") left top no-repeat }
div#homepage-sidebar { width: 209px; min-height: 540px; padding:0; background: #f5f6fe url("../images/brochureware/smartypants/sidebar-bottom.gif") left bottom no-repeat; position: absolute; left: 13px; top: 22px }
* html div#homepage-sidebar { height: 350px }

div#sidebar div#sidebar-content, div#homepage-sidebar div#sidebar-content { width:auto; margin: 0 10px 0 10px }
div#sidebar p, div#homepage-sidebar p { margin-bottom: 4px; font-size: 1.2em }

div#sidebar .widget-hdr, div#homepage-sidebar .widget-hdr { padding-top:25px }
div#sidebar h2, div#homepage-sidebar h2 { width: 179px; height: 22px; padding: 12px 0 0 10px; margin: 0; background: url("../images/brochureware/smartypants/sidebar-widget-hdr.gif") no-repeat left top; font-weight:bold; font-size:116% }
div#sidebar h3,div#homepage-sidebar h3 { margin: 10px 0 4px 0; border-bottom: 1px solid #455560; font-size: 1.4em; color: #455560 }
div#sidebar .new,div#homepage-sidebar .new { font-size:85%; font-weight:bold; color:#af3fc6 }

div#sidebar-rates { width: 179px; margin:0; padding:0; border: solid 1px #d4d2d2 }
div#sidebar-rates .rate_header { padding:3px 0 3px 8px; background-color:#fff; font-weight:bold }
div#sidebar-rates .row1 { height:20px; padding:0 0 0 8px; clear:left; background-color:#fff; border-top: dashed 1px #dadada }
div#sidebar-rates p { margin:10px 5px 5px 5px; font-size:85% }
div#sidebar-rates .row2 { height:20px; padding:0 0 0 8px; clear:left; background-color:#f5f6f6; border-top: dashed 1px #dadada }
div#sidebar-rates .col1 { width: 50%; padding:3px 0 4px 0; float:left }
div#sidebar-rates .col2 { width: 24%; padding:3px 0 4px 0; float:left }
div#sidebar-rates .col3 { width: auto; padding:3px 0 4px 0; float:left}
div#sidebar-rates .rate-footer { margin: 8px; padding:5px 0 0 0 }
div#sidebar-rates .rate-footer .updated { font-size:90% }
div#sidebar-rates .rate-footer .disclosures { font-size:85% }

div#sidebar-calculator { width: 163px; padding:15px 8px 15px 8px; border: solid 1px #d4d2d2; background:#f5f6f6 }
div#sidebar-calculator label { font-size:108%; font-weight:bold }
div#sidebar-calculator input, div#sidebar div#sidebar-calculator select { width:150px; margin:8px 0 8px 0 }
div#sidebar-calculator input img { width:158px; height:29px }
div#sidebar-calculator .validation { display:none; color:#cc0000 }
div#sidebar-calculator div.more-calculators { font-size:108% }
div#sidebar-calculator div.more-calculators { margin:10px 0 0 0 }


/* =Main Content
---------------------------------------------------------------------
*/
div#content { width: 570px; margin: 0 0 14px 235px }
/** html div#content { height: 445px }*/
div#content h1 { margin: 0 10px 5px 0; padding-bottom: 2px; border-bottom: 2px solid #f68f1e; font-size: 2.3em; color: #455560 }
div#content h2 { margin-bottom: 15px; font-size: 1.4em; color: #455560 }

div#content h2#homepageH2 { margin: 0 10px 5px 0; padding-bottom: 2px; border-bottom: 2px solid #f68f1e; font-size: 2.3em; color: #455560 }
div#content h1#homepageH1 { margin-bottom: 15px; font-size: 1.4em; color: #455560 ; border-bottom: none;}


div#content p { line-height: 1.5em }
div#content p span.callout { background: #fdfdd6; padding: 2px;}
div#content ul {list-style-image: none; margin: 0 3px 8px 25px; padding: 0px 15px 10px 15px;}
div#content ul li {list-style-image: none; list-style-position: outside; list-style-type:disc; font-size:116%; margin-top:3px;}

div#content .buttons { padding-top:5px }
div#content .smarty-head-logo { width:73px; height:73px; float:right }
div#content .smarty-watermelon-logo { width:152px; height:182px; float:right }

div#content .qf-start-form { width:340px; padding:0 10px 10px 10px; margin:0}
div#content div#qf-start label { width:128px; margin-top:5px; float:left; display:block; font-weight:bold; text-align:right; color:#455560 }
div#content div#qf-start select { width:192px; margin:3px 0 3px 10px; float:left; border:solid 1px #aacfe4; font-size:12px }
div#content div#qf-start .privacyBtn { width:128px; padding:10px 0 20px 8px; float:left; clear:left }
div#content div#qf-start .continueBtn { width:119px; padding:10px 0 20px 0; float:left }

div#content .content-block { width:523px; min-height:336px; margin:0 15px 20px 0; padding:15px; clear:left; background: url("../images/brochureware/smartypants/content-bg-grad.gif") no-repeat 0 0 }
* html div#content .content-block { height: 336px }
div#content .content-block h3 { margin:0; font-weight:bold }
div#content .content-block p { padding:5px 0 0 0 }
div#content .content-block .start-qf { width:139px; margin:8px 0 0 8px; padding:12px 15px 12px 15px; float:right; border: solid 1px #d9dad8; text-align:center }
div#content .content-block .start-qf h1 { font-size:172%; font-weight:normal }

div#content .smarty-box { float:right; width:153px; min-height:130px; text-align:center }
* html div#content .smarty-box { height: 130px }
div#content .smarty-box p { height:55px; padding: 10px 2px 5px 2px; margin: 0; background: url("../images/brochureware/smartypants/smarty-box-bg.gif") no-repeat left top; font-size:100%; line-height:108%; font-weight:normal }

div#content .orange-box { float:right; width:182px; min-height:130px; background: url("../images/brochureware/smartypants/content-bg-grd.gif") no-repeat 0 0; text-align:center }
* html div#content .orange-box { height: 100px }
div#content .orange-box h2 { height:12px; padding: 3px 0 4px 0; margin: 0; background: url("../images/brochureware/smartypants/orange-box-hdr.gif") no-repeat left top; border:none; font-size:116%; font-weight:normal }
div#content .orange-box h3 { height:59px; padding: 12px 0 0 0; margin: 0; background: url("../images/brochureware/smartypants/orange-box-bg.gif") no-repeat left top; font-size:126%; line-height:146%; font-weight:normal }

div#content div#tabs-wrapper { min-height: 252px; margin-top: 11px; background: url("../images/brochureware/smartypants/tab-background2.gif") no-repeat 0 22px  }
* html div#content div#tabs-wrapper { height: 252px }

div#content ul#tabs { height: 32px; padding: 0; margin:0 3px 8px 0; list-style:none }
div#content ul#tabs li { display:inline; position: relative }
div#content ul#tabs a {	height: 32px; float:left; display: block; background-repeat: no-repeat;	background-position: 0 0; border: none }

div#content ul#tabs li#tabHeader1 a, div#content ul#tabs #tabHeaderActive a#tablink1 { clear:left; width: 84px;	background-image: url("../images/brochureware/smartypants/tab-compare.gif"); outline:none }
div#content ul#tabs li#tabHeader2 a, div#content ul#tabs #tabHeaderActive a#tablink2 { width: 132px; background-image: url("../images/brochureware/smartypants/tab-loan-resources.gif"); outline:none }
div#content ul#tabs li#tabHeader3 a, div#content ul#tabs #tabHeaderActive a#tablink3 { width: 57px;	background-image: url("../images/brochureware/smartypants/tab-faq.gif"); outline:none }
div#content ul#tabs li#tabHeader4 a, div#content ul#tabs #tabHeaderActive a#tablink4 { width: 107px; background-image: url("../images/brochureware/smartypants/tab-testimonials.gif"); outline:none }
div#content ul#tabs li#tabHeader1 a:hover, div#content ul#tabs li#tabHeader2 a:hover, div#content ul#tabs li#tabHeader3 a:hover, div#content ul#tabs li#tabHeader4 a:hover,
div#content ul#tabs li#tabHeader1 a:active, div#content ul#tabs li#tabHeader2 a:active, div#content ul#tabs li#tabHeader3 a:active, div#content ul#tabs li#tabHeader4 a:active,
div#content ul#tabs li#tabHeader1 a:focus, div#content ul#tabs li#tabHeader2 a:focus, div#content ul#tabs li#tabHeader3 a:focus, div#content ul#tabs li#tabHeader4 a:focus { background-position: 0 -32px }

div#content ul#tabs #tabHeaderActive a { background-position: 0 -64px; outline:none }

div#content div#tabscontent {clear:left }
div#content div#tabscontent .tab-content-wrapper { width: 364px; float:left; display: inline }
div#content div#tabscontent h4 { margin-bottom: 8px; font-weight: bold;	font-size: 1.5em }
div#content div#tabscontent p {	font-size: 1.1em }
div#content div#tabscontent ol { margin-left: 35px; margin-bottom: 15px; line-height: 1.3em; font-size: 1.1em }
div#content div#tabscontent h4.h_compare { color: #455560 }
div#content div#tabscontent h4.h_resource { color: #f68f1e }
div#content div#tabscontent h4.h_faq { color: #4f91cd }
div#content div#tabscontent h4.h_testimonial { color: #81ba37 }
div#content div#tabscontent .tabContent { padding: 10px 0 0 20px }
div#content div#tabscontent .smarty-pants-tab {	margin-left: 35px; margin-top: -40px; margin-bottom: 10px; float: left; display: inline }
div#content div#tabscontent .smarty-pants-quote-wrapper { width: 122px; background: url("../images/brochureware/smartypants/smarty-pants-quote-middle.gif") left top repeat-y; outline:none }
div#content div#tabscontent  h5.smarty-pants-quote-header {	height: 33px; background: #ffffff url("../images/brochureware/smartypants/smarty-pants-quote-top.gif") no-repeat left bottom; outline:none }
div#content div#tabscontent .smarty-pants-quote-wrapper p {	margin-bottom: 0; font-size: 1.1em; text-align: center; line-height: 1.1em }
div#content div#tabscontent .smarty-pants-quote { padding: 8px 6px; background: url("../images/brochureware/smartypants/smarty-pants-quote-bottom.gif") no-repeat left bottom; outline:none }
div#content div#tabscontent .testimonial-name {	margin-left: 150px }


div#buttons img.continue { padding: 8px 0 0 0;}

div#content .bottom-module-container { width:100%; height:133px; margin: 10px 0 0 0 }
div#content .bottom-module1 { width:183px; height:133px; margin-right:10px; background: url("../images/brochureware/smartypants/bottom-module-bg.gif") no-repeat left top; float:left }
div#content .bottom-module2 { width:183px; height:133px; margin-right:11px; background: url("../images/brochureware/smartypants/bottom-module-bg.gif") no-repeat left top; float:left }
div#content .bottom-module3 { width:183px; height:133px; background: url("../images/brochureware/smartypants/bottom-module-bg.gif") no-repeat left top; float:left; }
div#content .bottom-module1 h3, div#content .bottom-module2 h3, div#content .bottom-module3 h3 { margin: 10px 15px 4px 15px; border-bottom: 1px solid #455560; font-size: 1.4em; color: #455560 }
div#content .bottom-module1 p, div#content .bottom-module2 p, div#content .bottom-module3 p { margin: 0 0 0 15px; font-size: 1.2em }
div#content .bottom-module1 .new, div#content .bottom-module2 .new, div#content .bottom-module3 .new { font-size:85%; font-weight:bold; color:#af3fc6 }


/* =CARCHEX
---------------------------------------------------------------------
*/
div#carchex { width: 780px; min-height:407px; margin: 0 20px 100px 20px }
* html div#carchex { height: 407px }
div#carchex h1 { margin: 30px 0 15px 0; padding-bottom: 2px; border-bottom: 2px solid #f68f1e; font-size: 2.3em; color: #455560 }
div#carchex h2 { margin: 15px 0 15px 0; font-size: 1.3em; color: #f39025 }
div#carchex p { font-size:116%; line-height: 1.5em }
div#carchex ul {margin: 0; padding: 0 0 0 40px;}
div#carchex ul li {font-size:116%; list-style-type:disc; list-style-position:outside; padding: 0 0 4px 0; margin:0;}
div#carchex .sup { font-size:8px }
div#carchex .carchex-img { width:259px; height:407px; margin-left:20px; float:right }
div#carchex .btn-get-quote { width:170px; height:31px; margin:20px 0 0 25px }

/* =Footer
---------------------------------------------------------------------
*/
div#footer { clear:left; margin-top: 55px; font-family: Arial, Helvetica, sans-serif; font-size: 1.1em; color: #455560; text-align: center }
div#footer p { margin-bottom: 10px }
div#footer p.footer-top { padding-top: 5px; padding-bottom: 5px; background-color: #ededed; font-weight: bold }
* html div#footer p.footer-top { height: 10px }
div#footer a { color: #455560; text-decoration: none }
div#footer a:hover { border-bottom: 1px dashed #455560; color: #455560; text-decoration: none }
div#footer img { border:none }
div#footer img.footer-logos { margin-left: 20px; vertical-align: middle; border: none }
div#footer a.img-link, div#footer a.img-link:hover { border: none }
div#footer div#ask-search { margin-top: 15px }
div#footer div#ask-search input { font-size: 1.2em }
