@import url(reset.css);

html { font: normal 62.5% Helvetica, Arial, sans-serif; }
#iehtml { background: #67615b url(/images/interface/background.jpg) left top; }

a, a span { color: #206d6e; font-weight: bold; }
.clearer { clear: both; }

body { font-size: 1.45em; line-height: 1.3; color: #1c1c1c; }
#iebody { background: url(/images/interface/top_gradient.png) center top repeat-x; }

/* CCS styles */
#content h1 { font-size: 2.0em; line-height: 1.3em; font-weight: bold; }
#content h2 { font-size: 1.7em; line-height: 1.3em; font-weight: bold; }
#content h3 { font-size: 1.3em; line-height: 1.3em; font-weight: bold; }
#content h4 { font-size: 1.1em; line-height: 1.3em; font-weight: bold; }
#content h5 { font-size: 1.0em; line-height: 1.3em; font-weight: bold; }
#content p { }
#content strong, #content b { font-weight: bold; }

#main ul { margin: 6px 10px 10px; list-style-type: none; }
#main li { line-height: 1.3; padding-left: 14px;
           background: url('/images/interface/bullet.png') left 5px no-repeat; }

#main h2 { font-size: 1.4em; text-transform: uppercase; color: #837035; font-weight: normal; margin-bottom: 10px; }
#main h3 { font-size: 1.2em; font-weight: normal; color: #837035; border-bottom: 3px solid #D7D2BA; }
#main blockquote { background: url('/images/interface/quote_open.png') left top no-repeat; margin-bottom: 20px; border-bottom: solid 3px #bbd2cf; padding: 10px 0 10px 30px; }
#main blockquote i { color: #719c96; }

#right-sidebar h3 { padding: 5px 0; font-weight: normal; color: #837035; text-transform: uppercase; font-size: 1.1em; border-top: 1px dotted #837035; border-bottom: 1px dotted #837035; margin-bottom: 10px; }
#right-sidebar h4 { font-weight: normal; color: #837035; text-transform: uppercase; font-size: 0.85em; margin-bottom: 3px; }
#right-sidebar i { font-size: 0.75em; }
#right-sidebar .small { font-size: 0.85em; }

#main .left-photo { float: left; margin: 0 20px 20px 0; border: solid 5px #D5D0B7; }
#main .right-photo { float: right; margin: 0 0 20px 20px; border: solid 5px #D5D0B7; }
#main .center-photo { text-align:center; border: solid 5px #D5D0B7; margin-bottom: 20px; }

#container { min-height: 350px;
             background: url(/images/interface/container_bg.png) center top no-repeat; }

#header { width: 960px; margin: 0 auto; height: 160px; position: relative;
          background: url(/images/interface/logo_header.png) left top no-repeat; }
#header #visit-showroom-link { display: block; position: absolute; top: 36px; left: 68px;
                               width: 200px; height: 0; padding-top: 26px; overflow: hidden;
                               background: url(/images/interface/btn_visit_showroom.png) left top no-repeat; }
#header #visit-showroom-link:hover { background-position: left -26px; }
#header #upcoming-seminar-link { display: block; position: absolute; top: 66px; left: 68px;
                                 width: 200px; height: 0; padding-top: 26px; overflow: hidden;
                                 background: url(/images/interface/btn_upcoming_seminars.png) left top no-repeat; }
#header #upcoming-seminar-link:hover { background-position: left -26px; }
#header #contact-us-link { display: block; position: absolute; top: 46px; right: 78px;
                           width: 186px; height: 0; padding-top: 41px; overflow: hidden;
                           background: url(/images/interface/btn_contact_us_today.png) left top no-repeat; }

#navigation { width: 960px; margin: 0 auto; height: 55px;
              position: absolute; top: 110px; }
#main-nav li { float: left; }
#main-nav #main-nav-left-cap div { display: block; float: left; width: 97px; height: 55px;
                                   background: url(/images/interface/navigation.png) left top no-repeat; }
