
/* CSS Document */


/************************************ LAYOUT ************************************/

body {
	background: #000;
	width: 900px;
	margin: auto;
	padding: 0 0 20px 0;
	font-family: Arial, Helvetica, sans-serif;
	font-size: 13px;
	line-height: 15px;
	color: #ffffff; 
	font-weight:lighter;
}

#storelocatortarget {background: #da1a33;}

html {min-height: 600px;}

* {-moz-outline: none 0;outline: none 0; }

#content {
	position: relative;
	z-index: 0;
	width: 100%;
	float:none;
	}
	
.flash {height: 418px; background: #000; float: none; position:absolute; margin-top: 145px;}

#logo {
	float:left;
	z-index: 1;
	border: none;
	width: 174px;
	height: 121px;
}

#nav {
	width: 100%; height: 10px;
	z-index: 10;
	margin-top: 0px;
	margin-left: 0px;
	float:none;
}

#nav2 {
	width: 900px; height: 18px;
	z-index: 10;
	margin: 35px 0 0 0px;
	float:none;
}

#nav3 {
	height: 18px;
	z-index: 10;
	margin: 0 0 0 177px;
	float:none;
}

#subnav {
	width: 100%;
/*	margin-left: -54px;*/
	float:none;
}

#footer {
	width: 170px; height: 50px;
	background: url(../img/nav/MJ_footer.gif) top left no-repeat;
	margin: 10px 365px 20px 365px;
	float:left;
}

a:link {
	color: #999;
	text-decoration: none;
}

a:visited {
	color: #999;
	text-decoration: none;
}
a:hover {
	color: #fff;
	text-decoration: none;
}
a:active {
	color: #fff;
	text-decoration: none;
}

a img {border: 0;}

strong {font-weight: bold;}


/************************************ NAV ************************************/

/* ================================================================ 
This copyright notice must be kept untouched in the stylesheet at 
all times.

The original version of this stylesheet and the associated (x)html
is available at http://www.cssplay.co.uk/menu/pro_drop5.html
Copyright (c) 2005-2007 Stu Nicholls. All rights reserved.
This stylesheet and the associated (x)html may be modified in any 
way to fit your requirements.
=================================================================== */
.prodrop5 {padding:0px; margin-top:0px; list-style:none; height:10px; position:relative; z-index:500; font-family:arial, verdana, sans-serif;}

.prodrop5 li.top {display:block; float:left;}

.prodrop5 li a.pos1 {background:url(../img/nav/MJ_topnav_01.gif); width:73px; height:10px; display:block; text-indent:-99999px;} 
.prodrop5 li a.pos2 {background:url(../img/nav/MJ_topnav_02.gif); width:72px; height:10px; display:block; text-indent:-99999px;} 
.prodrop5 li a.pos3 {background:url(../img/nav/MJ_topnav_03.gif); width:80px; height:10px; display:block; text-indent:-99999px;} 
.prodrop5 li a.pos4 {background:url(../img/nav/MJ_topnav_04.gif); width:105px; height:10px; display:block; text-indent:-99999px;} 
.prodrop5 li a.pos5 {background:url(../img/nav/MJ_topnav_05.gif); width:81px; height:10px; display:block; text-indent:-99999px;} 
.prodrop5 li a.pos6 {background:url(../img/nav/MJ_topnav_06.gif); width:94px; height:10px; display:block; text-indent:-99999px;} 
.prodrop5 li a.pos7 {background:url(../img/nav/MJ_topnav_07.gif); width:104px; height:10px; display:block; text-indent:-99999px;} 
.prodrop5 li a.pos8 {background:url(../img/nav/MJ_topnav_08.gif); width:61px; height:10px; display:block; text-indent:-99999px;} 
.prodrop5 li a.pos9 {background:url(../img/nav/MJ_topnav_09.gif); width:76px; height:10px; display:block; text-indent:-99999px;} 
.prodrop5 li a.pos0 {background:url(../img/nav/MJ_topnav_10.gif); width:154px; height:10px; display:block; text-indent:-99999px;} 

.prodrop5 li.p1 {background:url(../img/nav/MJ_topnav_01.gif); background-position:bottom; cursor:default;} 
.prodrop5 li.p2 {background:url(../img/nav/MJ_topnav_02.gif); background-position:bottom; cursor:default;} 
.prodrop5 li.p3 {background:url(../img/nav/MJ_topnav_03.gif); background-position:bottom; cursor:default;} 
.prodrop5 li.p4 {background:url(../img/nav/MJ_topnav_04.gif); background-position:bottom; cursor:default;} 
.prodrop5 li.p5 {background:url(../img/nav/MJ_topnav_05.gif); background-position:bottom; cursor:default;} 
.prodrop5 li.p6 {background:url(../img/nav/MJ_topnav_06.gif); background-position:bottom; cursor:default;} 
.prodrop5 li.p7 {background:url(../img/nav/MJ_topnav_07.gif); background-position:bottom; cursor:default;} 
.prodrop5 li.p8 {background:url(../img/nav/MJ_topnav_08.gif); background-position:bottom; cursor:default;} 
.prodrop5 li.p9 {background:url(../img/nav/MJ_topnav_09.gif); background-position:bottom; cursor:default;} 
.prodrop5 li.p0 {background:url(../img/nav/MJ_topnav_10.gif); background-position:bottom; cursor:default;}  

