@charset "utf-8";
/* CSS Document */

/* general typography*/
body {
	margin: 0 auto;
	width: 900px;
	font: 75%/120% Arial, Helvetica, sans-serif;
    text-align: left;
	position:relative;
	
}

h1{
	font-size:14px;
	font-weight:bold;
	
}
p{
	font-family:Arial, Helvetica, sans-serif;


}
#mainwrapper{
	width: 900px;
	background: #ece1f6;
	vertical-align:top;
	 margin: 0 auto; 
	 text-align: left;
	 position:relative;

}

ul#topnav {
	margin: 0;
	padding: 0;
	border-bottom: solid 1px #c0bdc6;
	background-color:#ece1f6;
	text-decoration: none;
	color: #c0bdc6;
	float: right;
	text-align:center;
	
}
ul#topnav li a{
	margin: 0;
	padding: 0;
	border-bottom: solid 1px #422410;
	background-color:#000000;
	text-decoration: underline;
	color: #c0bdc6;
}

.topnav{color: #B6B6B6 ;}

ul#main-nav li{
	list-style: none;
	display: inline;
	font: 115% Arial, Helvetica, sans-serif;
	font-weight: bold;
	padding: 5px 0px 0px 0px;
	margin: 0px 20px 0px 0px;
	float: right;
	text-align:center;
	font-stretch:ultra-expanded;
	height:31px;
	color: #8b82b3;
	text-decoration: none;
	position:relative;

}
#main-nav {
	height:31px;
	position:relative;
	top:-15px;
	 margin: 0 auto; 
	 text-align: left;
	 width:auto;
	
}
ul#main-nav li a{
	list-style: none;
	display: inline;
	font: 115% Arial, Helvetica, sans-serif;
	font-weight: bold;
	height:31px;
	color: #8b82b3;
	text-decoration: none;
}
ul#main-nav li a: hover{
	list-style: none;
	display: inline;
	font: 115% Arial, Helvetica, sans-serif;
	font-weight: bold;
	height:31px;
	color: #000;
	text-decoration: none;
}


#slide {
	margin: 0;
	padding: 0;	
	background: url(../../images/bps/slidesbg-2.png) no-repeat right top;
	text-decoration: none;
	height:35px;
	width:900px;
}

.btn-slide01 {
/*background: url(../images/bps/white-arrow.gif) no-repeat right -50px; */
	text-align: center;
	width: 144px;
	height: 31px;
	padding: 0px 0px 5px 25px;
	margin: 0 auto;
	display: block;
	font: bold 105%/100% Arial, Helvetica, sans-serif;
	color: #fff;
	text-decoration: none;
}
.btn-slide02 {
	/*background: url(../images/bps/white-arrow.gif) no-repeat right -50px;*/
	text-align: center;
	width: 144px;
	height: 31px;
	padding: 0px 0px 0px 7px;
	margin: 0 auto;
	display: block;
	font: bold 105%/100% Arial, Helvetica, sans-serif;
	color: #fff;
	text-decoration: none;
}
.btn-slide03 {
	/*background: url(../images/bps/white-arrow.gif) no-repeat right -50px;/*/
	text-align: center;
	width: 144px;
	height: 31px;
	padding: 0px 0px 10px 23px;
	margin: 0 auto;
	display: block;
	font: bold 105%/100% Arial, Helvetica, sans-serif;
	color: #fff;
	text-decoration: none;
}
#panel {
	background: #8b82b3;
	height: 170px;
	display: none;
	text-decoration: none;
	font-family:Arial, Helvetica, sans-serif;
	padding: 10px 20px 10px 10px;
	color:#FFFFFF;
	font-size:90%;
}
#panel a{
	color:#FFFFFF;
	text-decoration:underline;
}
#panel a:hover{
	color:#009966;
	text-decoration:underline;
}
.white a{
	color:#FFFFFF;
	

}
#panel2 {
	background: #8b82b3;
	height: 265px;
	display: none;
	font-family:Arial, Helvetica, sans-serif;
	padding: 10px 20px 10px 10px;
	color:#FFFFFF;
	font-size:90%;
}
#panel2 a{
	color:#FFFFFF;
	text-decoration:underline;
}
#panel2 a:hover{
	color:#009966;
	text-decoration:underline;
}
#panel3 {
	background: #8b82b3;
	height: 140px;
	display: none;
	font-family:Arial, Helvetica, sans-serif;
	padding: 10px 20px 10px 10px;
	color:#FFFFFF;
	font-size:90%;
}
#panel3 a{
	color:#FFFFFF;
	text-decoration:underline;
}
#panel3 a:hover{
	color:#009966;
	text-decoration:underline;
}
input.btn {   
  color:#8b82b3;   
  font: bold 84% 'trebuchet ms',helvetica,sans-serif;   
  background-color:#d7eada;   
  border: 1px solid;   
  border-color: #696 #363 #363 #696;   
  filter:progid:DXImageTransform.Microsoft.Gradient   
  (GradientType=0,StartColorStr='#ffffffff',EndColorStr='#d7eada'); 
 }   
 input.btn:hover {   
  color:#000;   
  font: bold 84% 'trebuchet ms',helvetica,sans-serif;   
  background-color:#d7eada;   
  border: 1px solid;   
  border-color: #363 #696 #696 #363;   
  filter:progid:DXImageTransform.Microsoft.Gradient   
  (GradientType=0,StartColorStr='#ffffffff',EndColorStr='#d7eada'); 
 } 
