/* Created by Bi-'stO Design : bistodesign.com */

/* COLORS
Color: #HEXHEX (usage)
Color: #HEXHEX (usage)
Color: #HEXHEX (usage)
*/



/* Zero */
* {
	vertical-align: top;
	margin: 0px;
	padding: 0px;
	border: 0px;
	}
	
	
	
a{ /* part I of link dotted border elimination */
outline: none;
}

:focus { /* part II of link dotted border elimination */
-moz-outline-style: none;
}
	
/* --------   -------- */

body{
	background-image: url(images/mainpage/backgroundpattern.gif);
	background-repeat: repeat-x;
	}
	
	
p{
	font-family: Arial, Verdana;
	color: white;
	font-size: 10px;
	font-weight: 200;
	line-height: 17px;
	letter-spacing: 1px;
	padding-bottom: 5px
	}

#container{
	height: 600px;
	background-color: black;
	background-image: url(images/mainpage/backgroundline.jpg);
	background-position: bottom left;
	background-repeat: repeat-x;
	min-width: 950px;
	width: expression(document.body.clientWidth < 952? "950px" : document.body.clientWidth > 12002? "12000px" : "auto");
	}

h2{
	font-family: Arial;
	font-size: 18px;
	color: #DC358D;
	padding-bottom: 5px;
	margin-top: 10px;
	}

h3{
	display: block;	
	height: 45px;
	text-indent: -99999px;
	background-repeat: no-repeat;
	padding-bottom: 5px;
	}
	
b{
	font-family: Arial, Verdana;
	color: #DC358D;
	font-size: 10px;
	font-weight: 200;
	line-height: 17px;
	letter-spacing: 1px;
	
	}

#history h3  { background-image: url("images/aboutpage/subheads/history.jpg") }

#philosophy h3  { background-image: url("images/aboutpage/subheads/philosophy.jpg") }

#store h3  { background-image: url("images/aboutpage/subheads/store.jpg") }



/* --------- Content -------- */

#mainphoto{
	height:600px;
	width:275px;
	position: absolute;
	left: 0px;
	top: 0px;
	background-image: url(images/mainphoto/maureen.jpg);
	clear: both;
	}
	
	
#rightcontent{
	height: 600px;	
	clear: both;
	float: right;
	background-position: bottom left;
	background-repeat: repeat-x;
	}
	
#about #rightcontent {
	background-position: 639px 217px;
	background-repeat: no-repeat;
	float: none;
	}
	
	
	 
	
/*#introfloat{
	height: 150px;
	width: 350px;
	float: left;
}*/
	
#intro{
	height: 150px;
	width: 375px;
	margin-left: 45px;
	position: absolute;
	left: 240px;
	top: 100px;
	clear: both;
	}

#promofloat{
	height: 300px;
	width: 675px;
	float: right;
	clear: both;
	margin-top: 10px;
	}
	
#productofmonth{
	width: 225px;
	height: 300px;
	float: right;
	}
	
#pom a, #pom a:link, #pom a:active, #pom a:visited {
	
	display: block;
	width: 225px;
	height: 300px;
	background-image: url(images/mainpage/productofmonth/twoforten.jpg);
	background-position: 0px 0px;
	text-indent: -99999px;
	overflow: hidden;
	background-repeat: repeat
	}

#pom a:hover, #pom a:visited:hover {
	background-position: 0px 300px;			
	}
	
#promobayone{
	width: 225px;
	height: 300px;
	float: right;
	}
	
#promobaytwo{
	width: 225px;
	height: 300px;
	float: right;
	}
	
#description{
	width: 290px;
	height: 500px;
	position: absolute;
	left: 275px;
	top: 70px;
	background-image: url(images/products/descriptionbg.jpg);
	background-repeat: no-repeat;
	background-position: top left;
	}
	
#descriptiontype{
	width: 265px;
	height: 300px;
	margin-left: 25px;
	margin-top: 20px;
	}
	