#home #nav .prodrop5 li a.pos1 {background:url(../img/nav/MJ_topnav_01.gif); background-position:bottom; cursor:default;} 
#shop #nav .prodrop5 li a.pos2 {background:url(../img/nav/MJ_topnav_02.gif); background-position:bottom; cursor:default;}
#salon #nav .prodrop5 li a.pos3 {background:url(../img/nav/MJ_topnav_03.gif); background-position:bottom; cursor:default;}
#pictures #nav .prodrop5 li a.pos4 {background:url(../img/nav/MJ_topnav_04.gif); background-position:bottom; cursor:default;}
#about #nav .prodrop5 li a.pos5 {background:url(../img/nav/MJ_topnav_05.gif); background-position:bottom; cursor:default;}
#styling #nav .prodrop5 li a.pos6 {background:url(../img/nav/MJ_topnav_06.gif); background-position:bottom; cursor:default;}
#mjstore #nav .prodrop5 li a.pos7 {background:url(../img/nav/MJ_topnav_07.gif); background-position:bottom; cursor:default;}
#faq #nav .prodrop5 li a.pos8 {background:url(../img/nav/MJ_topnav_08.gif); background-position:bottom; cursor:default;}
#press #nav .prodrop5 li a.pos9 {background:url(../img/nav/MJ_topnav_09.gif); background-position:bottom; cursor:default;}
#storelocator #nav .prodrop5 li a.pos0 {background:url(../img/nav/MJ_topnav_10.gif); background-position:bottom; cursor:default;}
#storelocatortarget #nav .prodrop5 li a.pos0 {background:url(../img/nav/MJ_topnav_10.gif); background-position:bottom; cursor:default;}

.prodrop5 table {border-collapse:collapse; width:0; height:0; position:absolute; top:0; left:0;}

/* Default link styling */

/* Style the list OR link hover. Depends on which browser is used */

.prodrop5 a:hover {visibility:visible; position:relative; z-index:200;}
.prodrop5 li:hover {position:relative; z-index:200;}

.prodrop5 li a.top_link:hover {background:transparent;} 
.prodrop5 li:hover > a.top_link {background:transparent;} 

/* keep the 'next' level invisible by placing it off screen. */
.prodrop5 ul {position:absolute; left:-9999px; top:-9999px; width:0; height:0; margin:0; padding:0; list-style:none;}

.prodrop5 :hover ul {left:0; top:10px; padding-top:10px; padding-left:8px; padding-bottom:13px; padding-right:10px; background-color:#000; white-space: nowrap; height:auto; width:auto; z-index:300;}
.prodrop5 :hover ul li {display:block; height:20px; position:relative; font-weight:normal; width:auto;}
.prodrop5 :hover ul li a {display:block; font-size:13px; height:20px; line-height:20px; width:auto; padding:0 10px; color:#fff; background:transparent; text-decoration:none;}
.prodrop5 :hover ul li a:hover {color:#f9ac98;}

#bestseller #nav .prodrop5 :hover ul li a:hover {color:#f9ac98;}
#bestseller2 #nav .prodrop5 :hover ul li a:hover {color:#f9ac98;}


/************************************ SUBNAV (on homepage & best seller) ************************************/

#subnav ul {
	list-style: none;
	line-height: 0;
	width: 900px;
	margin:0 0 0 0;
	padding:0;
}

#subnav a {
	display: block; float: left;
	background-position: top left no-repeat;
	z-index: 10;
	}
	
#subnav ul li {
	width: 133px;
	height: 131px;
	margin-right: 14px;
	float:left;
	}

#subnav a img {
	height: 105px; width: 133px;
	border: 0;
	float:left;
	margin:0;
	}

#subnav a .nav1 {width: 133px; height: 26px; background: url(../img/index/MJ_subnav_1.gif); float:left; z-index: 0;}
#subnav a .nav2 {width: 133px; height: 26px; background: url(../img/index/MJ_subnav_2.gif); float:left; z-index: 0;}
#subnav a .nav3 {width: 133px; height: 26px; background: url(../img/index/MJ_subnav_3.gif); float:left; z-index: 0;}
#subnav a .nav4 {width: 133px; height: 26px; background: url(../img/index/MJ_subnav_4.gif); float:left; z-index: 0;}
#subnav a .nav5 {width: 133px; height: 26px; background: url(../img/index/MJ_subnav_5.gif); float:left; z-index: 0;}
#subnav a .nav6 {width: 164px; height: 54px; background: url(../img/index/MJ_subnav_6.gif); float:left; z-index: 0;}
#subnav a .nav7 {width: 164px; height: 55px; background: url(../img/index/MJ_subnav_7.gif); float:left; z-index: 0;}

#bestseller #subnav a .nav1 {background-position: bottom; cursor: default;}
#bestseller2 #subnav a .nav1 {background-position: bottom; cursor: default;}


#subnav a:hover .nav1 {background-position: bottom;}
#subnav a:hover .nav2 {background-position: bottom;}
#subnav a:hover .nav3 {background-position: bottom;}
#subnav a:hover .nav4 {background-position: bottom;}
#subnav a:hover .nav5 {background-position: bottom;}
#subnav a:hover .nav6 {background-position: bottom;}
#subnav a:hover .nav7 {background-position: bottom;}

/************************************ BTM NAV (with LiveChat and YouTube buttons) ************************************/

#nav2 ul {
	list-style: none;
	line-height: 0;
}

#nav2 a {
	display: inline; float: left;
	height: 18px; width: 900px;
	background-position: top left no-repeat;
	text-indent: -9999px;
	z-index: 10;
	}

