and add a bg image*/ .replace { letter-spacing : -1000em; line-height: 0; overflow: hidden; line-height: 0; background-repeat:no-repeat; text-indent: -999em;} /* Just for Opera, but hide from MacIE */ /*\*/html>body .replace { letter-spacing : normal; text-indent : -999em; overflow : hidden;} /* End of hack */ /* TEXT ---------- */ .maroon {color: #954556; font-weight:bold; margin-top:-17px;} .blue {color: #123672; } p{margin-bottom:10px;} /* HEADERS ---------- */ h1{font-size:14px; font-weight:bold;margin-bottom:15px; background-repeat: no-repeat; height: 26px; /* this height reflects the height of the heading image */ overflow: hidden; text-indent: -999em;} /* hides rich text so only background image shows */ h2 {font-size:12px; font-weight: bold; line-height:18px; color:#000000;margin-bottom:10px;} h2.larger{font-size:14px;} h3{font-size:12px; font-weight:bold;} /* LINKS ---------- */ a {text-decoration:none;} a:visited {text-decoration:none;} a:hover {text-decoration:underline;} #logo a {width: 369px; height: 94px; display: block;} #flower a{color:#525252;} #flower a:visited {color:#5252525;} #flower a:hover {color:#5252525;} #flower2 a{color:#525252;} #flower a:visited {color:#5252525;} #flower a:hover {color:#5252525;} #footer a{ color:#fff;} #footer a:visited {color:#fff;} #footer a:hover {color:#fff;} /* TOPNAV NAVIGATION ---------- */ topnav, #topnav ul {top:0; left:0;width: auto; height: auto; list-style: none; position: relative; z-index: 1;} #topnav li {display:block;} /* Sets styles for all links that are inside the ul id="topnav" */ #topnav a {display: block; overflow: hidden; text-indent: -999em; /*Indents the rich-text so it does not show */ } /* Set the image for each nav item */ #patient-login {background: url(images/patient-login.gif); width:104px; height:27px;} #doctor-login {background: url(images/doctor-login.gif); width:104px; height:27px;} #home {background: url(images/home.gif); width:104px; height:35px;} /* Shift the image position up to show the active state */ #topnav li a:hover, #topnav li a.active {background-position: -104px 0;} /* Set cursor to default arrow so link does not appear clickable */ #topnav .active {cursor: default} /* NAVIGATION ---------- */ #nav {width: 764px; position: absolute; top: 130px; left: 50%; margin-left: -389px; z-index: 100;} #nav ul {width: 764px; height: 26px; list-style: none; padding:0; margin: 0;} #nav li {float: left; display:inline;} /* Sets styles for all links that are inside the ul id="nav" */ #nav a {height: 26px; display: block; overflow: hidden; text-indent: -999em; /*Indents the rich-text so it does not show */ } /* Shift the image position up to show the active state */ #nav ul li:hover a, #nav ul li.sfhover a, #nav ul li a.active {background-position: 0 -26px;} /* Set the image for each nav item */ #our-office {background: url(images/our-office.gif) 0 0; width:144px;} #about-ortho {background: url(images/about-ortho.gif) 0 0; width:155px;} #braces-101 {background: url(images/braces-101.gif) 0 0; width:113px;} #emergency-care {background: url(images/emergency-care.gif) 0 0; width:141px;} #fun-and-games {background: url(images/fun-and-games.gif) 0 0; width:110px;} #contact {background: url(images/contact.gif) 0 0; width:85px;} /* Set cursor to default arrow so link does not appear clickable */ #nav .active {cursor: default} /* DROP DOWNS -----------*/ #nav li ul { /* second-level lists */margin: 0; padding: 0; width: 155px; position: absolute; left: -999em; line-height: 30px; font-size: 12px; text-align: left; height: auto; background: #954556; color:#fff; z-index: 100;} #nav li ul a {padding: 0px 0px 0px 10px; width: 145px; color: #fff; background:6b2836; text-indent: 0; text-decoration: none; line-height: 30px; height: auto;} #nav li:hover ul, #nav li.sfhover ul { /* lists nested under hovered list items */ left: auto; display:block; z-index: 100;} #nav li:hover ul a:hover, #nav li.sfhover ul a:hover { /* lists nested under hovered list items */ color: #fff; background: #6b2836;} /* SUB-NAVIGATION -----------*/ #subnavcontainer {width: 600px; height:50px; margin:28px 0 10px 10px;} #subnav {width:415px; color:#fff;} #subnav li {display:inline; list-style:none; text-indent:none; white-space:nowrap;} #subnav li a {color:#fff; padding: 0 4px 0 5px; border-left: 1px solid #fff; white-space:nowrap;} #subnav li a:visited {color:#fff;} #subnav li:hover a, #subnav li a.active {color:#fff; font-weight:bold; text-decoration:none;} #subnav li.first a{padding-left:0; border-left:none;} .subnavstyles {text-align:left;} /* IMAGES ---------- */ img {border: none;} /*--------------------------------- Image Replacement ---------------------------------*/ #logo a {background: url(images/logo.gif) 0 0 no-repeat;} /* LAYOUT ---------- */ #container {width:794px; text-align:left; margin: 0 auto -140px; /* the bottom margin is the negative value of the footer's height */ min-height: 100%; height: auto;!important height: 100%;} #header {width:794px; height: 156px;} #logo { position:absolute; margin: 20px 0px 0px 14px; width:369px; height: 94px;} #topnav{position:absolute; margin:0px 0px 0px 638px; text-align:center;} #title {height: 26px; width: 100px; margin:0;} #flash-home {z-index:-1;} #spotlight {width:764px; height:137px; margin:0;} #spotlight.home {height:244px; margin:0;} #content {color: #000000; width: 794px; height: auto; margin:0 0 14px 0;} #maintext {float:left; width:454px; min-height:200px; _height:200px; padding-left:8px; } #maintext ul{margin-bottom:10px;} #maintext li{list-style:disc outside none; margin-left:15px;} #maintext a{color:#954556;text-decoration:none;} #maintext a:visited{color:#954556;text-decoration:none;} #maintext a:hover{color:#954556;text-decoration:underline;} #flower {position:absolute; top:230px; left:50%; background-image:url(images/flower.gif); background-repeat:no-repeat; width: 161px; height:134px; margin:75px 0 0 75px; padding: 320px 0 0 160px; text-align: center; font-size:10px; color:#525252; line-height:12px; z-index:5;} #flower2 {position:absolute; top:90px; left:50%; background-image:url(images/flower2.gif); background-repeat:no-repeat; width: 236px; height:154px; margin:75px 0 0 95px; padding: 340px 0 0 85px; text-align: center; font-size:10px; color:#525252; line-height:12px; z-index:0;} #forms{position: absolute; top: 0; left:50%; width:185px; height:auto; margin: 630px 0 0 162px; padding: 3px 3px 0 8px;background-color:#c4c4c4; border: 3px solid #954556;} #footer {margin-top:20px; padding-top: 15px; width: 100%; height: 140px; text-align: center; color: #ffffff; background-image:url(images/footer-bg.gif); background-repeat:repeat-x; background-color:#283057;} #footer li {display:inline; list-style:none; text-indent:none;} #footer li a {color:#fff; padding: 0 4px 0 5px; border-left: 1px solid #fff;} #footer li a:visited {color:#fff;} #footer li:hover a, #footer li a.active {color:#fff; text-decoration:underline;} #footer li.first a{padding-left:0; border-left:none;} .push {height: 140px;} .clear{clear:both;} /*----------------------------- Shortcuts -----------------------------*/ /* Image Replacement -- add class="replace" to root element, i.e.
and add a bg image*/ .replace { letter-spacing : -1000em; line-height: 0; overflow: hidden; line-height: 0; text-indent: -999em; } /* Just for Opera, but hide from MacIE */ /*\*/html>body .replace { letter-spacing : normal; text-indent : -999em; overflow : hidden; } /* End of hack */ /* MEET DR VOSSERS ---------- */ .dr {float:left; border:1px solid #954556; margin: 0 20px 10px 0;} /* MEET THE TEAM ---------- */ .team {float:left; border:1px solid #954556; margin: 0 10px 0 0;} .names {text-align:center; width: 200px; margin:10px 10px 20px 0; float:left;} /* HELPFUL LINKS ---------- */ dl.logos, dl.logos dt, dl.logos dd {list-style:none;margin:0;padding:0;} dl.logos {margin-bottom: 10px;padding:10px;} dl.logos dd {margin-left:-5px;padding:10px 0 5px 0;width:50%;} dl.logos span {font-size: 17px; font-weight:bold;} /* THE GAME ROOM ---------- */ #sesame-game {background: #000;line-height: 0;margin: 10px auto;text-align: center;width: 400px} ul#sesame-games {list-style: none;margin: 0;padding: 0} ul#sesame-games li {clear: both;display: block} ul#sesame-games img {border: 0;margin: 0 0 10px 10px} ul#sesame-games a.button {float:right;height:85px;width:200px} ul#sesame-games p {padding-bottom: 1em} /* CONTACT US ---------- */ .map{border: 1px solid #954556;} /* SITE MAP ---------- */ .column{float:left; width:200px; margin-right: 10px;}