#productfloat{
	width: 375px;
	height: 300px;
	float: right;
	clear: both;
	}

#mainlinks{
	width: 300px;
	height: 200px;
	position: absolute;
	left: 295px;
	top: 100px;
	}

#mainlinksrow{
	width: 600px;
	height: 100px;
	position: absolute;
	left: 295px;
	top: 300px;
	}

#linkscontainer{
	width: 600px;
	height: 180px;
	position: absolute;
	left: 325px;
	top: 405px;
	}

#columnone{
	width: 130px;
	height: 160px;
	float: left;
	margin-top: 18px;
	}
	
#columntwo{
	width: 130px;
	height: 160px;
	float: left;
	margin-top: 18px;
	}

#columnthree{
	width: 130px;
	height: 160px;
	float: left;
	margin-top: 18px;
	}
	
.linklist{
	color: white;
	font-family: Verdana, Arial; 
	font-size: 10px;
	line-height: 14px;
	list-style-type: none;
	text-transform: uppercase;
	letter-spacing: 1px;
	
	}
	
	
.linklist a, .linklist a:link, .linklist a:active, .linklist a:visited {

	color: #a1a1a1;
	text-decoration: none;
	}

.linklist a:hover, .linklist a:visited:hover {
				
	color: #ffffff;
	border-bottom-style: dotted;
	border-bottom-width: 1px;
	}
	
.educator a, .educator a:link, .educator a:active, .educator a:visited {
	color: #DC358D;
	text-decoration: none;
	}

#columntwo .linklist{
	padding-left: 5px;
	}

#columnthree .linklist{
	padding-left: 5px;
	}
	

#mainlinksone a, #mainlinksone a:link, #mainlinksone a:active, #mainlinksone a:visited {
	display: block;
	width: 100px;
	height: 100px;
	float: left;
	background-position: 0px 100px;
	text-indent: -99999px;
	overflow: hidden;
	background-repeat: repeat
	}
	
#mainlinksone li{
	float: left;
	}
	
#mainlinksone a:hover, #mainlinksone a:visited:hover {
	background-position: 0px 0px;
	}

#mainlinksone #jbevlink a{
	background-image: url(images/linkspage/jbev.jpg)
	}
	
#mainlinksone #italylink a{
	background-image: url(images/linkspage/italy.jpg)
	}
	
#mainlinksone #alternalink a{
	background-image: url(images/linkspage/alterna.jpg)
	}
	
#mainlinksone #pureologylink a{
	background-image: url(images/linkspage/pureology.jpg)
	}

#mainlinksone #diksonlink a{
	background-image: url(images/linkspage/dikson.jpg)
	}
	
#mainlinksone #rofflerlink a{
	background-image: url(images/linkspage/roffler.jpg)
	}
	
#mainlinksone #enjoylink a{
	background-image: url(images/linkspage/enjoy.jpg)
	}
	
#mainlinkstwo a, #mainlinkstwo a:link, #mainlinkstwo a:active, #mainlinkstwo a:visited {
	display: block;
	width: 100px;
	height: 100px;
	float: left;
	background-position: 0px 100px;
	text-indent: -99999px;
	overflow: hidden;
	background-repeat: repeat
	}
	
#mainlinkstwo a:hover, #mainlinkstwo a:visited:hover {
	background-position: 0px 0px;
	}
	
#mainlinkstwo li{
	float: left;
	}
	
#mainlinkstwo #sorbielink a{
	background-image: url(images/linkspage/sorbie.jpg)
	}

#mainlinkstwo #pelusilink a{
	background-image: url(images/linkspage/p2.jpg)
	}
	
#mainlinkstwo #bistodesign a{
	background-image: url(images/linkspage/bisto.jpg)
	}

#mainlinkstwo #colette a{
	background-image: url(images/linkspage/colette.jpg)
	}
	
#newsletterpos{
	width: 400px;
	height: 450px;
	position: absolute;
	top: 85px;
	left: 285px;
	}
	