#nav2 .nav1 a {width: 149px; background: url(../img/nav/MJ_btmnav_01.gif);}
#nav2 .nav2 a {width: 109px; background: url(../img/nav/MJ_btmnav_02.gif);}
#nav2 .nav3 a {width: 166px; background: url(../img/nav/MJ_btmnav_03.gif);}
#nav2 .nav4 a {width: 120px; background: url(../img/nav/MJ_btmnav_04.gif);}
#nav2 .nav5 a {width: 139px; background: url(../img/nav/MJ_btmnav_05.gif);}
#nav2 .nav6 a {width: 140px; background: url(../img/nav/MJ_btmnav_06.gif);}

#mjstore #nav2 .nav1 a {width: 149px; background: url(../img/nav/MJ_btmnav_01.gif);}

#testimonials #nav2 .nav1 a {background-position: bottom; cursor: default;}
#contact #nav2 .nav2 a {background-position: bottom; cursor: default;}
#customercare #nav2 .nav3 a {background-position: bottom; cursor: default;}
#facebook #nav2 .nav4 a {background-position: bottom; cursor: default;}
#livechat #nav2 .nav5 a {background-position: bottom; cursor: default;}
#youtube #nav2 .nav6 a {background-position: bottom; cursor: default;}

#nav2 a:hover {background-position: bottom;}
#mjstore #nav2 .nav1 a:hover {background-position: bottom;}


/************************************ BTM NAV (on homepage ONLY...no livechat & youtube) ************************************/

#nav3 ul {
	list-style: none;
	line-height: 0;
	margin:0;
	padding:0;
}

#nav3 a {
	display: block; float: left;
	height: 18px; width: 900px;
	background-position: top left no-repeat;
	text-indent: -9999px;
	z-index: 10;
	margin-top: 14px;
	}

#nav3 .nav1 a {width: 149px; background: url(../img/nav/MJ_btmnav_01.gif);}
#nav3 .nav2 a {width: 109px; background: url(../img/nav/MJ_btmnav_02.gif);}
#nav3 .nav3 a {width: 166px; background: url(../img/nav/MJ_btmnav_03.gif);}
#nav3 .nav4 a {width: 120px; background: url(../img/nav/MJ_btmnav_04.gif);}

#testimonials #nav3 .nav1 a {background-position: bottom; cursor: default;}
#contact #nav3 .nav2 a {background-position: bottom; cursor: default;}
#customercare #nav3 .nav3 a {background-position: bottom; cursor: default;}
#facebook #nav3 .nav4 a {background-position: bottom; cursor: default;}

#nav3 a:hover {
	background-position: bottom;
}


/************************************ CONTENT ************************************/


#content {
	width: 100%;
	margin: 14px 0 14px 0;
	min-height: 400px;
	float:left;
	}

#pictures #content, #faq #content, #press #content, #storelocator #content, #customercare #content, #testimonials #content, #celebs #content, #contact #content {background: #2d001f;}
#shop #content, #styling #content, #event #content, #videos #content {background: #fff; color: #000;}
#bestseller #content {background: url(../img/misc/bestseller/MJ_best_bg.gif) top left no-repeat; height: 418px;}
#bestseller2 #content {background: url(../img/misc/bestseller/MJ_best2_bg.gif) top left no-repeat; height: 418px;}
#storelocatortarget #content {width: inherit; margin: 0 0 0 0; min-height: 400px; float:left; background: #da1a33;}
	
#columnLeft {
	width: 185px;
	height: inherit;
	float: left;
	margin: 0;
	background: inherit;
	}
	
#columnMiddle {
	width: 684px;
	height: inherit;
	margin: 20px 0 20px 0;
	padding: 9px 0px 14px 29px;
	float: left;
	background: url(../img/index/MJ_border_white.gif) top left repeat-y;
	}
	
#styling #columnMiddle, #videos #columnMiddle {background: url(../img/index/MJ_border_black.gif) repeat-y;}

#shop #columnMiddle {background: url(../img/shop/MJ_border_shop.gif) top left repeat-y;}

#about #columnMiddle, #salon #columnMiddle, #mjstore #columnMiddle {background: #000;}
	
#shop #columnMiddle {
	width: 540px;
	padding: 9px 0 14px 14px;
}
#storelocatortarget #columnMiddle {
	width: 684px;
	height: inherit;
	margin: 20 px 0 20px 0;
	padding: 9px 0 14px 29px;
	float: left;
	color: #000;
	background: url(../img/index/MJ_border_black.gif) top left repeat-y;
	}
	
#columnRight {
	width: 160px;
	float:left;
	background: #f00;
	margin:0;
	padding:0;
	/*margin-top: 20px;
	padding: 10px;
	background: url(../img/index/MJ_border_black.gif) top left repeat-y #f00;*/
	}

#columnMiddle ul {
	display: block;
	list-style: none;
	float:left;
	padding:0;
	margin: 0;
}


#subcol1 {
	width: 148px;
	margin: 20px 20px 20px 0;
	float:left;
	}
	
#subcol1 img {
	border: 0;
	margin-bottom: 14px;
	}
	
#subcol2 {
	width: 316px;
	margin: 20px 20px 20px 0;
	float:left;
	}
	
#subcol2 embed {
	border: 1px solid #ccc;
	margin:0;
	padding:0;
	}
	
#subcol2 img {
	margin-bottom: 14px;
	margin-right: 14px;
	}
	
#subcol3 {
	width: 205px;
	margin: 0 20px 20px 0;
	float:left;
	}
	
#subcol4 {
	width: 652px;
	margin: 0 20px 20px 0;
	float:left;
	}

