w/* HTML, BODY ---------- */
html {height: 100%;}
body {background: #A0A77D url(../images/body-tile.jpg) repeat 0 0; margin: 0; padding:0;}
* {margin:0; padding:0;}

/* TEXT ---------- */
body {color: #8c6239; font: 12px/20px Tahoma, Helvetica, sans-serif; text-align:left;}
p {padding: 0px 0 15px 0px;}
.green {color:#687819;}
.orange {color:#df7a1c;}
.centered {text-align: center;}
/* HEADERS ---------- */
/* jcIR Styles --------- */
h1.jcir {/* standard styles for your headings if image replacement not-available */
color:#df7a1c;
font-family:Georgia, "Times New Roman", Times, serif;}
h1.replaced {/* jcIR plugin wraps text in div named replaced and hides it */
	overflow: hidden; 
	text-indent: -999em; 
	background-repeat: no-repeat;
}
h2{color: #687819; padding: 5px 0 10px 0; font-family: Georgia, "Times New Roman", Times, serif; font-style:italic;}
h3{color:#df7a1c; padding: 0 0 5px 0; font-family: Georgia, "Times New Roman", Times, serif; font-style:italic;}
h4 {font-family: Georgia, "Times New Roman", Times, serif; font-style:italic}	
h5 {font-size: 12px; padding-bottom: 5px;}
#column2-title {width: 321px; height: 24px; display: block; background:url(../images/colum2-title.gif) no-repeat 0 0;}
	
/* LISTS ---------- */
ol, ul {padding: 0 0 10px 20px; list-style-image: url(../images/leaf.gif);}
.home #left-column li{padding: 0 0 10px 0;}
.home #mid-column li{padding: 0 0 10px 0;}
/* LINKS ---------- */
a {color: #df7a1c; text-decoration: underline;}
a:visited{color: #df7a1c; text-decoration: underline;}
a:hover {color: #df7a1c; text-decoration: none;}
#logo {position:absolute; top:58px; left:544px; width: 241px; height: 103px; display: block; background: url(../images/logo.gif) no-repeat 0 0;}
#logo a{width: 241px; height: 103px; display: block;}

/* NAVIGATION ---------- */
#nav {z-index: 100; position: absolute; top: 190px; left: 21px;border-top: 1px solid #687819;}
/*---IE 6 Hack ---*/
*html #nav{border-bottom: 1px solid #687819;}
/*---IE 7 Hack ---*/
*+html #nav{border-bottom: 1px solid #687819;}
#nav ul {list-style: none; padding: 0;}
#nav li {float: left; display:inline;}
#nav a {height: 26px; display: block; overflow: hidden; text-indent: -999em;}
#our-office {background: url(../images/nav/office.gif) 0 0; width:182px;}
#dental-services {background: url(../images/nav/dental.gif) 0 0; width:189px;}
#spa-treatments {background: url(../images/nav/spa.gif) 0 0; width:182px;}
#contact-us {background: url(../images/nav/contact.gif) 0 0; width:153px;}
#home {background: url(../images/nav/home.gif) 0 0; width:134px;}
#nav ul li:hover a, #nav li.sfhover a,#nav a:hover, #nav .active {background-position: 0 -26px;}
#nav li.active a{background-position: 0 -26px;}
/* Set cursor to default arrow so link does not appear clickable */
#nav .active {cursor: default}

/* DROP DOWNS -----------*/
#nav li ul {margin: 0px auto; padding: 0; width: 145px; position: absolute; left: -999em; font-size: 12px; text-align: center; height: auto; background: #c9d0a9; border: 1px solid #687819;z-index: 100;}
#nav li.our-office ul{margin: 0 0 0 36px;}
#nav li.dental-services ul{margin: 0 0 0 22px;}
#nav li.spa-treatments ul{margin: 0 0 0 18px;}
#nav li.contact-us ul{margin: 0 0 0 3px;}
#nav li ul a {padding: 0px 5px 0px 5px; width: 135px; color: #687819;  text-indent: 0; text-decoration: none; line-height: 24px; height: auto;}
#nav li:hover ul, #nav li.sfhover ul {left: auto; display:block; z-index: 100;}
#nav li:hover ul a:hover, #nav li.sfhover ul a:hover {background: #fff;}

/* SUB-NAVIGATION -----------*/
.sub_nav{color: #424d09; padding: 20px 0 15px 0;}
.sub_nav a{color: #424d09; text-decoration: underline;}
.sub_nav a:visited {color: #424d09;	text-decoration: underline;}
.sub_nav a:hover, .sub_nav a.active {color: #424d09;font-weight:normal; text-decoration:none;}

/* ON PAGE SUB-NAVIGATION -----------*/
#on-page-sub-nav {margin-bottom:20px;}
#on-page-sub-nav h2{background: url(../images/more-in-this-section.gif) no-repeat 0 0; overflow:hidden; display: block; width: 157px; height: 41px; text-indent: -999em;}
#on-page-sub-nav ul{text-align: right;width: 125px; background: #f5d9c0; border: 1px solid #df7a1c; padding-top: 5px; padding-right: 10px; padding-bottom: 9px; list-style:none; list-style-image:none; color:#424d09; line-height:20px;}
#on-page-sub-nav a{ color:#424d09;}
#on-page-sub-nav a:visited{ color:#424d09;}
#on-page-sub-nav a:hover{ color:#424d09;}
	
/* LAYOUT ---------- */
.clear{clear:both;}
.hide {display:none;}
.flash-replaced .alt {display: none;}
div.hr { background: #c9d0a9; clear: both; height: 1px; margin: 20px 0; width: 100%; }
div.hr hr { display: none; }
#container {background: url(../images/container-tile.jpg) repeat-x 0 0;	min-height: 719px;_height: 719px; margin: 0; padding:0;}
#main {position: relative; background: url(../images/main-tile.png) repeat-y 0 0; width: 883px; margin: 0 auto;}
/*---IE 6 Hack ---*/
*html #main {background: url(../images/main-tile.gif) repeat-y 0 0; width:883px;}
#header {height: 214px; width: 883px; display:block; background: url(../images/header-bg.gif) no-repeat 0 0;}
#header-phone-number{position:absolute; top:84px; left:85px; width: 235px; height: 29px; display: block;	background: url(../images/phone-number.gif) no-repeat;}
#office-address{font-size: 12px; position: absolute; top: 140px; left: 85px;line-height:18px; color:#687819;}
#office-address a{color:#687819; text-decoration: none;}
#office-address a:visted{color:#687819; text-decoration: none;}
#office-address a:hover{color:#687819; text-decoration: underline;}
#mid{background: url(../images/mid-bg.gif) no-repeat top right;left: 21px; width: 840px; margin: 0; padding: 30px 0 0 21px;}
/*---IE 6 Hack ---*/
*html #mid{margin-top:-2px;}
*html .home #mid{margin-top:0px;}
#text{width:538px; padding: 5px 40px 0 46px; border-right: 1px solid #c9d0a9;}
#spotlight{background: #fff url(../images/spotlight-bg.gif) no-repeat 0 0; width: 840px; height: 254px; border-top: 1px solid #687819; z-index:1; margin:3px 0 0 21px;}
#spotlight-leaf{background: url(../images/spotlight-leaf.png) no-repeat 0 0; display: block; width: 85px;height: 71px; position: absolute; top: 218px; left: 50%; margin-left: 440px;}
/*---IE 6 Hack ---*/
*html #spotlight-leaf{background: url(../images/spotlight-leaf.gif) no-repeat 0 0;}
#left-column{width: 175px; float: left; padding: 0 30px 0 26px;}
#dental-services-callout {width: 165px; height: 218px; background: url(../images/dental-services-callout.jpg) no-repeat 0 0; margin: 40px 0;  padding: 0 0 0 5px;}
#dental-services-callout ul{list-style-image: url(../images/callout-leaf.png);}
/*---IE 6 PNG Hack ---*/
*html #dental-services-callout ul{list-style-image: url(../images/callout-leaf.gif);}
#dental-services-callout h2{background: url(../images/dental-services-title.gif) no-repeat 0 0; overflow: hidden; text-indent:-999em;}
#spa-treatments-callout {background: url(../images/spa-treatments-bg.jpg) no-repeat 0 0; width: 316px; height: 147px; display: block; margin: 50px 0 20px 0; padding: 0 0 0 10px;}
#spa-treatments-callout h2{background: url(../images/spa-treatments-title.gif) no-repeat 0 0; overflow: hidden; text-indent:-999em;}
#spa-treatments-callout ul{list-style-image: url(../images/callout-leaf.png);}
/*---IE 6 PNG Hack ---*/
*html #spa-treatments-callout ul{list-style-image: url(../images/callout-leaf.gif);}
#mid-column{width: 322px; float: left; border-right: 1px solid #c9d0a9; border-left: 1px solid #c9d0a9; margin: 15px 0 0 0; padding: 0 25px 0 44px;}	
.home #right-column{min-height:600px; _height: 600px;}
#right-column{width: 162px; padding:70px 25px 0 0; float: right;}
#footer {background: url(../images/footer-bg.png) no-repeat top center; color: #687819; font-size: 11px; padding: 60px 0 70px 0; text-align: center;}
/*---IE 6 PNG Hack ---*/
*html #footer{background: url(../images/footer-bg.gif) no-repeat top center;}
#footer p{line-height:14px;}

/* IMAGES ---------- */
img {border:none;}

/*right and left floating image with border*/
.right {float:right; border: 1px solid #687819; margin-left:10px;margin-bottom:10px;}
.left {float:left; border: 1px solid #687819; margin-right:10px; margin-bottom:10px;}
img.center {display:block; margin:0 auto 10px auto;}
iframe {border: 1px solid #687819; margin-bottom:20px;}
.logos{float: left; clear: both; margin-bottom: 10px; padding:10px;}
.borderless {border:none;}

/* Image Replacement -- add class="replace" to root element, i.e. <p> and add a bg image*/
.replace {letter-spacing : -1000em;line-height: 0;overflow: hidden;line-height: 0;text-indent: -999em;}
/* Just for Opera, but hide from MacIE */

/*\*/html>body .replace {	letter-spacing : normal;text-indent : -999em;overflow : hidden;}
/* End of hack */

/* ANATOMY OF A TOOTH ---------- */
#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}

/* Mini-Contact Form */
.contact-form-mini {
	margin: 0;	
	width: 100%; 
	padding: 9px 0 20px;
	border: 0;}/*optional, change color to match site*/
.contact-form-mini h2{background: url(../images/contact-us-mini-title.gif) no-repeat 0 0; text-indent:-999em; display: block; width: 138px; height: 31px; overflow:hidden; margin-bottom: 0px;}	
.contact-form-mini p{font-size: 11px; line-height:14px; color:#5c6a14;}
.contact-form-mini fieldset {border: none; padding: 0 0;}
.contact-form-mini li {font-weight: bold;}
.contact-form-mini label {display: none;}
.contact-form-mini input, .contact-form-mini textarea {
	font-family:Tahoma, Verdana, sans-serif;
	font-size:11px;
	color: #5c6a14;
	padding:1px 0px 1px 3px;
	border:solid 1px #5c6a14;
	width:159px;
	margin:5px 0;
	background: #e8ebdc;
	text-align: left; text-transform:uppercase;}
.contact-form-mini button {/*these styles control the look of the button, change as necessary*/
	text-indent: -999em;
	overflow:hidden;
	padding:0;
	margin: 0;/*do not change, controls positioning*/
	float: right;
	display: block;
	width:89px;
	height: 25px;
	background: url(../images/submit-btn.gif) no-repeat 0 0;
	border: none;}
.contact-form-mini button:hover {background-position: 0 0;}
.contact-form-mini span.error {	display: none;}
.contact-form-mini span.error, .contact-form-mini ul.error li {
	font-size: 11px;
	font-weight:normal; 
	color:#ff0000; 
	text-align:left; 
	padding: 3px 0 3px 18px;
    background: transparent url(../images/cancel.png) no-repeat left; }
.contact-form-mini h2.error {color: #ff0000;}
.contact-form-mini #message	{ margin: 9px 10px; padding: 9px; 
background: #232366 url(../images/form-success-bg.jpg) 0 100% repeat-x; border:solid 1px #5b589f;}
.contact-form-mini #message h2 {margin: 9px 0; text-align: center;}
.contact-form-mini #message p {margin:9px 0px; text-align: center;}
.contact-form-mini #checkmark {display: block; margin: 9px auto; text-align: center;}

/* Errors */

/* JQuery */
input.error, textarea.error {border: 1px solid #ff0000; background: #fefda1; color: #ff0000;}
div.error {padding-left: 18px; background: #ffffff url(../images/validate_error.jpg) 0 0 no-repeat; color: #ff0000; display: block;margin:0 0 9px 50%;font-size: 11px;line-height: 18px;}
#html-contact-form div.error {width: 145px; margin: 0 0 3px 0;}
div.success {padding-left: 18px; background: #ffffff url(../images/validate_ok.jpg) 0 0 no-repeat; color: #000000; display: block;margin:0 0 9px 50%;font-size: 11px;line-height: 18px;}