#promogift{
	float: right;
	clear: both;
	width: 230px;
	margin-top: 55px;
	padding-right: 25px;
	
	}
	
#promogifttype{
	float: left;
	clear: both;
	width: 185px;
	}


#promogifttype p{
	color: #00C0F3
	}
	
	
#aboutheader{
	width: 375px;
	height: 100px;
	position: absolute;
	top: 95px;
	left: 275px;
	}
	
#content{
	width: 370px;
	height: 300px;
	position: absolute;
	top: 220px;
	left: 280px; 
	overflow: auto;
	overflow-x: hidden;
	
	}
	
#content p{
	padding-right: 10px
	}	

#aboutlinks{
	}
	
#stafflinkmain{
	display: block;
	float: right;
	clear: both;
	margin-top: 10px;
	
	}

#comingsoon{
	width: 350px;
	height: 288px;
	display: block;
	position: absolute;
	text-indent: -99999px;
	top: 55px;
	left: 260px;
	background-image: url(images/comingsoon/comingsoon.jpg)
	}
	
#thankyou{
	width: 350px;
	height: 288px;
	display: block;
	position: absolute;
	text-indent: -99999px;
	top: 55px;
	left: 260px;
	background-image: url(images/comingsoon/thankyou.jpg)
	}
	
#styleone{
	width: 440px;
	height: 150px;
	position: absolute;
	top: 95px;
	left: 275px;
	}

#styletwo{
	width: 440px;
	height: 150px;
	position: absolute;
	top: 255px;
	left: 275px;
	}

#colorline{
	width: 550px;
	height: 150px;
	position: absolute;
	top: 415px;
	left: 275px;
	}
	
/*--- Products ---*/

.productlinks a, .productlinks a:link, .productlinks a:active, .productlinks a:visited{
	display: block;
	width: 110px;
	height: 150px;
	background-position: 0px 0px;
	text-indent: -99999px;
	overflow: hidden;
	background-repeat: repeat
	
	}

.productlinks a:hover, .productlinks a:visited:hover {
	background-position: 0px 150px;
	}
	
.productlinks li{
	float: left;
	}
	
.productlinks  #jbevprod a{
	background-image: url(images/products/links/jbev.jpg);
	width: 130px;
	margin-top: 2px;
	}

.productlinks  #enjoyprod a{
	background-image: url(images/products/links/enjoy.jpg);
	margin-top: 3px;
	}
	
.productlinks  #alternaprod a{
	background-image: url(images/products/links/alterna.jpg);
	}
	
.productlinks  #rofflerprod a{
	background-image: url(images/products/links/roffler.jpg);
	margin-top: 2px;
	}
	
.productlinks  #sorbieprod a{
	background-image: url(images/products/links/sorbie.jpg);
	}
	
.productlinks  #italyprod a{
	background-image: url(images/products/links/italy.jpg);
	margin-top: 5px;
	}

.productlinks  #diksonprod a{
	background-image: url(images/products/links/dikson.jpg);
	}
	
.productlinks  #eshampooprod a{
	background-image: url(images/products/ind_products_lg/links/enjoyshampoo.jpg);
	}
	
.productlinks  #econditionprod a{
	background-image: url(images/products/ind_products_lg/links/enjoycondition.jpg);
	}
	
.productlinks  #estyleprod a{
	background-image: url(images/products/ind_products_lg/links/enjoystyle.jpg);
	}
	
.productlinks  #efinishprod a{
	background-image: url(images/products/ind_products_lg/links/enjoyfinish.jpg);
	}
	
.productlinks  #ecolorprod a{
	background-image: url(images/products/ind_products_lg/links/enjoycolor.jpg);
	}

.productlinks  #eskinjoyprod a{
	background-image: url(images/products/ind_products_lg/links/enjoyskinjoy.jpg);
	}

.productlinks  #caviarprod a{
	background-image: url(images/products/ind_products_lg/links/caviar.jpg);
	}
	
