/* 
----------------------------------------------------------------------------
Copyright Einstein Industries 2005. Used with Permission.                             
May not be duplicated or reproduced.

Please check for cross-browser compatibility prior to making changes
MINIMUM BROWSER CHECK :: IE5.x/IE6/Op7/NS7/Safari

CSS Document - styles.css
---------------------------------------------------------------------------- */

/* undo some default styling of common (X)HTML browsers
 * ------------------------------------------------------------------------- */

ul,ol { list-style: none; }
h1,h2,h3,h4,h5,h6,pre,code { font-size: 1em; }
ul,ol,li,h1,h2,h3,h4,h5,h6,pre,form,body,html,p,blockquote,fieldset,input,div,dd,dt,dl { margin: 0; padding: 0; }
a img,:link img,:visited img { border: none; }

/* HTML
---------------------------------------------------------------------------- */
html,body { height: 100%; }

body {
	margin: 0 auto;
	text-align: center;
	font: 12px/17px lucida grande,lucida sans,lucida sans unicode,sans-serif;
	background: #986645 url(../images/body-bg.jpg) repeat-x;
	color:#000;
}

a:link,a:visited	{ color:#996644; text-decoration:underline; border:none; }
a:hover,a:active	{ color:#000; text-decoration:underline; border:none; }

fieldset { border: none; }
em strong { display: block; visibility: hidden; }

h1	{ font-size:1.2em; color:#000; }
h2	{ font-size:1.1em; color:#996644; }
h3	{ font-size:1.0em; color:#C5A86C; }

h1 span,h2 span,h3 span	{ display:none; }


/* Layout
---------------------------------------------------------------------------- */
#top, #mast-container, #content-container, #pre-footer, #footer { width: 764px; }
#top {
	background: url(../images/wrap-bg.jpg) repeat-y;
	text-align: left;
	margin: 0 auto;
}

#mast-header, #mast-index { float: left; height: 158px; }
#mast-header { width: 348px; background: url(../images/mast-header.jpg); position: relative; }
	#mast-header a{	
		position: absolute;
		left: 30px;
		width: 300px;
		top: 40px;
		height: 80px;
		}
#mast-index { width: 416px; background: url(../images/mast-index.jpg); }
	#mast-header span { display: none; }

#left-col, #right-col { float: left; }

#left-col, #nav, #actual-nav, #contact-container, #hdr-contact-us, #hdr-office-info, #hdr-procedures, #hdr-our-associations, #div-left-bot { width: 243px; }
#contact-container { height: auto; background: url(../images/div-left-bg.jpg); }
#hdr-contact-us { height: 67px; background: url(../images/headers/hdr-contact-us.jpg); }
#hdr-office-info { height: 67px; background: url(../images/headers/hdr-office-info.jpg); }
#hdr-procedures { height: 53px; background: url(../images/headers/hdr-procedures.jpg) no-repeat; }
#hdr-our-associations { height: 53px; background: url(../images/headers/hdr-our-associations.jpg) no-repeat; }
	#hdr-contact-us span, #hdr-office-info span, #hdr-procedures span, #hdr-our-associations span { display: none; }
#div-left-bot { height: 25px; background: url(../images/div-left-bot.jpg); }
#left-col p { margin: 0 12px 12px 50px; }
#left-col ul.list { margin: 0 12px 12px 62px; list-style: outside disc; }

#right-col, #splash-index, #hdr-welcome, #gallery-container { width: 521px; }
#right-col p { margin: 0 46px 12px 32px; }
#right-col h1, #right-col h2, #right-col h3{ padding: 0 46px 12px 32px; }
#right-col em { font-size: 14px; }
	#right-col ul.list { margin: 0 46px 12px 56px; list-style: outside disc; }
	
	#right-col ul.bullet { padding: 0 0 12px 45px; }
		#right-col ul.bullet li { 
			background:transparent url("../images/bullet.jpg") 0px 3px no-repeat;
			padding-left:10px; /* pushes text to the right to display bg img */
			margin-right:32px;
			}

	/* multi column list */
	#right-col ul.dentistry { padding:0 0 15px 25px; } 
		#right-col ul.dentistry li { 
			float:left;
			width:150px;
			margin-right:5px;
			line-height:20px; 
			}

	
#hdr-welcome { height: auto; background: url(../images/headers/hdr-welcome.jpg) no-repeat; padding: 30px 0 16px 0; }
#hdr-welcome em strong { height: 25px; }
#splash-index { height: 198px; background: url(../images/splash-index.jpg); position:relative;}
	#splash-index span { display: none; }

#hdr-cosmetic-dentistry, #hdr-sedation-dentistry, #hdr-restorative-dentistry, #hdr-smile-gallery, #hdr-about-our-practice, #hdr-contact-us-2, #hdr-sitemap, #hdr-thankyou { width: 240px; height: 30px; }
#hdr-about-our-practice { background: url(../images/headers/hdr-about-our-practice.jpg) no-repeat; } 
#hdr-contact-us-2 { background: url(../images/headers/hdr-contact-us-2.jpg) no-repeat; } 
#hdr-cosmetic-dentistry { background: url(../images/headers/hdr-cosmetic-dentistry.jpg) no-repeat; } 
#hdr-sedation-dentistry { background: url(../images/headers/hdr-sedation-dentistry.jpg) no-repeat; } 
#hdr-restorative-dentistry { background: url(../images/headers/hdr-restorative-dentistry.jpg) no-repeat; } 
#hdr-smile-gallery { background: url(../images/headers/hdr-smile-gallery.jpg) no-repeat; }
#hdr-thankyou { background: url(../images/headers/hdr-thankyou.jpg) no-repeat; }
#hdr-sitemap { background: url(../images/headers/hdr-sitemap.jpg) no-repeat; }
#hdr-about-our-practice span, #hdr-contact-us-2 span, #hdr-cosmetic-dentistry span, #hdr-sedation-dentistry span, #hdr-restorative-dentistry span, #hdr-smile-gallery span, #hdr-thankyou span, #hdr-sitemap span { display: none; }

#gallery-container ul { clear: both; margin-left: 24px; }
#gallery-container li { width: 223px; float: left; }

#pre-footer { height: 42px; background: url(../images/pre-footer.jpg); }
#footer { color: #fafafa; text-align: center; padding-bottom: 12px; margin: 0 auto; }
#footer p { padding: 0 24px 11px; }
#footer a:link, #footer a:visited	{ color:#fff; text-decoration:underline; border:none; }
#footer a:hover, #footer a:active	{ color:#E0CCA3; text-decoration:underline; border:none; }
#footer ul { margin-bottom: 12px; }
#footer li { display: inline;  padding: 0 5px 0 7px; border-left: 1px solid #ccc; font-size: 12px; line-height: 12px; }
#footer li.first { border-left: none; }

/* Navigation
---------------------------------------------------------------------------- */
#actual-nav { background: url(../images/nav.jpg) top left no-repeat; height: 170px; }
#actual-nav span { display: none; }
#actual-nav li, #actual-nav a { height: 21px; display: block; }
#actual-nav li { float: left; list-style: none; display: inline; }

#btn-1 { margin-top: 12px; }
#btn-1, #btn-2, #btn-3, #btn-4, #btn-5, #btn-6 { width: 197px; margin-left: 18px; }

/* Changed values should match "width" numbers specified above */
#btn-1 a:hover { background: transparent url(../images/nav.jpg) no-repeat -261px -12px; }
#btn-2 a:hover { background: transparent url(../images/nav.jpg) no-repeat -261px -33px; }
#btn-3 a:hover { background: transparent url(../images/nav.jpg) no-repeat -261px -54px;  }
#btn-4 a:hover { background: transparent url(../images/nav.jpg) no-repeat -261px -75px;  }
#btn-5 a:hover { background: transparent url(../images/nav.jpg) no-repeat -261px -96px;  }
#btn-6 a:hover { background: transparent url(../images/nav.jpg) no-repeat -261px -117px;  }


/* ----- global form elements ----- */ 

form {
	width:150px;
	margin:10px 0 15px 0px;
	}
#left-col form {margin-left: 50px;}
#right-col form {width: 450px; margin-left: 50px;}
form label	{ font-size:.95em; }

form br { line-height:0; height:0; } /* defaults vertical spacing between fields */

input, textarea, select { 
	background-color:#fff !important; /* to prevent highlighting by Google Toolbar */
	border:1px solid #000;
	color:#000;
	width:145px; /* 5 pixles smaller than form width !important */
	height:18px;
	line-height:18px;
	vertical-align: middle;
	margin-bottom:2px; /* sets vertical spacing between fields */
	padding-top:1px; /* vertically position text in input/textarea field */
	padding-left:4px; /* horizontally position text in input/textarea field */
	font-family:lucida grande,lucida sans,lucida sans unicode,sans-serif; 
	font-size:1.0em;
	}
	
select { width:155px; padding:0; } /* same width as form - !important */

textarea { height:90px; overflow:auto; }

#contact_business { display: none; } /* do not remove */ 


/* ----- main contact form ----- */ 
 
#contact-main { margin:20px 0 10px 0; }

#contact-main label { 
	width:220px; 
	position:relative; 
	display:block; 
	text-align:right; 
	margin-bottom:10px;
	font-size:1.0em;
	}
	
