/* ------------------------------------------------------------------------------------- */
/* Copyright Einstein Industries 2004. 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/FireFox                             */
/*                                                                                       */
/* CSS Document                                                                          */
/* ------------------------------------------------------------------------------------- */

:link,:visited { text-decoration:none }

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
{ margin:0; padding:0 }

a img,:link img,:visited img { border:none }

/* basic elements
 * ------------------------------------------------------------------------------------- */
body {
	background: #B1C5DA url(../images/bg.jpg);
	text-align: center;
}

p, div, li, div, h1, h2, h3, h4, td, input, select, textarea {
	font-family: Arial, Helvetica, sans-serif;
	font-size: 11px;
	color: #000000;
	line-height: 16px;
}

a:link, a:visited {
	color: #0C598D;
	text-decoration: underline;
}
a:hover, a:active {
	color: #A0B7D0;
	text-decoration: underline;
}

span {
	display: none;
}

/* main structural elements
 * ------------------------------------------------------------------------------------- */
#wrapper {
	width: 780px;
	margin: 0 auto;
	text-align: left;
}

.index {
	background: url(../images/index/bg-index.jpg) left top repeat-y;
}

.html {
	background: url(../images/bg-main.jpg) left top repeat-y;
}

/* HORIZONTAL sprite nav
 * ------------------------------------------------------------------------------------- */
#header {
	background: url(../images/header.jpg) left top no-repeat;					
	width: 203px;
	height: 80px;
	padding: 0px;
	margin-left: 577px;
	position: absolute;
}
#header li span {display: none;}
#header li {margin: 0; padding: 0; list-style: none; position: absolute; top: 0;}

#header li, #header a {height: 80px; display: block;}
#header-01 {left: 0px; width: 46px;}
#header-02 {left: 58px; width: 59px;}
#header-03 {left: 116px; width: 53px;}

#header-01 a:hover {background: transparent url(../images/header.jpg) -0px -80px no-repeat;}
#header-02 a:hover {background: transparent url(../images/header.jpg) -58px -80px no-repeat;}
#header-03 a:hover {background: transparent url(../images/header.jpg) -116px -80px no-repeat;}


/* VERTICAL sprite nav
 * ------------------------------------------------------------------------------------- */
#menu {
	background: url(../images/menu.jpg) left top no-repeat;					
	width: 216px;
	height: 466px;
	padding: 0px;
	margin: 0px;
	position: relative;
}
#menu li span {display: none;}
#menu li {margin: 0; padding: 0; list-style: none; position: absolute;}

#menu li, #menu a {height: 35px; display: block;}
#menu-01 {top: 39px;}
#menu-02 {top: 74px;}
#menu-03 {top: 109px;}
#menu-04 {top: 144px;}
#menu-05 {top: 179px;}
#menu-06 {top: 214px;}
#menu-07 {top: 249px;}
#menu-08 {top: 284px;}
#menu-09 {top: 319px;}
#menu-10 {top: 354px;}
#menu-11 {top: 392px;}
#menu-12 {top: 430px;}


#menu-01, #menu-02, #menu-03, #menu-04, #menu-05, #menu-06, #menu-07, #menu-08, #menu-09, #menu-10, #menu-11, #menu-12 { left: 0px; width: 216px; }

#menu-01 a:hover {background: transparent url(../images/menu.jpg) -216px -39px no-repeat;}
#menu-02 a:hover {background: transparent url(../images/menu.jpg) -216px -74px no-repeat;}
#menu-03 a:hover {background: transparent url(../images/menu.jpg) -216px -109px no-repeat;}
#menu-04 a:hover {background: transparent url(../images/menu.jpg) -216px -144px no-repeat;}
#menu-05 a:hover {background: transparent url(../images/menu.jpg) -216px -179px no-repeat;}
#menu-06 a:hover {background: transparent url(../images/menu.jpg) -216px -214px no-repeat;}
#menu-07 a:hover {background: transparent url(../images/menu.jpg) -216px -249px no-repeat;}
#menu-08 a:hover {background: transparent url(../images/menu.jpg) -216px -284px no-repeat;}
#menu-09 a:hover {background: transparent url(../images/menu.jpg) -216px -319px no-repeat;}
#menu-10 a:hover {background: transparent url(../images/menu.jpg) -216px -354px no-repeat;}
#menu-11 a:hover {background: transparent url(../images/menu.jpg) -216px -392px no-repeat;}
#menu-12 a:hover {background: transparent url(../images/menu.jpg) -216px -430px no-repeat;}


