/* Layout */
body {background: #f2fcff url(images/body-bg.jpg) repeat-x top center; margin: 0; text-align: center;}
#container {width: 740px; margin: 0 auto; text-align: left; position: relative;}
#header {background: url(images/header-bg.jpg);}
#wrap {background: #dbd6b3 url(images/content-bg.jpg) no-repeat; width: 740px; min-height: 650px; margin: 0; padding: 31px 0 0 0;}
* html #wrap {height: 650px;}
#content-wrap {width: 539px; margin: 0 0 0 182px; padding: 0;}
#content {width: 509px; margin: 21px 15px 0 15px; padding: 0;}
#footer {background: #f2fcff url(images/footer-bg.jpg) no-repeat; padding: 40px 0 20px 0; margin: 0; clear: both; text-align: center;}
.sidebar {background: #fff; width: 105px; display: block; text-align: center; border: solid 1px #558d9b; float: right; margin: 5px 0 15px 15px; padding: 5px;}

.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;}

/* Flash */
.flash {margin: 0 auto;}
#flash-common-treatments, #flash-types-of-braces, #flash-braces-diagram, #flash-brace-painter {width: 500px;}
p.upgrade {width: 60%; background: #e4e4e4; font-size: 10px; text-align: left; margin: 20px auto; padding: 5px; border: solid 1px #000; overflow: auto;}

/* QT 360 Tours */
.qt {width: 400px; margin: 10px auto; padding: 0; border: solid 1px #558d9b;}

/* Text */
body, table {font: 12px/18px Verdana, Arial, Helvetica, sans-serif; color: #11343e;}
p {margin: 0 0 10px 0;}
.center {text-align: center;}
#footer, #footer a {font-size: 10px; line-height: normal;}

/* Links */
a {color: #11343e; text-decoration: underline;}
a:hover {color: #035692;}

/* Images */
img {border: 0; display: block;}
.img_left_border {border: solid 1px #558d9b; margin: 5px 15px 15px 0; float: left; clear: left;}
.img_right_border {border: solid 1px #558d9b; margin: 10px 0 15px 15px; float: right; clear: right;}
.img_center_border {border: solid 1px #558d9b; margin: 0 auto; display: block;}

/* Lists */
ol, ul {margin-bottom: 10px; margin-top: 0;}
dl.logos, dl.logos dt, dl.logos dd {list-style: none; margin: 0; padding: 0;}
dl.logos {border: 1px solid #cac5a6; border-width: 0 0 1px 1px; margin: 10px 0 5px 0; padding: 10px 0 5px 10px; width: 60%;}
dl.logos dd {margin-bottom: 10px; padding: 10px 0 5px 0;}
dl.logos span {font-size: 14px; font-weight: bold; line-height: normal;}

/* Headings */
h1 {width: 509px; height: 38px; margin: 0 0 10px 0; text-indent: -999em; overflow: hidden; clear: both;}
h2 {font-size: 17px; color: #11343e; margin: 10px 0;}
h3 {font-size: 12px; font-weight: bold; color: #11343e; margin: 0;}
h1.home {background: url(images/headings/home.gif); height: 34px;}
h1.about-our-office {background: url(images/headings/about-office.gif);}
h1.meet-the-orthodontists {background: url(images/headings/meet-doctor.gif);}
h1.meet-the-team {background: url(images/headings/meet-team.gif);}
h1.office-mission {background: url(images/headings/office-mission.gif);}
h1.office-tour {background: url(images/headings/office-tour.gif);}
h1.office-policies {background: url(images/headings/office-policies.gif);}
h1.office-events {background: url(images/headings/office-events.gif);}
h1.about-orthodontics {background: url(images/headings/about-ortho.gif);}
h1.why-braces {background: url(images/headings/why-braces.gif);}
h1.for-children {background: url(images/headings/for-children.gif);}
h1.for-adults {background: url(images/headings/for-adults.gif);}
h1.two-phase-treatment {background: url(images/headings/two-phase.gif);}
h1.orthodontic-treatments {background: url(images/headings/ortho-treatments.gif);}
h1.ortho-dictionary {background: url(images/headings/ortho-dictionary.gif);}
h1.ask-the-orthodontist {background: url(images/headings/ask.gif);}
h1.resources {background: url(images/headings/resources.gif);}
h1.braces-101 {background: url(images/headings/braces-101.gif);}
h1.life-with-braces {background: url(images/headings/life-braces.gif);}
h1.types-of-braces {background: url(images/headings/types-braces.gif);}
h1.types-of-appliances {background: url(images/headings/types-appliances.gif);}
h1.braces-diagram {background: url(images/headings/braces-diagram.gif);}
h1.brace-painter {background: url(images/headings/brace-painter.gif);}
h1.retainers {background: url(images/headings/retainers.gif);}
h1.orthodontic-technologies {background: url(images/headings/ortho-tech.gif);}
h1.invisalign {background: url(images/headings/invisalign.gif);}
h1.surgical-orthodontics {background: url(images/headings/surgical-ortho.gif);}
h1.in-ovation {background: url(images/headings/in-ovation.gif);}
h1.emergency-care {background: url(images/headings/emergency.gif);}
h1.smiles-across-the-bay {background: url(images/headings/smiles-across-the-bay.gif);}
h1.the-game-room {background: url(images/headings/game-room.gif);}
h1.contact-us {background: url(images/headings/contact-us.gif);}
h1.locations {background: url(images/headings/locations.gif);}
h1.comment-form {background: url(images/headings/comments.gif);}
h1.refer-a-friend {background: url(images/headings/referrals.gif);}
h1.site-map {background: url(images/headings/site-map.gif);}
h1.invisalign-teen {background: url(images/headings/invisalign-teen.gif);}
h1.the-damon-system {background: url(images/headings/damon-system.gif);}

/* Login Buttons */
#logins {margin: 0; padding: 0; right: 19px; top: 15px; position: absolute; z-index: 2;}
#logins a {display: block; text-decoration: none; text-indent: -999em; overflow: hidden; float: left; width: 94px; height: 21px;}
#logins a:hover {background-position: 0 -21px;}
#pt-login {background: url(images/nav/pt-login.gif);}
#dt-login {background: url(images/nav/dt-login.gif);}

/* Side Navigation */
#nav {width: 182px; margin: 0; padding: 0; left: 0; top: 170px; position: absolute; z-index: 2;}
#nav a {display: block; text-decoration: none; text-indent: -999em; overflow: hidden; height: 26px;}

#our-office {background: url(images/nav/our-office.jpg);}
#about-ortho {background: url(images/nav/about-ortho.jpg);}
#braces-101 {background: url(images/nav/braces-101.jpg);}
#ortho-tech {background: url(images/nav/ortho-tech.jpg);}
#emergency {background: url(images/nav/emergency.jpg);}
#smiles-across-the-bay {background: url(images/nav/smiles-across-the-bay.jpg);}
#game-room {background: url(images/nav/game-room.jpg);}
#contact {background: url(images/nav/contact.jpg);}
#home {background: url(images/nav/home.jpg);}

#nav a:hover, #nav a.active,
#nav li:hover #our-office, #nav li.sfhover #our-office,
#nav li:hover #about-ortho, #nav li.sfhover #about-ortho,
#nav li:hover #braces-101, #nav li.sfhover #braces-101,
#nav li:hover #ortho-tech, #nav li.sfhover #ortho-tech,
#nav li:hover #contact, #nav li.sfhover #contact,
#nav li:hover #home, #nav li.sfhover #home {background-position: 0 26px;}
#nav a.active {cursor: default;}

/* Drop Down */
#nav ul {line-height: 1; list-style: none; margin: 0; padding: 0; border: 0;}
#nav li {display: inline;}
#nav li ul {background: #cadbe0; border: solid 1px #fff; font-size: 12px; left: -9999px; position: absolute; z-index: 4; padding: 3px 0;}
#nav li:hover ul, #nav li.sfhover ul {left: auto; margin: -27px 0 0 182px;}
#nav ul li a {color: #2a5e63; padding: 2px 0 2px 10px; width: 160px; height: 18px; line-height: 18px; text-indent: 0;}
#nav ul li a:hover {background: #303330; color: #fff;}

/* The Game Room */
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: inline;}
ul#sesame-games img {border: 0; float: right; margin: 0 0 10px 10px;}
ul#sesame-games p {padding-bottom: 1em;}

/* Damon */
.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: 0 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;}

