/*
	ColorBox Core Style:
	The following CSS is consistent between example themes and should not be altered.
*/
#colorbox, #cboxOverlay, #cboxWrapper{position:absolute; top:0; left:0; z-index:9999; overflow:hidden;}
#cboxOverlay{position:fixed; width:100%; height:100%;}
#cboxMiddleLeft, #cboxBottomLeft{clear:left;}
#cboxContent{position:relative;}
#cboxLoadedContent{overflow:auto;}
#cboxTitle{margin:0;}
#cboxLoadingOverlay, #cboxLoadingGraphic{position:absolute; top:0; left:0; width:100%;}
#cboxPrevious, #cboxNext, #cboxClose, #cboxSlideshow{cursor:pointer;}
.cboxPhoto{float:left; margin:auto; border:0; display:block;}
.cboxIframe{width:100%; height:100%; display:block; border:0;}

/* 
	User Style:
	Change the following styles to modify the appearance of ColorBox.  They are
	ordered & tabbed in a way that represents the nesting of the generated HTML.
*/
#cboxOverlay{background:url(../images/colorbox/overlay.png) repeat 0 0;}
#colorbox{background-color: #ECEFF4;}
	#cboxTopLeft{width:21px; height:21px; background:url(../images/colorbox/controls.png) no-repeat -100px 0;}
	#cboxTopRight{width:21px; height:21px; background:url(../images/colorbox/controls.png) no-repeat -129px 0;}
	#cboxBottomLeft{width:21px; height:21px; background:url(../images/colorbox/controls.png) no-repeat -100px -29px;}
	#cboxBottomRight{width:21px; height:21px; background:url(../images/colorbox/controls.png) no-repeat -129px -29px;}
	#cboxMiddleLeft{width:21px; background:url(../images/colorbox/controls.png) left top repeat-y;}
	#cboxMiddleRight{width:21px; background:url(../images/colorbox/controls.png) right top repeat-y;}
	#cboxTopCenter{height:21px; background:url(../images/colorbox/border.png) 0 0 repeat-x;}
	#cboxBottomCenter{height:21px; background:url(../images/colorbox/border.png) 0 -29px repeat-x;}
	#cboxContent{background:#fff; overflow:hidden;}
		#cboxError{padding:50px; border:1px solid #ccc;}
		/*#cboxLoadedContent{margin-bottom:28px;}*/
		#cboxTitle{position:absolute; bottom:4px; left:0; text-align:center; width:100%; color:#949494;}
		#cboxCurrent{position:absolute; bottom:4px; left:58px; color:#949494;}
		#cboxSlideshow{position:absolute; bottom:4px; right:30px; color:#0092ef;}
		#cboxPrevious{position:absolute; bottom:0; left:0; background:url(../images/colorbox/controls.png) no-repeat -75px 0; width:25px; height:25px; text-indent:-9999px;}
		#cboxPrevious.hover{background-position:-75px -25px;}
		#cboxNext{position:absolute; bottom:0; left:27px; background:url(../images/colorbox/controls.png) no-repeat -50px 0; width:25px; height:25px; text-indent:-9999px;}
		#cboxNext.hover{background-position:-50px -25px;}
		#cboxLoadingOverlay{background:url(../images/colorbox/loading_background.png) no-repeat center center;}
		#cboxLoadingGraphic{background:url(../images/colorbox/loading.gif) no-repeat center center;}
		#cboxClose{position:absolute; bottom:0; right:0; width:25px; height:25px;}
		#cboxClose.hover{background-position:-25px -25px;}

/*
	The following fixes a problem where IE7+ replaces a PNG's alpha transparency with a black fill
	when an alpha filter (opacity change) is set on the element or ancestor element.
*/
.cboxIE #cboxTopLeft,
.cboxIE #cboxTopCenter,
.cboxIE #cboxTopRight,
.cboxIE #cboxBottomLeft,
.cboxIE #cboxBottomCenter,
.cboxIE #cboxBottomRight,
.cboxIE #cboxMiddleLeft,
.cboxIE #cboxMiddleRight {
	filter: progid:DXImageTransform.Microsoft.gradient(startColorstr=#00FFFFFF,endColorstr=#00FFFFFF);
}