.productlinks  #luxuryprod a{
	background-image: url(images/products/ind_products_lg/links/luxury.jpg);
	}

.productlinks  #tenprod a{
	background-image: url(images/products/ind_products_lg/links/ten.jpg);
	}
	
.productlinks  #moistureprod a{
	background-image: url(images/products/ind_products_lg/links/everyday.jpg);
	}
	
.productlinks  #volumeprod a{
	background-image: url(images/products/ind_products_lg/links/addbody.jpg);
	}
	
.productlinks  #repairprod a{
	background-image: url(images/products/ind_products_lg/links/rescue.jpg);
	}
	
.productlinks  #crazyprod a{
	background-image: url(images/products/ind_products_lg/links/crazy.jpg);
	}
	
.productlinks  #specsprod a{
	background-image: url(images/products/ind_products_lg/links/specialshampoo.jpg);
	}
	
.productlinks  #speccprod a{
	background-image: url(images/products/ind_products_lg/links/specialcondition.jpg);
	}	

.productlinks  #jbevstyleprod a{
	background-image: url(images/products/ind_products_lg/links/jbevstyle.jpg);
	}
	
.productlinks  #jbevfinishprod a{
	background-image: url(images/products/ind_products_lg/links/finish.jpg);
	}
	
.productlinks  #dikcolorprod a{
	background-image: url(images/products/ind_products_lg/links/diksoncolor.jpg);
	}
	
.productlinks  #tonicprod a{
	background-image: url(images/products/ind_products_lg/links/tonic.jpg);
	}
	
.productlinks  #meprod a{
	background-image: url(images/products/ind_products_lg/links/diksonme.jpg);
	}
	
.productlinks  #andcoprod a{
	background-image: url(images/products/ind_products_lg/links/&co.jpg);
	}
	
.productlinks  #fixerprod a{
	background-image: url(images/products/ind_products_lg/links/fixer.jpg);
	}
	
.productlinks  #italycolorprod a{
	background-image: url(images/products/ind_products_lg/links/colorly.jpg);
	}
	
.productlinks  #purityprod a{
	background-image: url(images/products/ind_products_lg/links/purity.jpg);
	}

.productlinks  #italyshamprod a{
	background-image: url(images/products/ind_products_lg/links/protection.jpg);
	}
	
.productlinks  #italyspecialprod a{
	background-image: url(images/products/ind_products_lg/links/italyspecial.jpg);
	}
	
.productlinks  #roffshamprod a{
	background-image: url(images/products/ind_products_lg/links/roffshamp.jpg);
	}
	
.productlinks  #roffcondprod a{
	background-image: url(images/products/ind_products_lg/links/roffcond.jpg);
	}
	
.productlinks  #roffstyleprod a{
	background-image: url(images/products/ind_products_lg/links/roffstyle.jpg);
	}
	
.productlinks  #groomprod a{
	background-image: url(images/products/ind_products_lg/links/groom.jpg);
	}

/*--- Products End ---*/
	
#contactinfo{
	width: 250px;
	height: 350px;
	position: absolute;
	top: 90px;
	left: 285px
	}
	
#eventcontainer{
	width: 350px;
	height: 450px;
	position: absolute;
	top: 90px;
	left: 275px;
	}
	
#newscontent{
	width:285px;
	height: 200px;
	position: absolute;
	top: 100px;
	left: 300px;
	}
	
#newsspace{
	width: 350px;
	height: 400px;
	margin-right: 15px;
	overflow: auto;
	overflow-x: hidden;
	}
	
	
.newsdate{
	font-size: 40px;
	line-height: 37px;
	font-family: Century Gothic, Arial;
	color: pink
	}
	
.newstext{
	font-family: Arial;
	font-size: 12px;
	line-height: 18px;
	color: #00C0F3;
	padding-top: 15px;
	padding-right: 25px;
	padding-bottom: 30px;
	}
	
#headshot{
	width: 285px;
	height: 285px;
	float: right;
	clear: both;
	margin-top: 15px;
	}	
	
