/* Reset */
* {margin: 0 ; padding: 0;}

/* IE6 upgrade alert */
#alert {background-color: #fff; width: 430px; color: #333; font-size: 12px; font-weight: bold; padding: 15px 15px 0 15px; border: solid 2px #900; position: absolute; z-index: 5000; top: 10px; left: 10px;}
#alert a:hover {color: #00F;}
a.ie-alert-link {float: right;}
p.upgrade {width: 66px; display: block; text-align: center; float: left; margin: 0 10px 0 0; font-size: 10px;}

/* Layout */
body {background: #557089 url(../images/body-bg.jpg) repeat-x;}
#container {background: url(../images/container-bg.gif) repeat-y; width: 960px; margin-left: -480px; padding: 0; left: 50%; position: absolute;}
#banner {background: url(../images/banner-bg.gif); height: 218px;}
#content {margin: 0 0 0 267px; width: 648px; min-height: 480px; _height: 480px; clear: both;}
#address {margin: 20px 0 20px 20px;}
#nav-wrap {width: 202px; position: absolute; z-index: 100; top: 218px; left: 45px;}
#footer {background: url(../images/footer-bg.jpg) no-repeat; height: 175px; clear: both;}

.right {float: right; margin: 0 0 15px 15px;}
.left {float: left; margin: 0 15px 15px 0;}
.cr {clear: right;}
.cl {clear: left;}
.hide {display: none;}
.staff {padding: 25px 25px 0 25px; margin: 15px 0 0 0; border: solid 1px #93ab65; border-width: 1px 0 0 0; float: left;}

hr {height: 0; border: solid 1px #462712; border-width: 1px 0 0 0; margin: 10px 0; clear: both;}

/* Images */
img {border: none; outline: none;}
.photo {margin: 5px 0 15px 15px; border: solid 1px #462712; float: right; clear: right;}
.img-border {border: solid 1px #462712;}
.img-right {margin: 5px 0 15px 15px; float: right; clear: right;}
.img-left {margin: 5px 15px 15px 0; float: left; clear: left;}
.img-left-border {border: solid 1px #462712; margin: 5px 15px 15px 0; float: left; clear: left;}
.img-right-border {border: solid 1px #462712; margin: 5px 0 15px 15px; float: right; clear: right;}
.img-center-border {border: solid 1px #462712; margin: 10px auto; display: block;}

.layout {display: block;}
.callout {float: left;}
.review {margin-left: 20px;}
.logo {background-color: #fff; padding: 10px;}


 

/* Typo */
body {font-size: 100%; font-family: Verdana, Geneva, sans-serif;}
#container {font-size: .75em; line-height: 1.5em;}
#content {color: #462712; font-weight: normal;}
#address {color: #ede4c5; font-weight: normal;}
#footer, .text_nav {color: #ede4c5;}
.text_nav {text-align: right; margin: 73px 45px 0 0; float: right;}
.sub_nav {color: #462712; margin: 0 0 18px 0; padding: 0 0 15px 0; border: solid 1px #462712; border-width: 0 0 1px 0;}
p.sesame {margin: 0 45px 5px 0; padding: 0; float: right;}
p {margin: 0 0 18px 0;}
.lt-brown {color: #ab7827;}
.dk-brown {color: #462712;}
p.location {width: 35%; float: left; margin: 18px 20px 0 0;}

/* Links */
a {color: #557089; text-decoration: none; font-weight: bold;}
a:hover, .sub_nav a.active {text-decoration: underline;}
.sub_nav a {color: #557089;}
.sub_nav a.active {cursor: default;}
.text_nav a, p.sesame a {color: #ede4c5; text-decoration: none; font-weight: normal;}
.text_nav a:hover, p.sesame a:hover {text-decoration: underline;}
.top-link {clear: both;}

/* Headings */
h1, h1.jcir {font-size: 1.83em; font-weight: bold; margin: 0 0 20px 0; clear: both;}
h2 {font-size: 1.33em; font-weight: bold; margin: 0; color: #557089;}
h3 {font-size: 1.08em; margin: 0; font-weight: bold; color: #3f2500;}
h4 {font-size: 1em; color: #f1ead5; font-weight: normal; margin: 55px 0 5px 45px; padding: 0; width: 410px; float: left;}
h1.logo {background: url(../images/logo-chadwell.gif) no-repeat; width: 202px; height: 151px; margin: 23px 20px 0 45px; _margin-left: 22px; padding: 0;  text-indent: -999em; overflow: hidden; border: none; float: left;}
h1.logo a {width: 202px; height: 151px; display: block;}
h1.replaced {/* jcIR plugin wraps text in div named replaced and hides it */
	overflow: hidden; 
	text-indent: -999em; 
	background-repeat: no-repeat;
}

/* Flash */
.flash {width: 500px; margin: 10px auto;}
.notice {width: 80%; background: #e4e4e4; font-size: 1em; text-align: left; margin: 50px auto; padding: 10px; border: solid 1px #000; overflow: auto;}
.flash-replaced .alt {display: block; height: 0px; position: absolute; overflow: hidden; width: 0px;}
#flash-homepage {width: 693px; height: 198px; float: left; margin: 0;}

/* Video */
#video-in-ovation {width: 320px;}

/* Lists */
ul, ol {margin: 0 0 15px 30px;}

/* Side Navigation */
#nav ul {width: 202px; margin: 0; padding: 0; list-style: none;}
#nav li {margin: 0; height: 30px; padding: 0; list-style: none; display: inline;}
#nav li a {width: 202px; display: block; text-decoration: none; text-indent: -999em; overflow: hidden;}

#patient-login {background: url(../images/nav/patient-login.gif); height: 34px; margin-bottom: 10px; border-bottom: 1px solid #462712;}
#for-new-patients {background: url(../images/nav/for-new-patients.gif); height: 30px;}
#about-orthodontics {background: url(../images/nav/about-orthodontics.gif); height: 30px;}
#about-braces {background: url(../images/nav/about-braces.gif); height: 30px;}
#invisalign {background: url(../images/nav/invisalign.gif); height: 30px;}
#in-ovation {background: url(../images/nav/in-ovation.gif); height: 30px;}
#contact-us {background: url(../images/nav/contact-us.gif); height: 30px;}
#home {background: url(../images/nav/home.gif); height: 30px;}

#nav a:hover, #nav li.active a,
#nav li:hover #for-new-patients, #nav li.sfhover #for-new-patients,
#nav li:hover #about-orthodontics, #nav li.sfhover #about-orthodontics,
#nav li:hover #about-braces, #nav li.sfhover #about-braces,
#nav li:hover #invisalign, #nav li.sfhover #invisalign,
#nav li:hover #in-ovation, #nav li.sfhover #in-ovation,
#nav li:hover #contact-us, #nav li.sfhover #contact-us,
#nav li:hover #home, #nav li.sfhover #home {background-position: 0 -30px;}

#nav li:hover #patient-login, #nav li.sfhover #patient-login { background-position: 0 -34px; }

/* Drop Down */
#nav li ul {margin: 0; padding: 0; width: 202px; position: absolute; z-index: 3; left: -999em;}
#nav li:hover ul, #nav li.sfhover ul {left: auto; margin: -30px 0 0 202px;}
#nav li ul li {background: #462712; display: block; width: 202px; height: 28px; padding: 0; margin: 0;}
#nav li ul li a {padding: 5px 0 5px 10px; margin: 0; width: auto; height: 18px; display: block; text-indent: 0; font-size: 1em; font-weight: normal; color: #ede4c5; text-decoration: none;}
#nav li ul li a:hover {height: 18px; color: #c4e5ee;}
#nav li ul li.first {padding-top: 5px;}
#nav li ul li.last {padding-bottom: 5px;}

/* 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}



.clear {clear: both;}
.cf:after {content: "."; display: block; height: 0; clear: both; visibility: hidden;}
.cf {display: inline-block;} /*this trips hasLayout for ie7*/
.cf {display: block;} /*this returns it back to normal*/
* html .cf {height: 1px;}


/* Invisalign teen */
#sidebar {
background: #fff;
width: 275px;
margin: 0 0 15px 15px;
padding: 0;
border: solid 1px #000;
float: right;
clear: right;}
#sidebar a {
color: #036;}
#sidebar h3 {
background: #97AFC2;
margin: 0;
padding: 15px;
color: #fff;}
.thumb {
border: solid 1px #000;
margin: 0 10px 10px 0;
float: left;
clear: left;}
#sidebar p {
padding: 0 15px;
margin: 15px 0;}
.clear {clear: both;}