/* HTML, BODY ---------- */
html {height: 100%; margin-bottom: 1px}
body {background: #DFD6BF; margin: 0}
/* TEXT ---------- */
body, table, input, textarea {color: #000; font: 12px/1.5em tahoma, sans-serif}
BODY, TD, .NormalText { font-weight: normal; text-decoration: none; font-style: normal; color: #000; font-size: 12px; font-family: Tahoma, Arial, Georgia, Helvetica, sans serif; }
.Header { color: #BE310C; font: italic normal 2.2em georgia, serif; line-height: 24px; }
.Subheader { color: #BE310C; font: italic normal 1.5em georgia, serif; }
.Red { color: #BE310C; }
.Blue { color: #004D8B; }
.Black { color: #000000; }
.SmallText { font-size: 10px; }
.MediumText { font-size: 16px; line-height: 16px; }
.LargeText { font-size: 24px; line-height: 24px; }
p {margin: 0; padding-bottom: 1em}
td {vertical-align: top}
* #flash-home p {background: #FFFF99; bottom: 0; padding: 5px 50px 5px 5px}
* .sup {font-size: .5em; line-height: 1em; position: relative; bottom: 1em}
/* HEADERS ---------- */
h1, h2 {color: #BE310C; font: italic normal 2.2em georgia, serif; margin: 0 0 .25em 0}
h2 {font-size: 1.5em}
* #content .column-left h2 {color: #FFF; margin: 0; padding: 30px 0 50px 0; text-align: center; width: 200px}
h2.pledge {margin-bottom: 1em; text-align: center; width: 300px}
h3 {font-size: 1em; font-weight: bold; margin: 0}
* #footer h4 {color: #79784E; font-size: .8em; font-weight: normal; margin: 0; text-align: justify}
/* LISTS ---------- */
ol, ul {margin-bottom: 1em; margin-top: 0}
ul#info {color: #FFF; display: block; font-size: 1em; left: 20px; line-height: 1.5em; list-style: none; padding: 0; position: absolute; top: -60px; z-index: 1}
* #info li {display: inline}
* #logos {list-style: none; margin: 0; padding: 0}
ul#logos li {float: left}
* #logos li a {display: block; height: 27px; overflow: hidden; text-indent: -999em}
* #logos li a#aao-logo {background: url(images/aao-logo.gif); margin-right: 25px; width: 43px}
* #logos li a#invisalign-logo {background: url(images/invisalign-logo.gif); margin-right: 25px; width: 68px}
* #logos li a#damon-system-logo {background: url(images/damon-system-logo.gif); width: 74px}
* #footer ul {list-style: none; margin: 0; padding: 0}
* #footer ul li {display: inline}
/* LINKS ---------- */
a {color: #BE310C; text-decoration: underline}
a:hover {text-decoration: none}
a#logo {background: url(images/logo.gif); display: block; height: 155px; overflow: hidden; text-indent: -999em; width: 290px}
a.callout {background: url(images/callout.gif); color: #FFF; display: block; font-weight: bold; height: 40px; padding: 5px 45px 0 10px; text-decoration: none; width: 190px}
a.callout:hover {text-decoration: underline}
a.form {background: url(images/form.gif); color: #FFF; display: block; font-weight: bold; height: 30px; line-height: 30px; margin-bottom: 1em; padding: 0 0 0 10px; text-decoration: none; width: 200px}
a.form:hover {text-decoration: underline}
* #footer a {color: #BE310C}
/* NAVIGATION ---------- */
* #masthead {height: 30px; list-style: none; left: 480px; margin: 0; padding: 0; position: absolute; top: 10px}
* #masthead li {background: url(images/masthead-li.gif) no-repeat; float: left; margin-left: 10px}
* #masthead a {background: url(images/masthead-a.gif) no-repeat 100% 0; color: #FFF; display: block; font-weight: bold; line-height: 30px; padding: 0 30px 0 10px; text-decoration: none}
* #masthead a:hover {text-decoration: underline}
* #navigation {height: 35px; left: 0; list-style: none; margin: 0; padding: 0; position: absolute; top: 50px; z-index: 2}
#navigation li {background: url(images/navigation-li.gif) no-repeat; float: left; margin-right: 1px}
#navigation a {background: url(images/navigation-a.gif) no-repeat 100% 0; color: #FFF; display: block; font-weight: bold; line-height: 35px; padding: 0 6px; text-decoration: none}
#navigation a:hover {text-decoration: underline}
#navigation li.active {background: url(images/navigation-li-active.gif) no-repeat}
#navigation li.active a, #navigation li.active a:hover {background: url(images/navigation-a-active.gif) no-repeat 100% 0; color: #BE310C; text-decoration: none}
#navigation ul {background: #DB9251; border: 1px solid #CF6D17; left: -999em; list-style: none; margin: 0; padding: 1px 1px 0 1px; position: absolute; width: 180px}
#navigation ul li {float: none}
#navigation li:hover ul, #navigation li.sfhover ul {display: block; left: auto}
#navigation ul li a {background: #CF6D17; display: block; font-weight: normal; line-height: 2em; margin-bottom: 1px; padding: 0 0 0 10px; text-decoration: none; text-indent: 0; width: 170px}
#navigation li.active ul li, #navigation li.active ul li a, #navigation li.active ul li a:hover {background: #CF6D17; color: #FFF}
#navigation li.active ul li a:hover, #navigation ul li a:hover {background: #DB9251}
/* IMAGES ---------- */
img {border: none; color: #BE310C}
* .centered {display: block; margin: 0 auto}
* .clear {clear: both}
* .left {float: left; margin: 0 10px 10px 0}
* .right {float: right; margin: 0 0 10px 10px}
/* LAYOUT ---------- */
* .wrap {position: relative; width: 780px}
* #header {background: url(images/header.gif) repeat-x; height: 85px}
* .column-left {float: left; width: 290px}
* .column-right {float: left; padding: 0 50px; width: 385px}
* #content {background: #DFCDA9 url(images/content.gif) repeat-x; border-bottom: 10px solid #BE310C}
* #content .wrap {background: url(images/content-column-left.gif) repeat-y}
* #blocks {background: url(images/blocks.gif); height: 386px; left: 204px; position: absolute; top: 155px; width: 86px}
* #image {height: 300px}
* #content .column-right {background: url(images/content-column-right.gif) no-repeat right bottom; min-height: 400px; padding-bottom: 200px; padding-top: 75px}
* html #content .column-right {height: 400px}
* #flash-home {background: url(images/flash.jpg); height: 300px; position: relative; width: 290px; z-index: 1}
* #footer {background: url(images/footer.gif) repeat-x; clear: both; color: #BE310C; font-size: .9em; padding: 10px 0; position: relative}
* #footer .column-left {padding: 0 30px 0 20px; width: 240px}
* #content:after, #content .wrap:after, #content .column-right:after, #footer:after {clear: both; content: "."; display: block; height: 0; visibility: hidden}
/* DAMON SYSTEM ---------- */
h2.media-center {background:#000033; color:#FFF; margin:0; padding:5px;}
div.media-center {background:#336699; color:#FFF; display:inline-block; margin-bottom:10px; overflow:auto; padding:10px 5px;}
div.media-center a {color:#FFF;}
div.media-center img {border:1px solid #FFF;}
/* BRACES DIAGRAM ---------- */
* #braces-diagram {background: url(images/braces-diagram/braces-diagram-bg.gif); height: 374px; margin: 0 -20px; position: relative; width: 425px}
* #braces-diagram a {cursor: help; display: block; position: absolute}
* #braces-diagram a:hover {background: transparent}
a#elastic-tie {height: 20px; left: 90px; top: 100px; width: 65px}
a#loop-archwire {height: 20px; left: 150px; top: 80px; width: 100px}
a#archwire {height: 20px; left: 190px; top: 100px; width: 65px}
a#bracket {height: 20px; left: 230px; top: 120px; width: 60px}
a#headgear-tube {height: 20px; left: 335px; top: 100px; width: 90px}
a#coil-spring {height: 20px; left: 150px; top: 300px; width: 65px}
a#tie-wire {height: 20px; left: 235px; top: 325px; width: 65px}
a#band {height: 20px; left: 270px; top: 300px; width: 40px}
a#hook {height: 20px; left: 315px; top: 280px; width: 35px}
a#elastic {height: 40px; left: 355px; top: 280px; width: 45px}
a#print {cursor: pointer; height: 23px; left: 365px; top: 351px; width: 60px}
#braces-diagram a img {border: none; display: block; height: 0; position: absolute; width: 0}
#braces-diagram a:hover img {height: 74px; width: 425px}
a#elastic-tie:hover img {left: -90px; top: -100px}
a#loop-archwire:hover img {left: -150px; top: -80px}
a#archwire:hover img {left: -190px; top: -100px}
a#bracket:hover img {left: -230px; top: -120px}
a#headgear-tube:hover img {left: -335px; top: -100px}
a#coil-spring:hover img {left: -150px; top: -300px}
a#tie-wire:hover img {left: -235px; top: -325px}
a#band:hover img {left: -270px; top: -300px}
a#hook:hover img {left: -315px; top: -280px}
a#elastic:hover img {left: -355px; top: -280px}