
/*--------------------- Last Modified --> 2006.03.25 ---------------------*/
/*-----------------------------------------------------------------------*/


/* 
 ----------------------------------------------------------------------------
  Copyright Einstein Industries 2006. 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,label,div,dd,dt,dl,table,tr,td { margin:0; padding:0; }

/* prevent blue linked image borders */
a img,:link img,:visited img,fieldset { border:none; }


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


/* ----- type selectors ----- */ 
body { 
	background:#430707 url("../images/bg-body.jpg") top repeat-x;
	text-align:center; 
	font:12px/16px Arial, Helvetica, sans-serif; 
	color:#993300;
	}


blockquote { 
	margin-left:10px; 
	margin-right:10px; 
	}

h1	{ font-size:1.2em; color:#430706; font-weight:bold; }
h2	{ font-size:1.25em; color:#430706; font-weight:bold; margin: 0.75em 0 0.75em 20px;}
h2 a, h2 a:link, h2 a:visited {color: #430706;}
h3	{ font-size:1.0em; color:#7F2A00; font-weight:bold; margin-left: 20px;}
h4 {margin-left: 20px;}
#results-top {margin-left: 0;}
h1 span,h2 span,h3 span	{ display:none; }

a:link,a:visited	{ color:#BE4500; text-decoration:underline; outline:none; }
a:hover,a:active	{ color:#993300; text-decoration:underline; outline:none; }

/* ----- classes ----- */

div.clear	{ 
	clear:both;
	height:.01em; 
	overflow:hidden; 
	}

p.back-to-top a {
	text-align:right;
	margin-left:390px;
	font-size:.95em;
	text-decoration:none;
	}
	
	p.back-to-top a:link, p.back-to-top a:active, p.back-to-top a:visited {color:#430706;}
	p.back-to-top a:hover { color:#993300}
	
img.img-left { 
	float:left; 
	margin:2px 5px 0px 36px; 
	}
	
img.img-left-pic { 
	float:left; 
	margin:2px 10px 4px 0px; 
	}
	
img.img-right { 
	float:right; 
	margin:5px 0 10px 10px; 
	}

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

form {
	width:150px;
	margin:10px 0 15px 0;
	}

form label	{ font-size:.95em; }

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

input, textarea, select { 
	background-color:#F59C5B !important; /* to prevent highlighting by Google Toolbar */
	border:1px solid #FCE386;
	color:#993300;
	width:126px; /* 5 pixles smaller than form width !important */
	height:18px;
	line-height:18px;
	vertical-align: middle;
	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:Arial, Helvetica, sans-serif; 
	font-size:1.0em;
	}
	
select { width:150px; padding:0; } /* same width as form - !important */

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

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


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

#contact-main label { 
	width:180px; 
	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:190px;
	position:absolute; 
	left:110%; 
	top:-2px;
	}
	
#contact-main label select { width:195px; }
	
#contact-main label textarea { height:100px; overflow:auto; }


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

input.submit, input.submit-contact-main { 
	width:64px;
	height:18px;
	cursor:pointer; 
	padding:0; 
	}

input.submit-contact-main { margin:95px 0 0 196px; }

input.submit-image, input.submit-contact-main { /* REMOVE IF NOT USED */
	background:url("../images/btn-submit.gif") no-repeat;
	width:64px;
	height:18px;
	border:none;
	cursor:pointer;
	}


/* framework
 * ------------------------------------------------------------------------- */

#wrap {
	background:url("../images/bg-wrap.jpg") repeat-y;
	width:760px;
	margin:0 auto;
	text-align:left;
	}
	
body#about #wrap, body#practice #wrap, body#cosmetic #wrap, body#results-p #wrap, body#contact #wrap, body#thankyou #wrap {
	background:url("../images/bg-wrap-sub.jpg") repeat-y;
	}
	
	
#masthead {
	position:relative;
	background:url("../images/masthead.jpg");
	height:82px;
	text-indent: -9999em;
	}
	/* index page link within #masthead */		
	#masthead a {	
		position:absolute;
		left:36px;
		width:464px;
		top:16px;
		height:47px; 
		}
	#masthead a span {
		display:none;
		}

/* ----- content-left ----- */

#column-left {
	width:217px;
	float:left;
	
	}
	#left {background:url("../images/col-left-bg.jpg") repeat-y;}
	#left-top-main { background:url("../images/col-left-top-blank.jpg") no-repeat;padding-top:30px}
	#left-top { background:url("../images/col-left-top.jpg") no-repeat; padding-top:90px;}

	#left-top-blank { background:url("../images/col-left-top-blank.jpg") no-repeat; padding-top:90px;}
	#left-bottom{ background:url("../images/col-left-bottom.jpg") no-repeat; height:34px;}
	#left-top-location { background:url("../images/col-left-top-location.jpg") no-repeat; padding-top:118px;}
	#sendemail { background:url("../images/col-left-top.jpg") no-repeat; padding-top:90px;}
	#column-left p, #column-left h1, #column-left h2, #column-left h3 {
		margin:0 33px 0px 36px;
		}
	#column-left #left p {padding:0 33px 0 14px;}
	#column-left form { margin-left:49px; }
			
	#meet { background:url("../images/meet-dr.jpg") no-repeat; height:65px;}
	
	#procedures {background:url("../images/procedures-sub.jpg") no-repeat; height:98px;}
		
	#mediabutton {background-image:url("../images/img-media-button2.jpg");
		/*margin: 0 0 0 19px;*/
		width:198px;
		height:65px;	
	
	}	
	
	
	#mediabutton a {
		display: block;
		width: 198px;
		height: 65px;
	}
	
	#mediabutton a:hover { background-image:url("../images/img-media-button1.jpg");
	
	}
	
