@charset "utf-8";
/* CSS Document */
/* CSS Document */
/* HTML, BODY ---------- */
* {margin:0; padding:0;}
body {margin:0; background: url(images/tile.jpg) repeat-x #345894; font-family:tahoma, serif, Arial; font-size:12px;  color:#0d264f;}
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:#0d264f;}
a:hover {text-decoration:none;}
a img {border-style:none;}
#footer a {color:#849fcc;}
input {margin-right:5px;}

/* LAYOUT ---------- */
#wrapfull {width:100%; background:url(images/bg-wrapfull.jpg) no-repeat center top;}
#wrap {background:url(images/tile-body.jpg) repeat-y; width:780px; margin:0 auto; position:relative;}
#body {background:url(images/bg-body.jpg) no-repeat; width:780px; min-height:716px; height:auto !important; height:716px;}
#address {margin:0 0 10px 48px; width:528px; font-size:11px; line-height:18px; color:#9eb3d5; padding-top:6px;}
#content {width:511px; clear:both; margin:20px 0 0 208px; padding:0;}
#patientforms {float:right; clear:right; width:260px; border:2px solid #FFF; background:#84ac99; padding: 10px; margin:10px 10px 10px 50px;}
#footer {width:642px; background:url(images/bg-footer.jpg) no-repeat #345894;  text-align:right; color:#849fcc; line-height:16px; font-size:11px; padding:23px 85px 20px 53px;}
#bannerinvisalign {position:absolute; z-index:20; top:669px; margin-left:16px;}
#banneraao {position:absolute; z-index:21; top:752px; margin-left:16px;}


/* HEADERS ---------- */
h1 {background-repeat: no-repeat; height: 40px; width:432px; text-indent: -999em; margin: 0; padding:0;}
#footer h2 {font-size:11px; font-weight:normal; text-align:center; color:#a2a2a2; margin:0px 0 20px 158px;}
#content h2 {color:#6db390; font-size:16px; text-transform:uppercase;}

h1#logo {
margin: 0 0 0 48px;
padding: 0;
background-repeat: no-repeat; 
width: 528px;/* this width reflects the width of the logo image */
height: 130px; /* 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: 1306px;/*same height as logo h1*/ 
width: 528px;/*same width as logo h1*/}

/* CLASSES ---------- */
#footer .sesame {color:#FFF;}
.img {margin:0 0 0 5px; width:755px; height:169px; clear:both;}
.right {float:right;}
.left {float:left;}
.hide {display:none;}
.flash {margin:0 0 0 5px; width:765px; height:169px; clear:both;}
.flashp {color:#000; background-image: url(images/1.jpg); text-align:center; padding-bottom:110px; width:750px;}
.block {display:block;}
.listnone {list-style:none;}
.center {text-align:center;}
.clear {clear:both;}
.resources {border:1px solid #187654;}
p.breadcrumbs, .breadcrumbs a {font-size:11px; font-weight:bold; color:#5ba56f; padding-top:40px;}
.green {color:#bedb99;}
.homelists {margin:0 15px 30px 0; padding:0; list-style:none; float:left;}
.contenthome {line-height:17px;}
.contentsub {line-height:20px;}

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


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

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

/* Set the image for each nav item */
#fornewpatients {background: url(images/nav-for-new-patients.gif); }
#yourfirstvisit {background: url(images/nav-your-first-visit.gif); }
#aboutorthodontics {background: url(images/nav-about-orthodontics.gif); }
#braces101 {background: url(images/nav-braces-101.gif); }
#emergencycare {background: url(images/nav-emergency-care.gif); }
#asktheorthodontist {background: url(images/nav-ask-the-orthodontist.gif); }
#treatmentoptions {background: url(images/nav-treatment-options.gif); }
#funandgames {background: url(images/nav-fun-and-games.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 #fornewpatients, #nav li.sfhover #fornewpatients, 
#nav li:hover #yourfirstvisit, #nav li.sfhover #yourfirstvisit, 
#nav li:hover #aboutorthodontics, #nav li.sfhover #aboutorthodontics, 
#nav li:hover #braces101, #nav li.sfhover #braces101, 
#nav li:hover #emergencycare, #nav li.sfhover #emergencycare, 
#nav li:hover #funandgames, #nav li.sfhover #funandgames,
#nav li:hover #treatmentoptions, #nav li.sfhover #treatmentoptions, 
#nav li:hover #asktheorthodontist, #nav li.sfhover #asktheorthodontist, 
#nav li:hover #home, #nav li.sfhover #home, 
#nav li:hover #contactus, #nav li.sfhover #contactus {background-position:-175px 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: #187654; left: -999em; padding:0; position: absolute; z-index: 1; }
#nav li:hover ul, #nav li.sfhover ul {left: auto; margin: -27px 0 0 164px; color:#FFF;}
#nav ul li a {height:auto; margin: 0; text-decoration: none; width: 167px; text-indent:0; color:#FFF; font-size:11px; padding:3px 10px;}
#nav ul li a:hover {background:#9aca8d;}

ul#sitemap {list-style:circle; }
#sitemap a {text-indent:none; overflow:auto; background:none;}

ul#staff {list-style:none; width:400px; margin: 0 auto; text-align:center;}
#staff li {margin-right:4px; margin-bottom:4px; float:left;}
#staff img {border:1px solid #187654;}


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

ul#logins {height: 20px; width:148px; list-style: none; padding:0; margin:0 0 0 631px; position:absolute; z-index:90; top:43px;}


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

/* Set the image for each nav item */
#patientlogin {background: url(images/nav-patient-login.gif);}

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

div#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}