#bio{
	width: 200px;
	height: 300px;
	position: absolute;
	top: 95px;
	left: 325px
	}
	
	
#bio h1{
	width: 200px;
	height: 60px;
	text-indent: -9999px;
	background-repeat: no-repeat;
	padding-bottom: 15px;
	}
	
#bio #jim h1{
	text-indent: -9999px;
	background-image: url(images/aboutpage/staff/jimname.jpg);
}
	
#bio #jen h1{
	background-image: url(images/aboutpage/staff/jenname.jpg);
	}
	
#bio #jeri h1{
	background-image: url(images/aboutpage/staff/jeriname.jpg);
	}
		
#bio #judy h1{
	background-image: url(images/aboutpage/staff/judyname.jpg);
	}
	
#bio #shelley h1{
	background-image: url(images/aboutpage/staff/shelleyname.jpg);
	}

#bio #kendra h1{
	background-image: url(images/aboutpage/staff/kendraname.jpg);
	}
	
#bio #jeff h1{
	background-image: url(images/aboutpage/staff/jeffname.jpg);
	}
	
#bio #lori h1{
	background-image: url(images/aboutpage/staff/loriname.jpg);
	}

#stats{
	width: 175px;
	height: 150px;
	position: absolute;
	top: 385px;
	left: 450px
	}
	
#staffone{
	width: 440px;
	height: 150px;
	position: absolute;
	top: 95px;
	left: 275px;
	}

#stafftwo{
	width: 440px;
	height: 150px;
	position: absolute;
	top: 255px;
	left: 275px;
	}

#staffthree{
	width: 550px;
	height: 150px;
	position: absolute;
	top: 415px;
	left: 275px;
	}
	
	
.stafflinks a, .stafflinks a:link, .stafflinks a:active, .stafflinks a:visited{
	display: block;
	width: 110px;
	height: 150px;
	background-position: 0px 0px;
	text-indent: -99999px;
	overflow: hidden;
	background-repeat: repeat
	
	}

.stafflinks a:hover, .stafflinksa:visited:hover {
	background-position: 0px 150px;
	}
	
.stafflinks li{
	float: left;
	}
	
.stafflinks  #jimlink a{
	background-image: url(images/aboutpage/staff/jimlink.jpg);
	}
	
.stafflinks  #jerilink a{
	background-image: url(images/aboutpage/staff/jerilink.jpg);
	}
	
.stafflinks  #shelleylink a{
	background-image: url(images/aboutpage/staff/shelleylink.jpg);
	}
	
.stafflinks  #kendralink a{
	background-image: url(images/aboutpage/staff/kendralink.jpg);
	}
	
.stafflinks  #jefflink a{
	background-image: url(images/aboutpage/staff/jefflink.jpg);
	}
	
.stafflinks  #jenlink a{
	background-image: url(images/aboutpage/staff/jenniferlink.jpg);
	}
	
.stafflinks  #judylink a{
	background-image: url(images/aboutpage/staff/judylink.jpg);
	}
	
.stafflinks  #lorilink a{
	background-image: url(images/aboutpage/staff/lorilink.jpg);
	}

/* --------- Navigation -------- */


a, a:link, a:active, a:visited {
	
	color: #9d9fa2;
	}

a:hover, a:visited:hover {
	color: #7ad3f7;
	text-decoration: none;
	}

#topnavfloat{
	height: 60px;
	width: 625px;
	float: right;
	background-color: #000000;
	}

#topnav{
	float: right;
	width: 540px;
	list-style-type: none;

	}
	
#topnav a, #topnav a:link, #topnav a:active, topnav a:visited {
	display: block;
	background-position: 0px 0px;
	background-repeat: repeat;
	height: 50px;
	text-indent: -99999px;
	overflow: hidden;
	}
	
#topnav a:hover, #topnav a:visited:hover {
	background-position: 0px 50px;
	}
	
#topnav li{ 
	float: left;
	}
	