/* ----- content-middle ----- */
		
	#column-middle {
	width:326px;
	float:left;
	}
	
	#video { padding-top: 35px; background:url("../images/subhead-index.jpg") no-repeat #EA8C4C; }
	#video object#myFlashContent {width: 327px; height: 260px; position: relative; z-index: -1;}
	#video h1 {text-indent: -9999em;}
	#video p.ptop {margin-top: 12px; margin-bottom: 2em;}
	#video object, #video iframe {margin-left: 10px;}
	#video h3 {margin-top: 1em; }
	#index #middle h2 {padding-top: 2em;}
	#column-middle p, #column-middle h1 { padding:0 22px 0 22px;}
	
	#middle, #vidmid {background:url("../images/bg-welcome.jpg") repeat-y;}
	#welcome-top { background:url("../images/subhead-index2.jpg") no-repeat; height:90px;}
	#welcome-bottom {background:url("../images/bottom-welcome.jpg") no-repeat; height:49px; }
		
	#results-top {background:url("../images/top-results.jpg") no-repeat; height:61px; margin: 0;}
	#results-bottom, #video-bottom {background:url("../images/bottom-welcome.jpg") no-repeat; height:49px;}
		
/* ----- content-right ----- */

#column-right {
	background:url("../images/col-right-procedures.jpg") no-repeat;
	width:215px;
	float:left;
	padding-top:30px;
	}

	#column-right p, #column-right h1, #column-right h2, #column-right h3, #column-right > ul, #column-right dl {
		margin:0 0px 10px 0px;
		}
	#column-right form { margin-left:0px; }
	#column-right-padding { padding-top:300px; }
	 
	/* definition list */
	#column-right dl { padding-left: 20px; }
	#column-left dl { padding-left:38px;}
	#column-right dl a:link, #column-left dl a:link, #column-right dl a:active, 
	#column-left dl a:active, #column-right dl a:visited, #column-left dl a:visited  { text-decoration:none;}
	#column-right dl a:hover,#column-left dl a:hover { text-decoration:underline;} 
		#column-right dl dt, #column-left dl dt  {
			font-weight:bold;
			color:#993300;
			}
		#column-right dl dd, #column-left dl dd {
			background:transparent url("../images/bullet.gif") 0px 6px no-repeat;
			padding-left:12px;  /* pushes text to the right to display bg img */
			margin-left:0px;
			}
			
/* ----- column-right-sub ----- */
	
#column-right-sub {
	width:523px;
	padding-right: 20px;
	float:left;
	}
	
	#sub {background:url("../images/bg-sub.jpg") repeat-y; }
	#sub-bottom {background:url("../images/sub-bottom.jpg") no-repeat; height:52px;}
	
