@charset "utf-8";
/* CSS Document */

.flash-replaced .alt {/*JQUERY STYLE - sets size of container to 0 to hide alternative content*/
 display: block;height: 0px;position: absolute;overflow: hidden;width: 0px;}

/* HTML, BODY ---------- */
* {margin:0; padding:0;}
body {margin:0; background: url(../images/tile.jpg) repeat-x #FFF; font-family: tahoma, serif, Arial; font-size:12px; line-height:20px; color:#000;}
p, h2, h3, ul, blockquote, ol {padding-bottom:10px; padding-top:10px;}
ul, blockquote, ol {padding-left:30px; padding-right:10px; padding-top:10px;}
a {color:#000; }
a:hover {text-decoration:none;}
a img {border-style:none;}
#footernav a {color:#dce6ed; }
/*#content a {font-style:normal;}*/

/* LAYOUT ---------- */
#wrap {width:798px;  background:url(../images/tile-body.jpg) repeat-y ; position:relative; margin:0 auto; min-height:279px; height:auto !important; height:279px;}
#body {width:798px; background:url(../images/bg-body.jpg) no-repeat;}
#bottom {width:798px; background:url(../images/bg-bottom.jpg) bottom no-repeat; padding-top:105px;}
#address {width:347px; margin:67px 0 10px 413px; font-size:11px; font-weight:bold; clear:both; text-align:right;}
#content {width:449px; margin:0 0 0 241px; padding-bottom:20px; min-height:440px; height:auto !important; height:440px;}
#text {width:449px; clear:both;}
#footerwrap {width:100%; background:url(../images/tile-footer.jpg) repeat-x #618ac5; clear:both; padding-bottom:20px; margin-top:20px;}
#footer {width:705px; margin:17px auto; padding:20px 93px 20px 0; line-height:20px;}
#beforeafter {width:100%;}

/* CALLOUTS ---------- */
#bannerinvisalign {position:absolute; z-index:50; top:591px; margin-left:38px; width:146px; height:73px;}
#bannercerec {position:absolute; z-index:51; top:672px; margin-left:38px; width:146px; height:29px;}
#bannerbritesmile {position:absolute; z-index:52; top:709px; margin-left:38px; width:146px; height:32px;}


/* HEADERS ---------- */
h1 {background-repeat: no-repeat; height: 44px; width:478px;  margin: 0; padding:0;}
h1.replaced {overflow: hidden; text-indent: -999em; background-repeat: no-repeat; background-position: 0 0}
h1.jcir {font-size: 25px;margin: 0;font-weight: normal;text-align: left; color:#000;  margin: 0; font-family:Georgia, "Times New Roman", Times, serif;}
#content h2 {color:#2d5f74; font-size:14px;}
#footer h2 {color:#FFF; font-size:11px; margin:0; padding:0;}

h1#logo {
margin: 0 0 0 362px;
padding: 0;
background-repeat: no-repeat; 
width: 406px;/* this width reflects the width of the logo image */
height: 86px; /* this height reflects the height of the heading image */
overflow: hidden; 
text-indent: -999em;} /* hides rich text so only background image shows */

h1#logo a {
display: block; 
height: 86px;/*same height as logo h1*/ 
width: 406px;/*same width as logo h1*/}

/* CLASSES ---------- */
#footer .sesame {color:#2d538b; font-size:11px; font-weight:bold;}
.img {border:#2d5f74 1px solid; }
.right {float:right; margin:15px 0 10px 10px;}
.left {float:left; margin:10px 10px 10px 0;}
p.breadcrumbs, .breadcrumbs a  {color:#2d5e72; font-size:11px; font-weight:bold;}
.hide {display:none;}
.block {display:block;}
.listnone {list-style:none;}
.marginnone {margin:0; padding:0;}
.center {text-align:center;}
.clear {clear:both;}
.clearright {clear:right;}
.flashhome {width:571px; height:249px; margin:0 0 19px 210px; clear:both;}
.sub {padding-top:20px;}


/* NAVIGATION MAIN ---------- */
ul#nav {list-style: none; padding: 0; margin:0 0 0 13px; width:197px; position:absolute; z-index:80; top:264px;}

/*  Sets styles for all links that are inside the ul id="nav" */
#nav a {display: block;height: 35px; overflow: hidden; text-indent:-999em; width:197px}
#nav li {float:left;}

/* Set the image for each nav item */
#aboutouroffice {background: url(../images/nav-about-our-office.jpg); }
#forthenewpatient {background: url(../images/nav-for-the-new-patient.jpg); }
#dentalservices {background: url(../images/nav-dental-services.jpg); }
#cosmeticdentistry {background: url(../images/nav-cosmetic-dentistry.jpg); }
#smilegallery {background: url(../images/nav-smile-gallery.jpg); }
#ourtechnology {background: url(../images/nav-our-technology.jpg); }
#patienteducation {background: url(../images/nav-patient-education.jpg); }
#home2 {background: url(../images/nav-home2.jpg); }
#contactus2 {background: url(../images/nav-contact-us2.jpg); }

/* Shift the image position up to show the active state */
#nav a:hover, #nav .active, #nav li:hover, #nav li.sfhover, 
#nav li:hover #aboutouroffice, #nav li.sfhover #aboutouroffice, 
#nav li:hover #forthenewpatient, #nav li.sfhover #forthenewpatient, 
#nav li:hover #dentalservices, #nav li.sfhover #dentalservices, 
#nav li:hover #cosmeticdentistry, #nav li.sfhover #cosmeticdentistry, 
#nav li:hover #smilegallery, #nav li.sfhover #smilegallery,
#nav li:hover #patienteducation, #nav li.sfhover #patienteducation,
#nav li:hover #home2, #nav li.sfhover #home2,
#nav li:hover #contactus2, #nav li.sfhover #contactus2,
#nav li:hover #ourtechnology, #nav li.sfhover #ourtechnology {background-position:-197px 0pt;}

/* Set the cursor to default arrow so link does not appear clickable */
#nav .active {cursor: default}

#nav, #nav ul {list-style: none; margin: 0; }
#nav li {display: inline; }
#nav li ul {background: #5b9cb2; left: -999em; padding: 0; position: absolute; z-index: 1; border:#79cae6 1px solid;}
#nav li:hover ul, #nav li.sfhover ul {left: auto; margin: -30px 0 0 167px; color:#FFF; }
#nav ul li a {height:auto; margin: 0; text-decoration: none; width: 187px; text-indent:0; color:#FFF; font-size:12px; padding:5px 10px 5px 10px;  font-weight:bold;}
#nav ul li a:hover {color:#194d5e; }

/* SUB MAIN ---------- */
#subnav {width:449px; padding-top:21px; clear:both;  margin-bottom:49px;}
#subnav h2 {color:#2d5e72; font-size:11px; text-transform:uppercase; margin:0; padding:0; }
#subnav ul, ul#subnav {list-style:none; margin:0; padding:0; font-size:12px; color:#2d5e72;  overflow:auto; white-space:nowrap;}
#subnav li {float:left; margin-top:0px; padding-top:0; line-height:17px;}
#subnav li a {color:#2d5e72; padding:0 12px 0 0; border-right:1px solid #2d5e72; margin-right:12px; font-size:12px; font-style:normal;}
#subnav ul li a:hover, #subnav .active {text-decoration:none;}
/* Set the cursor to default arrow so link does not appear clickable */
#subnav .active {cursor: default}

#subnav li a.noborder {border:none;}

/*SMILE GALLERY */
ul#smilegallerylist {list-style:none; margin:0; padding:0;}
#smilegallerylist .active {cursor:default; text-decoration:none; font-weight:bold;}

/* LOGINS NAV ITEMS ---------- */

ul#logins {height: 34px; width:256px; list-style: none; padding:0; margin:0 0 0 30px; position:absolute; z-index:90; top:0px;}

/*  Makes the list items sit next to each other */
#logins li {float: left;}

/*  Sets styles for all links that are inside the ul id="nav" */
#logins a {display: block;height: 34px; overflow: hidden; text-indent:-999em;}

/* Set the image for each nav item */
#contactus {background: url(../images/nav-contact-us.jpg); width:128px;}
#home {background: url(../images/nav-home.jpg); width:128px;}

/* Shift the image position up to show the active state */
#logins a:hover, #logins .active, #logins li:hover, #logins li.sfhover,
#nav li:hover #home, #nav li.sfhover #home, 
#nav li:hover #contactus, #nav li.sfhover #contactus {background-position:0 -34px;}

/* Set the cursor to default arrow so link does not appear clickable */
#logins .active {cursor: default}

#logins, #logins ul {list-style: none; margin: 0; }
#logins li {display: inline; }
#logins li ul li {float:none;}
#logins li ul {background: #5b9cb2; left: -999em; padding: 0; position: absolute; z-index: 1; border:#79cae6 1px solid;}
#logins li:hover ul, #logins li.sfhover ul {left: auto; margin: -10px 0 0 5px; color:#FFF; }
#logins ul li a {height:auto; margin: 0; text-decoration: none; width: 187px; text-indent:0; color:#FFF; font-size:12px; padding:5px 10px 5px 10px;  font-weight:bold;}
#logins ul li a:hover {color:#194d5e; }


/* SITEMAP */
ul#sitemap a {background:none; indent:none;}

/* FOOTERNAV */
ul#footernav a {background:none; indent:none; }
ul#footernav {float:left;width:100px;margin:0 59px 0 83px;padding:0 0 30px 0;  list-style:none; line-height:15px;}
#footernav li {margin:0; padding:0; list-style:none; text-align:right;  font-size:11px;}
#footernav ul {display:none;}

/* SESAME CONTENT */
#anatomy-of-a-tooth {background: url(../images/anatomy-of-a-tooth/anatomy-of-a-tooth-bg.gif); height: 525px; position: relative; width: 300px}
#anatomy-of-a-tooth a {cursor: help; display: block; position: absolute}
#anatomy-of-a-tooth a:hover {background: transparent}
a#bone {height: 20px; left: 30px; top: 380px; width: 40px}
a#cementum {height: 20px; left: 100px; top: 460px; width: 90px}
a#dentin {height: 20px; left: 80px; top: 165px; width: 60px}
a#enamel {height: 20px; left: 165px; top: 135px; width: 60px}
a#gingiva {height: 30px; left: 20px; top: 275px; width: 60px}
a#periodontal {height: 30px; left: 205px; top: 440px; width: 70px}
a#pulp {height: 30px; left: 125px; top: 220px; width: 50px}
a#print {cursor: pointer; height: 23px; left: 240px; top: 502px; width: 60px}
#anatomy-of-a-tooth a img {border: none; display: block; height: 0; position: absolute; width: 0}
#anatomy-of-a-tooth a:hover img {height: 98px; width: 300px}
a#bone:hover img {left: -30px; top: -380px}
a#cementum:hover img {left: -100px; top: -460px}
a#dentin:hover img {left: -80px; top: -165px}
a#enamel:hover img {left: -165px; top: -135px}
a#gingiva:hover img {left: -20px; top: -275px}
a#periodontal:hover img {left: -205px; top: -440px}
a#pulp:hover img {left: -125px; top: -220px}

/* Toggle List */
ul#toggle-content {margin: 0 0 15px 0; padding: 0; list-style: none;}