#subcol5 {
	width: 450px;
	margin: 0 20px 20px 0;
	float:left;
	}
	
#subcol5 embed {
	border: 1px solid #ccc;
	margin:0;
	padding:0;
	}
	
#subcol6 {
	width: 185px;
	margin: 0 20px 20px 0;
	float:left;
	}

#subcol7 {
	width: 300px;
	margin: 10px 42px 0 0;
	float:left;
	} 
#subcol8 {
	width: 300px;
	margin: 0 42px 20px 0;
	float:left;
	} 
	
#back a{
	height: 15px; width: 54px;
	background: url(../img/nav/MJ_back.gif) top left no-repeat;
	float:left;
	margin-left: 262px;
	}
	
#back a:hover {background-position: bottom;}

#next a {
	height: 15px; width: 54px;
	background: url(../img/nav/MJ_next.gif) top left no-repeat;
	float:left;
	}
	
#next a:hover {background-position: bottom;}

#storelocator a:hover {color: #fff}	
	
h1 {
	font-size: 13px;
	font-weight: bold;
	color: #f9ac98;
	text-transform: uppercase;
	margin-bottom:0;
	}
	
h2 {
	font-size: 13px;
	font-weight: bold;
	color: #da1a33;
	text-transform: uppercase;
	margin-bottom:0;
	}

#storelocatortarget h1 {color: #fff;}

#returntop a {color: #f9ac98;text-transform: uppercase;margin-bottom: 25px;font-size: 12px;}
#noscroll a {color: #f9ac98;}
#shop #returntop a, #styling #returntop a {color:#898069;}
#storelocatortarget #returntop a {color: #fff;}
#returntop a:hover, #noscroll a:hover {color: #fff;}
#storelocatortarget #returntop a:hover {color: #000;}

#storelocator h2 a:link {color: #fff;}
#storelocator h2 a:hover {color: #da1a33;}

	
ul #list {list-style: disc inside;margin-bottom: 15px;}


/************************************ STORE LOCATOR ***********************************/

#storelocator #content {float:left;}

#storelocator #columnMiddle ul {float: none; display: table-row;}
#storelocator h1 {margin: 7px 0 7px 0; width: 600px;}


/************************************ STORE LOCATOR TARGET ***********************************/

#storelocatortarget #content {float:left;}

#storelocatortarget #columnMiddle ul {float: none; display: table-row;}
#storelocatortarget h1 {margin: 7px 0 7px 0; width: 600px;}



/************************************ SHOP ***********************************

.next {
	height: 22px; width: 10px;
	background: url (../img/shop/MJ_next.gif) top left no-repeat;
	text-indent: -9999px;
	}

.prev {
	height: 22px; width: 10px;
	background: url (../img/shop/MJ_prev.gif) top left no-repeat;
	text-indent: -9999px;
	}
	
.next, .prev{background-position: bottom;}*/

#shop #slideshow {
	width: 868px; height: 300px;
	overflow: hidden;
	padding:0;
	}
	
#shop #slideshow img {width: 210px;}



/************************************ STYLING ************************************/

#styling #content a {text-transform: uppercase; color: #000; font-weight: bold;}
#styling #content a:hover {color: #898069;}

#styling #content #subcol4 a {text-transform: uppercase; color: #898069; font-weight: normal;}
#styling #content #subcol4 a:hover {color: #000;}

	
/************************************ FOOTER ************************************/

#ftr ul {
	list-style: none;
}

#ftr a {
	display: block;
	margin-left: -42px;
	height: 20px;
	background-position: top left no-repeat;
	text-indent: -9999px;
	}
	
#ftr .ftr1 a {width: 80px; background: url(images/nav/nav_backtotop.gif) ;}

#ftrbar {
	margin-left: -200px;
	padding-bottom: 50px;
	border: none;
	}

#ftr a:hover {background-position: bottom;}


/************************************ SHOP SLIDER ************************************/

#shop #content {background: #fff; min-height: 450px;}

#slideshow {width: 900px; height: 300px; padding: 0px; margin: 0 14px;}

#slideshow img {margin:0; padding: 0;}

#item_set {
	height: 300px; width: 900px; 
	padding: 15px; margin:0px; 
	overflow: hidden; 
	clear:left; 
	position:absolute; 
	top:0px; left:0px;
	}

.prev a {
	width: 10px; height: 22px;
	background: url(../img/shop/MJ_shop_prev.gif) top left no-repeat;
	float:right;
	text-indent: -9999px;
}
.next a {
	width: 10px; height: 22px;
	background: url(../img/shop/MJ_shop_next.gif) top left no-repeat;
	float:left;
	text-indent: -9999px;
}

#slider_side {
	width:220px; 
	float:left;
	background: url(../img/index/MJ_border_black_horizontal.gif) top left repeat-x;
	padding: 17px 0;
}

#slider_center {
	width:410px; 
	float:left;
	background: url(../img/index/MJ_border_black_horizontal.gif) top left repeat-x;
	padding: 10px;
	text-align: center;
}

#slider_center img {
	margin-bottom: 10px;
}

#MJitem00 {display: block;}

#MJitem01, #MJitem02, #MJitem03, #MJitem04, #MJitem05, #MJitem06, #MJitem07, #MJitem08, #MJitem09, #MJitem10, #MJitem11, #MJitem12, #MJitem13, #MJitem14, #MJitem15, #MJitem16, #MJitem17, #MJitem18, #MJitem19, #MJitem20, #MJitem21, #MJitem22, #MJitem23, #MJitem24, #MJitem25, #MJitem26, #MJitem27, #MJitem28, #MJitem29, #MJitem30 {display: none;}