#column-right-sub p, #column-right-sub p.h1, #column-right-sub p.h2, #column-right-sub p.h3 { padding:0 59px 10px 23px;}	

		#column-right-sub ul { padding:5px 69px 5px 33px; }
		#column-right-sub ul li, #index #sidenav li { 
			background:transparent url("../images/bullet.jpg") 0px 5px no-repeat;
			padding-left:10px;  /* pushes text to the right to display bg img */
			}
	
	#quick-link { background:url("../images/quick-link-bg.jpg") repeat-y; float:right; margin:0 0px 0 5px; padding-right:50px; width:138px}
	#quick-top { background:url("../images/quick-link-top.jpg") no-repeat; height:73px; margin:0 0px 0 0px;}
	#quick-bottom { background:url("../images/quick-link-bottom.jpg") no-repeat; height:45px;}
	.no-link {font-size: 0.9em;}
	
	#column-right-sub dl a { font-size:.95em;}
	
	#column-right-sub dl dd {
			background:transparent url("../images/bullet.gif") 0px 6px no-repeat;
			padding-left:10px;  /* pushes text to the right to display bg img */
			margin-left:0px;
			}
	#column-right-sub dl { padding-left: 10px; }
	
	#column-right-sub dl dt  {
		font-weight:bold;
		color:#993300;
		}
	
	
	
/* ----- bottom-wrap ----- */
 
#bottom-wrap {
	background:url("../images/bottom-wrap.jpg") no-repeat;
	height:59px;
	clear:both;
	width:100%; /* fix for Safar */
	}
	
#logos { 
	width: 125px;
	margin: 1em auto 0 auto;
	}		
	
	
#bottom-wrap {
	background:url("../images/bottom-wrap-sub.jpg") no-repeat;
	height:107px;
	clear:both;
	width:100%; /* fix for Safar */
	}

	
/* header framework
 * ------------------------------------------------------------------------- */

#header-flash { height:258px; background:url("../images/flash-area.jpg") no-repeat; } /* sets height for the flash header - REMOVE IF NOT USED */

/* subhead framework
 * ------------------------------------------------------------------------- */

#column-right-sub h1 { height:108px; text-indent: -9999em;} /* sets height for all subheads */
#column-right-sub.cosmetic-sub h1 {text-indent: 0;}
#index h1 {margin: 0 0 49px; font-size: 1.5em; }
	.about h1 { background:url("../images/subhead-about.jpg") no-repeat; }
	.contact h1 { background:url("../images/subhead-contact.jpg") no-repeat; }
	.thankyou h1 { background:url("../images/subhead-thankyou.jpg") no-repeat; }
	.cosmetic h1 { background:url("../images/subhead-cosmetic.jpg") no-repeat; }
	.practice h1 { background:url("../images/subhead-practice.jpg") no-repeat; }
	.results h1 { background:url("../images/subhead-results.jpg") no-repeat; }


/* footer
 * ------------------------------------------------------------------------- */
 
#footer {
	width:760px;
	margin:0 auto;
	text-align:center;
	}

#footer p {
	color:#FFD385;
	margin:10px 0 10px 0;
	}

#footer a:link, #footer a:visited, #footer a:active { color:#FFD385; }

 #footer a:hover { color:#FFB866; }

#footer ul {margin-top:10px;}

#footer li { /* if your li's float, you can adjust border height w/ line-height */
	padding:0 5px 0 7px;
	display: inline;
	border-left: 1px solid #FFD385;
	}

	#footer li.first { border: none; }
	


/* Horozontal Sprite Nav
 * ------------------------------------------------------------------------- */

#nav { 
	background:url("../images/nav.jpg") no-repeat; 
	width:760px; 
	height:30px; 
	margin:0;
	padding:0; 
	}
#navwrap {position: relative; z-index: 9999;}

#nav span { display: none; }

#nav > li, #nav > li > a { height:30px; display:block; } /* change height here also */
#nav .submenu li {float: none; border-bottom: 1px solid #F3BB5B;}
#nav .submenu li a, #nav .submenu li a:hover {padding: 2px 7px; border: none; margin: 0;}
#nav > li { float:left; list-style:none; display:inline; }

#nav-01 > a{ width: 90px; margin-left: 19px;}
#nav-02 > a{ width: 107px;}
#nav-03 > a{ width: 107px;}
#nav-04 > a{ width: 165px;}
#nav-05 > a{ width: 123px;}
#nav-06 > a{ width: 130px;}


