/*
PRODUCT PAGE STYLES

Styles targetted for a certain colour scheme must be selected in context of the root colour scheme class

eg. 
.productDetailsOnBlack ...other selectors {
			black colour scheme specific style
}

All global product styles should be in a more general context, or within .productDetails context
*/

/* Global styles */
.productDetails {
	width: 784px;
	padding-left: 2px;
}

.productDetails .top {
	width: 784px;
	height: 3px;
	background-repeat: no-repeat;
	background-position: top left;
	line-height:1px;
}

.productDetails .content {
	height: 320px;
	margin-right: 2px;
	background-repeat: repeat-x;
	background-position: top left;
	position: relative;
	overflow: hidden;
	/*overflow-x: hidden;
	overflow-y: hidden;*/
}

	.productDetails .content table.selector {
		width: 764px;
		margin: 0 auto;
	}
	
	.productDetails .content .prev, .content .next, .content .prev a, .content .next a {
		font-size: 11px;
		text-decoration: none;
	}
	
	.content table.selector td {
		vertical-align: middle;
		width: 30%;
	}
	
	.content .prev {
		text-align: left;	
	}
	
	.content .next {
		text-align: right;	
	}
	
	.content .current {
		text-align: center;	
	}
	
	.content .current {
		color: white;
		font-size: 16px;
	}
	
	.content .contentImage {
		position: absolute;
		top: 50px;
		left: 50px;
	}
	
	.contentDescription {
		color: white;
		position: absolute;
		top: 45px;
		left: 381px;
		width: 392px;
		font-size: 11px;
	}
	
		.contentDescription .right {
			float: right;
			margin: -20px 10px 10px 10px;
		}
	
		.contentDescription .productTitle {
			font-size: 18px;
			margin: 0 0 10px 0;
		}
		
		.contentDescription .productDescription {
			margin: 10px 10px 10px 0;
		}
		
		.contentDescription .productDescription p {
			padding: 0;
		}
		
		.contentDescription table.productPrice {
			margin: 10px 0 10px 0;
			height: 22px;
			font-size: 14px;
		}
		
			.productPrice .priceLeft, .productPrice .priceRight {
				width: 5px;
				height: 22px;
				background-repeat: no-repeat;
			}
		
			.productPrice .priceLeft {
				background-image: url("/images/products/priceLeft.png");
			}
			
			.productPrice .priceContent {
				color: #666666;
				background-color: white;
				vertical-align: middle;
			}
			
			.productPrice .priceRight {
				background-image: url("/images/products/priceRight.png");
			}
			
		.contentDescription .buttons {
			margin: 10px 0 0 0;
		}
			
			.contentDescription .buttons a {
				margin-right: 6px;
			}

.productItemContainer {
	/*display: inline;*/
}

.productItem {
	width: 330px;
	height: 110px;
	position: relative;
	float: left;
}

	.productItem .productItemImage {
		background-image:url("/images/products/productItemImageBG.png");
		background-position:left top;
		background-repeat:no-repeat;
		height:90px;
		left:0;
		padding:5px;
		position:absolute;
		top:0;
		width:135px;
	}
	
		.productItemImage a{
			position: relative;
			top: 0px;
			left: 0px;
		}
		
	.productItem .productItemInfo {
		position: absolute;
		top: 0px;
		left: 165px;
		width: 165px;
		/*height: 110px;*/
		line-height: normal;
	}
	
		.productItemInfo .productItemName {
			color: #999999;
			font-size: 14px;
		}
		
		.productItemInfo .productPrice .priceLeft {
			background-image: url("/images/products/itemPriceLeft.png");
		}
		
		.productItemInfo .productPrice .priceContent {
			color: #666666;
			background-color: #f5f5f5;
			vertical-align: middle;
		}
		
		.productItemInfo .productPrice .priceRight {
			background-image: url("/images/products/itemPriceRight.png");
		}

div.productTabsContainer {
	background-image: url("/images/products/tabsShadow.png");
	background-position: top right;
	background-repeat: no-repeat;
	padding: 0 4px 0 2px;
	width: 782px;
}
	
	.productCarousel {
		background-image: url("/images/products/carouselBG.png");
		background-repeat: repeat-x;
		margin: 0 1px 0 2px;
		height: 50px;
		position: relative;
	}
	
		.productCarousel #colourControl {
			position: absolute;
			top: 16px;
			left: 380px;
		}
		
		.productCarousel #share {
			position: absolute;
			top: 18px;
		    right: 18px;
		}
			
		.productCarousel .swatch {
			float: left;
			margin-right: 5px;
		}
		
			.productCarousel #colourControl .active {
				border-bottom: 2px solid #999999;
			}
			
			.swatch .swatchColour {
				width: 14px;
				height: 14px;
				border: 1px solid white;
				margin-bottom: 2px;
			}
		
		.productCarousel #imagesControl 
		{
		    width:99999px;
		}
		
			#imagesControl div {
				float: left;
				height: 38px;
				width: 60px;
				background-image: url("/images/products/carouselItem.png");
				background-position: top left;
				background-repeat: no-repeat;
				padding-top: 12px;
				text-align: center;
			}
			
				#imagesControl div a {
					margin: 0 auto;
				}
			
			#imagesControl div.active {
				background-image: url("/images/products/carouselItemSelected.png");
			}
	
	