/*
	The following provides PNG transparency support for IE6
*/
.cboxIE6 #cboxTopLeft{background:url(../images/colorbox/ie6/borderTopLeft.png);}
.cboxIE6 #cboxTopCenter{background:url(../images/colorbox/ie6/borderTopCenter.png);}
.cboxIE6 #cboxTopRight{background:url(../images/colorbox/ie6/borderTopRight.png);}
.cboxIE6 #cboxBottomLeft{background:url(../images/colorbox/ie6/borderBottomLeft.png);}
.cboxIE6 #cboxBottomCenter{background:url(../images/colorbox/ie6/borderBottomCenter.png);}
.cboxIE6 #cboxBottomRight{background:url(../images/colorbox/ie6/borderBottomRight.png);}
.cboxIE6 #cboxMiddleLeft{background:url(../images/colorbox/ie6/borderMiddleLeft.png);}
.cboxIE6 #cboxMiddleRight{background:url(../images/colorbox/ie6/borderMiddleRight.png);}

.cboxIE6 #cboxTopLeft,
.cboxIE6 #cboxTopCenter,
.cboxIE6 #cboxTopRight,
.cboxIE6 #cboxBottomLeft,
.cboxIE6 #cboxBottomCenter,
.cboxIE6 #cboxBottomRight,
.cboxIE6 #cboxMiddleLeft,
.cboxIE6 #cboxMiddleRight {
	_behavior: expression(this.src = this.src ? this.src : this.currentStyle.backgroundImage.split('"')[1], this.style.background = "none", this.style.filter = "progid:DXImageTransform.Microsoft.AlphaImageLoader(src=" + this.src + ", sizingMethod='scale')");
}

/**
 * styling for tip content
 * mostly for example
 * note: canvas (the tip itself) cannot be styled here. use javascript options for that.
 */
.bt-content {
	font-size: small;
	color: #000;
	line-height: normal;
}

/* styling for active target elements - usually for background highlighting */
.bt-active { /* example:
  background-color: yellow !important;
 */
	
}

/*!
 * jQuery UI Stars v3.0.1
 * http://plugins.jquery.com/project/Star_Rating_widget
 *
 * Copyright (c) 2010 Marek "Orkan" Zajac (orkans@gmail.com)
 * Dual licensed under the MIT and GPL licenses.
 * http://docs.jquery.com/License
 *
 * $Rev: 164 $
 * $Date:: 2010-05-01 #$
 * $Build: 35 (2010-05-01)
 *
 */
.ui-stars-star,
.ui-stars-cancel {
	float: left;
	display: block;
	overflow: hidden;
	text-indent: -999em;
	cursor: pointer;
}
.ui-stars-star a,
.ui-stars-cancel a {
	width: 16px;
	height: 15px;
	display: block;
	background: url(../images/jquery.ui.stars.gif) no-repeat 0 0;
}
.ui-stars-star a {
	background-position: 0 -32px;
}
.ui-stars-star-on a {
	background-position: 0 -48px;
}
.ui-stars-star-hover a {
	background-position: 0 -64px;
}
.ui-stars-cancel-hover a {
	background-position: 0 -16px;
}
.ui-stars-star-disabled,
.ui-stars-star-disabled a,
.ui-stars-cancel-disabled a {
	cursor: default !important;
}

#stars-wrapper img {
	position: absolute;
	top: -88px;
	left: 0;
	cursor: pointer;
}

#stars-wrapper img.no_star {
	top: -60px;
}

#stars-wrapper label {
	position: relative;
	width: 1.8em;
	height: 1.8em;
	overflow: hidden;
	float: left;
	margin-right: 15px;
	text-indent: -999em;
	padding-right: 0;
}

#stars-wrapper label:hover, #stars-wrapper .selected {
	opacity: 0.5;
	filter: alpha(opacity=50)
}

#stars-wrapper br {
	display: none;
}

 /*
 * jQuery UI Autocomplete 1.8.18
 *
 * Copyright 2011, AUTHORS.txt (http://jqueryui.com/about)
 * Dual licensed under the MIT or GPL Version 2 licenses.
 * http://jquery.org/license
 *
 * http://docs.jquery.com/UI/Autocomplete#theming
 */
.ui-autocomplete { 
	position: absolute; 
	cursor: default;
 }

/* workarounds */
* html .ui-autocomplete { width:1px; } /* without this, the menu expands to 100% in IE6 */

/*
 * jQuery UI Menu 1.8.18
 *
 * Copyright 2010, AUTHORS.txt (http://jqueryui.com/about)
 * Dual licensed under the MIT or GPL Version 2 licenses.
 * http://jquery.org/license
 *
 * http://docs.jquery.com/UI/Menu#theming
 */