#procedures {
	background: url(../images/index/procedures.jpg) left top no-repeat;					
	width: 251px;
	height: 331px;
	padding: 0px;
	margin: 0px;
	position: relative;
}
#procedures li span {display: none;}
#procedures li {margin: 0; padding: 0; list-style: none; position: absolute;}

#procedures li, #procedures a {height: 24px; display: block;}
#procedures-01 {top: 155px;}
#procedures-02 {top: 179px;}
#procedures-03 {top: 203px;}
#procedures-04 {top: 227px;}
#procedures-05 {top: 251px;}
#procedures-06 {top: 275px;}
#procedures-07 {top: 299px;}

#procedures-01, #procedures-02, #procedures-03, #procedures-04, #procedures-05, #procedures-06, #procedures-07 { left: 0px; width: 251px; }

#procedures-01 a:hover {background: transparent url(../images/index/procedures.jpg) -251px -155px no-repeat;}
#procedures-02 a:hover {background: transparent url(../images/index/procedures.jpg) -251px -179px no-repeat;}
#procedures-03 a:hover {background: transparent url(../images/index/procedures.jpg) -251px -203px no-repeat;}
#procedures-04 a:hover {background: transparent url(../images/index/procedures.jpg) -251px -227px no-repeat;}
#procedures-05 a:hover {background: transparent url(../images/index/procedures.jpg) -251px -251px no-repeat;}
#procedures-06 a:hover {background: transparent url(../images/index/procedures.jpg) -251px -275px no-repeat;}
#procedures-07 a:hover {background: transparent url(../images/index/procedures.jpg) -251px -299px no-repeat;}

/* buttons - read more
 * ------------------------------------------------------------------------------------- */

 #megapeel a {
    display: block;
    height: 45px;
    width: 185px;
    margin: 0;
    padding: 0;
    background: url(../images/index/megapeel.jpg) 0 0 no-repeat;
    }

 #megapeel a:hover, #megapeel a:active {
    background-position: 0 -45px;
    }
	
 #q4 a {
    display: block;
    height: 45px;
    width: 181px;
    margin: 0;
    padding: 0;
    background: url(../images/index/q4.jpg) 0 0 no-repeat;
    }

 #q4 a:hover, #q4 a:active {
    background-position: 0 -45px;
    }

 #skincare a {
    display: block;
    height: 45px;
    width: 198px;
    margin: 0;
    padding: 0;
    background: url(../images/index/skincare.jpg) 0 0 no-repeat;
    }

 #skincare a:hover, #skincare a:active {
    background-position: 0 -45px;
    }
/* begin son of suckerfish
 * ------------------------------------------------------------------------------------- */

	#menu li ul {
		position: absolute;
		left: -9999px;
		background-color: #720000;
	}
	
	#menu li ul li {
		height: 20px;
	}
	#menu li ul li a {
		width: 100%;
		height: 20px;
		line-height: 20px;
	}
	#menu li ul li a span {
		display: block;
		padding-left: 5px;
	}
	
	#menu a:link, #menu a:visited, #menu a:hover, #menu a:active {
		font-size: 11px;
		color: #FFFFFF;
		text-decoration: none;
	}

	#menu li:hover ul, #menu li.sfhover ul	{ left: auto; }

	#menu-04 ul a:hover, #menu-05 ul a:hover, #menu-06 ul a:hover, #menu-07 ul a:hover, #menu-08 ul a:hover { 
		background-image: none;
		background-color: #AA0000; 
	}
	
	#menu-04 ul, #menu-04 li { width: 168px; }
	#menu-05 ul, #menu-05 li { width: 170px; }
	#menu-06 ul, #menu-06 li { width: 160px; }
	#menu-07 ul, #menu-07 li { width: 160px; }
	#menu-08 ul, #menu-08 li { width: 160px; }