#topnav #spectrum a {
	background-image: url(images/topnav/spectrum.jpg);
	width: 123px;
	}
#topnav #pureology a {
	background-image: url(images/topnav/pureology.jpg);
	width: 74px;
	}
	
#topnav #enjoy a {
	background-image: url(images/topnav/enjoy.jpg);
	width: 74px;
	}
	
#topnav #jbev a {
	background-image: url(images/topnav/jbev.jpg);
	width: 51px;
	}
	
#topnav #roffler a {
	background-image: url(images/topnav/roffler.jpg);
	width: 79px;
	}

#topnav #pelusi a {
	background-image: url(images/topnav/pelusi.jpg);
	width: 55px;
	}

#topnav #alterna a {
	background-image: url(images/topnav/alterna.jpg);
	width: 80px;
	}
	
#topnav #italy a {
	background-image: url(images/topnav/italy.jpg);
	width: 71px;
	}
	
#topnav #dikson a {
	background-image: url(images/topnav/dikson.jpg);
	width: 79px;
	}
	
#navigationfloat{
	width: 240px;
	height: 220px;
	float: right;
	clear: both;
	}
	
#flashcontent{
	margin-top: 10px;
	float: right;
	}
	
#newsletter{
	z-index: 1;
	height: 120px;
	width: 90px;
	top: 0px;
	left: 175px ;
	position: absolute;
	}
	
.links{
	font-family: Arial, Verdana;
	color: #a1a1a1;
	font-size: 10px;
	text-decoration: none;
	}
	
	
.links a, .links a:link, .links a:active, .links a:visited {

	color: #a1a1a1;}

.links a:hover, .links a:visited:hover {
				
	color: #ffffff;
	text-decoration: underline;
				
				}
				
				
/*--- forms ---*/

#formcontainer{
	width: 300px;
	height: 150px;
	float: right;	
	position: absolute;
	top: 70px;
	left: 285px
	}
	
#formcontainer p{
	margin-top: 10px;
	margin-bottom: 5px;
	width: 225px;
	line-height: 13px
	}

input, select, textarea {
	clear: none;
	background-color:#000000;

	border: 2px dotted #00ADE7;
	font-family: Verdana, Arial, Helvetica, sans-serif;
	font-size: 12px;
	color: #ffffff;
	width: 225px;
	float: left;
	display: block;
	}

#forms div {
	clear: both;
	margin-bottom:5px;
	height: 25px;
	}

#forms label {
	width: 70px;
	display: block;
	float: left;
	font-family: Verdana, Arial, Helvetica, sans-serif;
	font-size: 11px;
	color: #666666;
	line-height: 17px;
	}
	
#forms checkbox{
	width: 10px;
	}

div#formcity {
	float: left;
	}
#formcity input {
	width: 75px;
	}
	
#form-zip input {
	width: 75px;
	}

div#form-state {
	float: left;
	clear: none;
	}
#form-state label {
	width: 50px;
	color: #D70075;
	margin-left: 25px;
	margin-top: 3px
	}
	
#form-pickupcontainer{
	width: 235px;
	}
	
div#form-pickup select {
	width: 75px;
	}
	
div#form-pickup {
	float: left;
	clear: none;
	}
#form-pickup label {
	width: 50px;
	color: #D70075;
	margin-right: 20px
	}
	

div#form-state select {
	width: 50px;
	}
	
div#form-pickup select {
	width: 125px;
	}
	
div#submit {
	margin-top: 10px;
	width: 80px;
	clear: both;
	}
	
#submit input {
	width: 80px;
	float: left;
	}
	
	
div#checkboxlabel{
	width: 85px;
	float: left;
	}
	
#checkboxlabel label{
	width: 50px;
	color: #D70075;
	float: left
	}
	
#message textarea{
	height: 50px;
	margin-bottom: 5px;
	}

#delivery{
	width: 25px
	}
	
#disclaimer p {
	font-size: 9px;
	line-height: 11px;
	color: #D70075;
	}