/************************************ SHOP LIST ************************************/

#shop #content a:hover {color: #000;}

#shop #subcol1 {
	width: 170px;
	margin: 20px 20px 20px 0;
	float:left;
	}

#shop #coltop {
	background: url(../img/shop/list/MJ_quantitybg.gif) top left no-repeat; 
	height: 32px;
	padding-top:9px;
	margin-top:30px;
	font-weight: bold;
	}

#shop #size {float:left; width:60px;}
#shop #price {float:left; width:160px;}
#shop #quantity {float:left; width:90px;}

#quantity form input {height: 5px;}

#shop #cart {width: 150px; min-height: 400px; position: fixed; top: 190px; right: auto; z-index:0;}


/************************************ FAQ ************************************/

#faq #columnMiddle ul {
	display:block;
	list-style: none;
	text-indent: -9999px;
	line-height:1px;
	height: 36px;
	width: 592px;
	margin: 21px 30px 15px 30px;
	}

#faq #columnMiddle li a {
	display: inline; float:left;
	height: 36px;
	background-position: top left no-repeat;
	z-index: 10;
	}

#faq #columnMiddle .nav1 a {width: 174px; background: url(../img/faq/MJ_faq_nav_01.gif);}
#faq #columnMiddle .nav2 a {width: 162px; background: url(../img/faq/MJ_faq_nav_02.gif);}
#faq #columnMiddle .nav3 a {width: 129px; background: url(../img/faq/MJ_faq_nav_03.gif);}
#faq #columnMiddle .nav4 a {width: 127px; background: url(../img/faq/MJ_faq_nav_04.gif);}

#faq #faqstyling .nav1 a {background-position: bottom; cursor: default;}
#faq #faqappt .nav2 a {background-position: bottom; cursor: default;}
#faq #faqsilkner .nav3 a {background-position: bottom; cursor: default;}
#faq #faqproducts .nav4 a {background-position: bottom; cursor: default;}

#faq #columnMiddle li a:hover {
	background-position: bottom;
}

#faq #columnMiddle a {color: #f9ac98;}
#faq #columnMiddle a:hover {color: #fff;}

#customercare #columnMiddle a {color: #f9ac98;}
#customercare #columnMiddle a:hover {color: #fff;}

#contact #columnMiddle a {color: #f9ac98;}
#contact #columnMiddle a:hover {color: #fff;}

#testimonials #columnMiddle a {color: #f9ac98;}
#testimonials #columnMiddle a:hover {color: #fff;}

#celebs #columnMiddle a {color: #f9ac98;}
#celebs #columnMiddle a:hover {color: #fff;}


/************************************ TESTIMONIALS ************************************/

#testimonials #subcol2 p {margin-bottom: 28px;}
#testimonials #subcol2 strong {margin-bottom: 7px;}

/************************************ ABOUT ************************************/

#about #columnMiddle, #salon #columnMiddle, #mjstore #columnMiddle  {	
	font-family: Arial, Helvetica, sans-serif;
	font-size: 13px;
	line-height: 15px;
	color: #ffffff; 
}

#about #columnLeft, #salon #columnLeft, #mjstore columnLeft {margin-top: 11px;}

#about #columnLeft ul {
	display: block;
	list-style: none;
	text-indent: -9999px;
	margin: 14px 0 0 0px;
	padding: 0;
	line-height: 1px;
}

/*#about #columnLeft li, #salon #columnLeft li, #mjstore #columnLeft li {padding:0; margin-bottom: 14px; height: 1px;}*/

#about #columnLeft a, #salon #columnLeft a, #mjstore #columnLeft a  {
	background-position: top left no-repeat;
	z-index: 10;
	margin-bottom: 7px;
}

#about #subnav, #salon #subnav, #mjstore #subnav {
	width: 185px; height: 250px; 
	float:left; 
	position:relative; 
	top: -28px;
	text-align: right;
	}

#about #columnLeft .nav1 a {width: 150px; height: 10px; background: url(../img/about/MJ_about_nav01.gif); float:left; z-index: 0;}
#about #columnLeft .nav2 a {width: 150px; height: 10px; background: url(../img/about/MJ_about_nav02.gif); float:left; z-index: 0;}
#about #columnLeft .nav3 a {width: 150px; height: 10px; background: url(../img/about/MJ_about_nav03.gif); float:left; z-index: 0;}
#about #columnLeft .nav4 a {width: 150px; height: 10px; background: url(../img/about/MJ_about_nav04.gif); float:left; z-index: 0;}
#about #columnLeft .nav5 a {width: 150px; height: 10px; background: url(../img/about/MJ_about_nav05.gif); float:left; z-index: 0;}

#about #columnLeft .nav1 a:hover {background-position: bottom;}
#about #columnLeft .nav2 a:hover {background-position: bottom;}
#about #columnLeft .nav3 a:hover {background-position: bottom;}
#about #columnLeft .nav4 a:hover {background-position: bottom;}
#about #columnLeft .nav5 a:hover {background-position: bottom;}

#about #aboutmj .nav1 a {background-position: bottom; cursor: default;}
#about #aboutsalon .nav2 a {background-position: bottom; cursor: default;}
#about #aboutproducts .nav3 a {background-position: bottom; cursor: default;}
#about #aboutmiko .nav4 a {background-position: bottom; cursor: default;}
#about #abouttiti .nav5 a {background-position: bottom; cursor: default;}