/* image replacement
 * ------------------------------------------------------------------------------------- */
#banner	{ position:relative; }

#banner #logo {
	height: 80px;
	width: 577px;
	background: url(../images/banner.jpg) left top no-repeat;
}
	
	#logo a {
		position: absolute;
		width: 375px;
		height: 80px;
		top: 15px;
		left: 12px;
	}
		
.tagline {
	background: url(../images/tagline.jpg) left top no-repeat;
	width: 564px;
	height: 62px;
}

#megapeel-div {
	width: 185px;
	float: left;
	background: url(../images/index/megapeel/bg.jpg) left top repeat-y;
}
	h2.megapeelh1 {
		background: url(../images/index/megapeel/header.jpg) left top no-repeat;
		width: 185px;
		height: 87px;
	}
	#megapeel-div p {
		margin: 10px 10px 0px 25px;
	}

#q4-div {
	width: 181px;
	float: left;
	background: url(../images/index/q4/bg.jpg) left top repeat-y;
}

	h2.q4h1 {
		background: url(../images/index/q4/header01.jpg) left top no-repeat;
		width: 181px;
		height: 87px;
	}
	#q4-div p {
		margin: 10px 15px 0px 25px;
	}

#skincare-div {
	width: 198px;
	float: left;
	background: url(../images/index/skincare/bg.jpg) left top repeat-y;
}

	h2.skincareh1 {
		background: url(../images/index/skincare/header.jpg) left top no-repeat;
		width: 198px;
		height: 87px;
		cursor: pointer;
	}
	#skincare-div p {
		margin: 10px 25px 0px 25px;
	}

h2.welcome-title {
	width: 564px;
	height: 106px;
	background: url(../images/pagetitles/welcome.jpg) left top no-repeat;
}

h2.products-index-title {
	width: 564px;
	height: 106px;
	background: url(../images/index/products.jpg) left top no-repeat;
}

.contactus {
	padding-bottom: 11px;
	width: 216px;
	height: 60px;
	background: url(../images/contact_us.jpg) left top no-repeat;
}

.seminars {
	width: 216px;
	height: 60px;
	background: url(../images/seminars.jpg) left top no-repeat;
}

.about-title {
	width: 564px;
	height: 106px;
	background: url(../images/pagetitles/about.jpg) left top no-repeat;
}

.megapeel-title {
	width: 564px;
	height: 106px;
	background: url(../images/pagetitles/megapeel.jpg) left top no-repeat;
}

.megapeelequipment-title {
	width: 564px;
	height: 106px;
	background: url(../images/pagetitles/megapeel_equipment.jpg) left top no-repeat;
}

.q4-title {
	width: 564px;
	height: 106px;
	background: url(../images/pagetitles/q4.jpg) left top no-repeat;
}

.q4treatment-title {
	width: 564px;
	height: 106px;
	background: url(../images/pagetitles/q4_treatments.jpg) left top no-repeat;
}

.dmskincare-title {
	width: 564px;
	height: 106px;
	background: url(../images/pagetitles/dmskincare.jpg) left top no-repeat;
}

.dmskincaretreatment-title {
	width: 564px;
	height: 106px;
	background: url(../images/pagetitles/dmskincare_products.jpg) left top no-repeat;
}

.yourbusiness-title {
	width: 564px;
	height: 106px;
	background: url(../images/pagetitles/yourbusiness.jpg) left top no-repeat;
}

.seminars-title {
	width: 564px;
	height: 106px;
	background: url(../images/pagetitles/seminars.jpg) left top no-repeat;
}

.contact-title {
	width: 564px;
	height: 106px;
	background: url(../images/pagetitles/contact.jpg) left top no-repeat;
}

.sitemap-title {
	width: 564px;
	height: 106px;
	background: url(../images/pagetitles/sitemap.jpg) left top no-repeat;
}

.thankyou-title {
	width: 564px;
	height: 106px;
	background: url(../images/pagetitles/thankyou.jpg) left top no-repeat;
}

