/*--------------------- 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; } /* prevent blue linked image borders */ a img,:link img,:visited img,fieldset { border:none; } /* global elements * ------------------------------------------------------------------------- */ /* ----- type selectors ----- */ body { background:#142146 url("../images/bg-body.jpg") top repeat-x; text-align:center; font-size:14px; font-family: Geneva, Arial, Helvetica, sans-serif } blockquote { margin-left:10px; margin-right:10px; } .keywords {color:#5b6b8e; font-weight:bold;} .quote {font-style:italic; border:solid 1px #5b6b8e; font-weight:bold; padding: 5px 5px 5px 25px; text-align:} h1 { font-size:1.2em; color:#142146; } h2 { font-size:1.1em; color:#5E658E; } h3 { font-size:1.0em; color:#8895B1; } h1 span,h2 span,h3 span { display:none; } a:link,a:visited { color:#4B567A; text-decoration:underline; outline:none; } a:hover,a:active { color:#2f86af; text-decoration:underline; outline:none; } /* ----- classes ----- */ div.clear { clear:both; height:.01em; overflow:hidden; } p.back-to-top { text-align:right; display:block; padding-right:15px; background:url("../images/bullet-back-to-top.jpg") right no-repeat; } img.img-center { margin:0 0 10px 125px; } img.img-left { float:left; margin:2px 10px 10px 50px; } img.img-right { float:right; margin:0px 35px 5px 10px; } img.logo { margin: 5px 0 10px 70px;} label.required-text {color: #DAE5EF;} /* ----- global form elements ----- */ form { width:150px; 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-color:#fff !important; /* to prevent highlighting by Google Toolbar */ border:1px solid #8DA6C4; color:#4B567A; width:130px; /* 5 pixles smaller than form width !important */ height:18px; 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:"Trebuchet MS", Arial, Helvetica, sans-serif; font-size:1.0em; } select { width:150px; 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 30px 0; } #contact-main label { width:220px; position:relative; display:block; text-align:right; margin-bottom:10px; font-size:1.0em; } #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; } #contact-main #verification { margin-top: 95px; } #contact-main label img { position: absolute; left: 110%; margin-top: 15px; } /* ----- submit button form elements ----- */ input.submit, input.submit-contact-main { width:60px; height:20px; cursor:pointer; padding:0; } input.submit-contact-main { margin:55px 0 0 243px; } input.submit-image, input.submit-contact-main { /* REMOVE IF NOT USED */ background:url("../images/submit.jpg"); width:58px; height:18px; border:none; cursor:pointer; } /* framework * ------------------------------------------------------------------------- */ #wrap { background:url("../images/bg-wrap.jpg") repeat-y; width:760px; margin:0 auto; text-align:left; } #masthead { position:relative; background:url("../images/masthead.jpg"); height:106px; } /* index page link within #masthead */ #masthead a { position:absolute; left:110px; width:245px; top:25px; height:35px; } #masthead a span { display:none; } /* ----- content-left ----- */ #column-left { background-image:url('images/bg-left-column2.jpg'); background-repeat: no-repeat; width:500px; float:left; } #column-left p, #column-left h1, #column-left h2, #column-left h3, #column-left dl { margin:0 30px 10px 70px; } #column-left a:link, #column-right a:visited {color: #4B567A;} #column-left a:hover, #column-right a:active {color: #8486C6;} #column-left form { margin-left:20px; } /* single column list */ #column-left ul { padding-left:85px; margin-bottom:10px;} #column-left ul li { background:transparent url("../images/bullet.gif") 0px 6px no-repeat; padding-left:10px; /* pushes text to the right to display bg img */ } /* definition list */ #column-left dl { padding-left:5px; } #column-left dl dt { font-weight:bold; color:#99CC00; } #column-left dl dd { background:transparent url("../images/bullet.jpg") 0px 6px no-repeat; padding-left:10px; /* pushes text to the right to display bg img */ margin-left:5px; } #procedures-index{ background: url("../images/procedures-index.jpg") top no-repeat; float:left; padding-top:50px; width:275px; } #procedures-index span {display: none;} #column-left #procedures-index ul.procedures-index{ padding-left: 70px;} #results-index{ background: url("../images/results-index.jpg") top no-repeat; float:left; width: 225px; padding:50px 0 0 0px; } #results-index p {margin:0 20px 10px 0px;} img.results-index {margin:0 20px 10px 13px;} #subnav{ background: #E8EAEE; border: 1px solid #576183; width: 165px; float:left; margin: 0 10px 7px 70px; display:inline; } #subnav ul.subnav {padding-left:20px;} /* ----- content-right ----- */ #column-right { width:260px; float:left; } #column-right p, #column-right h1, #column-right h2, #column-right h3, #column-right ul, #column-right dl { color:#DAE5EF; margin:0 60px 10px 50px; } #column-right a:link, #column-right a:visited {color: #DAE5EF;} #column-right a:hover, #column-right a:active {color: #8486C6;} #column-right form { margin-left:50px; } /* single column list */ #column-right ul { padding-left:0px; } #column-right ul li { /*background:transparent url("../images/bullet.jpg") 0px 6px no-repeat;*/ /*padding-left:10px; pushes text to the right to display bg img */ } /* multi column list */ #column-right ul { padding-left:0px; } #column-right ul li { /*background:transparent url("../images/bullet.jpg") 0px 6px no-repeat;*/ /*padding-left:10px; pushes text to the right to display bg img */ float:left; width:150px; line-height:20px; } /* definition list */ #column-right dl { padding-left:5px; } #column-right dl dt { font-weight:bold; color:#99CC00; } #column-right dl dd { background:transparent url("../images/bullet.jpg") 0px 6px no-repeat; padding-left:10px; /* pushes text to the right to display bg img */ margin-left:5px; } #rt-contactus{ background: url("../images/subhead-rt-contactus.jpg") top no-repeat; padding-top: 10px; } #rt-contactus-inside{ background: url("../images/subhead-rt-contactus-inside.jpg") top no-repeat; padding-top: 45px; } #rt-locateus{ background: url("../images/subhead-rt-locateus.jpg") top no-repeat; height: 240px; padding-top: 45px; } /* ----- bottom-wrap ----- */ #bottom-wrap { background:url("../images/bottom-wrap.jpg"); height:108px; clear:both; width:100%; /* fix for Safar */ } /* header framework * ------------------------------------------------------------------------- */ body#index #header-index { height:235px; background:url("../images/header-index_new3.jpg");} /* sets height for all non-flash headers */ .phone { color:#efbd26; font-size:16px; font-family:Arial, Helvetica, sans-serif; font-weight:bold; position:relative; width:100px; height:20px; float:right; top:27px; right:50px;} #header-graphic{ height:170px; } /* sets height for all non-flash headers */ body#index #header-index { background:url("../images/header-index_new3.jpg"); } body#about #header-graphic { background:url("../images/header-about.jpg"); } body#cosmetic #header-graphic { background:url("../images/header-cosmetic_new.jpg"); } body#implants #header-graphic { background:url("../images/header-implants.jpg") top no-repeat; } body#family #header-graphic { background:url("../images/header-family_new.jpg"); } body#financing #header-graphic { background:url("../images/header-financing_new.jpg"); } body#contact #header-graphic { background:url("../images/header-contact_new1.jpg"); } body#thankyou #header-graphic { background:url("../images/header-contact.jpg"); } body#testimonials #header-graphic { background:url("../images/header-sitemap.jpg"); } body#sitemap #header-graphic { background:url("../images/header-sitemap.jpg"); } body#maps-directions #header-graphic { background:url("../images/header-sitemap.jpg"); } /* subhead framework * ------------------------------------------------------------------------- */ #subhead { height:60px; } /* sets height for all subheads */ body#about #subhead { background:url("../images/subhead-about.jpg") top no-repeat; } body#cosmetic #subhead { background:url("../images/subhead-cosmetic.jpg") top no-repeat; } body#implants #subhead { background:url("../images/subhead-implants.jpg") top no-repeat; } body#family #subhead { background:url("../images/subhead-family.jpg") top no-repeat; } body#financing #subhead { background:url("../images/subhead-financing.jpg") top no-repeat; } body#contact #subhead { background:url("../images/subhead-contact.jpg") top no-repeat; } body#thankyou #subhead { background:url("../images/subhead-thankyou.jpg") top no-repeat; height:240px; padding-top:60px;} body#sitemap #subhead { background:url("../images/subhead-sitemap.jpg") top no-repeat; } body#maps-directions #subhead { background:url("../images/title-maps.jpg") top no-repeat; } /* ----- subhead framework with varying heights ----- */ #subhead-meet-doc { height:55px; background:url("../images/subhead-meet-doc.jpg") ; } /* footer * ------------------------------------------------------------------------- */ #footer { background:url("../images/footer.jpg") top no-repeat; width:720px; margin:0 auto; text-align:center; } #footer p { color:#DCEDFA; margin-bottom:10px; } #footer a:link, #footer a:visited { color:#8486C6; } #footer a:hover, #footer a:active { color:#4B567A; } #footer ul {margin-bottom:35px; width:700px; text-align:center;} #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 #4B567A; line-height: 18px; } #footer li a:link, #footer li a:visited {color:#4B567A;} #footer li a:hover, #footer li a:active{color:#4B567A; text-decoration:none;} #footer li.first { border: none; } /* Horozontal Sprite Nav * ------------------------------------------------------------------------- */ #nav-inside { background:url("../images/nav-inside.jpg") no-repeat; width:760px; height:41px; margin:0; padding:0; z-index:100; } #nav-inside span { display: none; } #nav-inside li, #nav-inside a { height:41px; display:block; } /* change height here also */ #nav-inside li { list-style:none; _display:inline;z-index:100; } #nav-inside-01 { width: 48px; margin-left: 24px;float:left;z-index:100;} #nav-inside-02 { width: 64px;float:left;z-index:100;} #nav-inside-03 { width: 106px;float:left;z-index:100;} #nav-inside-04 { width: 91px;float:left;z-index:100;} #nav-inside-inv {width: 68px;float:left;z-index:100;} #nav-inside-05 { width: 146px;float:left;z-index:100;} #nav-inside-06 { width: 120px;float:left;z-index:100;} #nav-inside-07 { width: 70px;float:left;z-index:100;} /*-------------- (-79px) X position of button / (-30px) height of image from above ------------- */ #nav-inside-01 a:hover { background:url("../images/nav-inside.jpg") -24px -41px no-repeat; } #nav-inside-02 a:hover { background:url("../images/nav-inside.jpg") -72px -41px no-repeat; } #nav-inside-03 a:hover { background:url("../images/nav-inside.jpg") -136px -41px no-repeat; } #nav-inside li ul li { position:absolute;left: -99999em;} #nav-inside li { height:26px; color:#FFFFFF;} #nav-inside li:hover, #nav-inside li.sfhover { display:list-item; position:relative; top:0px;} #nav-inside li:hover ul li, #nav-inside li.sfhover ul li { display:list-item; position:relative; top:0px; left:auto;} #nav-inside-04 a:hover { background:url("../images/nav-inside.jpg") -242px -41px no-repeat; } #nav-inv a:hover { background:url("../images/nav-inside.jpg") -333px -41px no-repeat; } #nav-inside-05 a:hover { background:url("../images/nav-inside.jpg") -401px -41px no-repeat; } #nav-inside-06 a:hover { background:url("../images/nav-inside.jpg") -547px -41px no-repeat; } #nav-inside-07 a:hover { background:url("../images/nav-inside.jpg") -667px -41px no-repeat; } /* Horozontal Sprite Nav Index * ------------------------------------------------------------------------- */ #nav { background:url("../images/nav.jpg") no-repeat; width:760px; height:41px; margin:0; padding:0; } #nav span { display: none; } #nav li, #nav a { height:41px; display:block; } /* change height here also */ #nav li { list-style:none; _display:inline; } #nav-01 { width: 48px; margin-left: 24px;float:left;} #nav-02 { width: 64px;float:left;} #nav-03 { width: 106px;float:left;} #nav-04 { width: 91px;float:left;} #nav-inv {width: 68px;float:left;} #nav-05 { width: 146px;float:left;} #nav-06 { width: 120px;float:left;} #nav-07 { width: 70px;float:left;} /*-------------- (-79px) X position of button / (-30px) height of image from above ------------- */ #nav-01 a:hover { background:url("../images/nav.jpg") -24px -41px no-repeat; } #nav-02 a:hover { background:url("../images/nav.jpg") -72px -41px no-repeat; } #nav-03 a:hover { background:url("../images/nav.jpg") -136px -41px no-repeat; } #nav-04 a:hover { background:url("../images/nav.jpg") -242px -41px no-repeat; } #nav-inv a:hover { background:url("../images/nav.jpg") -333px -41px no-repeat; } #nav-05 a:hover { background:url("../images/nav.jpg") -401px -41px no-repeat; } #nav-06 a:hover { background:url("../images/nav.jpg") -547px -41px no-repeat; } #nav-07 a:hover { background:url("../images/nav.jpg") -667px -41px no-repeat; } #nav li ul li { position:absolute;left: -99999em; } #nav li { color:#FFFFFF; line-height:12px; margin-bottom:-10px;} #nav li:hover, #nav li.sfhover { display:list-item; position:relative; top:0px;} #nav li:hover ul li, #nav li.sfhover ul li { display:list-item; position:relative; top:0px; left:auto;} #office-img { text-align: center; margin: 0px 0px 15px 34px; } .office-img-margin { margin-left: 4px; } /* SUB-NAVIGATION -----------------------------------------*/ #nav-inside li ul { /* second-level lists */ margin: 0; padding: 0; width: 100px; position: relative; top:10px; left: 300px; line-height: 25px; height: auto; } #nav-inside li ul a { padding: 0 0 0 0; width: 100px; color: #36637e; text-indent: 0; line-height: 25px; height: auto; } #nav-inside a:hover ul, #nav-inside a.sfhover ul { /* lists nested under hovered list items */ left: auto; margin-left: 100px; display:block; visibility:visible; } #nav-inside a:hover ul a:hover, #nav-inside a.sfhover ul a:hover { /* lists nested under hovered list items */ color: #fff; background: #cad2ec;visibility:visible; } #nav li ul { /* second-level lists */ margin: 0; padding: 0; width: 100px; position: relative; line-height: 25px; height: auto; } #nav li ul a { padding: 0 0 0 0; width: 100px; color: #36637e; text-indent: 0; line-height: 25px; height: auto; } #nav a:hover ul, #nav a.sfhover ul { /* lists nested under hovered list items */ left: auto; margin-left: 100px; display:block; visibility:visible; } #nav a:hover ul a:hover, #nav a.sfhover ul a:hover { /* lists nested under hovered list items */ color: #fff; background: #cad2ec;visibility:visible; } /* -DROP DOWNS- */ .sub-menu { width:205px;position:relative} .sub-menu-item { width:200px; position:relative} #drop-down{ background:#dcecfb no-repeat 0px 0px; width:200px; position:absolute } #drop-down li a {background:#dcecfb no-repeat 0px 0px; margin-left:5px; width:200px; position:absolute } #drop-down li a:hover, #drop-down li a.sfhover {background:#dcecfb no-repeat 0px 0px; color:#000000; margin-left:5px; position:absolute } #drop-down2{ background:#dcecfb no-repeat 0px 0px; width:200px; } #drop-down2 li a {background:#dcecfb no-repeat 0px 0px; margin-left:5px; width:200px;} #drop-down2 li a:hover, #drop-down2 li a.sfhover {background:#dcecfb no-repeat 0px 0px; color:#000000; margin-left:5px;} #drop-down3{ background:#dcecfb no-repeat 0px 0px; } #drop-down3 li a {background:#dcecfb no-repeat 0px 0px; margin-left:5px; } #drop-down3 li a:hover, #drop-down3 li a.sfhover {background:#dcecfb no-repeat 0px 0px; color:#000000; margin-left:5px; } /* --- */ #white-for-life {list-style:none; list-style-type:none; text-indent:-999em; } #white-for-life li{ width:135; height:58px; list-style:none; list-style-type:none; line-height:12px; float:left} #white-for-life a, ul.white-for-life a {display: block; padding: 0; width: 135px; margin: 0; } #white-for-life li a{ background:url(../images/white-for-life.gif); width:135; height:48px; } #white-for-life li a:hover { background:url(../images/white-for-life.gif) 0 48px; width:135; height:48px;} #search {text-align:center; background-color:#ffffff; border:solid 2px #9693D9; width:150px; margin-left:50px; padding:5px 5px 5px 5px;} hr {width:237px;} #simplegallery{ //CSS for Simple Gallery Example 1 position: relative; /*keep this intact*/ visibility: hidden; /*keep this intact*/ border: 1px solid #445C84; z-index: 1; left:72px; }