/*-------------- (-79px) X position of button / (-30px) height of image from above ------------- */
#nav-01 > a:hover { background:url("../images/nav.jpg")  -19px -30px no-repeat; }
#nav-02 > a:hover { background:url("../images/nav.jpg") -109px -30px no-repeat; }
#nav-03 > a:hover { background:url("../images/nav.jpg") -216px -30px no-repeat; }
#nav-04 > a:hover, #nav-04.sfHover > a { background:url("../images/nav.jpg") -323px -30px no-repeat; }
#nav-05 > a:hover { background:url("../images/nav.jpg") -488px -30px no-repeat; }
#nav-06 > a:hover { background:url("../images/nav.jpg") -611px -30px no-repeat; }


/*-------------- OPTIONAL - Keeps the hover state on each page based on body #id ------------- */
.index #nav-01 { background:url("../images/nav.jpg")  -19px -30px no-repeat; }
.about #nav-02 { background:url("../images/nav.jpg") -109px -30px no-repeat; }
.practice #nav-03 { background:url("../images/nav.jpg") -216px -30px no-repeat; }
.cosmetic #nav-04 { background:url("../images/nav.jpg") -323px -30px no-repeat; }
.results-p #nav-05 { background:url("../images/nav.jpg") -488px -30px no-repeat; }
.contact #nav-06 { background:url("../images/nav.jpg") -611px -30px no-repeat; }

/* finance box on homepage */
#financing-options { width: 326px; height: 246px; background: url(../images/financing-options.png) no-repeat; position: relative;}
#financing-options a {position: absolute; width: 286px; height: 71px; left: 20px; text-indent: -9999em;}
#financing-options a#carecredit {top: 20px;}
#financing-options a#chase {top: 106px;}

/* sidenav */
#column-right-sub #sidenav {padding: 0; margin-left: 9px; width: 120px;}
 #index #sidenav {margin-left: 20px; width: 173px; padding: 0;}
#column-right-sub #sidenav li { font-size: 11px;}
#index #sidenav li { font-size: 12px;}
#index #sidenav li a { text-decoration: none;}
#index #sidenav li a:hover { text-decoration: underline;}
#column-right-sub #sidenav > li, #index #sidenav > li {background: none; padding: 0; line-height: 19px;}
#column-right-sub #sidenav > li > a, #index #sidenav > li > a {font-weight: bold;}
#column-right-sub #sidenav > li > ul, #index #sidenav > li > ul {padding: 0;}

#nav a {text-decoration: none;}
#nav a:hover {text-decoration: underline;}
#nav .submenu, #nav .submenu ul {
	background: #FECC75;
	border: 1px solid #ef9546;
	padding: 0;
}
#nav .submenu a:hover {background: #FBC669;}
/*** ESSENTIAL STYLES ***/
.sf-menu, .sf-menu * {
	margin:			0;
	padding:		0;
	list-style:		none;
}
.sf-menu {
	line-height:	1.0;
}
.sf-menu ul {
	position:		absolute;
	top:			-999em;
	width:			14em; /* left offset of submenus need to match (see below) */
	z-index: 9999;
}
.sf-menu ul li {
	width:			100%;
}
.sf-menu li:hover {
	visibility:		inherit; /* fixes IE7 'sticky bug' */
}
.sf-menu li {
	float:			left;
	position:		relative;
}
.sf-menu a {
	display:		block;
	position:		relative;
}
.sf-menu li:hover ul,
.sf-menu li.sfHover ul {
	left:			0;
	top:			2.5em; /* match top ul list item height */
	z-index:		99;
}
ul.sf-menu li:hover li ul,
ul.sf-menu li.sfHover li ul {
	top:			-999em;
}
ul.sf-menu li li:hover ul,
ul.sf-menu li li.sfHover ul {
	left:			14em; /* match ul width */
	top:			0;
}
ul.sf-menu li li:hover li ul,
ul.sf-menu li li.sfHover li ul {
	top:			-999em;
}
ul.sf-menu li li li:hover ul,
ul.sf-menu li li li.sfHover ul {
	left:			10em; /* match ul width */
	top:			0;
}