.gallery-title {
	width: 564px;
	height: 106px;
	background: url(../images/pagetitles/gallery.jpg) left top no-repeat;
}

.articles-title {
	width: 564px;
	height: 106px;
	background: url(../images/pagetitles/articles.jpg) left top no-repeat;
}
.csculpt-title {
	width: 564px;
	height: 106px;
	background: url(../images/pagetitles/csculpt.jpg) left top no-repeat;
}
.dermayag-title {
	width: 564px;
	height: 106px;
	background: url(../images/pagetitles/dermayag.jpg) left top no-repeat;
}

.testimonials-title {
	width: 564px;
	height: 106px;
	background: url(../images/pagetitles/testimonials.jpg) left top no-repeat;
}


#megapeel-machine {
	background: url(../images/sub/megapeel_all.jpg) left top no-repeat;
	width: 373px;
	height: 137px;
	margin: 0 auto;
}
#tips {
	background: url(../images/sub/megapeel_tips.jpg) left top no-repeat;
	width: 139px;
	height: 103px;
	float: right;
	margin-right: 35px;
}

#book {
	background: url(../images/book_cover.jpg) left top no-repeat;
	width: 149px;
	height: 200px;
	float: right;
	margin-right: 35px;
}

#megapeel-one {
	background: url(../images/sub/megapeel_one.jpg) left top no-repeat;
	width: 175px;
	height: 175px;
	float: right;
	margin-right: 35px;
	margin-top: 15px;
}

#dmskincare1 {
	background: url(../images/sub/dmskincare_full_line.jpg) left top no-repeat;
	width: 166px;
	height: 152px;
	float: right;
	margin-right: 35px;
	margin-top: 15px;
}

#dmskincare-fullline {
	background: url(../images/sub/dm_products.jpg) left top no-repeat;
	width: 141px;
	height: 122px;
	float: right;
	margin-right: 35px;
	margin-top: 15px;
}

#q4-handpiece {
	background: url(../images/sub/q4_handpiece.jpg) left top no-repeat;
	width: 137px;
	height: 95px;
	float: right;
	margin-right: 35px;
}

#q4-all {
	background: url(../images/sub/q4_all01.jpg) left top no-repeat;
	width: 141px;
	height: 170px;
	float: left;
	margin-left: 30px;
	padding-left: 5px;
}

#q4-only {
	background: url(../images/sub/q4_only01.jpg) left top no-repeat;
	width: 153px;
	height: 240px;
	float: right;
	margin-right: 35px;
}

/* content
 * ------------------------------------------------------------------------------------- */
#content-container {
	width: 780px;
	margin: 0 auto;
	padding: 0;
}

#content-left {
	width: 216px;
	float: left;
}

	#content-left form {
		margin: 0px 23px 30px 43px;
	}
	#content-left p {
		margin: 0px 23px 10px 43px;
		color: #5F5F5F;
	}
	
#content-right {
	width: 564px;
	float: left;
}

#buttons {
	width: 564px;
	height: 206px;
	margin: 0;
	padding: 0;
}

#welcome {
	width: 564px;
	float: left;
	background: url(../images/index/bg-welcome.jpg) left top repeat-y;
}
	#welcome p {
		margin: 5px 35px 10px 35px;
	}
	#welcome-img {
		width: 251px;
		height: 331px;
		float: right;
		background: url(../images/index/featured.jpg) left top no-repeat;
	}

#products-index {
	width: 564px;
	float: left;
}
	#products-index p {
		margin: 5px 35px 10px 35px;
	}
	#products-index-img {
		width: 251px;
		height: 229px;
		float: right;
		background: url(../images/index/doggies.jpg) left top no-repeat;
	}

#content-sub {
	width: 564px;
	float: left;
}
	#content-sub p {
		margin: 0px 35px 10px 35px;
	}
	
	#content-sub h1, #content-sub h2, #content-sub h3 {
		margin: 20px 35px 0px 35px;
	}
	#content-sub h1, #content-sub h2, #content-sub h3 {
		font-size: 12px;
		color: #932323;
	}
	

