/*--------------------- Last Modified 2006.03.25 ---------------------*/ /*-----------------------------------------------------------------------*/ /* ---------------------------------------------------------------------------- Copyright Einstein Industries 2006. Used with Permission. May not be duplicated or reproduced. Please check for cross-browser compatibility prior to making changes MINIMUM BROWSER CHECK :: IE5.x/IE6/Firefox/Safari CSS Document - layout.css ---------------------------------------------------------------------------- */ /* undo some default styling of common (X)HTML browsers * ------------------------------------------------------------------------- */ /* No list-markers by default - must redefine bullets w/ bg graphics */ ul,ol { list-style:none; } /* Avoid browser default inconsistent heading font-sizes and pre/code */ h1,h2,h3,h4,h5,h6,pre,code,td { font-size:1em; } /* Remove inconsistent (among browsers) default padding or margin */ ul,ol,li,h1,h2,h3,h4,h5,h6,pre,form,body,html,p,blockquote,fieldset,input,label,div,dd,dt,dl,table,tr,td { margin:0; padding:0; -moz-background-clip: #FFFFFF; } /* prevent blue linked image borders */ a img,:link img,:visited img,fieldset { border:none; } /* global elements * ------------------------------------------------------------------------- */ /* ----- type selectors ----- */ body { background:#993333 url("../images/bg-body.jpg") top repeat-x; text-align:center; font:11px/16px Arial, Helvetica, sans-serif; color:#9B2900; line-height:15px; } blockquote { margin-left:10px; margin-right:10px; } h1 { font-size:1.0em; color:#9B2900; } h2 { font-size:1.0em; color:#9B2900; } h3 { font-size:1.0; color:#9B2900; } h1 span,h2 span,h3 span { display:none; } a:link,a:visited { color:#9B2900; text-decoration:underline; outline:none; } a:hover,a:active { color:#FB6437; text-decoration:underline; outline:none; } /* ----- classes ----- */ div.clear { clear:both; height:.01em; overflow:hidden; } p.back-to-top { text-align:left; display:block; padding-right:15px; } p.back-to-top a {color:#FB6437; font-size:11px; font-weight:bold; } .back-to-top a:link, .back-to-top a:visited { color:#FB6437; text-decoration:none; } .back-to-top a:hover, .back-to-top a:active { color:#FB6437; text-decoration:underline; } img.img-left { float:left; margin:2px 10px 2px 0; } img.img-right { float:right; margin:5px 0 10px 10px; } img.img-center { float:left; margin:5px 0 25px 20px; } div.img-center { margin-left:125px;} /* ----- global form elements ----- */ form { width:135px; margin:10px 0 15px 0; } form label { font-size:.95em; } form br { line-height:0; height:0; } /* defaults vertical spacing between fields */ input, textarea, select { background:url("../images/bg-contact.jpg"); background-color:#FDBC87 !important; /* to prevent highlighting by Google Toolbar */ border:1px solid #FEE9DB; color:#A02B01; width:130px; /* 5 pixles smaller than form width !important */ height:20px; line-height:18px; vertical-align: middle; margin-bottom:4px; /* sets vertical spacing between fields */ padding-top:1px; /* vertically position text in input/textarea field */ padding-left:4px; /* horizontally position text in input/textarea field */ font-family: Arial, Helvetica, sans-serif; font-size:1.0em; } select { width:135px; padding:0; } /* same width as form - !important */ textarea { height:90px; overflow:auto; } #contact_business { display: none; } /* do not remove */ /* ----- main contact form ----- */ #contact-main { margin:20px 0 10px 0; } #contact-main label { width:190px; position:relative; display:block; text-align:right; margin-bottom:10px; font-size:1.0em; margin-left:35px; } #contact-main label input, #contact-main label textarea, #contact-main label select { width:170px; position:absolute; left:110%; top:-2px; } #contact-main label select { width:175px; } #contact-main label textarea { height:100px; overflow:auto; } /* ----- submit button form elements ----- */ input.submit, input.submit-contact-main { width:52px; height:15px; cursor:pointer; padding:0; color:#3E0800; } input.submit-contact-main { margin:95px 0 0 243px;} input.submit-image, input.submit-contact-main { /* REMOVE IF NOT USED */ background:url("../images/btn-submit.jpg"); width:52px; height:15px; border:none; cursor:pointer; } /* framework * ------------------------------------------------------------------------- */ #wrap { background:url("../images/bg-wrap.jpg") repeat-y; width:712px; margin:0 auto; text-align:left; margin-top:9px; } /* ----- column-left ----- */ #column-left { background:url("../images/bg-left-column.jpg") no-repeat; width:490px; float:left; } #column-left p, #column-left h1, #column-left h2, #column-left h3, #column-left h4 { margin:0 19px 10px 40px; } #column-left h4 { margin-bottom:0; } #logos { text-align:center; width:448px; height:123px; margin-left:40px;} #logos img { padding-left:45px; float:left;} .logo-middle { margin-top:25px;} a.bodylink {font-weight:bold; } a.bodylink:link, a.bodylink:visited { color:#FB6437; text-decoration:none;} a.bodylink:hover, a.bodylink:active { color:#FB6437; text-decoration:underline;} #hd-box { background:url("../images/hd-box.jpg") no-repeat; height:91px; margin-left:25px;} #hd-box p { margin:0 35px 10px 15px; padding-top:10px;} #column-left a.bna { width:124px; float:left; margin-left:39px; margin-top:17px;} /* ----- column-left index ----- */ body#index #column-left { background:url("../images/bg-left-column.jpg") no-repeat; width:212px; float:left; } #statue { background:url("../images/statue.jpg") no-repeat; height:274px; margin-left:10px;} #hd-testimonials { background:url("../images/hd-testimonials-index.jpg") no-repeat; height:23px; margin:10px 0 10px 10px;} .btn-learnmore { background:url("../images/arrow.gif") 4px 5px no-repeat; float:right; padding-left:20px;} .btn-view { background:url("../images/arrow.gif") 4px 13px no-repeat; float:right; padding:7px 20px 0 20px;} #hd-featured { background:url("../images/hd-featured.jpg") no-repeat; height:21px; margin:50px 0 20px 42px;} #featured-cases { background:url("../images/bg-featured.jpg") no-repeat; height:240px; margin-left:34px;} #featured-cases p {padding:16px 0 0 21px; margin:0; font-weight:bold;} #column-left a.cases { width:124px; float:left; margin-left:21px; margin-top:13px;} /* ----- column-middle ----- */ #column-middle { background:url("../images/bg-column-middle.jpg") no-repeat; width:278px; float:left; } #column-middle p, #column-middle h1, #column-middle h2 { margin:0 10px 10px 23px; } #hd-about-practice { background:url("../images/hd-about.jpg") no-repeat; height:14px; margin:50px 34px 10px 49px;} #logo { background:url("../images/logo.jpg") no-repeat; width:78px; height:112px; margin:100px 0 20px 100px; } /* ----- column-right ----- */ #column-right { background:url("../images/bg-right-column.jpg") no-repeat; width:222px; float:left; } #column-right p, #column-right h1, #column-right h2, #column-right h3, #column-right ul, #column-right dl, #column-right div { margin:6px 2px 2px 6px !important; } #column-right form { margin-left:49px; } #column-right #financing {background: url(../images/hd-finance.jpg) 0px 0px no-repeat; width:222px; height:35px; margin:15px 0px 10px 0px !important;} #credit-logos {padding-left:31px;} #credit-logos img {margin:10px 0px 10px 0px;} /* definition list */ #column-right dl { padding-left:0; padding-top:25px; } #column-right dl dt { font-weight:bold; color:#9B2900; } #column-right dl dd { background:transparent url("../images/bullet.jpg") 0px 6px no-repeat; padding-left:0; /* pushes text to the right to display bg img */ margin-left:0; text-align:center; } #hd-contact { background:url("../images/hd-contact.jpg") no-repeat; height:35px; margin-top:36px; width:222px;} #hd-seminars { background:url("../images/hd-seminars.jpg")no-repeat; height:24px;} #bg-right { background:url("../images/bg-right.jpg") no-repeat; height:240px;} #bg-right p { margin:0 35px 10px 49px; padding-top:25px;} body#contact #hd-seminars { background:url("../images/hd-seminars-contact.jpg") no-repeat; height:35px; margin-top:36px;} body#contact #bg-right { background:url("../images/bg-right-contact.jpg") no-repeat; height:205px; margin-top:15px;} body#contact #bg-right p { margin:0 35px 10px 49px; padding-top:15px;} #column-right #map{position:relative; float:left; width:134px; height:133px;} #column-right #map a {position:absolute; background: url("../images/map.jpg") 0px 0px no-repeat; width:134px; height:133px; } /* ----- menu-seminars ----- */ #btn-seminars { background:url("../images/more_seminars.jpg") no-repeat; width:150px; height:20px; margin-left:39px; } #btn-seminars a { display:block; height:20px; } #btn-seminars a:hover { background: transparent url("../images/more_seminars.jpg") no-repeat 0 -20px; } #btn-seminars span { display:none; } /* ----- bottom-wrap ----- */ #bottom-wrap { background:url("../images/bottom-wrap.jpg"); height:165px; clear:both; width:100%; /* fix for Safar */ } body#index #bottom-wrap { background:url("../images/bottom-wrap-index.jpg"); } /* header framework * ------------------------------------------------------------------------- */ #header-flash { height:343px; margin-left:10px;} /* sets height for the flash header - REMOVE IF NOT USED */ /* subhead framework * ------------------------------------------------------------------------- */ #subhead { height:82px; margin-bottom:20px; } /* sets height for all subheads */ body#index #subhead { background:url("../images/subhead-index.jpg"); height:83px; } body#about #subhead { background:url("../images/subhead-about.jpg"); } body#practice #subhead { background:url("../images/subhead-practice.jpg"); } body#testimonials #subhead { background:url("../images/subhead-testimonials.jpg");} body#skin #subhead { background:url("../images/subhead-skin.jpg"); } body#breast #subhead { background:url("../images/subhead-breast.jpg"); } body#body #subhead { background:url("../images/subhead-body.jpg"); } body#face #subhead { background:url("../images/subhead-face.jpg"); } body#contact #subhead { background:url("../images/subhead-contact.jpg"); } body#thankyou #subhead { background:url("../images/subhead-thankyou.jpg"); } body#sitemap #subhead { background:url("../images/subhead-sitemap.jpg"); } /* ----- subhead framework with varying heights ----- */ #subhead-meet-doc { height:55px; background:url("../images/subhead-meet-doc.jpg") ; } /* footer * ------------------------------------------------------------------------- */ #footer { width:712px; margin:0 auto; text-align:center; } #footer p { color:#CCC; margin:10px 30px 10px 30px; } #footer a:link, #footer a:visited { color:#CCC; text-decoration:none; } #footer a:hover, #footer a:active { color:#CCC; text-decoration:underline; } #footer ul {margin:10px 0 0 100px;} #footer li { /* if your li's float, you can adjust border height w/ line-height */ padding:0 5px 0 7px; display: inline; border-left: 1px solid #CCC; float:left; line-height:11px; } #footer li.first { border: none; } /* Horozontal Sprite Nav - Index * ------------------------------------------------------------------------- */ #nav-index { background:url("../images/nav-index.gif") no-repeat; width:712px; height:28px; margin:0; padding:0; } #nav-index span { display: none; } #nav-index li, #nav-index a { height:30px; display:block; } /* change height here also */ #nav-index li { float:left; list-style:none; _display:inline; } #nav-index-01 { width: 128px; margin-left:10px;} #nav-index-02 { width: 88px;} #nav-index-03 { width: 67px;} #nav-index-04 { width: 57px;} #nav-index-05 { width: 54px;} #nav-index-06 { width: 89px;} #nav-index-07 { width: 116px;} #nav-index-08 { width: 93px;} /*-------------- (-10px) X position of button / (-28px) height of image from above ------------- */ #nav-index-01 a:hover { background:url("../images/nav-index.gif") -10px -28px no-repeat; } #nav-index-02 a:hover { background:url("../images/nav-index.gif") -138px -28px no-repeat; } #nav-index-03 a:hover { background:url("../images/nav-index.gif") -226px -28px no-repeat; } #nav-index-04 a:hover { background:url("../images/nav-index.gif") -293px -28px no-repeat; } #nav-index-05 a:hover { background:url("../images/nav-index.gif") -350px -28px no-repeat; } #nav-index-06 a:hover { background:url("../images/nav-index.gif") -404px -28px no-repeat; } #nav-index-07 a:hover { background:url("../images/nav-index.gif") -493px -28px no-repeat; } #nav-index-08 a:hover { background:url("../images/nav-index.gif") -609px -28px no-repeat; } /* Horozontal Sprite Nav * ------------------------------------------------------------------------- */ #nav { background:url("../images/nav.gif") no-repeat; width:712px; height:28px; margin:0; padding:0; } #nav span { display: none; } #nav li, #nav a { height:30px; display:block; } /* change height here also */ #nav li { float:left; list-style:none; _display:inline; } #nav-01 { width: 69px; margin-left:10px;} #nav-02 { width: 113px;} #nav-03 { width: 83px;} #nav-04 { width: 66px;} #nav-05 { width: 56px;} #nav-06 { width: 51px;} #nav-07 { width: 51px;} #nav-08 { width: 112px;} #nav-09 { width: 91px;} /*-------------- (-10px) X position of button / (-28px) height of image from above ------------- */ #nav-01 a:hover { background:url("../images/nav.gif") -10px -28px no-repeat; } #nav-02 a:hover { background:url("../images/nav.gif") -79px -28px no-repeat; } #nav-03 a:hover { background:url("../images/nav.gif") -192px -28px no-repeat; } #nav-04 a:hover { background:url("../images/nav.gif") -275px -28px no-repeat; } #nav-05 a:hover { background:url("../images/nav.gif") -341px -28px no-repeat; } #nav-06 a:hover { background:url("../images/nav.gif") -397px -28px no-repeat; } #nav-07 a:hover { background:url("../images/nav.gif") -448px -28px no-repeat; } #nav-08 a:hover { background:url("../images/nav.gif") -499px -28px no-repeat; } #nav-09 a:hover { background:url("../images/nav.gif") -611px -28px no-repeat; } div.hr { width:161px; height: 1px; background: #652222 url() no-repeat scroll center; margin:20px 0 5px 165px; } div.hr hr { display: none; }