#about #aboutmj #subnav { background: url(../img/about/MJ_aboutmj_title.gif) top right no-repeat;}	
#about #aboutsalon #subnav { background: url(../img/about/MJ_aboutsalon_title.gif) top right no-repeat;}	
#about #aboutproducts #subnav { background: url(../img/about/MJ_aboutproducts_title.gif) top right no-repeat;}	
#about #aboutmiko #subnav { background: url(../img/about/MJ_aboutmiko_title.gif) top right no-repeat;}
#about #abouttiti #subnav { background: url(../img/about/MJ_abouttiti_title.gif) top right no-repeat;}

/************************************ SALON ************************************/

#salon #columnLeft ul{
	display: block;
	list-style: none;
	text-indent: -9999px;
	margin: 14px 0 0 0;
	padding: 0;
	line-height: 1px;
}


#salon #columnLeft .nav0 a {width: 165px; height: 41px; background: url(../img/salon/MJ_salon_nav00.gif) top left no-repeat; float:left; z-index: 0;}
#salon #columnLeft .nav1 a {width: 150px; height: 10px; background: url(../img/salon/MJ_salon_nav01.gif); float:left; z-index: 0;}
#salon #columnLeft .nav2 a {width: 150px; height: 10px; background: url(../img/salon/MJ_salon_nav02.gif); float:left; z-index: 0;}
#salon #columnLeft .nav3 a {width: 150px; height: 10px; background: url(../img/salon/MJ_salon_nav03.gif); float:left; z-index: 0;}
#salon #columnLeft .nav4 a {width: 150px; height: 10px; background: url(../img/salon/MJ_salon_nav04.gif); float:left; z-index: 0;}
#salon #columnLeft .nav5 a {width: 150px; height: 10px; background: url(../img/salon/MJ_salon_nav05.gif); float:left; z-index: 0;}
#salon #columnLeft .nav6 a {width: 150px; height: 10px; background: url(../img/salon/MJ_salon_nav06.gif); float:left; z-index: 0;}
#salon #columnLeft .nav7 a {width: 150px; height: 10px; background: url(../img/salon/MJ_salon_nav07.gif); float:left; z-index: 0;}
#salon #columnLeft .nav8 a {width: 150px; height: 10px; background: url(../img/salon/MJ_salon_nav08.gif); float:left; z-index: 0;}

#salon #columnLeft .nav1 a:hover {background-position: bottom;}
#salon #columnLeft .nav2 a:hover {background-position: bottom;}
#salon #columnLeft .nav3 a:hover {background-position: bottom;}
#salon #columnLeft .nav4 a:hover {background-position: bottom;}
#salon #columnLeft .nav5 a:hover {background-position: bottom;}
#salon #columnLeft .nav6 a:hover {background-position: bottom;}
#salon #columnLeft .nav7 a:hover {background-position: bottom;}
#salon #columnLeft .nav8 a:hover {background-position: bottom;}

#salon #salonabout .nav1 a {background-position: bottom; cursor: default;}
#salon #salonservices .nav2 a {background-position: bottom; cursor: default;}
#salon #salonappt .nav3 a {background-position: bottom; cursor: default;}
#salon #salonprepare .nav4 a {background-position: bottom; cursor: default;}
#salon #salondirections .nav5 a {background-position: bottom; cursor: default;}
#salon #salonmiko .nav8 a {background-position: bottom; cursor: default;}
	
#salon #salonabout #subnav { background: url(../img/salon/MJ_salonabout_title.gif) top right no-repeat;}	
#salon #salonservices #subnav { background: url(../img/salon/MJ_salonservices_title.gif) top right no-repeat;}	
#salon #salonappt #subnav { background: url(../img/salon/MJ_salonappt_title.gif) top right no-repeat;}	
#salon #salonprepare #subnav { background: url(../img/salon/MJ_salonprepare_title.gif) top right no-repeat;}	
#salon #salondirections #subnav { background: url(../img/salon/MJ_salondirections_title.gif) top right no-repeat;}	
#salon #salonmiko #subnav { background: url(../img/salon/MJ_salonmiko_title.gif) top right no-repeat;}


/************************************ MJ STORE ************************************/

#mjstore #columnLeft ul{
	display: block;
	list-style: none;
	text-indent: -9999px;
	margin: 25px 0 0 -7px;
	padding: 0;
	line-height: 1px;
}


#mjstore #columnLeft .nav0 a {width: 165px; height: 41px; background: url(../img/mjstore/MJ_store_nav00.gif) top left no-repeat; float:left; z-index: 0;}
#mjstore #columnLeft .nav1 a {width: 150px; height: 10px; background: url(../img/salon/MJ_salon_nav01.gif); float:left; z-index: 0;}
#mjstore #columnLeft .nav2 a {width: 150px; height: 10px; background: url(../img/salon/MJ_salon_nav02.gif); float:left; z-index: 0;}
#mjstore #columnLeft .nav3 a {width: 150px; height: 10px; background: url(../img/salon/MJ_salon_nav03.gif); float:left; z-index: 0;}
#mjstore #columnLeft .nav4 a {width: 150px; height: 10px; background: url(../img/salon/MJ_salon_nav04.gif); float:left; z-index: 0;}
#mjstore #columnLeft .nav5 a {width: 150px; height: 10px; background: url(../img/salon/MJ_salon_nav05.gif); float:left; z-index: 0;}
#mjstore #columnLeft .nav6 a {width: 150px; height: 10px; background: url(../img/salon/MJ_salon_nav06.gif); float:left; z-index: 0;}
#mjstore #columnLeft .nav7 a {width: 150px; height: 10px; background: url(../img/salon/MJ_salon_nav07.gif); float:left; z-index: 0;}
#mjstore #columnLeft .nav8 a {width: 150px; height: 10px; background: url(../img/salon/MJ_salon_nav08.gif); float:left; z-index: 0;}