.active {
	background-position: right 12px;
	text-decoration: none;
}
.active2 {
	background-position: right 12px;
	text-decoration: none;
}
.active3 {
	background-position: right 12px;
	text-decoration: none;
}
.pstyle {
	font-family:Arial, Helvetica, sans-serif;
	padding: 10px 10px 10px 10px;
	margin: 10px 10px 10px 10px;
	text-decoration: none;
	font-size:12px;

}
li[class^='evname'] {
	width:35%;
}
ul#nav li{
	list-style: none;
	display: inline;
	font: 105% Arial, Helvetica, sans-serif;
	font-weight: bold;
	padding: 5px 9px 0px 0px;
	float: right;
	text-align:center;
	height:31px;
	text-decoration: none;
}
ul#nav li a{
	list-style: none;
	display: inline;
	font: 105% Arial, Helvetica, sans-serif;
	font-weight: bold;
	height:31px;
	text-decoration: none;
}
ul#nav li a: hover{
	list-style: none;
	display: inline;
	font: 105% Arial, Helvetica, sans-serif;
	font-weight: bold;
	color:#003399;
	height:31px;
	text-decoration: none;
}

a {
text-decoration: none;
}/*
a:focus {
	outline: none;
	text-decoration: none;
}
*/
#top {
	background: #ece1f6;
	height: 128px;
	width:900px;

}
.pink {
	background: #ece1f6;

}
#top-logo {
	width:900px;
	height:128px;
	background: #ece1f6;
	vertical-align:top;

	
	
}
#top-line{
	background: #d0cae3;
	height:6px;
	width:900px;
	position:relative;
	top:-34px;
	vertical-align:top;
	 margin: 0 auto; 
	 text-align: left;

}
.logo {
	margin-top:-50px;
	z-index:1;
	
}
#movie{
	z-index:-1;
}
#promobox{
	position:relative;
	float:left;
	width:250px;
	height:276px;
	padding: 0px 0px 0px 0px;
	background-color:#8b82b3;
	margin: -130px 0px 0px 0px;;
	color:#FFFFFF;
	z-index:5;
}
.promobox{
	color:#FFFFFF;	
	font-weight:600;
	font-family:Verdana, Arial, Helvetica, sans-serif;
	padding: 10px 10px 0px 10px;

}
<!--footer-->
#test{
	background:url(http://www.beachplumspa.com/images/bps/footer-bar.gif) no-repeat;
	background:url(/images/bps/footer-bar.gif)
}

#footer{
background:url(http://www.beachplumspa.com/images/bps/footer-bar.gif) no-repeat;
position:relative;

	width:900px;
	height:146px;
	margin:0px 0px 0px 0px;
	color:#677372;
	font-size: 11px;
	font-weight:600;
	font-family:Verdana, Arial, Helvetica, sans-serif;
	background-position:bottom;
	z-index:0;
	
}
.footer-copy{
	margin: 0px 0px 0px 270px;
	color:#677372;
	font-size: 11px;
	font-weight:600;
	font-family:Verdana, Arial, Helvetica, sans-serif;
	z-index:0;
}
.footer{
	margin: 10px 10px 10px 10px;
	color:#677372;
	font-size: 11px;
	font-weight:600;
	font-family:Verdana, Arial, Helvetica, sans-serif;
}

#footernav {
	height:50px;
	position:relative;
	margin:0px 0px 0px 10px;
	padding:100px 10px 0px 10px;
	vertical-align:bottom;
	
}
ul#footernav li{
	list-style: none;
	display: inline;
	font: 100% Arial, Helvetica, sans-serif;
	font-weight: bold;
	padding: 0px 5px 0px 0px;
	margin: 0px 18px 0px 0px;
	float: right;
	text-align:center;
	height:15px;
	color: #8b82b3;
	text-decoration: none;
	position:relative;

}