#main-nav #main-nav-right-cap div { display: block; float: left; width: 96px; height: 55px;
                                    background: url(/images/interface/navigation.png) right top no-repeat; }

#main-nav li a.main-nav-item { display: block; overflow: hidden; height: 0; padding-top: 55px; float: left;
                               background: url(/images/interface/navigation.png) left top no-repeat; }
#main-nav #main-nav-home a { width: 84px; background-position: -97px top; }
#main-nav #main-nav-home a:hover { width: 84px; background-position: -97px -55px; }
#main-nav #main-nav-home a.current { width: 84px; background-position: -97px -110px !important; }
#main-nav #main-nav-about a { width: 123px; background-position: -181px top; }
#main-nav #main-nav-about a:hover { width: 123px; background-position: -181px -55px; }
#main-nav #main-nav-about a.current { width: 123px; background-position: -181px -110px !important; }
#main-nav #main-nav-services a { width: 117px; background-position: -304px top; }
#main-nav #main-nav-services a:hover { width: 117px; background-position: -304px -55px; }
#main-nav #main-nav-services a.current { width: 117px; background-position: -304px -110px !important; }
#main-nav #main-nav-portfolio a { width: 137px; background-position: -421px top; }
#main-nav #main-nav-portfolio a:hover { width: 137px; background-position: -421px -55px; }
#main-nav #main-nav-portfolio a.current { width: 137px; background-position: -421px -110px !important; }
#main-nav #main-nav-testimonials a { width: 162px; background-position: -558px top; }
#main-nav #main-nav-testimonials a:hover { width: 162px; background-position: -558px -55px; }
#main-nav #main-nav-testimonials a.current { width: 162px; background-position: -558px -110px !important; }
#main-nav #main-nav-contact a { width: 144px; background-position: -720px top; }
#main-nav #main-nav-contact a:hover { width: 144px; background-position: -720px -55px; }
#main-nav #main-nav-contact a.current { width: 144px; background-position: -720px -110px !important; }

#content { width: 900px; margin: 0 auto; padding: 0;
           background: url(/images/interface/content_bg.png) left top repeat-y; }
#content-wrapper { width: 840px; padding: 25px 30px 0; }

#footer { width: 900px; margin: 0 auto; padding: 128px 0 20px; color: #5d5a44;
          background: url(/images/interface/footer_bg.png) left top no-repeat; }
#footer a { color: #5d5a44; font-weight: normal; }
#footer-nav { text-align: center; }
#footer-divider { width: 900px; height: 0; padding-top: 40px; overflow: hidden;
                  background: url(/images/interface/footer_divider.png) center center no-repeat; }

#footer #site-info { text-align: center; font-size: .82em; }

/* home page */
#features { margin: 0 0 20px; padding: 26px 0 0; position: relative; width: 840px; height: 320px; }
#features .feature { position: absolute; width: 840px; }

#feature-nav { position: absolute; top: 0; left: -12px; width: 840px; height: 30px; margin: 0; padding: 0; }
#feature-nav li { float: left; background: none; line-height: 1; padding: 0; margin: 0; }

#feature-nav li a { width: 160px; display: block; overflow: hidden; height: 0; padding-top: 30px; float: left;
                    background: url(/images/interface/nav_feature.png) left top no-repeat; }