#mjstore #columnLeft .nav1 a:hover {background-position: bottom;}
#mjstore #columnLeft .nav2 a:hover {background-position: bottom;}
#mjstore #columnLeft .nav3 a:hover {background-position: bottom;}
#mjstore #columnLeft .nav4 a:hover {background-position: bottom;}
#mjstore #columnLeft .nav5 a:hover {background-position: bottom;}
#mjstore #columnLeft .nav6 a:hover {background-position: bottom;}
#mjstore #columnLeft .nav7 a:hover {background-position: bottom;}
#mjstore #columnLeft .nav8 a:hover {background-position: bottom;}

#mjstore #about .nav0 a {background-position: bottom; cursor: default;}
	
#mjstore #about #subnav { background: url(../img/mjstore/MJ_store_title.gif) top right no-repeat;}	


/************************************ TEXT SLIDER - MIKO.html ************************************/

#flash_about {
	margin-left: -200px;
	position: relative;
	top: -2px;
	width: 20px;
	}
#bar_about {
	margin-top: -362px;
	float: right;
	border: none;
	}
.Container_miko {
  position: relative;
  top: -4px; left: 195px;
  width: 400px;
  height: 260px;
  margin-bottom: 0;
}


#Scroller-1 { 
  position: absolute; 
  overflow: hidden;
  width: 480px;
  height: 260px; 
}

#Scroller-0 { 
  position: absolute; 
  overflow: visible;
  width: 480px;
  left: 350px;
}


#Scroller-1 p, #Scroller-0 p {
  margin-bottom: 0px; padding: 0;
}

#Scroller-1 strong, #Scroller-0 strong {
  font-weight: bold;
  text-transform: uppercase;
  margin-top: -14px;
}

.Scroller-Container {
  position: absolute;
  top: 0px; left: 0px;
  height: auto;

}
.Scrollbar-Up {
  cursor: pointer;
  position: relative;
  top: 255px;

}
.Scrollbar-Down {
  cursor: pointer;
  position: relative;
  top: 255px;
}

#noscroll {width: 485px; float:right; margin: -4px 0 0 10px;}


/************************************ BEST SELLERS ************************************/

#best_left {
	position: absolute; 
	top: 189px; left: 127px; 
	width: 385px; height: 150px;
	font-family: Arial, Helvetica, sans-serif;
	font-size: 13px;
	line-height: 15px;
	color: #000;
	text-align: center;
	}
	
#best_right {
	position: absolute; 
	top: 71px; right: 85px; 
	width: 285; height: 270px;
	}

#bestseller a:hover, #bestseller2 a:hover {color: #000;}

/************************************ EVENTS SLIDER ************************************/

