@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:#cac38f; font-family: Verdana, Arial, Helvetica, sans-serif; font-size:13px; line-height:20px; }
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:#cd6221; }
p.breadcrumbs, .breadcrumbs a {font-size:12px; font-weight:bold; color:#cd6221; clear:both;}


/* LAYOUT ---------- */
#wrap {width:990px; background:url(../images/bg-body.jpg) no-repeat; margin:0 auto; position:relative;}
#body {width:990px; background:url(../images/bg-bottom-2.jpg) no-repeat bottom right; min-height:870px; height:auto !important; height:750px;}
#address { text-align:right;  padding:20px 7px 0 0; font-size:12px;}
#content {/*clear:right;*/ width:567px;  margin-left:313px; text-align:justify; padding-bottom:20px; padding-top:50px; }
#footer {clear:both; background:url(../images/bg-footer.jpg) no-repeat; width:891px; margin:0 auto; padding:48px 99px 20px 0;}


/* BANNERS ---------- */
#callout-social-icons {position:absolute; z-index:3; top:601px; margin-left:36px; }
#callout-invisalign {position:absolute; z-index:3; top:671px; margin-left:60px; }
#callout-consultation {position:absolute; z-index:4; top:852px; margin-left:0px; }
#callout-damon {position:absolute; z-index:5; top:1025px; margin-left:0px; }
#callout-aao {position:absolute; z-index:6; top:1078px; margin-left:0px; }

/* HEADERS ---------- */

h1 {background-repeat: no-repeat; height: 84px; width:290px; text-indent: -999em; margin: 0; padding:0; background-position: bottom;}
h1.replaced {overflow: hidden; text-indent: -999em; background-repeat: no-repeat; background-position: 0 0}
h1.jcir {font-size: 35px; margin: 0; }
.ph {color:#8b8144; font-family:Tahoma, Geneva, sans-serif; font-size:18px; font-weight:bold; float:right; padding:5px 0px 0px 0; height:25px}

h1#logo {float:left;
margin: 0;
padding: 0;
background-repeat: no-repeat; 
width: 248px;/* this width reflects the width of the logo image */
height: 254px; /* 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: 254px;/*same height as logo h1*/ 
width: 248px;/*same width as logo h1*/}

#content h2 {color:#cd6221; font-size:17px; margin-bottom:0px; padding-bottom:0px; padding-top:20px; text-align:left;}
#content h3 {color:#664228; font-size:14px; margin-bottom:0px; padding-bottom:0px;}
#footer h2 {color:#5b4e17; font-size:12px; line-height:18px; margin-top:0; padding-top:0;}


/* CLASSES ---------- */
#footer .sesame {color:#ede6c6; font-weight:bold; font-size:11px;}
.img {float:right; margin-top:-20px; padding-left:5px;}
.right {float:right;}
.left {float:left;}
.imgleft {float:left; margin:0 20px 10px 0;}
.imgright {float:right; margin:0 0 10px 10px;}
.hide {display:none;}
.flashhome {width:672px; height:313px;  margin:35px 0 20px 248px;clear:right; overflow:hidden;}
.block {display:block;}
.listnone {list-style:none;}
.center {text-align:center;}
.clear {clear:both;}
.marginnone {margin:0; padding:0;}
.resources {padding:7px; background:#FFF; border:1px solid #cd6221;}
.brown {color:#664228;}
.welcome {margin-top:-50px;}
.specialmargin {margin-top:-30px;}
ol.speciallist li {font-weight:bold;}
.speciallist li p {font-weight:normal; padding-bottom:30px;}

/* NAVIGATION ---------- */


/* NAVIGATION MAIN ---------- */
ul#nav {list-style: none; padding: 0; margin:0 0 0 23px; width:209px; position:absolute; z-index:240; top:337px;}

/*  Sets styles for all links that are inside the ul id="nav" */
#nav a {display: block;height: 27px; overflow: hidden; text-indent:-999em; width:209px}

/* Set the image for each nav item */
#aboutouroffice {background: url(../images/nav-about-our-office.gif); }
#fornewpatients {background: url(../images/nav-for-new-patients.gif); }
#home {background: url(../images/nav-home.gif); }
#aboutorthodontics {background: url(../images/nav-about-orthodontics.gif); }
#aboutbraces {background: url(../images/nav-about-braces.gif); }
#treatmentoptions {background: url(../images/nav-treatment-options.gif); }
#invisalign {background: url(../images/nav-invisalign.gif); }
#emergencycare {background: url(../images/nav-emergency-care.gif); }
#contactus {background: url(../images/nav-contact-us.gif); }

/* 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 #fornewpatients, #nav li.sfhover #fornewpatients, 
#nav li:hover #home, #nav li.sfhover #home, 
#nav li:hover #aboutorthodontics, #nav li.sfhover #aboutorthodontics, 
#nav li:hover #aboutbraces, #nav li.sfhover #aboutbraces, 
#nav li:hover #treatmentoptions, #nav li.sfhover #treatmentoptions, 
#nav li:hover #invisalign, #nav li.sfhover #invisalign, 
#nav li:hover #emergencycare, #nav li.sfhover #emergencycare, 
#nav li:hover #contactus, #nav li.sfhover #contactus {background-position:-209px 0px;}

/* 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: #c49548; left: -999em; padding: 3px 0; position: absolute; z-index: 1; filter:alpha(opacity=85);	-moz-opacity:0.85;	-khtml-opacity: 0.85;	opacity: 0.85; border:1px solid #674429;}
#nav li ul li {float:none;}
#nav li:hover ul, #nav li.sfhover ul {left: auto; margin: -27px 0 0 189px; color:#000; }
#nav ul li a {height:auto; margin: 0; text-decoration: none; width: 180px; text-indent:0; color:#000; font-size:12px; padding:1px 10px 1px 10px;  }
#nav ul li a:hover {color:#FFF; }


/* NAVIGATION LOGINS ---------- */
ul#logins {list-style: none; padding: 0; margin:0 0 0 920px; width:70px; position:absolute; z-index:69; top:117px;}

/*  Sets styles for all links that are inside the ul id="nav" */
#logins a {display: block; overflow: hidden; text-indent:-999em; width:70px}

/* Set the image for each nav item */
#doctorlogin {background: url(../images/nav-doctor-login.jpg); height:153px;}
#patientlogin {background: url(../images/nav-patient-login.jpg); height:146px;}


/* Shift the image position up to show the active state */
#logins a:hover, #logins .active, #nav li:hover, #logins li.sfhover, 
#logins li:hover #patientlogin, #logins li.sfhover #patientlogin, 
#logins li:hover #doctorlogin, #logins li.sfhover #doctorlogin {background-position:-70px 0px ;}

/* Set the cursor to default arrow so link does not appear clickable */
#logins .active {cursor: default}



/* SITE MAP NAV */
ul#sitemap {list-style:circle;}
#sitemap li a {background:none; text-decoration:underline}
#sitemap li a:hover {text-decoration:none;}

/* FOOTER NAV */
ul#footernav {list-style:none; padding:0 128px 40px 0; margin:0; float:left; width:191px; text-align:right; margin-top:-40px}
ul#footernav li ul {display:none; margin:0; padding:0;}
#footernav li a {background:none; text-decoration:underline}
#footernav li a:hover {text-decoration:none;}
#footernav li {line-height:13px; height:auto; text-transform:lowercase;}

/* The Game Room */
div#sesame-game {background: #000; line-height: 0; margin: 10px auto 30px auto; text-align: center; width: 400px}
ul#sesame-games {list-style: none; margin: 0 18px 0 0; padding: 0}
ul#sesame-games li {clear: both; display: block}
ul#sesame-games img {border: 0; float: right; margin: 0 0 10px 10px}
ul#sesame-games a.button {float:right; height:85px; width:200px}
ul#sesame-games p { padding-bottom: 1em}

.left {
float:left;
margin:0 10px 10px 0;}
img.right {
float:right;
margin:0 0 10px 10px;}
.clear {
clear:both;}
#damon-bracket {
display:block;
margin:0 auto 10px auto;}
#damon-wrap {
width:400px;
margin:0 auto;}
#damon-left {
float:left;
width:175px;
margin-right:20px;}
#damon-right {
float:left;
width:170px;}
#flash-damon-system-comparison {
margin:0 auto;
width:250px;}
#video-the-damon-system {
margin: 23px 15px 15px 0;
width: 240px;
height: 206px;
float: left;
clear: left;}
#video-the-damon-system-2 {
margin: 0 15px 15px 0;
width: 400px;
height: 330px;
float: left;
clear: left;}

.flash-replaced .alt {
display: block;
width: 0px;
height: 0px;
position: absolute;
overflow: hidden;}