/*** DEMO SKIN ***/
.sf-menu {
	float:			left;
	margin-bottom:	1em;
}
.sf-menu li {
	line-height: 23px;
}
	.sf-menu li li {
		line-height: 14px;
		padding: 4px 0;
	}
.sf-menu a, .sf-menu a:visited  { /* visited pseudo selector so IE6 applies text colour*/
	color:			#993300;
}
.sf-menu li:hover, .sf-menu li.sfHover,
.sf-menu a:focus, .sf-menu a:hover, .sf-menu a:active {
	outline:		0;
}

/*** arrows **/
.sf-menu a.sf-with-ul {
	min-width:		1px; /* trigger IE7 hasLayout so spans position accurately */
}
.sf-sub-indicator {
	position:		absolute;
	display:		block;
	right:			.75em;
	top:			1.05em; /* IE6 only */
	width:			10px;
	height:			10px;
	text-indent: 	-999em;
	overflow:		hidden;
	background:		url('../images/arrows-ffffff.png') no-repeat -10px -100px; /* 8-bit indexed alpha png. IE6 gets solid image only */
}
a > .sf-sub-indicator {  /* give all except IE6 the correct values */
	top:			.8em;
	background-position: 0 -100px; /* use translucent arrow for modern browsers*/
}
/* apply hovers to modern browsers */
a:focus > .sf-sub-indicator,
a:hover > .sf-sub-indicator,
a:active > .sf-sub-indicator,
li:hover > a > .sf-sub-indicator,
li.sfHover > a > .sf-sub-indicator {
	background-position: -10px -100px; /* arrow hovers for modern browsers*/
}

/* point right for anchors in subs */
.sf-menu ul .sf-sub-indicator { background-position:  -10px 0; }
.sf-menu ul a > .sf-sub-indicator { background-position:  0 0; }
/* apply hovers to modern browsers */
.sf-menu ul a:focus > .sf-sub-indicator,
.sf-menu ul a:hover > .sf-sub-indicator,
.sf-menu ul a:active > .sf-sub-indicator,
.sf-menu ul li:hover > a > .sf-sub-indicator,
.sf-menu ul li.sfHover > a > .sf-sub-indicator {
	background-position: -10px 0; /* arrow hovers for modern browsers*/
}

/*** shadows for all but IE6 ***/
.sf-shadow ul.sf-shadow-off {
	background: transparent;
}
#column-right-sub.cosmetic-sub h1 {height: auto; font-size: 2em; font-family: georgia; margin: 2em 1em 1em 20px; color: #B4571C; line-height: 1em;}
a.jump {text-indent: -9999em; visibility: hidden;}
#column-middle #results {background: #EA8C4C; margin-right: 1px;}
#social {width: 173px; overflow: hidden; margin-left: 37px;}
#social li {float: left; margin-right: 7px;}
.adlink {margin: 1em 0 1em 37px; display: block; width: 162px; height: 74px;}
.left {float: left; margin-right: 0.75em; margin-bottom: 0.75em;}
.right {float: right; margin-left: 0.75em; margin-bottom: 0.75em;}
.otherbox {padding: 10px; background: #FDA656; border: 1px solid #FBE285; width: 467px; margin-left: 22px;}
.otherbox p {padding-left: 0 !important; padding-right: 0 !important; font-weight: bold;}
.otherbox ul {padding-left: 10px !important; padding-right: 0 !important;}
#cont-wrap {margin: 0;}
#holiday {display: block; width: 47px; height: 214px; background: url(../images/discount.png) no-repeat -1px 0; position: absolute; left: 0; top: 10%; text-indent: -9999em; z-index: 9999;}
#holiday:hover {background-position: 0 0;}
#holidayd {display: block; width: 268px; height: 67px; background: url(../images/discount2.png) no-repeat; text-indent: -9999em;}
p.center {margin: 0 auto; text-align: center;}
#column-right-sub object {float: right; margin: 0 29px 22px 22px;}
#column-right-sub img {margin-left: 22px;}
object + h3 {margin-top: 1em;}
.index object {margin: 1em 0;}
#vidmid {margin-top: 1em;}
h3.clear {clear: both; margin-top: 1em; }
#hdis {background: #F59C5B; border: 1px solid #FCE386; padding-bottom: 10px; margin-left: 10px; width: 303px;}
