/* 
 ----------------------------------------------------------------------------
  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/Firefox/Safari

  CSS Document - layout.css
 ---------------------------------------------------------------------------- 
*/


/* undo some default styling of common (X)HTML browsers
 * ------------------------------------------------------------------------- */

/* No list-markers by default - must redefine bullets w/ bg graphics */
ul,ol { list-style:none; }

/* Avoid browser default inconsistent heading font-sizes and pre/code */
h1,h2,h3,h4,h5,h6,pre,code,td { font-size:1em; }

/* Remove inconsistent (among browsers) default padding or margin */
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; }

/* prevent blue linked image borders */
a img,:link img,:visited img,fieldset { border:none; }

span {display: none;}

/* global elements
 * ------------------------------------------------------------------------- */

/* ----- type selectors ----- */ 
body { 
		background:url(../images/index/bg.jpg) repeat-x top left #8C9E80; 
		text-align:center; 
		font:11px/16px "Trebuchet MS", "Bitstream Vera Sans", Arial, Verdana, Helvetica, sans-serif; 
		color:#27331F; 
		}

p, ul, ol, dl, pre, blockquote	{ margin-bottom:10px; }

blockquote { 
	margin-left: 10px; 
	margin-right: 10px; 
	}

h1	{ font-size:16px; }
h2	{ font-size:14px; }
h3	{ font-size:12px; }

h1 span,h2 span,h3 span	{ display:none; margin:0; padding:0; }