.ui-menu {
	list-style:none;
	display:block;
	background-color:white;
	z-index:10000 !important;
}
.ui-menu .ui-menu-item {
	margin:0;
	padding: 0;
	zoom: 1;
	float: left;
	clear: left;
	line-height:30px;
	display:block;
	width:100%;
}
.ui-menu .ui-menu-item a{
	text-decoration:none;
	display:block;
	zoom:1;
	padding:5px;
	border:1px solid #eceff4;
	border-top:none;
}
.ui-menu .ui-menu-item a.ui-state-hover,
.ui-menu .ui-menu-item a.ui-state-active{
	font-weight: bold;
}


.treeview, .treeview ul { 
	padding: 0;
	margin: 0;
	list-style: none;
}

.treeview ul {
	background-color: white;
	margin-top: 4px;
}

.treeview .hitarea {
	background: url(../images/treeview/treeview-default.gif) -64px -25px no-repeat;
	height: 16px;
	width: 16px;
	margin-left: -16px;
	float: left;
	cursor: pointer;
}
/* fix for IE6 */
* html .hitarea {
	display: inline;
	float:none;
}

.treeview li { 
	margin: 0;
	padding: 3px 0pt 3px 16px;
}

.treeview a.selected {
	background-color: #eee;
}

#treecontrol { margin: 1em 0; display: none; }

.treeview .hover { color: red; cursor: pointer; }

.treeview li { background: url(../images/treeview/treeview-default-line.gif) 0 0 no-repeat; }
.treeview li.collapsable, .treeview li.expandable { background-position: 0 -176px; }

.treeview .expandable-hitarea { background-position: -80px -3px; }

.treeview li.last { background-position: 0 -1766px }
.treeview li.lastCollapsable, .treeview li.lastExpandable { background-image: url(../images/treeview/treeview-default.gif); }  
.treeview li.lastCollapsable { background-position: 0 -111px }
.treeview li.lastExpandable { background-position: -32px -67px }

.treeview div.lastCollapsable-hitarea, .treeview div.lastExpandable-hitarea { background-position: 0; }

.treeview-red li { background-image: url(../images/treeview/treeview-red-line.gif); }
.treeview-red .hitarea, .treeview-red li.lastCollapsable, .treeview-red li.lastExpandable { background-image: url(../images/treeview/treeview-red.gif); } 

.treeview-black li { background-image: url(../images/treeview/treeview-black-line.gif); }
.treeview-black .hitarea, .treeview-black li.lastCollapsable, .treeview-black li.lastExpandable { background-image: url(../images/treeview/treeview-black.gif); }  

.treeview-gray li { background-image: url(../images/treeview/treeview-gray-line.gif); }
.treeview-gray .hitarea, .treeview-gray li.lastCollapsable, .treeview-gray li.lastExpandable { background-image: url(../images/treeview/treeview-gray.gif); } 

.treeview-famfamfam li { background-image: url(../images/treeview/treeview-famfamfam-line.gif); }
.treeview-famfamfam .hitarea, .treeview-famfamfam li.lastCollapsable, .treeview-famfamfam li.lastExpandable { background-image: url(../images/treeview/treeview-famfamfam.gif); } 

.treeview .placeholder {
	background: url(../images/treeview/ajax-loader.gif) 0 0 no-repeat;
	height: 16px;
	width: 16px;
	display: block;
}

.filetree li { padding: 3px 0 2px 16px; }
.filetree span.folder, .filetree span.file { padding: 1px 0 1px 16px; display: block; }
.filetree span.folder { background: url(../images/treeview/folder.gif) 0 0 no-repeat; }
.filetree li.expandable span.folder { background: url(../images/treeview/folder-closed.gif) 0 0 no-repeat; }
.filetree span.file { background: url(../images/treeview/file.gif) 0 0 no-repeat; }

ul.treeview >li.collapsable:first-child{
   background-position: -17px -90px;
}

ul.treeview >li.expandable:first-child{
   background-position: -49px -46px;
}

/* quick fix to expand teh first hierachy*/
ul.treeview li ul li ul{
   display:none;
}


/* Product detail page vertical scroller */

#thumbnail_scroller_container
{
	height: 340px;	
}

#thumbnail_scroller_content, #colorbox_scroller_content
{
	margin: 0 0 0 23px !important;	
}

#colorbox_scroller_container
{
 	
}

/* 
 * Stepper v3.0.7 - 2014-05-07 
 * A jQuery plugin for cross browser number inputs. Part of the Formstone Library. 
 * http://formstone.it/stepper/ 
 * 
 * Copyright 2014 Ben Plum; MIT Licensed 
 */
