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

/* Layout */
body {background: #CCE5EE url(../images/body-bg.gif) 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) no-repeat; height: 238px;}
#content-wrap {background: url(../images/content-bg.gif) no-repeat; min-height: 530px; _height: 530px; clear: both;}
#content {width: 599px; margin-left: 310px;}
#nav-wrap {width: 197px; position: absolute; z-index: 10; top: 254px; left: 33px;}
#footer {background: #39597c url(../images/footer-bg.jpg) no-repeat; padding: 80px 30px 20px 30px; clear: both;}
#util {position: absolute; z-index: 5; top: 10px; right: 50px;}
#social-wrap {width: 189px; margin: 15px auto;}

.fl {float: left;}
.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: 2px; background-color: #fff; border: solid 1px #BDD475; border-width: 1px 0 0 0; margin: 30px 0; clear: both;}

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

.layout {display: block;}
.callout {margin: 15px 0 0 25px;}
.logo {background-color: #fff; padding: 10px;}
.social-logo {margin: 0 15px 0 0;}

/* Typo */
body {font-size: 100%; font-family: Arial, Helvetica, sans-serif;}
#container {font-size: .88em; line-height: 1.43em;}
#content {color: #333333; font-weight: normal;}
#footer {line-height: 1.71em; text-align: center; color: #fff;}
.text_nav {color: #ccff99; font-size: .86em; margin: 0;}
.sub_nav {color: #0099cc; margin: 15px 0 18px 0; padding: 0;}
p.sesame {margin: 0; padding: 0; font-size: .86em;}
p.address {letter-spacing: .14em;}
p {margin: 0 0 20px 0;}

/* Links */
a {color: #0099cc; text-decoration: underline;}
a:hover, .sub_nav a:hover, .sub_nav a.active {color: #829c51; text-decoration: none;}
.sub_nav a {color: #0099cc;}
.sub_nav a.active {cursor: default;}
.text_nav a, p.sesame a {color: #ccff99; text-decoration: underline;}
.text_nav a:hover, p.sesame a:hover {color: #fff;}
.top-link {clear: both;}

/* Headings */
h1 {font-size: 3em; font-weight: normal; margin: 0; clear: both;}
h2 {font-size: 1.57em; font-weight: normal; margin: 0 0 20px 0; color: #336699;}
h3 {font-size: 1.29em; margin: 0; font-weight: normal; color: #669900;}
h4 {font-size: .86em; color: #fff; font-weight: normal; margin: 0 0 25px 0; padding: 0;}
h1.logo {background: url(../images/doleac-logo.gif) no-repeat; width: 295px; height: 238px; margin: 0 0 0 37px; padding: 0;  text-indent: -999em; overflow: hidden; border: none;}
h1.logo a {width: 295px; height: 238px; display: block;}
h1.welcome {margin: 0 0 0 310px;}
h3.staff {margin: 0 0 20px 0;}


/* 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: 710px; height: 330px; margin: 0 0 0 250px;}

/* Video */
#video-invisalign {width: 360px; margin: 10px auto;}


/* Lists */
ul, ol {margin: 0 0 15px 30px;}
ol.unique li {margin-left: 25px;}
dl.logos, dl.logos dt, dl.logos dd {list-style: none; margin: 0; padding: 0;}
dl.logos {border: 1px solid #8ba65f; border-width: 0 0 1px 1px; margin: 10px 0 5px 0; padding: 10px 0 5px 10px; width: 50%;}
dl.logos dd {margin-bottom: 10px; padding: 10px 0 5px 0;}
dl.logos span {font-size: 14px; font-weight: bold; line-height: normal;}

/* Utilities */
#util ul {list-style: none; margin: 0; padding: 0;}
#util li {float: left; margin-left: 15px;}
#util li a {height: 30px; display: block; text-decoration: none; text-indent: -999em; overflow: hidden;}
#patient-login {background: url(../images/nav/patient-login.gif); width: 130px;}
#doctor-login {background: url(../images/nav/doctor-login.gif); width: 140px;}
#util a:hover, #util li.active a,
#util li:hover #patient-login, #util li.sfhover #patient-login,
#util li:hover #doctor-login, #util li.sfhover #doctor-login {background-position: 0 -30px;}

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

#for-new-patients {background: url(../images/nav/for-new-patients.gif);}
#about-orthodontics {background: url(../images/nav/about-orthodontics.gif);}
#treatment-options {background: url(../images/nav/treatment-options.gif);}
#emergency-care {background: url(../images/nav/emergency-care.gif);}
#contact-us {background: url(../images/nav/contact-us.gif);}
#home {background: url(../images/nav/home.gif);}

#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 #treatment-options, #nav li.sfhover #treatment-options,
#nav li:hover #emergency-care, #nav li.sfhover #emergency-care,
#nav li:hover #contact-us, #nav li.sfhover #contact-us,
#nav li:hover #home, #nav li.sfhover #home {background-position: 0 -36px;}

/* Drop Down */
#nav li ul {margin: 0; padding: 0; width: 210px; position: absolute; z-index: 3; left: -999em;}
#nav li:hover ul, #nav li.sfhover ul {left: auto; margin: -36px 0 0 197px;}
#nav li ul li {background: #fff; display: block; width: 275px; height: 28px; padding: 0; margin: 0;}
#nav li ul li a {padding: 5px 0 5px 15px; margin: 0; width: auto; height: 18px; display: block; text-indent: 0; font-size: .86em; font-weight: normal; text-transform: uppercase; color: #365477; text-decoration: none;}
#nav li ul li a:hover {height: 18px; background-color: #365477; color: #fff;}

/* Clear Fix */
.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;}



/* The Damon System */

#flash-damon-system-comparison {margin: 10px auto; width: 250px;}
#flash-the-damon-system {width: 240px; margin: 15px auto;}
h2.media-center {background: #0065A4; color: #FFF; margin: 0; padding: 5px;}
div.media-center {background: #EEF3F9; color: #FFF; margin-bottom: 10px; overflow: auto; width: 564px; padding: 20px; text-align: center;}
div.media-center img {width: 250px; margin: 0 auto;}