/* HTML, BODY ---------- */

html {height: 100%; margin-bottom: 1px}

body {margin: 0}



/* TEXT ---------- */

body, table, input, textarea {color: #333; font: 13px/1.4em arial, sans-serif}

p {margin: 0 0 1.4em 0}

td {vertical-align: top}



/* HEADERS ---------- */

h1 {background-repeat: no-repeat; color: #FF7129; font-size: 18px; height: 18px; margin: 0; text-indent: -999em}

h2 {color: #3B4DA0; font-size: 14px; margin: 0}

h3 {color: #FF7129; font-size: 13px; font-weight: bold; margin: 0}



/* LISTS ---------- */

ol, ul {margin-bottom: 1.4em; margin-top: 0}

ul#navigation {list-style: none; margin: 0; padding: 0; position: absolute; right: 0; top: 8px}

#navigation li {float: left}

#sub_navigation ul {list-style: none; margin: 0; padding: 0}



/* LINKS ---------- */

a {color: #FF7129; text-decoration: underline}

a:hover {text-decoration: none}

#logo {position: absolute; top: 18px}

#logo_text {left: 0; position: absolute; top: 95px}



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

#navigation a {border-right: 2px solid #CCC; display: block; height: 65px; overflow: hidden; text-indent: -999em; width: 78px}

#patient_login {background: url(images/navigation/patient_login.gif)}

#our_office {background: url(images/navigation/our_office.gif)}

#orthodontics {background: url(images/navigation/orthodontics.gif)}

#braces_101 {background: url(images/navigation/braces_101.gif)}

#before_and_after {background: url(images/navigation/before_and_after.gif)}

#game_room {background: url(images/navigation/game_room.gif)}

#contact_us {background: url(images/navigation/contact_us.gif)}

#home {background: url(images/navigation/home.gif)}

#navigation a:hover, #navigation .active {background-position: 0 -65px}

.active {cursor: default}



#sub_navigation a {border-bottom: 2px solid #CCC; display: block; height: 78px; overflow: hidden; text-indent: -999em; width: 138px}

#meet_dr_wong {background: url(images/navigation/meet_dr_wong.gif)}

#meet_the_team {background: url(images/navigation/meet_the_team.gif)}

#office_tour {background: url(images/navigation/office_tour.gif)}

#patient_forms {background: url(images/navigation/patient_forms.gif)}

#current_contests {background: url(images/navigation/current-contests.gif)}

#why_braces {background: url(images/navigation/why_braces.gif)}

#for_adults {background: url(images/navigation/for_adults.gif)}

#for_children {background: url(images/navigation/for_children.gif)}

#two_phase_treatment {background: url(images/navigation/two_phase_treatment.gif)}

#common_treatments {background: url(images/navigation/common_treatments.gif)}

#invisalign {background: url(images/navigation/invisalign.gif)}

#faqs {background: url(images/navigation/faqs.gif)}

#types_of_braces {background: url(images/navigation/types_of_braces.gif)}

#types_of_appliances {background: url(images/navigation/types_of_appliances.gif)}

#life_with_braces {background: url(images/navigation/life_with_braces.gif)}

#emergency_care {background: url(images/navigation/emergency_care.gif)}

#retainer_instructions {background: url(images/navigation/retainer_instructions.gif)}

#braces_diagram {background: url(images/navigation/braces_diagram.gif)}

#brace_painter {background: url(images/navigation/brace_painter.gif)}

#helpful_links {background: url(images/navigation/helpful_links.gif)}

#games {background: url(images/navigation/games.gif)}

#contests {background: url(images/navigation/contests.gif)}

#newsroom {background: url(images/navigation/newsroom.gif)}

#comment_form {background: url(images/navigation/comment_form.gif)}

#referrals {background: url(images/navigation/referrals.gif)}

#sub_navigation a:hover, #sub_navigation .active {background-position: 0 -78px}



/* IMAGES ---------- */

img, table {border: none}

.border {border: 1px solid #333}

.centered {display: block; margin: 0 auto}

.left {float: left; margin: 0 10px 10px 0}

.right {float: right; margin: 0 0 10px 10px}

.clear {clear: both}



/* LAYOUT ---------- */

#container {margin: 0 auto; padding: 10px 10px 0 10px; width: 760px}

#header {background: url(images/container_bg.gif) no-repeat; height: 102px; padding: 8px 0 10px 0; position: relative}

#flash_sound {position: absolute; top: 100px; right: 0}

#content, #content_subnav {background: url(images/content_bg.gif) no-repeat; border: 2px solid #CCC; border-top: 0; padding: 56px 48px 30px 48px; position: relative; width: 660px}

#content_subnav {padding-left: 188px; width: 520px}

#sub_navigation {display: inline; float: left; margin: -48px 0 0 -188px}

#sub_navigation:after {clear: both; content: "."; display: block; height: 0; visibility: hidden}

#footer {font-size: 12px; line-height: 1.5em; padding-top: 10px; text-align: center}