@charset "UTF-8";
/* CSS Document */

@import url("form.css");
@import url("salon.css");
@import url("leftnav.css");

* {margin:0; padding:0;}
img {border:0;}
ul, li {list-style-type:none;}

body {background:#000 url(/images/background.jpg) repeat-y center; font-family:Arial, Helvetica, sans-serif; font-size:12px; color:#6a6a6a;}
h1 {font-size: 19px;}
h2 {font-size: 16px;}

.clear {clear:both;}
.standard_btn {display:block; float:left; margin-right:7px; background: #6a6a6a; padding:3px; color:#fff; text-decoration:none; border:solid 1px #000;}
.standard_btn:hover {background:#999;}
.bold {font-weight:bold;}
.line-dash {border:none; border-bottom:dashed 1px #6a6a6a; margin: 5px 0 5px 0;}
.left {float:left;}
.right {float:right;}

a {color:#606060;}
a:hover {text-decoration:none;}

.breadcrumb {padding:5px 0 5px 5px; color:#fff; background-color:#6a6a6a;}
.breadcrumb a {color:#fff;}
.breadcrumb-products {padding:5px 0 5px 5px; color:#fff; background-color:#6a6a6a;}
.breadcrumb-products a {color:#fff;}

#container {width:900px; background-color:#fff; margin: 0 auto; border: solid 3px #000;}

/***********************
	Header
***********************/
#header {position:relative; height:110px;}
#header #logo img {position:absolute; top:20px; left:10px;}
#header #local {position: absolute; top:20px; left:230px;}
#header #local a {display:block; float:left; font-size:10px; color:#999; text-decoration:none; padding: 0px 5px;}
#header #local a.on, #header #local a:hover {text-decoration:underline; color:#6a6a6a;}
#header #social {position:absolute; top: 55px; right:7px;}
#header #logged_in {position:absolute; top: 40px; right: 7px; font-size:11px;}
#header #global_salon_search {position:absolute; top:7px; right: 7px;}
#header #global_salon_search h2 {text-align:right;}
#header #global_salon_search #salon_locator_search_field {color:#ccc; float:left;}
#header #salon_search {position:absolute; top:20px; right:7px;}
#header #salon_search #search_input {color:#ccc;}
#header #topnav {position:absolute; bottom:0; width:100%; height:30px; background:#ccc; border-top:solid 1px #6a6a6a; border-bottom: solid 1px #6a6a6a;}
#header #topnav ul.navigation li {position:relative; float: left; height:30px; border-right: solid 1px #6a6a6a;}
#header #topnav ul.navigation li.pro {float:right; border-right:none; border-left:solid 1px #6a6a6a;}
#header #topnav ul.navigation li a:hover,
#home				#header #topnav ul.navigation li a#topnav_home,
#products			#header #topnav ul.navigation li a#topnav_products,
#hairstyles			#header #topnav ul.navigation li a#topnav_hairstyles,
#expert-hair-tips	#header #topnav ul.navigation li a#topnav_expert-hair-tips,
#free-samples		#header	#topnav ul.navigation li a#topnav_free-samples,
#mediaroom 			#header	#topnav ul.navigation li a#topnav_mediaroom,
#joico-cares 		#header	#topnav ul.navigation li a#topnav_joico-cares,
#business-tools		#header #topnav ul.navigation li a#topnav_business-tools,
#buy-dvds			#header #topnav ul.navigation li a#topnav_buy-dvds,
#step-by-step		#header #topnav ul.navigation li a#topnav_step-by-step,
#joico-rewards		#header #topnav ul.navigation li a#topnav_joico-rewards,
#salon-professional	#header #topnav ul.navigation li a#topnav_salon-professional 
	{background:#fff;}
#header #topnav ul.navigation li:hover ul#sub {display:block}
#header #topnav ul.navigation li a {display:block; padding:7.5px 10px; text-decoration: none; color: #6a6a6a; font-weight:bold;}
#header #topnav ul#sub {display:none; position:absolute; top:30px; z-index:100; width:130px; background: transparent url(/images/subnav_shadow.png) no-repeat bottom right; padding-bottom:10px;}
#header #topnav ul#sub li {border-right:none; position:static; float:none; margin-right:8px;}
#header #topnav ul#sub li.last {margin-bottom:8px;}
#header #topnav ul#sub li a {font-size:11px; text-decoration:none; color:#6a6a6a; font-weight:normal;}
#header #topnav ul#sub li a:hover {background:#6a6a6a; color:#fff;}

#adminnav {width:100%; height:30px; background:#ccc; border-top:solid 1px #6a6a6a; border-bottom: solid 1px #6a6a6a;}
#adminnav ul.navigation li {position:relative; float: left; height:30px; border-right: solid 1px #6a6a6a;}
#adminnav ul.navigation li.pro {float:right; border-right:none; border-left:solid 1px #6a6a6a;}
#adminnav ul.navigation li:hover {background:#fff;}
#adminnav ul.navigation li:hover ul#sub {display:block}
#adminnav ul.navigation li a {display:block; padding:9.5px 10px; text-decoration: none; color: #6a6a6a; font-weight:bold;}
#adminnav ul#sub {display:none; position:absolute; top:30px; z-index:100; width:130px; background: transparent url(/images/subnav_shadow.png) no-repeat bottom right; padding-bottom:10px;}
#adminnav ul#sub li {border-right:none; position:static; float:none; margin-right:8px;}
#adminnav ul#sub li.last {margin-bottom:8px;}
#adminnav ul#sub li a {font-size:11px; text-decoration:none; color:#6a6a6a; font-weight:normal;}
#adminnav ul#sub li a:hover {background:#6a6a6a; color:#fff;}

/***********************
	Content
***********************/
#content {}
#detail_content {float:right; width:672px;}
#inner_detail_content {padding:7px;}

/***********************
	Left Nav
***********************/
#left_nav {float:left; width:227px; background:url(/images/leftnav_bg.jpg) repeat-y; border-right:solid 1px #000;}
#section_title {font-size:25px; font-weight:bold; color:#fff; padding-left:9px; height:34px;}


/***********************
	HOME
***********************/
#content_inner{padding: 7px;}
#home_featured {float:left;}
#box_container {float:left; width:275px; margin-left:8px;}
.box {border: solid 1px #000; margin-bottom:7px;}
.box_header {background:#000; height:13px; padding:5px;}
.box_header h2 {font-size: 14px; color:#fff; font-weight:bold}
.box_header .subscribe_to_rss {float:right; color:#fff;}
.box_content {padding:7px; background:#fff url(/images/box_gradient.jpg) repeat-x;}
#news_feed li {margin-bottom:7px;}
.mag_pic {float: left; margin-right: 7px;}
.mag_copy {float: left; width:164px; margin-top:20px;}
#social_box li {float:left; margin-right:6px; margin-left:6px;}


/***********************
	PRODUCTS
***********************/
//#product_tabs_left {padding-left:10px; background:url(/images/products/tabs/tabs_left.png) left no-repeat; width:401px; height:36px;}

#product_tabs_left {padding-left:10px; background:url(/images/products/tabs/tabs_left.png) left no-repeat; width:550px; height:36px;}
#product_tabs_right {padding-right:10px; background:url(/images/products/tabs/tabs_right.png) right no-repeat;}
#product_tabs {height:36px; background:url(/images/products/tabs/tabs_bg.png) repeat-x;}
#product_tabs li {float:left;}
#product_tabs li a {display:block;height:36px;}
#product_tabs li .haircare {width:94px; background:url(/images/products/tabs/haircare.png) no-repeat;}
#product_tabs li .haircare.on, #product_tabs li .haircare:hover {background:url(/images/products/tabs/haircare_on.png) no-repeat;}
#product_tabs li .styling {width:85px; background:url(/images/products/tabs/styling.png) no-repeat;}
#product_tabs li .styling.on, #product_tabs li .styling:hover {background:url(/images/products/tabs/styling_on.png) no-repeat;}
#product_tabs li .bodycare {width:100px; background:url(/images/products/tabs/bodycare.png) no-repeat;}
#product_tabs li .bodycare.on, #product_tabs li .bodycare:hover {background:url(/images/products/tabs/bodycare_on.png) no-repeat;}
#product_tabs li .appliances {width:112px; background:url(/images/products/tabs/appliances.png) no-repeat;}
#product_tabs li .appliances.on, #product_tabs li .appliances:hover {background:url(/images/products/tabs/appliances_on.png) no-repeat;}
#product_tabs li .tools {width:65px; background:url(/images/products/tabs/tools.png) no-repeat;}
#product_tabs li .tools.on, #product_tabs li .tools:hover {background:url(/images/products/tabs/tools_on.png) no-repeat;}
#product_tabs li .professional {width:128px; background:url(/images/products/tabs/professional.png) no-repeat;}
#product_tabs li .professional.on, #product_tabs li .professional:hover {background:url(/images/products/tabs/professional_on.png) no-repeat;}
#product_tabs li .shampoo {width:94px; background:url(/images/products/tabs/haircare.png) no-repeat;}
#product_tabs li .shampoo.on, #product_tabs li .shampoo:hover {background:url(/images/products/tabs/haircare_on.png) no-repeat;}
#product_tabs li .conditioner {width:94px; background:url(/images/products/tabs/haircare.png) no-repeat;}
#product_tabs li .conditioner.on, #product_tabs li .conditioner:hover {background:url(/images/products/tabs/haircare_on.png) no-repeat;}


#product_grid {clear:both; float:left; width:100%; border-top:solid 4px #000;}
#product_grid li {position:relative; float:left; border-right:solid 1px #000; border-bottom:solid 1px #000;}
#product_grid a {display:block; width:224px; height:150px; color:#6a6a6a;}
#product_grid a:hover {color:#ffffff;}
#product_grid li.last_col {border-right:none;}
#product_grid li:hover, #product_grid li:hover a {background:#6a6a6a; color:#fff; cursor:pointer;}

#product_grid li img {position:absolute; bottom:0px; left:10px;}
#product_grid li div {position:absolute; top:10px; right:10px; width:150px;}

.products_sub_nav a {font-size:9.5px!important;}

.product_image {float:left; width:144px;}
.product_info {float:left; width:514px;}
.product_info h2 {border-bottom:dashed 1px #606060; padding-bottom:5px; margin-bottom:5px; font-size:12px;}
.product_info .detail {float:left; width:300px; padding:10px; border-right:dashed 1px #606060; min-height:280px;}
.product_info .tools {float:left; padding:10px; width:173px;}
.product_info .tools ul {margin-top:5px; margin-bottom:15px;}
.product_info .tools ul li strong {display:block; border-bottom:dashed 1px #606060; padding-bottom:5px; margin-bottom:5px;}
.product_info .benefits li {list-style-type:disc;}
.product_info .benefits {margin-left:30px;}
.product_info .desc {margin-bottom:10px;}
.product_info .rating {margin-left: 30px; margin-top: 1em;}
.related {float:left; width:660px; border-top:dashed 1px #606060;}
.related h2 {padding:5px 0;}
.products {margin-top:20px;}
.products li {float:left; border-right:dashed 1px #6a6a6a; border-bottom:dashed 1px #6a6a6a;}
.products li a {display:block; width:110.8px; height:200px; padding:10px;}
.products li.even {border-right:none;}
.products li a:hover {background-color:#6a6a6a; color:#ffffff;}
.products li img {float:left;}
.products li p {float:left; clear:both; width:100%;}
.products li a.review-link { width: auto; display: inline; padding: 0; height: auto; }
.products li dt, .product_info dt { display: none; }
.products li .rating { padding: 10px; }
.products li .star a { padding: 0 }
.products li .star a:hover {background-color: white;}
.products li br.star-rating-readonly, .product_info br.star-rating-readonly { display: none; }
.brand_description {font-size:15px;}

.related_products li {float:left; border-bottom: dashed 1px #606060;}
.related_products li a {display:block; width:289px; height:141px; padding:20px;}
.related_products li a:hover {background-color:#6a6a6a; color:#ffffff;}
.related_products li.even {border-left: dashed 1px #606060;}
.related_products li img {float:left;}
.related_products li p {float:left; width:170px; padding-top:50px; padding-left:5px;}

.reviews .review { padding: 10px; }
.reviews dt { display: block; }
.reviews #value-element br { display: none; }
.reviews dt label { font-weight: bold; }
.reviews #summary-element input { width: 250px; }
.reviews #review-element textarea { width: 250px; height: 200px; }

/***********************
	HAIRSTYLES
***********************/
#hairstyle_grid li {float:left; width:156px; padding:4px;}


/***********************
	EXPERTS
***********************/
#experts_home {padding:20px 100px 20px 20px;}
#experts_home div {margin-bottom:20px;}
#experts_list li {margin-bottom: 20px;}
#experts_list .image {float:left;}
#experts_list .info {float:left; width:450px;margin-left:10px;}
#experts_list .info .name {font-weight:bold;}
#experts_list .info .url a {font-weight:bold; color:#6A6A6A;}
#experts_list .info .desc {line-height:1.5em;}

.faq_cats li {min-height:50px;}
.faq_cats li img {float:left; margin-right: 20px;}
.faq_cats li a {font-weight:bold;}


/***********************
	OUR COMPANY
***********************/
#ourcompany_home_list li {margin-bottom:20px; height:100px;}
#ourcompany_home_list a {font-weight:bold;}
#ourcompany_home_list .icon {float:left; margin-right:20px;}
#eco_copy {margin-top:20px;}
#eco_copy h2 {color:#246911;}
#eco_copy p {margin-bottom:20px;}


/***********************
	Professional
***********************/
#shelf_talkers li {height:150px;}
#shelf_talkers img {margin-right:20px;}


.search_result_item {margin-bottom:20px;}

#msds #inner_detail_content ul {margin-top:10px;}
#msds #inner_detail_content li {margin-bottom:10px;}



/***********************
	Footer
***********************/
#footer {position:relative; clear:both; height:240px; color:#6a6a6a; background:#ccc; font-size:11px; border-top:solid 1px #000000;}
#footer a {text-decoration:none; color:#6a6a6a;}
#footer a:hover {color:#000;}
#footer div {padding:20px;width:150px; float: left;}

#footer .box1 {float:left; padding:20px; width:188px; background:#6a6a6a; color:#ccc; height:200px;}
#footer .about {float:left; width:170px;}
#footer .site_map {width:220px;}
#footer .site_map li {float:left; width:110px;}

#footer ul li {margin-bottom:5px;}
#footer h2 {display:block; font-weight:bold; font-size:16px; border-bottom:dashed 1px #6a6a6a; padding-bottom:10px; margin-bottom:10px;}
#footer .box1 h2 {border-bottom:none; padding-bottom:0; }












.sIFR-active .sIFR-text {
	visibility: hidden;
	font-family: Verdana;
	line-height: 1em;
	font-size: 18px;
	color: white;
}

.main-menu-item .sIFR-replaced {
	top: -1px;
	visibility: hidden;
}

.main-menu-item {
	font-size: 19px;
	color:#000;
}

