/* =====================================================
	PRODUCT LISTS
	===================================================== */
/*
	First Level tabs (might includes second level of tabs)
===================================================== */
#tabsSuperBG {/*ul*/
	clear: both; 
	text-align: center;
	*float: left;
	width: 100%;
	margin: 5px -15px;
	padding: 2px 15px 0 15px;
	list-style: none;
	background: #fff;
	border-bottom: 8px solid #e5e5e5;
}
#tabsSuperBG li {
	text-align: left;
	display: inline-block;
	margin: 0 -3px 1px 0;
	*float: left;
	*margin-right: 1px;
	padding: 10px 14px 2px 14px;
	cursor: pointer;
	font-size: 20px;
	font-weight: normal;
	line-height: 80%;
	letter-spacing: 0;
	color: #666;
	background: #e5e5e5 url('../imgPG/grad60TW.png') left top repeat-x;
	border-radius: 10px 10px 0 0;
}
#tabsSuperBG li span {
	font-size: 10px;
	font-weight: bold;
	letter-spacing: 0;
}
#tabsSuperBG li:hover {
	background: #e5e5e5 url('../imgPG/grad60WT80.png') left bottom repeat-x;
	color: #e40;
}
#tabsSuperBG li.selected {
	background: #e5e5e5 url('../imgPG/grad60WT80.png') left bottom repeat-x;
	padding: 10px 14px 3px 14px;
	margin-bottom: 0;
	color: #06a;
}


/*	Tabs for product lists
==========================================*/
ul.tabsBG {
	clear: both; 
	line-height: 100%;
	float: left;
	width: 100%;
	margin: 0;
	padding: 0;
	font-size:13px;
	border-bottom: 2px #6699cc solid;
}
ul.tabsBG li {
	float: left;
	margin: 0;
	padding: 0;
		line-height: 240%;
	list-style: none;
}
ul.tabsBG li span {
	display: inline-block;
	padding: 0 4px 0 0;
	margin: 8px 0 0 0;
}
ul.tabsBG li.tabUnselected {
	background: #c2c2c2 url('../imgPG/grad50WT80_.png') repeat-x left top;
	padding: 7px 6px 4px 6px;
	margin: 0 1px 0 0;
	cursor: pointer;
	color: #000;
	border-radius: 6px 6px 0 0;}
ul.tabsBG li.tabUnselected:hover {
	background: #c2c2c2 url('../imgPG/grad50TW80.png') repeat-x left top;
	color: #000000;}
ul.tabsBG li.tabSelected {
	background: #000000 url('../imgPG/grad50WT80.png') repeat-x left bottom;
	padding: 7px 6px 5px 6px;
	margin: 0 1px 0 0;
	cursor: pointer;
	color: #fed;
	border-radius: 6px 6px 0 0;}

.tabLayer {clear: both; }
.tabLayer h2 {clear: both; color: #999999; padding: 5px 0 0 0;}

.tabLayer .layerMoreBG {
	float:left; 
	width: 32%; 
	margin-right: 4px; 
	padding-bottom: 1px; 
	text-align: center;font-size: 12px;}
.tabLayer .layerMoreBG h4 {
	padding: 0 2px; 
	text-align:center; 
	height: 55px; 
	line-height: 110%; 
	margin: 0 0 5px 0;
}
.tabLayer .layerIMBG {
	display: table;
	table-layout:fixed;
	border-collapse: collapse; 
	border: 0;
	height: 114px;
	width: 100%;
	overflow: hidden;
}

.tabLayer .layerIMBG img {
	max-height: 110px;
	max-width: 100%;
	border: 1px solid #eee;
	box-shadow: 3px 3px 3px #888;
	margin: 0 auto;
}

/*	===================================== 
	Name list of products
	===================================== */
#nameListBG {margin: 0 0 12px 0}
#nameListBG table {
	background: #fff;
	color: #000;
	border-collapse: collapse;
	border-spacing: 0;
	}
#nameListBG th {
	font-size: 11px;
	font-weight: bold;
	padding: 8px 4px;
	color: #eee;
	border-right: 1px solid #eee;
	}
#nameListBG td {
	padding: 4px;
	border-right: 1px solid #f9f9f9;
	}
#nameListBG td:last-child,
#nameListBG th:last-child {
	border-right: 0;
}

/*	===================================== 
	Detail list of products (including middle promotion)
	=====================================*/
.detailsRowBG {
	clear: both;
	margin-bottom: 12px;
	}
.detailsBG {
	margin-bottom: 10px;
	text-align: center;
	color: #999;
	}
.detailsBG div.local {}
.detailsBG h2 {
	margin: 0;
	padding: 0;
	height: 70px;
	
	}

.details {
	margin: 0;
	padding: 0;
	}
.details div.imgBG{
	display: table;
	table-layout: fixed;
	height: 140px;
	width: 100%;
	overflow: hidden;
	text-align: center;
	}
.details div.imgBG img {
	max-height: 136px;
	max-width: 100%;
	margin: 0 auto;
	}