#feature-nav #feature-nav-home_renovations a          { background-position: left -1px; width: 200px; }
#feature-nav #feature-nav-home_renovations a:hover    { background-position: left -30px; }
#feature-nav #feature-nav-home_renovations a.selected { background-position: left -60px; }
#feature-nav #feature-nav-new_homes a                 { background-position: -200px -1px; width: 174px; }
#feature-nav #feature-nav-new_homes a:hover           { background-position: -200px -30px; }
#feature-nav #feature-nav-new_homes a.selected        { background-position: -200px -60px; }
#feature-nav #feature-nav-kitchens a                  { background-position: -374px -1px; width: 76px; }
#feature-nav #feature-nav-kitchens a:hover            { background-position: -374px -30px; }
#feature-nav #feature-nav-kitchens a.selected         { background-position: -374px -60px; }
#feature-nav #feature-nav-bathrooms a                 { background-position: -450px -1px; width: 94px; }
#feature-nav #feature-nav-bathrooms a:hover           { background-position: -450px -30px; }
#feature-nav #feature-nav-bathrooms a.selected        { background-position: -450px -60px; }
#feature-nav #feature-nav-commercial_projects a       { background-position: -544px -1px; width: 163px; }
#feature-nav #feature-nav-commercial_projects a:hover { background-position: -544px -30px; }
#feature-nav #feature-nav-commercial_projects a.selected { background-position: -544px -60px; }
#feature-nav #feature-nav-current_projects a          { background-position: -707px -1px; width: 133px; }
#feature-nav #feature-nav-current_projects a:hover    { background-position: -707px -30px; }
#feature-nav #feature-nav-current_projects a.selected { background-position: -707px -60px; }

.left-col { float: left; width: 245px; }
.middle-col { float: left; width: 275px; padding: 0 25px; }
.right-col { float: left; width: 270px; }

body.home .middle-col h2 { width: 239px; height: 0; padding-top: 14px; overflow: hidden; margin-bottom: 13px;
                           background: url(/images/interface/title_quality_construction.png) left top no-repeat; }

#seminar-caption { display: none; }
#next-seminar { height: 125px; padding: 95px 0 0 170px; text-align: center; line-height: 1.1;
                background: url(/images/interface/feature_seminar.jpg) left top no-repeat; }
#next-seminar-date { font-size: 1.5em; font-weight: bold; max-height: 1.2em; }
#next-seminar-time { font-size: 1.2em; font-weight: bold; max-height: 1.2em; }

#logos { margin-top: 30px; padding-bottom: -20px; float: left; padding-left: 100px; }
#logos img { margin-right: 40px; }
#logos img:last-child { margin-right: 0; }




/* sub sections */
#left-sidebar { min-height: 400px; width: 220px; padding: 25px 0 0 30px; margin-right: 25px; float: left; background: url('/images/interface/sidenav_background.png') top left no-repeat; }
#main-content { float: left; width: 375px; margin: 25px 20px 0 0; }
#right-sidebar { width: 200px; float: left; margin: 25px 0 0 0; }
#full-content { float: left; width: 595px; margin: 25px 0 0 0; }

#section-menu { font-size: 1em; text-transform: uppercase; margin-bottom: 30px; }
body.about #section-menu h3 { border-bottom: none; height: 45px; text-indent: -9999em; position: relative; background: url('/images/interface/nav_title_about.png') left top no-repeat; }
body.services #section-menu h3 { border-bottom: none; height: 45px; text-indent: -9999em; position: relative; background: url('/images/interface/nav_title_services.png') left top no-repeat; }
body.portfolio #section-menu h3 { border-bottom: none; height: 45px; text-indent: -9999em; position: relative; background: url('/images/interface/nav_title_portfolio.png') left top no-repeat; }
body.testimonials #section-menu h3 { border-bottom: none; height: 45px; text-indent: -9999em; position: relative; background: url('/images/interface/nav_title_testimonials.png') left top no-repeat; }
body.contact #section-menu h3 { border-bottom: none; height: 45px; text-indent: -9999em; position: relative; background: url('/images/interface/nav_title_contact.png') left top no-repeat; }

#section-menu ul { margin: 0; }
#section-menu li { border-bottom: solid 1px #bdd3cf; margin: 0; padding: 7px 0 3px 12px; background-position: left 12px; }
#section-menu li.current a { color: #837035; }
#section-menu li.current li a { color: #104849; }
#section-menu a { font-weight: normal; color: #104849; text-decoration: none; }
#section-menu a:hover { color: #837035; text-decoration: underline; }
#section-menu li.section-menu-item { font-size: 0.85em; background: none; padding: 5px 0 0 0; }