.tabDetailContainer .tabDetailBG {
	background-image: url("/images/products/tabDetailShadow.png");
	background-position: top right;
	background-repeat: repeat-y;
	padding: 0 4px 0 2px;
	width: 782px;
}
	.tabDetailContent {
		background-color: white;
		padding: 20px;
		color: #666666;
		overflow: auto;
		line-height: 16px;
	}
	
	.tabDetailContent strong {
		color: #000;
	}

	.tabDetailContainer .bottom {
		height: 6px;
		background-image: url("/images/products/productDetailBottom.png");
		background-position: top left;
		background-repeat: no-repeat;
	}
	
	ul#expandFirst div#specTopHead
	{
		padding-bottom: 10px;
		color: #4b4b4b;
	}
	
	#productDetailDisplay ul.collapsible {
	    list-style-image: none;
	    list-style-type: none;   
	}
	
	#productDetailDisplay ul
	{
		list-style: disc inside;
        color: #666666;
        margin: 0;
        line-height: 16px;
		list-style-image: none;	
		list-style-position: inside;		
	}
	
	#productDetailDisplay ul.bulleted {
		list-style-image: url( "/images/bullet.png" ); 
		/*list-style-position:inside;*/
		margin-left: 15px;
	}
	
		#productDetailDisplay ul li ul a
		{
				color: #4b4b4b;	
				line-height: 16px;
		}
	
.sideContent ul.accordian {
	list-style-type: none;
	list-style-image: none;
	margin: 0;
	font-size: 10px;
}

	.sideContent ul.accordian li {
		/* background-image: url("/images/products/usageCategory.png");
		background-position: top left;
		background-repeat: no-repeat;
		line-height: 24px; */
		width: 168px;
		padding: 0 0 1px 0;
		
	}
	
	.sideContent ul.accordian li.active {
		background-image: url("/images/products/usageCategorySelected.png");
		background-color: white;
	}

	.sideContent ul.accordian a {
		display: block;
		width: 158px;
		/* padding: 0 5px; */
		height: 1em;
		color: white;
		font-weight: bold;
		text-decoration: none;
	}
	
	.sideContent ul.accordian ul {
		list-style-image: url("/images/bullet.png");
	}
	
		.sideContent ul.accordian ul a {
			display: block;
			width: 143px;
			height: 24px;
			color: #666666;
			font-weight: normal;
		}
		
		.sideContent ul.accordian ul li {
			background-image: none;
			background-color: white;
			width: 143px;
			margin-left: 2em;
			color: #cc0000;
			font-weight: bold;
		}
		
		.sideNavBar ul li a.MenuToggle {
			
		}
	
/* Eric's Carousel */
#fullBackdrop 
{
    top:0;
    left:0;
    height:100%;
    width:100%;
    position:fixed;
    background-color:Black;
    opacity:0;
    z-index:100;
    display:none;
}

#carousel_container 
{
    left:50%;
    top:50px;
    margin-left:-320px;
    position:absolute;
    display:none;
    z-index:101;
	width: 640px;
}

#lightBoxTopHeader
{
	background-image: url("/images/lightBoxHeader.png");
	position: absolute;
	width: 640px;
	height: 34px;
	top : 5px;
	left : 0px;
	z-index: 102;
	padding-top:5px;
}  

#lightBoxTopBar
{
	background-image: url("/images/lightBoxTopBar.png");
	position: absolute;
	width: 640px;
	height: 5px;
	top : 0px;
	left : 0px;
	z-index: 102;

}  

#lightBoxTop
{
	background-image: url("/images/lightBoxTop.png");
	position: absolute;
	width: 640px;
	height: 20px;
	top : 34px;
	left : 0px;
	z-index: 102;
}  



#lightBoxBottom
{
	background-image: url("/images/lightBoxBottom.png");
	position: absolute;
	width: 640px;
	height: 20px;
	top : 630px;
	left : 0px;
	z-index: 102;
}  

