/* CSS Document */

/* HTML, BODY ---------- */
* {margin:0; padding:0;}
body {margin:0; background:#becab2; font-family: Arial, Helvetica, sans-serif; font-size:12px; line-height:20px; color:#5b3c20;}
p, h2, h3, ul, blockquote {padding-bottom:20px;}
ul, blockquote, ol {padding-left:30px; padding-right:20px;}
a {color:#5b3c20;}
a:hover {text-decoration:none;}
a img {border-style:none;}
#footer a {color:#6a9bca;}
#footer p {padding:0; margin:0;}

/* LAYOUT ---------- */
#wrap {margin:0 auto; width:802px; background:url(images/tile-body.jpg) repeat-y;}
#body {margin:0 auto; width:802px; min-height:655px; height:auto !important; height:655px;}
#address {float:right; width:196px; padding:45px 34px 0 0; text-align:right;}
#content { margin:0; clear:both;}
#forms {padding:10px; background-color:#FFF; border:3px solid #5b3c20;	width:180px; margin: 10px 0 10px 10px; float:right; color:#5b3c20; clear:right;}
#forms h3, #forms a {color:#a6aa62;}
#footer {width:758px; margin:0 auto; background:url(images/bg-footer.jpg) no-repeat; padding:57px 0 20px 44px; font-size:12px; line-height:17px; min-height:198px; height:auto !important; height:198px;}
#col1 {float:left; width:186px; padding:0; color:#fcfcf9;}
#col2 {float:left; width:480px; padding:0 0 0 46px; color:#6a9bca;}

/* HEADERS ---------- */
h1 {background-repeat: no-repeat; height: 60px; width:482px; text-indent: -999em; margin: 0; padding:0;}
h2 {font-size:14px; color:#a6aa62;}
h3 {font-size:12px;}
#col1 h2 {font-size:12px; font-weight:normal; color:#fcfcf9;}
h1#logo {
margin: 0;
padding: 14px 0 0 44px;
background-repeat: no-repeat; 
width: 179px;/* this width reflects the width of the logo image */
height: 253px; /* this height reflects the height of the heading image */
overflow: hidden; 
text-indent: -999em; float:left;} /* hides rich text so only background image shows */

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

/* CLASSES ---------- */
.sub {background:url(images/bg-body-sub.jpg) no-repeat;}
.home {background: url(images/bg-body-home.jpg) no-repeat;}
#footer .sesame {color:#a6c7e7; font-weight:bold;}
.img {margin:0 0 10px 30px; float:right;}
.right {float:right;}
.top  {color:#e4a732; font-size:11px; font-weight:bold;}
.hide {display:none;}
.flash {z-index: 100;}
.flashp {color:#000; background-image: url(images/1.jpg); text-align:center;}
.block {display:block;}
.listnone {list-style:none;}
.center {text-align:center;}
.bannerrefer {position:absolute; top:549px; margin:0 0 0 27px; z-index:202;}

#banner-xbow {position:absolute; top:689px; margin:0 0 0 27px; z-index:202;}

.names {color:#FFF;}
.contentpaddinghome {padding:217px 41px 20px 276px; width:485px;}
.contentpaddingsub {padding:15px 39px 20px 276px; width:487px;}
.resources {border:3px #5b3c20 solid;}
.clear {clear:both;}
iframe.map {border: 0; overflow: auto; width: 300px; height: 300px; border: 2px solid #5b3c20;}

/* NAVIGATION ---------- */


/* NAVIGATION MAIN ---------- */
ul#nav {list-style: none; padding: 0; position:absolute; top:281px; margin:0 0 0 27px; width:205px; z-index:99;}

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

/* Set the image for each nav item */
#ouroffice {background: url(images/nav-our-office.gif); }
#newpatients {background: url(images/nav-new-patients.gif); }
#aboutorthodontics {background: url(images/nav-about-orthodontics.gif); }
#aboutbraces {background: url(images/nav-about-braces.gif); }
#emergencycare {background: url(images/nav-emergency-care.gif); }
#treatmentoptions {background: url(images/nav-treatment-options.gif); }
#contactus {background: url(images/nav-contact-us.gif); }
#home {background: url(images/nav-home.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 #newpatients, #nav li.sfhover #newpatients, 
#nav li:hover #ouroffice, #nav li.sfhover #ouroffice, 
#nav li:hover #aboutorthodontics, #nav li.sfhover #aboutorthodontics, 
#nav li:hover #aboutbraces, #nav li.sfhover #aboutbraces, 
#nav li:hover #emergencycare, #nav li.sfhover #emergencycare, 
#nav li:hover #treatmentoptions, #nav li.sfhover #treatmentoptions, 
#nav li:hover #home, #nav li.sfhover #home, 
#nav li:hover #contactus, #nav li.sfhover #contactus {background-position:-205px 0pt;}

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

/* NAVIGATION SUB ---------- */
ul#sub {list-style: none; padding: 0; margin:0; width:205px;}

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

/* Set the image for each nav item */
#meettheorthodontist {background: url(images/nav-meet-the-orthodontist.gif); }
#meettheteam {background: url(images/nav-meet-the-team.gif); }
#officetour {background: url(images/nav-office-tour.gif); }
#orthodonticsforchildren {background: url(images/nav-orthodontics-for-children.gif); }
#twophasetreatment {background: url(images/nav-two-phase-treatment.gif); }
#orthodonticsforadults {background: url(images/nav-orthodontics-for-adults.gif); }
#dentofacialorthopedics {background: url(images/nav-dentofacial-orthopedics.gif); }
#tmjtmd {background: url(images/nav-tmj-tmd.gif); }
#orthodictionary {background: url(images/nav-ortho-dictionary.gif); }
#faq {background: url(images/nav-ask-the-orthodontist.gif); }
#resources {background: url(images/nav-resources.gif); }
#typesofbraces {background: url(images/nav-types-of-braces.gif); }
#typesofappliances {background: url(images/nav-types-of-appliances.gif); }
#palatalexpander {background: url(images/nav-palatal-expander.gif); }
#bracesdiagram {background: url(images/nav-braces-diagram.gif); }
#bracepainter {background: url(images/nav-brace-painter.gif); }
#oralcarevideo {background: url(images/nav-oral-care-video.gif); }
#retainers {background: url(images/nav-retainers.gif); }
#orthodontictreatments {background: url(images/nav-orthodontic-treatments.gif); }
#surgicalorthodontics {background: url(images/nav-surgical-orthodontics.gif); }
#invisalign {background: url(images/nav-invisalign.gif); }
#xbow {background: url(images/nav-xbow.gif);}
#location {background: url(images/nav-location.gif); }
#commentform {background: url(images/nav-comment-form.gif); }
#referafriend {background: url(images/nav-refer-a-friend.gif); }
#whybraces {background: url(images/nav-why-braces.gif); }
#lifewithbraces {background: url(images/nav-life-with-braces.gif); }
#beforeandafter {background: url(images/nav-before-and-after.gif); }
#fornewpatients {background: url(images/nav-for-new-patients.gif); }
#testimonials {background: url(images/nav-testimonials.gif); }


/* Shift the image position up to show the active state */
#sub a:hover, #sub .active, #sub li:hover, #sub li.sfhover, 
#sub li:hover #meettheorthodontist, #sub li.sfhover #meettheorthodontist, 
#sub li:hover #meettheteam, #sub li.sfhover #meettheteam, 
#sub li:hover #officetour, #sub li.sfhover #officetour, 
#sub li:hover #orthodonticsforchildren, #sub li.sfhover #orthodonticsforchildren, 
#sub li:hover #twophasetreatment, #sub li.sfhover #twophasetreatment, 
#sub li:hover #tmjtmd, #sub li.sfhover #tmjtmd, 
#sub li:hover #whybraces, #sub li.sfhover #whybraces, 
#sub li:hover #lifewithbraces, #sub li.sfhover #lifewithbraces, 
#sub li:hover #orthodictionary, #sub li.sfhover #orthodictionary, 
#sub li:hover #faq, #sub li.sfhover #faq, 
#sub li:hover #resources, #sub li.sfhover #resources, 
#sub li:hover #typesofbraces, #sub li.sfhover #typesofbraces, 
#sub li:hover #typesofappliances, #sub li.sfhover #typesofappliances, 
#sub li:hover #palatalexpander, #sub li.sfhover #palatalexpander, 
#sub li:hover #bracesdiagram, #sub li.sfhover #bracesdiagram, 
#sub li:hover #bracepainter, #sub li.sfhover #bracepainter, 
#sub li:hover #oralcarevideo, #sub li.sfhover #oralcarevideo, 
#sub li:hover #beforeandafter, #sub li.sfhover #beforeandafter, 
#sub li:hover #retainers, #sub li.sfhover #retainers, 
#sub li:hover #orthodontictreatments, #sub li.sfhover #orthodontictreatments, 
#sub li:hover #surgicalorthodontics, #sub li.sfhover #surgicalorthodontics, 
#sub li:hover #invisalign, #sub li.sfhover #invisalign, 
#sub li:hover #location, #sub li.sfhover #location, 
#sub li:hover #commentform, #sub li.sfhover #commentform, 
#sub li:hover #referafriend, #sub li.sfhover #referafriend, 
#sub li:hover #dentofacialorthopedics, #sub li.sfhover #dentofacialorthopedics,
#sub li:hover #fornewpatients, #sub li.sfhover #fornewpatients,
#sub li:hover #testimonials, #sub li.sfhover #testimonials
 {background-position:-205px 0pt;}

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





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

ul#logins {height: 39px; width:353px; list-style: none; padding:0; margin:0 0 0 429px; position:absolute; top:0; z-index:100; }

/*  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: 39px; overflow: hidden; text-indent:-999em;}

/* Set the image for each nav item */
#patientlogin {background: url(images/nav-patient-login.jpg);width:173px;}
#doctorlogin {background: url(images/nav-doctor-login.jpg);width:180px;}

/* Shift the image position up to show the active state */
#logins a:hover, #logins .active, #logins li:hover, #logins li.sfhover {background-position:0 -39px;}
/* Set the cursor to default arrow so link does not appear clickable */
#logins .active {cursor: default}