.stepper {
	border-radius: 3px;
	margin: 0px;
	overflow: hidden;
	position: relative;
	display: inline-block;
	height: 38px;
	border: 1px solid #cfcfcf;
}

.stepper .stepper-input {
	color:black;
	height: 38px;
	margin: 0;
	text-align: center;
	overflow: hidden;
	width: 100%;
	border:0px;
	line-height:38px;
	text-indent:-25px;
}

.stepper .stepper-input::-webkit-inner-spin-button,.stepper .stepper-input::-webkit-outer-spin-button
{
	-webkit-appearance: none;
	margin: 0;
}

.stepper .stepper-input:focus {
	background-color: #fff;
}

.stepper .stepper-arrow {
	background: #eee url(jquery.fs.stepper-arrows.png) no-repeat;
	cursor: pointer;
	display: block;
	height: 50%;
	position: absolute;
	right: 0;
	text-indent: -99999px;
	width: 20px;
	z-index: 50;
}

.stepper .stepper-arrow.up {
	height: 19px;
	width : 36px;
	background-position: center;
	border-bottom: 1px solid #cfcfcf;
	border-left: 1px solid #cfcfcf;
	top: 0px;
	border-top-right-radius: 7px;
	background:#fff url("../../common/images/arrow_up.PNG") no-repeat 11px;
}

.stepper .stepper-arrow.down {
	height: 19px;
	width : 36px;
	background-position: center;
	border-top: 1px solid #cfcfcf;
	border-left: 1px solid #cfcfcf;
	bottom: 0px;
	border-bottom-right-radius: 7px;
	background:#fff url("../../common/images/arrow_down.PNG") no-repeat 11px;
}

@media screen and (min-width: 740px) {
	.stepper:hover .stepper-input {
		background-color: #fff;
	}
	.stepper .stepper-step:hover {
		background-color: #F9F9F9;
	}
	.stepper.disabled .stepper-arrow {
		background: #fff;
		border-color: #eee;
		cursor: default;
	}
}

.stepper.disabled .stepper-input {
	background: #fff;
	border-color: #eee;
	color: #ccc;
}

.stepper.disabled .stepper-arrow {
	background: #fff;
	border-color: #eee;
	cursor: default;
}

.qtyLabel{
	float: left; 
	margin-right: 10px;
	margin-top: 10px;
}

/* 
	STYLE SHEET FOR IHWY JQUERY LISTNAV PLUGIN V 2.0, 3/2/2009
	
	For more information, visit http://www.ihwy.com/Labs/jquery-listnav-plugin.aspx
*/


/* default styling example
----------------------------------------------------------------- */

.listNav { margin:0 0 10px; }

.ln-letters { overflow:hidden; }
.ln-letters a { font-size:14px; color: #0096DF; display:block;font-weight: bold; float:left; padding:0px 5px; /* border-right:1px solid #3366cc; */  text-decoration:none;} 
.ln-letters a:visited { color: #0096DF; font-weight: bold; }
.ln-letters a.ln-last { border-right:none; } 
.ln-letters a:hover,
.ln-letters a.ln-selected { background-color:#0096DF;color: white;  }
.ln-letters a.ln-disabled { color:#ccc;  }
.ln-letter-count { text-align:center; font-size:0.8em; line-height:1; margin-bottom:3px; color:#336699; }


/* demo-specific
----------------------------------------------------------------- */

#demoThree-nav .ln-letters a { border:none; border-top:2px solid pink; color:red; }
#demoThree-nav .ln-letters a.ln-last { border-right:none; }
#demoThree-nav .ln-letters a:hover,
#demoThree-nav .ln-letters a.ln-selected { border-top:2px solid red; background-color:pink; color:White !important; }
#demoThree-nav .ln-letters a.ln-disabled { color:pink; }
#demoThree-nav .ln-letters a.ln-disabled:hover { color:white; }
#demoThree-nav .ln-letter-count { color:red; }

#demoThree li { color:pink; }
#demoThree li a { color:red; text-decoration:none; }
#demoThree li a:hover { text-decoration:underline; }

#demo4 #listWrapper { width:650px }
#demoFour li { float:left; }
#demoFour a { display:block; text-align:center; width:85px; border:1px solid silver; padding:10px; margin:0 10px 10px 0; text-decoration:none }
#demoFour a:hover { background-color:#eee }