a:link,a:visited	{ color:#27331F; text-decoration:underline; }
a:hover,a:active	{ color:#5E332A; text-decoration:underline; }


/* Horozontal Sprite Nav
 * ------------------------------------------------------------------------- */

#nav { 
	background: url(../images/index/nav.jpg) no-repeat; 
	width:751px; 
	height:38px; 
	margin-bottom:0; 
	}

#nav span { display: none; }

#nav li, #nav a { height: 38px; display: block; }

#nav li { float: left; list-style: none; display: inline; }

#nav-01 { width: 94px; margin-left: 11px;}
#nav-02 { width: 95px;}
#nav-03 { width: 128px;}
#nav-04 { width: 175px;}
#nav-05 { width: 136px;}
#nav-06 { width: 102px;}

#nav-01 a:hover {background: transparent url(../images/index/nav.jpg) -11px -38px no-repeat;}
#nav-02 a:hover {background: transparent url(../images/index/nav.jpg) -105px -38px no-repeat;}
#nav-03 a:hover {background: transparent url(../images/index/nav.jpg) -200px -38px no-repeat;}
#nav-04 a:hover {background: transparent url(../images/index/nav.jpg) -328px -38px no-repeat;}
#nav-05 a:hover {background: transparent url(../images/index/nav.jpg) -503px -38px no-repeat;}
#nav-06 a:hover {background: transparent url(../images/index/nav.jpg) -639px -38px no-repeat;}


/* ----- classes ----- */
.icon {margin: 0 0 -4px 4px; }
div.clear	{ clear:both; height:.01em; overflow:hidden; }
.top { text-align:right;}
img.img-left { float:left; margin:0px 1px 0px 0;}
img.img-right { float: right; margin: 2px 0 12px 12px;}

img.img-cosmetic { float:left; padding: 0 5px 0 30px;}
img.img-whitening { float:left;}
	
input.submit, input.submit-contact-main { 
	width:60px; 
	cursor:pointer; 
	padding:0; 
	}

input.submit-contact-main { margin:85px 0 0 242px; }

input.submit-image { 
	background: url("../images/btn-submit.gif"); 
	width:63px; 
	height:15px; 
	border:none; 
	cursor:pointer; 
	}

/* ----- form ----- */ 

form { width:168px; padding:0px 0 10px 20px;}

form p	{ font-size:10px; }
.white { color: #FFF;}
form br { 
	line-height:0; /* defaults vertical spacing between fields */
	}  

input, textarea, select { 
	background-color:#DBE7D2; 
	border:1px solid #556F42;
	color:#27331F;
	width:158px; 
	height:18px; 
	margin-bottom:4px; /* 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:"Trebuchet MS", "Bitstream Vera Sans", Arial, Verdana, Helvetica, sans-serif; 
	font-size:12px;
	}

textarea { 
	height:70px; 
	overflow:auto; 
	}

/* main contact form
 * ------------------------------------------------------------------------- */
 
#contact-main { padding:20px 0 10px 30px;}
	 
#contact-main label { 
	width:220px; 
	position:relative; 
	display:block; 
	text-align:right; 
	margin-bottom:10px; 
	}
	
#contact-main label input, #contact-main label textarea, #contact-main label select { 
	width:200px;
	position:absolute; 
	left:110%; 
	top:-2px;
	}
	
#contact-main label textarea { height:100px; }
	

/* main framework
 * ------------------------------------------------------------------------- */

#wrap { background:url(../images/index/bg_wrap.jpg) repeat-y; width:751px; margin:0 auto; text-align:left;}
#header { position:relative; background:url(../images/index/header2.jpg) left top no-repeat; width:751px; height:112px;}
#header a { position:absolute; width:0px; height:0px; top:0px; left:0px;}/* home link within header */
#img-container { background:url(../images/index/img_container.jpg) left top no-repeat; height:217px;}	
	#banner-image { background:url(../images/index/banner1.jpg) left top no-repeat; height:217px;}	

#top-container { background:url(../images/index/top_section_bg.jpg) left top repeat-y; width:751px; margin:0;}
	#cosmetic {  width:367px; float: left; padding-top: 0px; padding-bottom: 6px;}
	#cosmetic p {padding: 6px 0px 0px 170px;}
	#whitening { width: 360px; float:left; padding-top: 0px; padding-bottom: 6px;}
	#whitening p {padding: 6px 0px 0px 160px;}
	
   	#column-left { width:539px; float:left;}
	#column-left p {margin:5px 21px 5px 30px;}
	#column-left h1, #column-left h2, #column-left h3  {margin:10px 21px 10px 30px;}
	#column-left ul {margin:15px 21px 15px 35px; color:#4C5F3D;}
	#column-left .gallery-thumbs {padding: 5px 0 5px 25px;}
		#title-welcome { background:url(../images/index/title_welcome.jpg) no-repeat left top; height:70px;}
	    #btm-container { width:539px; margin: 0;}
		#meet-dr { background:url(../images/index/title_meet_popadopoulos.jpg) no-repeat left top; width:275px; float: left;}
		#meet-dr p {padding: 5px 0px 5px 0px;}
		#meet-dr p.btm-intro {padding-top:66px;} 
		#procedures { background:url(../images/index/title_procedures.jpg) no-repeat left top; width:264px; float:left;}
	    #procedures p.pro-intro {padding-top:66px;}
		#procedures p {padding: 0px 10px 0px 0px;}
		#procedures ul {padding: 0px 0 0px 25px;}
	
	#column-right { width:212px; float:left;}
	#column-right p {padding: 5px 29px 5px 20px; color:#FFF;}
	#column-right p.qintro {padding-top:89px;}
	#column-right p.qintro-thanks {padding-top:10px;}
	#column-right a {color: #FFF;}
		#office-tour { position:relative; background:url(../images/index/title_office_tour.jpg) left top no-repeat; width:212px; height:103px;}
		#office-tour-btn a { position:absolute; width:212px; height:103px; top:0px; left:0px;}/* home link within header */
		#title-quickcontact { background:url(../images/index/title_quickcontact.jpg) no-repeat; height:187px; margin-top:17px; }
	 #title-quickcontact-thanks { background:url(../images/index/title_quickcontact.jpg) no-repeat; height:80px; margin-top:17px; }
	#page-footer { background:url(../images/index/page_footer.jpg) no-repeat; width:751px; height:55px; clear:both; overflow:hidden;}

/* sub framework
 * ------------------------------------------------------------------------- */
   
    #banner-image2 { background:url(../images/index/banner2.jpg) left top no-repeat; height:217px;}
	#banner-image3 { background:url(../images/index/banner3.jpg) left top no-repeat; height:217px;}	
	#banner-image4 { background:url(../images/index/banner4.jpg) left top no-repeat; height:217px;}	
	#banner-image5 { background:url(../images/index/banner5.jpg) left top no-repeat; height:217px;}	
	#title-about { background:url(../images/sub/title_about.jpg) no-repeat left top; height:70px;}
	#title-contact { background:url(../images/sub/title_contact.jpg) no-repeat left top; height:70px;}
	#title-cosmetic-dentistry { background:url(../images/sub/title_cosmetic_dentistry.jpg) no-repeat left top; height:70px;}
	#title-procedures { background:url(../images/sub/title_procedures.jpg) no-repeat left top; height:70px;}
	#title-veneers { background:url(../images/sub/subhead-veneers.jpg) no-repeat left top; height:70px;}
	#title-implant { background:url(../images/sub/subhead-implant.jpg) no-repeat left top; height:70px;}
	#title-smile-gallery { background:url(../images/sub/title_smile_gallery.jpg) no-repeat left top; height:70px;}
	#title-thankyou { background:url(../images/sub/title_thankyou.jpg) no-repeat left top; height:70px;}
	#title-sitemap { background:url(../images/sub/subhead-sitemap.jpg) no-repeat left top; height:70px;}

/* footer
 * ------------------------------------------------------------------------- */
 
#footer { width:760px; text-align:center; margin:0 auto; }
#footer a:link, #footer a:visited, #footer p { text-decoration:none; color:#000; }
#footer a:hover, #footer a:active { text-decoration:underline; color:#fff; }

#footer ul { margin-bottom:10px; }
#footer li { padding: 0 5px 0 7px; display:inline; border-left: 1px solid #000; }
#footer li.first { border: none; }
	