#promotions img { border: solid 1px #a6a6a6; }

.slideshow-main { background-color: #EAE9E1; }
.slideshow-main img { border: 1px solid #787662; }
.slideshow-thumb-container { position: relative; height: 103px; margin-top: 20px; }
.slideshow-thumbs { width: 539px; padding: 0 28px; height: 103px; line-height: 103px;
                    position: absolute; z-index: 2;
                    background: url(/images/interface/slideshow_thumbs_bg.png) left top no-repeat; }
.slideshow-thumbs-scroll-container { width: 542px; overflow: hidden; }
.slideshow-thumbs img { border: 4px solid white; opacity: .6; margin: 0 2px; vertical-align: middle; }
.slideshow-thumbs img.selected,
  .slideshow-thumbs img.hovered { opacity: 1; }
.slideshow-thumbs-left { position: absolute; z-index: 1; left: 0; top: 0;
                         width: 27px; height: 0; padding-top: 103px; overflow: hidden;
                         background-color: #b4af83; }
.slideshow-thumbs-right { position: absolute; z-index: 1; right: 0; top: 0;
                          width: 27px; height: 0; padding-top: 103px; overflow: hidden;
                          background-color: #b4af83; }
.slideshow-thumbs-left.selected,
  .slideshow-thumbs-right.selected { background-color: white; }
a.slideshow-thumbs-left-link { display: block; position: absolute; z-index: 5; left: 0; top: 0;
                               width: 27px; height: 0; padding-top: 103px; overflow: hidden; }
a.slideshow-thumbs-right-link { display: block; position: absolute; z-index: 5; right: 0; top: 0;
                                width: 27px; height: 0; padding-top: 103px; overflow: hidden; }
.gallery_caption { text-align: right; font-size: 0.8em; margin-top: 10px; color: #867e61; }


/* [=forms]
*******************************************************************************************************/
#content form.form fieldset { padding: 0 20px 8px 0; }
#content form.form fieldset * { vertical-align: middle; }
#content form.form label { font-family: Helvetica, Arial, sans-serif; font-weight: bold; line-height: 24px; color: #424242; }
#content form.form div.separator { border-bottom: 1px solid #dedede; height: 1px; margin: 5px 0 6px 0; text-indent: -9999em; }
#content form.form fieldset div.separator { margin-right: -16px; }
#content form.form div.required { width: 25px; text-align: right; float: right; font-size: 10px; font-style: italic; margin-top: 5px; }
#content form.form select,
#content form.form input.text,
#content form.form textarea, 
#content form.form input.short-text { background-color: #EFEDDC; border: 0; height: 20px; padding: 3px 3px 0; width: 100%; font-size: 15px; border: solid 2px #D7D2BA; }
#content form.form textarea { vertical-align: text-top; }
#content form.form input.submit { margin: 8px auto 0; display: block; width: 132px; height: 35px; }
#content form.form select { padding: 4px; height: 30px; }
#content form.form .checkbox-pair { position: relative; padding-left: 25px; }
#content form.form .checkbox-pair input { position: absolute; top: -1px; left: 0; }
#content form.form label.checkbox { float: none; margin-left: 0; margin-right: 0; line-height: 1.5; }
#content form.form .form-notice { padding: 10px; border: solid 3px #dedede; font-size: 110%; }
#content form.form input.short-text { width: 157px; }
#content form.form input.text,
#content form.form textarea, { width: 370px; }

#content .error { font-family: Helvetica, Arial, sans-serif; font-size: 15px; font-weight: bold; color: red; margin: 0 0 10px 0; border-top: dotted red 1px; border-bottom: dotted red 1px; padding: 10px; }
#content .notice { font-family: Helvetica, Arial, sans-serif; font-size: 15px; font-weight: bold; color: #0e7b15; margin: 0 0 10px 0; border-top: dotted #0e7b15 1px; border-bottom: dotted #0e7b15 1px; padding: 10px; }