/* footer
 * ------------------------------------------------------------------------------------- */
#page-footer {
	background: url(../images/footer.jpg) left top no-repeat;
	width: 780px;
	height: 88px;
	clear: both;
}

	#page-footer ul {
		padding-top: 54px;
		text-align: center;
	}
	
	#page-footer li { 
		margin: 0px;
		padding: 0px;
		display: inline;
		color: #FFFFFF;
	}
	
	#page-footer a:link, #page-footer a:visited {
		color: #FFFFFF;
		text-decoration: underline;
	}
	#page-footer a:hover, #page-footer a:active {
		color: #000000;
		text-decoration: underline;
	}
	
#page-footer-sub {
	background: url(../images/page-footer-sub.jpg) left top no-repeat;
	width: 780px;
	height: 88px;
	clear: both;
}

	#page-footer-sub ul {
		padding-top: 54px;
		text-align: center;
	}
	
	#page-footer-sub li { 
		margin: 0px;
		padding: 0px;
		display: inline;
		color: #FFFFFF;
	}
	
	#page-footer-sub a:link, #page-footer-sub a:visited {
		color: #FFFFFF;
		text-decoration: underline;
	}
	#page-footer-sub a:hover, #page-footer-sub a:active {
		color: #000000;
		text-decoration: underline;
	}

#footer {
	width: 760px;
	margin: 0px auto;
	padding: 14px;
	text-align: center;
}
	
	#footer li { 
		margin: 0px;
		padding-bottom: 10px;
		display: inline;
	}

	#footer p {
		color: #000000;
		margin-top: 15px;
	}

	#footer a:link, #footer a:visited {
		color: #000000;
		text-decoration: underline;
	}
	#footer a:hover, #footer a:active {
		color: #932020;
		text-decoration: underline;
	}

/* misc layout elements 
 * ------------------------------------------------------------------------------------- */
 
input, textarea {
	font-family: Arial, Helvetica, sans-serif;
	font-size: 11px;
	color: #5F5F5F;
	border: 1px solid #5F5F5F;
	background-color: #FFFFFF;
	margin-bottom: 3px;
}

.quickcontact {
	width: 145px;
}

.top {
	display: block;
	text-align: right;
	font-size: 10px;
}

.big-form label, .big-form-field {
	display: block;
	width: 150px;
	float: left;
	margin-bottom: 10px;
}

.big-form label {
	text-align: right;
	width: 100px;
	padding-right: 20px;
}

.big-form br {
	clear: left;
}

img.img-left {
	float: left;
	margin: 0px 10px 10px 0px;
}

img.img-right {
	float: right;
	margin: 0px 0px 10px 10px;
}

img.img-right-pdf {
	float: right;
	margin: 0px 30px 10px 10px;
}


div.clear {
	clear: both;
}

th {
	text-align: center;
	background: url(../images/sub/seminar_bg.jpg) left top no-repeat;
	height: 50px;
	color: #0D598D;
}
.table-spacing {
	margin-bottom: 25px;
}
.table-text-color {
	color: #0D598D;
}

#bna-left {
	width: 250px;
	float: left;
	margin-left: 20px;
}
	#bna-left br {
		clear: both;
	}
	
	#bna-left img {
		margin: 10px 0px 5px 0px;
	}
	#bna-left p {
		margin: 0px;
		color: #932323;
	}
	
#bna-right {
	width: 250px;
	float: left;
}
	#bna-right br {
		clear: both;
	}
	
	#bna-right img {
		margin: 10px 0px 5px 0px;
	}
	
	#bna-right p {
		margin: 0px;
		color: #932323;
	}

#bna-left-2 {
	width: 250px;
	float: left;
	margin-left: 35px;
}
	#bna-left-2 br {
		clear: both;
	}
	
	#bna-left-2 img {
		margin: 10px 0px 5px 0px;
	}
	
#bna-right-2 {
	width: 250px;
	float: left;
}
	#bna-right-2 br {
		clear: both;
	}
	
	#bna-right-2 img {
		margin: 10px 0px 5px 0px;
	}
