body{background:#2E7BBE url(images/bg.gif) repeat-x;margin:0;padding:0}

/* ........................................ CLEARFIX HACK ........................................ */

* html .clearfix{height:1%}
html[xmlns] .clearfix{display:block}
.clearfix{display:inline-block}
.clearfix:after{clear:both;content:" ";display:block;height:0;line-height:0;visibility:hidden}

/* ........................................ TEXT ........................................ */

body,form,input,textarea{color:#000;font-family:arial,sans-serif;font-size:12px}
a{color:#000;text-decoration:underline}
a:hover{text-decoration:none}
div.hr{background:#2E7BBE;clear:both;height:1px;margin:20px 0;padding:0;width:531px}
div.hr hr{display:none}
h1{background:no-repeat;clear:left;height:41px;margin:0;overflow:hidden;text-indent:-999em}
h2{color:#205685;font-family:arial,sans-serif;font-size:20px;margin:10px 0}
h3{color:#2E7BBE;font-family:arial,sans-serif;font-size:14px;margin:10px 0}
h4{color:#FFF;font-family:arial,sans-serif;font-size:11px;font-weight:normal;margin:5px 0}
p{color:#000;line-height:18px;margin:10px 0}
.back-to-top a{color:#000;font-size:11px;line-height:14px;text-decoration:underline}
.back-to-top a:hover{color:#000;font-size:11px;line-height:14px;text-decoration:none}
.content ol{clear:left;color:#000;font-size:12px;line-height:14px;list-style:decimal;margin:10px 40px;padding:0}
.content ol a{color:#000}
.content ol li{margin:10px 0;padding:0}
html:not([lang*=""]) .content ol li{width:100%}
.content ol ol{clear:left;color:#000;font-size:12px;line-height:14px;list-style:lower-alpha;margin:10px 30px;padding:0}
.content ol ol a{color:#000}
.content ol ol li{margin:10px 0;padding:0}
html:not([lang*=""]) .content ol ol li{width:100%}
.content ul{clear:left;color:#000;font-size:12px;line-height:14px;list-style:disc;margin:10px 40px;padding:0}
.content ul a{color:#000}
.content ul li{margin:10px 0;padding:0}
html:not([lang*=""]) .content ul li{width:100%}
.content ul ul{clear:left;color:#000;font-size:12px;line-height:14px;list-style:circle;margin:10px 30px;padding:0}
.content ul ul a{color:#000}
.content ul ul li{margin:10px 0;padding:0}
html:not([lang*=""]) .content ul ul li{width:100%}
.flash a{color:#FFF}
.flash p{background:#D61308;color:#FFF;padding:10px}
#footer a{color:#FFF;font-size:11px;line-height:16px;text-decoration:none}
#footer a:hover{text-decoration:underline}
#footer p{color:#FFF;font-size:11px;line-height:16px;margin:5px 0 10px}
#patient-forms a{color:#FFF}
#patient-forms h3{color:#FFF}
#patient-forms p{color:#FFF}
#resource-list{list-style:none;margin:0;padding:0}
#resource-list a{color:#2E7BBE}
#resource-list p{color:#000}
#resource-list li{clear:left}
#textual-navigation-wrapper .textual-navigation .active{color:#286BA4;font-weight:bold;text-decoration:none}
#textual-navigation-wrapper .textual-navigation p{color:#2E7BBE;margin:0}
#textual-navigation-wrapper .textual-navigation a{color:#2E7BBE;margin:0;text-decoration:none}
#textual-navigation-wrapper .textual-navigation a:hover{color:#286BA4;font-weight:bold}

/* ........................................ IMAGES ........................................ */

img{border:0;display:block}
img.center{clear:both;margin:0 auto}
img.left{clear:left;float:left;margin:0 10px 10px 0}
img.right{border:5px solid #2E7BBE;clear:right;float:right;margin:10px 0 10px 10px}
.flash img{float:right;padding:10px}
.map{border:5px solid #2E7BBE;float:right;margin:0}

/* ........................................ LAYOUT ........................................ */

.back-to-top{clear:both;text-align:right;width:100%}
.content{display:inline;float:right;margin:0;padding:14px;width:538px}
#header{background:#FFF url(images/header-bg.gif) no-repeat;display:block;height:145px;margin:0;width:750px}
#flash-home{background:#2E7BBE url(images/flash-bg.jpg);float:right;height:231px;width:566px}
#footer{background:#2E7BBE url(images/footer-bg.gif) no-repeat;display:inline;float:left;height:87px;margin:0;padding:20px;text-align:center;width:710px}
#logo{background:#FFF url(images/header.gif) no-repeat;display:block;float:left;height:145px;margin:0;overflow:hidden;text-indent:-999em;width:337px}
#patient-forms{background:#2E7BBE;clear:right;float:right;margin:0 0 10px 10px;padding:0 10px;width:170px}
#site{background:#2E7BBE url(images/site-bg.gif) repeat-y;margin:0 auto;padding:0;width:750px}
#sub-header{background:#2E7BBE url(images/sub-header.gif) no-repeat;display:block;float:right;height:45px;margin:0;overflow:hidden;text-indent:-999em;width:566px}
#social-icons {float:left; display:inline; width:180px; margin:18px 0; text-align:center;}
#social-icons img, #social-icons a {display:inline; height:36px; width:auto;}
/* ........................................ NAVIGATION ........................................ */

/* .......... code .......... */
#navigation-wrapper{display:inline;float:left;margin:20px 0;width:184px}
ul#navigation{list-style:none;margin:0;padding:0;width:184px}
#navigation li{float:left}
#navigation a{display:block;height:32px;overflow:hidden;text-indent:-999em;width:184px}
/* .......... images .......... */
#board-certified{background:url(images/nav/board-certified.gif)}
#our-office{background:url(images/nav/our-office.gif)}
#for-new-patients{background:url(images/nav/for-new-patients.gif)}
#regular-checkups{background:url(images/nav/regular-checkups.gif)}
#teeth-101{background:url(images/nav/teeth-101.gif)}
#pediatric-dentistry{background:url(images/nav/pediatric-dentistry.gif)}
#the-game-room{background:url(images/nav/the-game-room.gif)}
/* .......... subnavigation code .......... */
#navigation ul{list-style:none;margin:0;padding:0;width:184px}
#navigation ul li{display:inline;margin:4px 0}
#navigation ul a{display:block;height:16px;overflow:hidden;text-indent:-999em;width:184px}
/* .......... subnavigation images .......... */
#meet-the-dentists{background:url(images/nav/meet-the-dentists.gif)}
#meet-the-team{background:url(images/nav/meet-the-team.gif)}
#office-tour{background:url(images/nav/office-tour.gif)}
#our-blog{background:url(images/nav/our-blog.gif)}
#teeth-for-life{background:url(images/nav/teeth-for-life.gif)}
#flossing-instructions{background:url(images/nav/flossing-instructions.gif)}
#sealants{background:url(images/nav/sealants.gif)}
#cavities{background:url(images/nav/cavities.gif)}
#diet{background:url(images/nav/diet.gif)}
#fluoride{background:url(images/nav/fluoride.gif)}
#homecare{background:url(images/nav/homecare.gif)}
#nursing{background:url(images/nav/nursing.gif)}
#toddler-time{background:url(images/nav/toddler-time.gif)}
#resources{background:url(images/nav/resources.gif)}
#dentistry-for-children{background:url(images/nav/dentistry-for-children.gif)}
#dental-fun-kit{background:url(images/nav/dental-fun-kit.gif)}
#pediatric-dental-faq{background:url(images/nav/pediatric-dental-faq.gif)}
#dental-care-for-babies{background:url(images/nav/dental-care-for-babies.gif)}
#thumb-sucking{background:url(images/nav/thumb-sucking.gif)}
#dental-emergencies{background:url(images/nav/dental-emergencies.gif)}
/* .......... rollover effects .......... */
#navigation a:hover,#navigation .active{background-position:0 -32px}
ul#navigation ul a:hover,ul#navigation ul .active{background-position:0 -16px}
/* .......... cursor effects .......... */
#navigation .active{cursor:default}
/* .......... horizontal navigation code .......... */
#horizontal-navigation-wrapper{float:left;margin:22px 0 0;padding:0;width:413px}
ul#horizontal-navigation{height:98px;list-style:none;margin:0;padding:0;width:413px}
#horizontal-navigation li{float:left}
#horizontal-navigation a{display:block;height:98px;overflow:hidden;text-indent:-999em}
/* .......... horizontal navigation images .......... */
#patient-login{background:url(images/nav/patient-login.gif);width:131px}
#contact-us{background:url(images/nav/contact-us.gif);width:131px}
#home{background:url(images/nav/home.gif);width:131px}
/* .......... horizontal navigation rollover effects .......... */
#horizontal-navigation a:hover,#horizontal-navigation .active{background-position:0 -98px}
/* .......... horizontal navigation cursor effects .......... */
#horizontal-navigation .active{cursor:default}
/* .......... textual navigation code .......... */
#textual-navigation-wrapper .textual-navigation{margin:0 0 20px;padding:0;width:531px}

/* ........................................ TEETH 101 ........................................ */

#anatomy-of-a-tooth {background: url(images/anatomy-of-a-tooth/anatomy-of-a-tooth-bg.gif); height: 525px; position: relative; width: 300px}
#anatomy-of-a-tooth a {cursor: help; display: block; position: absolute}
#anatomy-of-a-tooth a:hover {background: transparent}
a#bone {height: 20px; left: 30px; top: 380px; width: 40px}
a#cementum {height: 20px; left: 100px; top: 460px; width: 90px}
a#dentin {height: 20px; left: 80px; top: 165px; width: 60px}
a#enamel {height: 20px; left: 165px; top: 135px; width: 60px}
a#gingiva {height: 30px; left: 20px; top: 275px; width: 60px}
a#periodontal {height: 30px; left: 205px; top: 440px; width: 70px}
a#pulp {height: 30px; left: 125px; top: 220px; width: 50px}
a#print {cursor: pointer; height: 23px; left: 240px; top: 502px; width: 60px}
#anatomy-of-a-tooth a img {border: none; display: block; height: 0; position: absolute; width: 0}
#anatomy-of-a-tooth a:hover img {height: 98px; width: 300px}
a#bone:hover img {left: -30px; top: -380px}
a#cementum:hover img {left: -100px; top: -460px}
a#dentin:hover img {left: -80px; top: -165px}
a#enamel:hover img {left: -165px; top: -135px}
a#gingiva:hover img {left: -20px; top: -275px}
a#periodontal:hover img {left: -205px; top: -440px}
a#pulp:hover img {left: -125px; top: -220px}

/* ........................................ THE GAME ROOM ........................................ */

div#sesame-game {
background: #000;
line-height: 0;
margin: 20px auto;
text-align: center;
width: 400px}
ul#sesame-games {
list-style: none;
margin: 0;
padding: 0}
ul#sesame-games li {
clear: both;
display: inline-block}
ul#sesame-games img {
border: 0;
float: right;
margin: 0 0 10px 10px}
ul#sesame-games p {
padding-bottom: 1em}