.openPhotoTextImgBG {text-align: right; padding-right: 4px}
.imgOpenGalleryBG {margin: 1px -1px 0 0;}
.openGalleryTextImgBG {float:left; padding-left: 4px}

.details div.text {
	line-height: 120%;
	padding: 0;
	margin-top: 10px;
	text-align: left;
/*
	height: 104px;
	overflow: hidden;
*/
	}
.details div.priceBG {
	clear:both; 
	margin: 10px 0 0 0; 
	font-weight: normal;
	color: #000;
	font-size: 12px;
	height: 48px;
	line-height: 120%;
	}
.details div.priceBG span {font-weight: bold;}

.addForm {
	background: url('../imgPG/sx_colorGray10.png') left top repeat;
	clear:both;
	margin-top: 10px;
	text-align: left;
	padding: 0;
	}
.addForm form {}
.addForm form select {margin-top: 3px;}
.addForm table td {padding: 3px}
.addForm .shoppingImgCellH {
	padding: 4px 4px 0 4px;
	background: #fff url('../imgPG/sx_headerGray.png') left -4px repeat;
	}
.addForm .shoppingImgCell {
	padding: 4px 4px 0 4px;
	background: #fff url('../imgPG/sx_headerGray.png') left 5px repeat-x;
	vertical-align: top;
	border: 1px solid #e5e5e5;
	}
.addForm span.imgLink {
	display:block;
	padding-top: 3px;
	}

.discountBG {clear: both; margin-bottom: 4px}
.discountColor {
	color:#c00;
	}

/*	In productDetails.asp Page
======================================= */
#productBG {}

#imgBigBG {
	background: #fff;
	margin: 0;
	text-align: center;
	width: 100%;
	display: table;
	table-layout: fixed;
	overflow: hidden;
	text-align: center;
}
#imgBigBG div {}
#imgBigBG div img{
	max-width: 100%;
	max-height: 500px;
	margin: 0 auto;
}

#imgSmallBG {
	text-align: center;
}
#imgSmallBG div {
	cursor: pointer;
	margin: 5px; 
	float:left;
	}
#imgSmallBG div img {height: 70px}

#productBG .addForm{margin: 0 1px;}
#productBG .priceBG {
	padding: 5px;
	line-height: 160%;
}
#productBG .priceBG span{font-size: 18px;}

#productBG div.details {clear: both; padding-left: 5px;}
#productBG .text{}

/*	Tabs for Viewing variants of product images
======================================= */
#imageViewerBG {
	text-align:center;
	margin: 0 10%; 
	padding: 10px;
}

#imageViewer {
	border-top: 2px solid #eee;
	border-bottom: 2px solid #eee;
	padding: 20px 0;
}
#imageViewer div {}
#imageViewer div img{}

#imageViewerBG .infoBG {
	clear:both;
	margin: 10px 0;
	padding: 10px;
	text-align: center;
	font-size: 12px;
}

#imgTabBG {
	float:left;
}
.imgTabR {
	float:left;
	cursor: pointer;
	background: #eee;
	color: #000;
	padding: 6px;
	z-index: 100;
	margin-right: 1px;
	}
.imgTab {
	float:left;
	cursor: pointer;
	background: #fff;
	color: #d60;
	padding: 6px 6px 5px 6px;
	margin-right: 1px;
	}

/*	===================================================== 
	CUSTOMER MENU CLASSES
	===================================================== */
/*	Order View/Print/payment Classes
	========================= */
#repeatPayment {
	clear: both; 
	margin: 10px 0; 
	padding: 5px; 
	border: 1px solid #9c9; 
	background: #696 url('../imgPG/grad60WT80.png');
	height: 25px;
	color: #000;
	font-weight: bold;
}
#repeatPayment a {color: #eee;}
#repeatPayment a:hover {color: #000;}

#printViewLogo {
	clear: both; 
	margin: 10px 0; 
	padding-bottom: 2px;
	border-bottom: 2px solid #000;
	}

#viewBG {
	background: url('../imgPG/sx_color.png') left top repeat;
	padding: 10px 0;
	background: #000;
}
#printViewBG {
	width: 100%; 
	margin-bottom: 20px;
	padding: 5px 0;
	border-bottom: 1px solid #000000;
	border-top: 1px solid #000000;
	}

/* =============================================================
   SURVEY CLASSES 
============================================================= */
 
.voteBG {
	 margin: 20px 0;
	 background: #fff;
 }
.voteTitle {
 }
.voteTitle div{
 	color: #fff;
 	font-weight: bold;
 	text-align: center;
 	background: url('../imgPG/sx_header.png') left bottom repeat;
 	padding: 5px 2px;
 }
 
.voteContent {
	 padding: 5px;
	 margin-top: 1px;
	 border: 1px solid #eee;
 }
.voteContent h4 {
 }
.voteContent div {padding: 2px 0;
  }
.voteContent a {
	 background: url('../imgPG/sx_dotA2.gif') left top no-repeat;
	 padding-left: 14px;
 }
.voteContent a:hover {
	 background: url('../imgPG/sx_dotA4.gif') left top no-repeat;
 }


/*	
	END
	========================== */