ul#footernav li a{
	list-style: none;
	display: inline;
	font: 100% Arial, Helvetica, sans-serif;
	font-weight: bold;
	height:15px;
	color: #8b82b3;
	text-decoration: none;
}
ul#footernav li a: hover{
	list-style: none;
	display: inline;
	font: 100% Arial, Helvetica, sans-serif;
	font-weight: bold;
	height:15px;
	color: #000;
	text-decoration: none;
}
/*
/*main action area of home page*/
#gradient{
	background-image:url(../../images/bps/circles-gradient.jpg);
	height:415px;
	width:900px;
	top:-35px;
	position:relative;
	vertical-align:top;
	 margin: 0 auto; 
	 text-align: left;

	

}
#concern-nav{
	list-style: none;
	position:relative;
	padding: 0px 10px 13px 10px;
	margin: 0px 0px 10px 660px;
	font-size: 11px;
	font-weight:600;
	font-family: "Times New Roman", Times, serif;
	line-height:19px;
	overflow: visible;
	text-decoration:none;
}
#concern2-nav{
	list-style: none;
	position:relative;
	padding: 13px 10px 10px 10px;
	margin: -150px 120px 0px 400px;
	font-size: 11px;
	font-weight:600;
	font-family: "Times New Roman", Times, serif;
	line-height:19px;
	overflow: visible;
	width:240px;
	text-decoration:none;
}
#hover-demo1 p:hover { background: #ff0; }
#concern-nav ul li.purple a:hover{
	color:#FFFFFF;
	background: #ff0; 
}
.purple{
	color:#8b82b3;
}
.purple-bold{
	color:#8b82b3;
	font-weight:bold;
}
.blue{
	color:#4b98c9;
	font-family:Arial, Helvetica, sans-serif;
}
.purple a{
	color:#4b98c9;
	text-decoration: none;
}
.purple a hover{
	color:#8b82b3;
	text-decoration:none;
}
.moreinfo{
	color:#8b82b3;
	font-style:italic;
	margin-left:230px;
}
.moreinfo a:hover{
	color:#738977;

}
.green{
	color:#738977;
	text-decoration:none;

}
.bold{
	font-weight:bold;
}


#purple{
	color:8b82b3;
}
#green{
	color:798f7d;
}
#home-copy{
	border:solid 4px #d7eada;
	width:483px;
	height:80px;
	background-color:#f3eefc;
	position:relative;
	margin: 0px 10px 10px 398px;
	padding: 5px;
	font-family:Arial, Helvetica, sans-serif;
	font-size:11px;
}
.homecopy{
	padding:3px;
	line-height:16px;
}
#nothing{
	width:1px;
	height:87px;
	position:relative;
	margin: 0px 10px 10px -10px;
	padding: 5px;
	
}
#headline{
	position:relative;
	color:black;
	font-family:Arial, Helvetica, sans-serif;
	font-size:12px;
	font-weight:bold;
	letter-spacing:2px;
	font-style:italic;
	margin: 5px 2px 5px 0px;
}
#bounce{
	width:900px;
	height:700px;


}	