#lightBoxBottomBar
{
	background-image: url("/images/lightBoxBottomBar.png");
	background-repeat:no-repeat;
	position: absolute;
	width: 640px;
	height: 5px;
	top : 700px;
	left : 0px;
	z-index: 102;
}  


#lightBoxLeft
{
	background-image: url("/images/lightBoxLeftBack.png");
	background-repeat:repeat-y;
	height:576px;
	width:20px;
	z-index: 102;
	position:absolute;
	top:54px;
	left: 0px;
}

#lightBoxRight
{
	background-image: url("/images/lightBoxRightBack.png");
	background-repeat:repeat-y;
	height: 576px;
	width:20px;
	z-index: 102;
	position:absolute;
	top:54px;
	left:620px;
} 

#carouselRendererContainer
{
		border: 2px solid white;
		height:150px;
		width:620px;
}
    	
#carousel_inner {  
	float:left; /* important for inline positioning */  
	height:650px;
	width:640px; /* important (this width = width of list item(including margin) * items shown */  
	overflow: hidden;  /* important (hide the items outside the div) */  
	position: relative;
	/* non-important styling bellow */  
}  

    
#carousel_ul {  
	position:relative;  
	left:0px; /* important (this should be negative number of list items width(including margin) */  
	list-style-type: none; /* removing the default styling for unordered list items */  
	margin: 0px;  
	padding-top: 5px;
	padding: 0px;  
	width:99999px; /* important */  
	/* non-important styling bellow */  
	padding-bottom:10px;  
}  

#carouselRenderer 
{
	position:relative;  
	left:0px; /* important (this should be negative number of list items width(including margin) */  
	list-style-type: none; /* removing the default styling for unordered list items */  
	margin: 0px;  
	padding: 0px;  
	width:99999px; /* important */  
	/* non-important styling bellow */  
	padding-bottom:10px;      
}
   
#carousel_ul li
{  
	float: left; /* important for inline positioning of the list items */  
	width:640px;  /* fixed width, important */  
	height:650px;
	/* just styling bellow*/  
	padding:0px;  
	/*height:520px;*/ 
	list-style:none;
}  

#carousel_ul li div
{  
background-color: #000000;
margin-top: 5px;
padding-top: 95px;
}  


#carousel_ul li img {  
	.margin-bottom:-4px; /* IE is making a 4px gap bellow an image inside of an anchor (<a href...>) so this is to fix that*/  
	/* styling */  
	cursor:pointer;  
	cursor: hand;  
	border:0px;  
}  

#moveLeft {
	padding: 10px;
	position: absolute;
	top: 7px;
	left: 0px;
}
#lightBoxControls
{
	height:50px;
	background-color:#FFF;
	position:absolute;
	top:650px;
	left:0px;
	width:640px;
}

#moveRight {
	padding: 10px;
	position: absolute;
	top: 7px;
	left: 270px;
}

#viewStrip
{
	/*float:left;*/ /* important for inline positioning */  
	height: 38px;
	overflow: hidden;  /* important (hide the items outside the div) */  
	position: relative;
	left: 30px;
	/* non-important styling bellow */  
}

#left_scroll, #right_scroll, #closeCarousel {  
	color: black;
	z-index: 102;
}  


#left_scroll {  
	top: 600px;
	left: 5px;
	float: left;
	background-repeat: no-repeat;
	width: 85px;
	height: 13px;
	padding-left: 15px;
}

#right_scroll {
	top: 600px;
	right: 5px;
	float: right;
	width: 85px;
	height: 13px;
	padding-right: 15px;
}

#closeCarousel {
	top: 0px;
	right: 0px;
	width: 70px;
	height: 33px;
	float: right;
}



#left_scroll img, #right_scroll img, #closeCarousel img{  
/*styling*/  
cursor: pointer;  
cursor: hand;  
}
		
.sideNavBar ul li.active
{
	background-color:#CC0000;
}

.sideNavBar ul li.active div.contentSubTop
{
background-image:url(/images/sideBarSubTopRed.png);
}

.sideNavBar ul li.active div.contentSubBottom
{
	background-image:url(/images/sideBarSubBotRed.png);
}

/*
div .active div
{
	background-color:#C00;
	color:#FFF;
}
*/

div.selectedProductTab div
{
	height: auto;
	background-color: transparent;
	color:#F00;
}

div.driverBar.active div
{
	background-color: transparent;
}