#contact-main label input, #contact-main label textarea, #contact-main label select { 
	width:170px;
	position:absolute; 
	left:110%; 
	top:-2px;
	}
	
#right-col label select { 
		width: 150px; height: 20px;
	padding: 2px;
	font: 12px/12px lucida grande,lucida sans,lucida sans unicode,sans-serif;
	background-color: #fff;
	color: #000;
	border: 1px solid #666;
	}
	
#contact-main label textarea { 
	width: 344px; height: 88px;
	padding: 2px;
	font: 12px/12px lucida grande,lucida sans,lucida sans unicode,sans-serif;
	background-color: #fff;
	color: #000;
	border: 1px solid #666;
	overflow: auto;
	}

/* Main Contact
---------------------------------------------------------------------------- */
#right-col fieldset { margin-bottom: 3px; height: 32px; line-height: normal; }
#right-col fieldset div { float: left; width: 200px; }
#right-col fieldset div.field-item { text-align: right; padding-right: 12px; }
#right-col div.clear { clear: both; text-align: center; padding-top: 12px; }

#right-col input  {
	width: 150px;
	padding: 2px;
	font: 12px/12px lucida grande,lucida sans,lucida sans unicode,sans-serif;
	background-color: #fff;
	color: #000;
	border: 1px solid #666;
}


#right-col textarea {
	width: 250px; height: 88px;
	padding: 2px;
	font: 12px/12px lucida grande,lucida sans,lucida sans unicode,sans-serif;
	background-color: #fff;
	color: #000;
	border: 1px solid #666;
	overflow: auto;
}



/* ----- submit button form elements ----- */ 

#left-col input.submit { 
	width:60px;
	height:20px;
	cursor:pointer; 
	padding:0; 
	}

#right-col input.submit-contact-main { 
	margin-top:25px;
	width:60px;
	height:20px;
	cursor:pointer; 
	padding:0; 
}



/* Classes
---------------------------------------------------------------------------- */
.clear { clear: both; }
.img-left { float: left; margin: 0px 10px 10px 0px; }
.sm { font-size: 11px; line-height: 14px; }
.txt-center { text-align: center; }
.txt-right { text-align: right; }

p.back-to-top {
	text-align:right;
	display:block;
	padding-right:15px;
	background:url("../images/bullet-back-to-top.jpg") right no-repeat;
	}
p.learn-more {
	text-align:right;
	display:block;
	padding-right:15px;
	background:url("../images/bullet.jpg") right no-repeat;
	}