#events #content {
		background: url(../img/events/slider-bkgrd.gif) #fff; min-height: 450px;
		width: 900px;}

	.stripViewer .panelContainer .panel ul {
			text-align: left;
		}
		
		.slider-wrap { /* This div isn't entirely necessary but good for getting the side arrows vertically centered */
			position: relative;
			width: 100%;
		}

		/* These 2 lines specify style applied while slider is loading */
		.csw {width: 900px; height: 450px; position: absolute; background: url(../img/events/slider-bkgrd.gif) #fff; overflow: hidden; top: 14px;}
		.csw .loading {text-align: center; color: #000; margin: 160px 0 300px 0;}

		.stripViewer { /* This is the viewing window */
			position: absolute;
			overflow: hidden; 
			z-index: 0;
			background: url(../img/events/slider-bkgrd.gif) #fff;
			margin: 14px 0 0 0;
			width: 900px; /* Also specified in  .stripViewer .panelContainer .panel  below */
			height: 450px;
			clear: both;
		}
		
		.stripViewer .panelContainer { /* This is the big long container used to house your end-to-end divs. Width is calculated and specified by the JS  */
			position: relative; margin-top: 40px;
			left: 0; top: 0;
			width: 100%;
			z-index: 10;
			list-style-type: none;
			/* -moz-user-select: none; // This breaks CSS validation but stops accidental (and intentional - beware) panel highlighting in Firefox. Some people might find this useful, crazy fools. */
		}
		
		.stripViewer .panelContainer .panel { /* Each panel is arranged end-to-end */
			float:left;
			height: 100%;
			position: relative;
			width: 883px; /* Also specified in  .stripViewer  above */
		}
		
		.stripViewer .panelContainer .panel .wrapper { /* Wrapper to give some padding in the panels, without messing with existing panel width */
			padding-right: 0px;
		}
		
		.stripNav { /* This is the div to hold your nav (the UL generated at run time) */
			margin: 0; width: 600px;
			position: absolute;
			top: 390px;
			left: 170px;
			z-index: 100;
		}
		
		.stripNav ul { /* The auto-generated set of links */
			list-style: none;
		}
		
		.stripNav ul li {
			float: left;
			margin-right: 0px; /* If you change this, be sure to adjust the initial value of navWidth in coda-slider.1.1.1.js */
		}
		
		.stripNav a { /* The nav links */
			text-align: center;
			color: #fff;
			text-decoration: none;
			display: block;
			width: 18px; height: 10px;
			text-indent: -9999px;
			z-index: 100;
		}
		
		.stripNav li.tab1 a { background: url(../img/events/menu_1.gif) top center no-repeat  }
		.stripNav li.tab2 a { background: url(../img/events/menu_2.gif) top center no-repeat  }
		.stripNav li.tab3 a { background: url(../img/events/menu_3.gif) top center no-repeat  }
		.stripNav li.tab4 a { background: url(../img/events/menu_4.gif) top center no-repeat  }
		.stripNav li.tab5 a { background: url(../img/events/menu_5.gif) top center no-repeat  }
		.stripNav li.tab6 a { background: url(../img/events/menu_6.gif) top center no-repeat  }
		.stripNav li.tab7 a { background: url(../img/events/menu_7.gif) top center no-repeat  }
		.stripNav li.tab8 a { background: url(../img/events/menu_8.gif) top center no-repeat  }
		.stripNav li.tab9 a { background: url(../img/events/menu_9.gif) top center no-repeat  }
		.stripNav li.tab10 a { background: url(../img/events/menu_10.gif) top center no-repeat  }
		.stripNav li.tab11 a { background: url(../img/events/menu_11.gif) top center no-repeat  }
		.stripNav li.tab12 a { background: url(../img/events/menu_12.gif) top center no-repeat  }
		.stripNav li.tab13 a { background: url(../img/events/menu_13.gif) top center no-repeat  }
		.stripNav li.tab14 a { background: url(../img/events/menu_14.gif) top center no-repeat  }
		.stripNav li.tab15 a { background: url(../img/events/menu_15.gif) top center no-repeat  }
		.stripNav li.tab16 a { background: url(../img/events/menu_16.gif) top center no-repeat  }
		.stripNav li.tab17 a { background: url(../img/events/menu_17.gif) top center no-repeat  }
		.stripNav li.tab18 a { background: url(../img/events/menu_18.gif) top center no-repeat  }
		.stripNav li.tab19 a { background: url(../img/events/menu_19.gif) top center no-repeat  }
		.stripNav li.tab20 a { background: url(../img/events/menu_20.gif) top center no-repeat  }
		.stripNav li.tab21 a { background: url(../img/events/menu_21.gif) top center no-repeat  }
		.stripNav li.tab22 a { background: url(../img/events/menu_22.gif) top center no-repeat  }
		.stripNav li.tab23 a { background: url(../img/events/menu_23.gif) top center no-repeat  }
		.stripNav li.tab24 a { background: url(../img/events/menu_24.gif) top center no-repeat  }
		.stripNav li.tab25 a { background: url(../img/events/menu_25.gif) top center no-repeat  }
		.stripNav li.tab26 a { background: url(../img/events/menu_26.gif) top center no-repeat  }
		.stripNav li.tab27 a { background: url(../img/events/menu_27.gif) top center no-repeat  }

		.stripNav li a:hover {
			background-position: center;
		}
		
		.stripNav li a.current {
			background-position: center;
		}
		
		.stripNavL, .stripNavR { /* The left and right arrows */
			position: absolute;
			top: 390px;
			padding-top: 13px;
			text-indent: -9000em;
			z-index: 100;
		}
		
		.stripNavL a, .stripNavR a {
			display: block;
			height: 13px;
			width: 6px;
		}
		
		.stripNavL a {
			background: url(../img/events/slider-prev.gif) no-repeat;
		}
		
		.stripNavR a {
			background: url(../img/events/slider-next.gif) no-repeat;
		}
		
		.stripNavL a:hover, .stripNavR a:hover {
			background-position: no-repeat bottom;
		}
		
		
		.stripNavL {
			left: 190px;
		}
		
		.stripNavR {
			right: 190px;
		}
		
		.stripNavL {
			background: url(../img/events/slider-prev.gif) no-repeat bottom;
		}
		
		.stripNavR {
			background: url(../img/events/slider-next.gif) no-repeat bottom;
		}
		
.wrapper img {margin-left: 17px;}
.wrapper2 img {margin-left: 23px;}

#eventnav ul {
	list-style: none;
	line-height: 0;
	margin-top: 478px;
}

#eventnav a {
	display: inline; float: left;
	height: 18px; width: 900px;
	background-position: top left no-repeat;
	text-indent: -9999px;
	z-index: 10;
	}

#eventnav .nav1 a {width: 149px; background: url(../img/nav/MJ_btmnav_01.gif);}
#eventnav .nav2 a {width: 109px; background: url(../img/nav/MJ_btmnav_02.gif);}
#eventnav .nav3 a {width: 166px; background: url(../img/nav/MJ_btmnav_03.gif);}
#eventnav .nav4 a {width: 120px; background: url(../img/nav/MJ_btmnav_04.gif);}
#eventnav .nav5 a {width: 139px; background: url(../img/nav/MJ_btmnav_05.gif);}
#eventnav .nav6 a {width: 140px; background: url(../img/nav/MJ_btmnav_06.gif);}

#testimonials #eventnav .nav1 a {background-position: bottom; cursor: default;}
#contact #eventnav .nav2 a {background-position: bottom; cursor: default;}
#customer care #eventnav .nav3 a {background-position: bottom; cursor: default;}
#facebook #eventnav .nav4 a {background-position: bottom; cursor: default;}
#livechat #eventnav .nav5 a {background-position: bottom; cursor: default;}
#youtube #eventnav .nav6 a {background-position: bottom; cursor: default;}

#eventnav a:hover {
	background-position: bottom;}
.hide { visibility: hidden; }