.contentDescription .BVRRPrimaryRatingSummary {
	display: block;
	margin-left: 200px;
	margin-top: -108px;
	margin-right: 8px;
}
.contentDescription .BVRRPrimaryRatingSummary{
	font-size: 11px;
	text-align: right;
}
.contentDescription .BVRRRatingSummaryLinks .BVRRRatingSummaryLink, .contentDescription .BVRROverallRatingContainer{
	padding: 0;
	margin: 0;
}
.contentDescription .BVRRPrimaryRatingSummary .BVRROverallRatingContainer {
	margin-left:47px;
	float: right;
	width: 143px;
}
.contentDescription .BVRRRatingsHistogramButton{
	padding: 4px 0;
	display: none;
}
.contentDescription .BVRRRatingSummary .BVRROverallRatingContainer  .BVRRRatingNormalImage {
	padding: 2px 0;
}
.contentDescription .BVRRRatingEntry {
	padding: 0;
}
.contentDescription .BVRRRatingOverall .BVRRRatingNormalOutOf {
	padding: 0;
}
.contentDescription .BVRRBuyAgainContainer {
	clear: both;
	margin-top: -10px;
}
.contentDescription .BVRRRatingSummaryLinks {
	margin-top: 5px;
}
.contentDescription .BVRRBuyAgainTotal{
	display: none;
}
.contentDescription .BVRRBuyAgainContainer *{
	color: #aaa;
}
.contentDescription .BVRRBuyAgainContainer .BVRRNumber{
	color: #fff;
}
.contentDescription .BVRRBuyAgainContainer, .contentDescription .BVRRRatingSummaryLinks{
	line-height: 14px;
}
.contentDescription .BVRRRootElement a{
	color: #fff;
}
			
.productDetails .inlineRatings img 
{
    vertical-align: middle;   
}

/* fancybox-custom.css copy */

/*customer fancy*/

/* overwrite the fancy box style */
#fancybox-title {
	font-size:14px;
	font-weight:bold;
	text-align:left;
	top:6px;
	left: 5px;
	padding: 0px 10px !important;
	width: auto !important;
	height: auto !important;
	bottom: auto;
}
#fancybox-title .cufonBook {
	padding-bottom: 0;
	padding-top: 0;
}
#fancybox-title span{
	color: #CC0105;
}
#fancybox-close {
	background: none;
	background:url("/images/fancybox/closeButton.png") no-repeat scroll 0 0 transparent !important;
	height:19px;
	width:19px;
	right: 6px;
	top: 3px;
}
#fancybox-wrap {
	padding: 20px 60px;
}
#fancybox-outer {
	width:517px;
}
#fancybox-outer-top  {
	background:url("/images/fancybox/dialogOutterTop.png") repeat-y scroll 0 0 transparent !important;
	height:6px;
	width:517px;
}
#fancybox-outer-bottom  {
	background:url("/images/fancybox/dialogOutterBottom.png") repeat-y scroll left bottom transparent !important;
	height:6px;
	width:517px;
}
#fancybox-inner {
	background:url("/images/fancybox/dialogInnerCenter.png") repeat-y scroll 0 0 transparent !important;
	top: 39px !important;
	left: 6px !important;
	width: 505px !important;
}
#fancy-bg-n {
	background:url("/images/fancybox/dialogInnerTop.png") no-repeat scroll 0 0 transparent !important;
	height:10px;
	left:6px;
	top:30px;
	width:505px;
}

#fancy-bg-s {
	background:url("/images/fancybox/dialogInnerBottom.png") no-repeat scroll left bottom transparent !important;
	bottom:0;
	height:10px;
	left:6px;
	width:505px;
}
#fancy-bg-ne, #fancy-bg-e, #fancy-bg-se, #fancy-bg-sw, #fancy-bg-w, #fancy-bg-nw{
	display: none;
}
#fancybox-additional{
	background: #FFFFFF;
	width:481px;
	text-align: left;
	padding: 3px 18px;
}
#fancybox-additional a{
	color: #c00;
	text-decoration: underline;
}
#fancybox-overlay{
	background: #000 !important;
	opacity:0.6 !important;
}
.fancybox-inline-content{
	padding: 0 10px;
	width: 485px;
	text-align: left;
}
.fancybox-ie * {   FILTER: none !important;}
body.transBG {
	padding: 0 10px;
	margin: 0;
	text-align: left;
	background:url("/images/fancybox/dialogInnerCenter.png") repeat-y scroll 0 0 transparent;
}

.transBG  .desc{
	line-height: 15px;
}

.transBG  .form{
	padding: 20px 0 5px;
	font-size: 13px;
	line-height: 22px;
	vertical-align: middle;
}
.transBG  .form input{
	vertical-align: middle;
}

.transBG  .error{
	color: red;
	line-height: 15px;
}

button.redButton {
	background:url("/images/redButton.png") no-repeat scroll left top transparent;
	border:medium none;
	height:23px;
	line-height:23px;
	width:110px;
	color: white;
	font-weight: bold;
}