/***scars/ stretch marks*******/
#line1{
	width:2px;
	height:138px;
	position:relative;
	background-color:#f3eefc;
	margin: -503px 10px 10px 655px;
	padding: 0px;
}
#line1a{
	width:48px;
	height:2px;
	position:relative;
	background-color:#f3eefc;
	margin: -11px 10px 10px 655px;
	padding: 0px;
}
#line1b{
	width:187px;
	height:15px;
	position:relative;
	border:solid 3px #a9cff2;
	margin: -21px 10px 10px 703px;
	padding: 0px;

}
#line1c{
	width:16px;
	height:2px;
	position:relative;
	background-color:#f3eefc;
	margin: -11px 10px 10px 665px;
	padding: 0px;
}
#line1d{
	width:176px;
	height:15px;
	position:relative;
	border:solid 3px #a9cff2;
	margin: -20px 10px 10px 485px;
	padding: 0px;
}
/***acne & flabbiness*******/
#line2{
	width:2px;
	height:124px;
	position:relative;
	background-color:#f3eefc;
	margin: -503px 10px 10px 655px;
	padding: 0px;
}
#line2a{
	width:42px;
	height:2px;
	position:relative;
	background-color:#f3eefc;
	margin: -11px 10px 10px 655px;
	padding: 0px;
}
#line2b{
	width:155px;
	height:15px;
	position:relative;
	border:solid 3px #a9cff2;
	margin: -25px 10px 10px 695px;
	padding: 0px;
}
#line2c{
	width:90px;
	height:2px;
	position:relative;
	background-color:#f3eefc;
	margin: -11px 10px 10px 566px;
	padding: 0px;
}
#line2d{
	width:125px;
	height:15px;
	position:relative;
	border:solid 3px #a9cff2;
	margin: -25px 10px 10px 436px;
	padding: 0px;
}
/***spider veins and cellulite****/
#line3{
	width:2px;
	height:102px;
	position:relative;
	background-color:#f3eefc;
	margin: -503px 10px 10px 655px;
	padding: 0px;
}
#line3a{
	width:36px;
	height:2px;
	position:relative;
	background-color:#f3eefc;
	margin: -11px 10px 10px 657px;
	padding: 0px;
}
#line3b{
	width:150px;
	height:15px;
	position:relative;
	border:solid 3px #a9cff2;
	margin: -23px 10px 10px 690px;
	padding: 0px;
}
#line3c{
	width:90px;
	height:2px;
	position:relative;
	background-color:#f3eefc;
	margin: -11px 10px 10px 566px;
	padding: 0px;
}
#line3d{
	width:130px;
	height:15px;
	position:relative;
	border:solid 3px #a9cff2;
	margin: -23px 10px 10px 430px;
	padding: 0px;
}
/***rosacea and loose skin****/
#line4{
	width:2px;
	height:81px;
	position:relative;
	background-color:#f3eefc;
	margin: -503px 10px 10px 655px;
	padding: 0px;
}
#line4a{
	width:26px;
	height:2px;
	position:relative;
	background-color:#f3eefc;
	margin: -11px 10px 10px 655px;
	padding: 0px;
}
#line4b{
	width:120px;
	height:15px;
	position:relative;
	border:solid 3px #a9cff2;
	margin: -21px 10px 10px 681px;
	padding: 0px;
}
#line4c{
	width:60px;
	height:2px;
	position:relative;
	background-color:#f3eefc;
	margin: -11px 10px 10px 595px;
	padding: 0px;
}
#line4d{
	width:170px;
	height:15px;
	position:relative;
	border:solid 3px #a9cff2;
	margin: -21px 10px 10px 420px;
	padding: 0px;
}
/***skin tone and expression lines**/
#line5{
	width:2px;
	height:60px;
	position:relative;
	background-color:#f3eefc;
	margin: -503px 10px 10px 655px;
	padding: 0px;
}
#line5a{
	width:16px;
	height:2px;
	position:relative;
	background-color:#f3eefc;
	margin: -11px 10px 10px 655px;
	padding: 0px;
}
#line5b{
	width:185px;
	height:15px;
	position:relative;
	border:solid 3px #a9cff2;
	margin: -19px 10px 10px 670px;
	padding: 0px;
}
#line5c{
	width:10px;
	height:2px;
	position:relative;
	background-color:#f3eefc;
	margin: -11px 10px 10px 646px;
	padding: 0px;
}
#line5d{
	width:230px;
	height:15px;
	position:relative;
	border:solid 3px #a9cff2;
	margin: -19px 10px 10px 410px;
	padding: 0px;
}
/****age spots and unwanted hair***/

#hp-sunspots{
	border:solid 4px #d7eada;
	width:483px;
	height:80px;
	background-color:#f3eefc;
	position:relative;
	margin: 0px 10px 10px 398px;
	padding: 5px;
	font-family:Arial, Helvetica, sans-serif;
	font-size:11px;
}
#line6{
	width:2px;
	height:41px;
	position:relative;
	background-color:#f3eefc;
	margin: -503px 10px 10px 655px;
	padding: 0px;
}
#line6a{
	width:3px;
	height:2px;
	position:relative;
	background-color:#f3eefc;
	margin: -11px 10px 10px 655px;
	padding: 0px;
}
#line6b{
	width:195px;
	height:15px;
	position:relative;
	border:solid 3px #a9cff2;
	margin: -20px 10px 10px 658px;
	padding: 0px;
}
#line6c{
	width:85px;
	height:2px;
	position:relative;
	background-color:#f3eefc;
	margin: -11px 10px 10px 571px;
	padding: 0px;
}
#line6d{
	width:165px;
	height:15px;
	position:relative;
	border:solid 3px #a9cff2;
	margin: -20px 10px 10px 400px;
	padding: 0px;
}


