/* ------------------------------------------------------------------------------
 * PRODUCT - (IE7+ FF3+ Opera9+)
 * 
 * 	project: 	StockFuel
 * 	version: 	1.0 - 17.03.2010
 * 	author:		Hugo Larcher (hl@void.pt)
 *	assets:		product.gif
 *
 * 	[Table of Contents]
 *
 * 	1. Product Area (#product)
 * 		1.1. Title (#titleBox)
 *		1.2. Product Wrapper (.productWrapper)
 *			1.2.1. Product Player (#productPlayer)
 *			1.2.2. Product Rate (#productRate)
 *			1.2.3. Product Info (#productInfo)
 *			1.2.4. Flash Product Player (#fproductPlayer)
 *			1.2.5. Flash Product Info (#fproductRate)
 *			1.2.6. Flash Product Rate (#fproductInfo)
 * 	2. Purchase Area (#purchase)
 *		2.1. Purchase Prices (#purchasePrices)
 *			2.1.1. Table (#priceTable)
 *		2.2. Purchase Download (#purchaseDownload)
 *		2.3. Purchase Login (#purchaseLogin)
 *		2.4. Purchase Credits (#purchaseCredits)
 * 	3. Related Area (#related)
 *		3.1. Related Navigation (#relatedTabs)
 *		3.2. Related Comments (#relatedComments)
 *			3.2.1. Comment Paging (.commentPages)
 *		3.3. Related Keywords (#relatedKeywords)
 *		3.4. Related Products (#relatedItems)
 *			3.4.1. Item List (#itemList)
 *			3.4.2. Item Paging (.itemPages)
 * 	4. Favorites Popup (#layerfavorites)
 * 	5. Demo Popup (#layerFlashDemo)
 * ------------------------------------------------------------------------------
 */

/* [1. Product Area] */
#product {
	position:					relative;
	width:						664px;
	height:						auto;
	margin:						0px;
	padding:                	10px;
	text-align:					left;
	background-color:			#232323;
}

.hrBevel {
	width:						664px;
}

#titleBox {
	margin-bottom:				5px;
}

/* [1.2. Product Wrapper] */
.productWrapper {
	position:					relative;
	float:						left;
	width:						492px;
	height:						auto;
	margin:						0px;
	padding:                    0px;
}

/* [1.2.1. Product Player] */
#productPlayer {
	position:					relative;
	width:						480px;
	min-height:					270px;
	margin:						3px 0px 0px 0px;
	padding:                    6px;
	overflow:					hidden;
	text-align:					center;
	background:					#1d1d1d url(../../images/product-player-bg.gif) repeat-y left top;
}

#productPlayer .top {
	position:					absolute;
	top:						0;
	left:						0;
	width:						492px;
	height:						10px;
	background:					#1d1d1d url(../../images/product-player-top.gif) no-repeat left top;
}

#productPlayer .bot {
	position:					absolute;
	bottom:						0;
	left:						0;
	width:						492px;
	height:						10px;
	background:					#1d1d1d url(../../images/product-player-bot.gif) no-repeat left top;
}

#productPlayer img {
	position:					relative;
}

#productPlayer #productPreview {
	position:					relative;
}

#productPlayer #demoButton {
	position:					absolute;
	top:						112px;
	left:						145px;
	width:						184px;
	height:						40px;
	margin:						0px;
	padding:                    3px;
	background-color:			#75afcc;
	-webkit-border-radius: 		8px;
	-moz-border-radius: 		8px;
	-webkit-box-shadow: 		0px 0px 12px #676767;  
	-moz-box-shadow: 			0px 0px 12px #676767;  
	box-shadow: 				0px 0px 12px #676767;
	z-index:					50;
}

#productPlayer #demoButton a {
	position:					relative;
	display:					block;
	width:						137px;
	height:						30px;
	margin:						0px;
	padding:                    5px 5px 5px 42px;
	text-decoration:			none;
	text-align:					left;
	font:						bold 12px/14px Tahoma, Geneva, Verdana, Arial, Helvetica, sans-serif;
	color:						#1d1d1d;
	background:					#ffffff url(../../images/product-demo-button.gif) no-repeat left top;
	-webkit-border-radius: 		5px;
	-moz-border-radius: 		5px;
}

#productPlayer #demoButton a:hover, 
#productPlayer #demoButton a:active {
	text-decoration:			none;
	color:						#1d1d1d;
}

#productPlayer #demoButton a span {
	text-align:					left;
	font:						normal 11px/13px Tahoma, Geneva, Verdana, Arial, Helvetica, sans-serif;
	color:						#1d1d1d;
}

/* [1.2.2. Product Rate] */
#productRate {
	position:					relative;
	width:						486px;
	height:						31px;
	margin:						6px 0px 0px 0px;
	padding:                    3px;
	background:					#1d1d1d url(../../images/product-rate-bg.gif) no-repeat left top;
}

#productRate #rating {
	position:					relative;
	float:						left;
	width:						120px;
	height:						15px;
	margin:						0px;
	padding:                    9px 0px 8px 10px;
}

#productRate #rating span {
	float:						left;
	font: 						11px Tahoma, Geneva, Verdana, Arial, Helvetica, sans-serif;
	font-weight:				bold;
	color:						#ffffff;
}

#productRate #rating ul {
	position:					relative;
	float:						left;
	width:						70px;
	height:						14px;
	margin:						0px;
	padding:                    0px 0px 0px 10px;
}

#productRate #rating ul li {
	position:					relative;
	display:					block;
	float:						left;
	width:						14px;
	height:						14px;
	margin:						0px;
	padding:                    0px;
	text-indent:                -5555px;
	background:					url(../../images/product.gif) no-repeat 0px 0px;
	cursor:						pointer;
}

#productRate #rating ul li.hover {
	background:					url(../../images/product.gif) no-repeat -42px 0px;
}

#productRate #rating ul li.active {
	background:					url(../../images/product.gif) no-repeat -14px 0px;
}

#productRate #rating ul li.halfactive {
	background:					url(../../images/product.gif) no-repeat -28px 0px;
}

#productRate #rating ul li.disabled {
	cursor:						default;
}

#productRate .buttons {
	position:					relative;
	float:						right;
	clear:						right;
	width:						321px;
	height:						31px;
	margin:						0px;
	padding:                    0px;
}

#productRate .buttons a.btn {
	position:					relative;
	float:						right;
	display:					block;
	width:						107px;
	height:						31px;
	margin:						0px;
	padding:                    0px;
	text-indent:                -5555px;
	background:					url(../../images/product.gif) no-repeat;
}

#productRate .buttons a.sdownload {
	background-position:		-214px -55px;
}

#productRate .buttons a.sdownload:hover, 
#productRate .buttons a.sdownload:active {
	background-position:		-321px -55px;
}

#productRate .buttons a.fullframeBt {
	background-position:		0px -20px;
}

#productRate .buttons a.fullframeBt:hover, 
#productRate .buttons a.fullframeBt:active {
	background-position:		-107px -20px;
}

#productRate .buttons a.favoritesBt {
	background-position:		0px -55px;
}

#productRate .buttons a.favoritesBt:hover, 
#productRate .buttons a.favoritesBt:active {
	background-position:		-107px -55px;
}

#productRate .buttons a.viewdemoBt {
	background-position:		-214px -20px;
}

#productRate .buttons a.viewdemoBt:hover, 
#productRate .buttons a.viewdemoBt:active {
	background-position:		-321px -20px;
}

/* [1.2.3. Product Info] */
#productInfo {
	position:					relative;
	float:						left;
	width:						136px;
	height:						auto;
	margin:						3px 0px 0px 6px;
	padding:                    15px;
	overflow:					hidden;
	background:					#1d1d1d url(../../images/product-info-bg.gif) repeat-y left top;
}

#productInfo .top {
	position:					absolute;
	top:						0;
	left:						0;
	width:						166px;
	height:						10px;
	background:					#1d1d1d url(../../images/product-info-top.gif) no-repeat left top;
}

#productInfo .bot {
	position:					absolute;
	bottom:						0;
	left:						0;
	width:						166px;
	height:						10px;
	background:					#1d1d1d url(../../images/product-info-bot.gif) no-repeat left top;
}

#productInfo h1 {
	margin-bottom:				5px;
	font:						12px Tahoma, Geneva, Verdana, Arial, Helvetica, sans-serif;
	font-weight:				bold;
	color:						#9cbddd;
}

#productInfo ul li {
	position:					relative;
	float:						none;
	width:						auto;
	height:						18px;
	margin: 					0px;
	padding:                    0px;
	font:						11px/18px Tahoma, Geneva, Verdana, Arial, Helvetica, sans-serif;
	font-weight:				normal;
	color:						#ffffff;
}

#productInfo ul li span {
	font:						11px Tahoma, Geneva, Verdana, Arial, Helvetica, sans-serif;
	font-weight:				normal;
	color:						#8e8e8e;
}

#productInfo ul li a {
	text-decoration:			underline;
	color:						#8e8e8e;
}

#productInfo ul li a:hover, 
#productInfo ul li a:active {
	color:						#9cbddd;
}

/* [1.2.4. Flash Product Player] */
#fproductPlayer {
	position:					relative;
	width:						590px;
	height:						auto;
	margin:						3px 0px 0px 0px;
	padding:                    6px 37px 6px 37px;
	overflow:					hidden;
	text-align:					center;
	background:					#1d1d1d url(../../images/productf-player-bg.gif) repeat-y left top;
}

#fproductPlayer .top {
	position:					absolute;
	top:						0;
	left:						0;
	width:						664px;
	height:						10px;
	background:					#1d1d1d url(../../images/productf-player-top.gif) no-repeat left top;
}

#fproductPlayer .bot {
	position:					absolute;
	bottom:						0;
	left:						0;
	width:						664px;
	height:						10px;
	background:					#1d1d1d url(../../images/productf-player-bot.gif) no-repeat left top;
}

#fproductPlayer img {
	position:					relative;
}

#fproductPlayer #productPreview {
	position:					relative;
}

#fproductPlayer #demoButton {
	position:					absolute;
	top:						127px;
	left:						231px;
	width:						184px;
	height:						40px;
	margin:						0px;
	padding:                    3px;
	background-color:			#75afcc;
	-webkit-border-radius: 		8px;
	-moz-border-radius: 		8px;
	-webkit-box-shadow: 		0px 0px 12px #676767;  
	-moz-box-shadow: 			0px 0px 12px #676767;  
	box-shadow: 				0px 0px 12px #676767;
	z-index:					50;
}

#fproductPlayer #demoButton a {
	position:					relative;
	display:					block;
	width:						137px;
	height:						30px;
	margin:						0px;
	padding:                    5px 5px 5px 42px;
	text-decoration:			none;
	text-align:					left;
	font:						bold 12px/14px Tahoma, Geneva, Verdana, Arial, Helvetica, sans-serif;
	color:						#1d1d1d;
	background:					#ffffff url(../../images/product-demo-button.gif) no-repeat left top;
	-webkit-border-radius: 		5px;
	-moz-border-radius: 		5px;
}

#fproductPlayer #demoButton a:hover, 
#fproductPlayer #demoButton a:active {
	text-decoration:			none;
	color:						#1d1d1d;
}

#fproductPlayer #demoButton a span {
	text-align:					left;
	font:						normal 11px/13px Tahoma, Geneva, Verdana, Arial, Helvetica, sans-serif;
	color:						#1d1d1d;
}

/* [1.2.5. Flash Product Info] */
#fproductInfo {
	position:					relative;
	width:						634px;
	height:						auto;
	margin:						6px 0px 0px 0px;
	padding:                    15px;
	overflow:					hidden;
	background:					#1d1d1d url(../../images/productf-info-bg.gif) repeat-y left top;
}

#fproductInfo .top {
	position:					absolute;
	top:						0;
	left:						0;
	width:						664px;
	height:						10px;
	background:					#1d1d1d url(../../images/productf-info-top.gif) no-repeat left top;
}

#fproductInfo .bot {
	position:					absolute;
	bottom:						0;
	left:						0;
	width:						664px;
	height:						10px;
	background:					#1d1d1d url(../../images/productf-info-bot.gif) no-repeat left top;
}

#fproductInfo h1 {
	margin-bottom:				5px;
	font:						12px Tahoma, Geneva, Verdana, Arial, Helvetica, sans-serif;
	font-weight:				bold;
	color:						#9cbddd;
}

#fproductInfo ul li {
	position:					relative;
	float:						left;
	width:						auto;
	height:						20px;
	margin: 					0px;
	padding:                    0px 20px 0px 0px;
	font:						11px/18px Tahoma, Geneva, Verdana, Arial, Helvetica, sans-serif;
	font-weight:				normal;
	color:						#ffffff;
}

#fproductInfo ul li span {
	font:						11px Tahoma, Geneva, Verdana, Arial, Helvetica, sans-serif;
	font-weight:				normal;
	color:						#8e8e8e;
}

#fproductInfo ul li a {
	text-decoration:			underline;
	color:						#8e8e8e;
}

#fproductInfo ul li a:hover, 
#fproductInfo ul li a:active {
	color:						#9cbddd;
}

/* [1.2.6. Flash Product Rate] */
#fproductRate {
	position:					relative;
	width:						658px;
	height:						31px;
	margin:						6px 0px 0px 0px;
	padding:                    3px;
	background:					#1d1d1d url(../../images/productf-rate-bg.gif) no-repeat left top;
}

#fproductRate #rating {
	position:					relative;
	float:						left;
	width:						120px;
	height:						15px;
	margin:						0px;
	padding:                    9px 0px 8px 10px;
}

#fproductRate #rating span {
	float:						left;
	font: 						11px Tahoma, Geneva, Verdana, Arial, Helvetica, sans-serif;
	font-weight:				bold;
	color:						#ffffff;
}

#fproductRate #rating ul {
	position:					relative;
	float:						left;
	width:						70px;
	height:						14px;
	margin:						0px;
	padding:                    0px 0px 0px 10px;
}

#fproductRate #rating ul li {
	position:					relative;
	display:					block;
	float:						left;
	width:						14px;
	height:						14px;
	margin:						0px;
	padding:                    0px;
	text-indent:                -5555px;
	background:					url(../../images/product.gif) no-repeat 0px 0px;
	cursor:						pointer;
}

#fproductRate #rating ul li.hover {
	background:					url(../../images/product.gif) no-repeat -42px 0px;
}

#fproductRate #rating ul li.active {
	background:					url(../../images/product.gif) no-repeat -14px 0px;
}

#fproductRate #rating ul li.halfactive {
	background:					url(../../images/product.gif) no-repeat -28px 0px;
}

#fproductRate #rating ul li.disabled {
	cursor:						default;
}

#fproductRate .buttons {
	position:					relative;
	float:						right;
	clear:						right;
	width:						321px;
	height:						31px;
	margin:						0px;
	padding:                    0px;
}

#fproductRate .buttons a.btn {
	position:					relative;
	float:						right;
	display:					block;
	width:						107px;
	height:						31px;
	margin:						0px;
	padding:                    0px;
	text-indent:                -5555px;
	background:					url(../../images/product.gif) no-repeat;
}

#fproductRate .buttons a.sdownload {
	background-position:		-214px -55px;
}

#fproductRate .buttons a.sdownload:hover, 
#fproductRate .buttons a.sdownload:active {
	background-position:		-321px -55px;
}

#fproductRate .buttons a.fullframeBt {
	background-position:		0px -20px;
}

#fproductRate .buttons a.fullframeBt:hover, 
#fproductRate .buttons a.fullframeBt:active {
	background-position:		-107px -20px;
}

#fproductRate .buttons a.favoritesBt {
	background-position:		0px -55px;
}

#fproductRate .buttons a.favoritesBt:hover, 
#fproductRate .buttons a.favoritesBt:active {
	background-position:		-107px -55px;
}

#fproductRate .buttons a.viewdemoBt {
	background-position:		-214px -20px;
}

#fproductRate .buttons a.viewdemoBt:hover, 
#fproductRate .buttons a.viewdemoBt:active {
	background-position:		-321px -20px;
}

/* [2. Purchase Area] */
#purchase {
	position:					relative;
	width:						668px;
	height:						auto;
	margin:						15px 0px;
	padding:                	10px 8px 8px 8px;
	overflow:					hidden; /* FF float fix */
	text-align:					left;
	background-color:			#232323;
}

#purchase h1 {
	text-align:					center;
	font:						12px/24px Tahoma, Geneva, Verdana, Arial, Helvetica, sans-serif;
	font-weight:				bold;
	color:						#f7ab45;
}

#purchase h2 {
	text-align:					center;
	font:						18px/26px 'Trebuchet MS', 'Lucida Grande', Arial, sans-serif;
	font-weight:				normal;
	color:						#ffffff;
}

#purchase p {
	text-align:					center;
	font:						11px/22px Tahoma, Geneva, Verdana, Arial, Helvetica, sans-serif;
	font-weight:				normal;
	color:						#8e8e8e;
}

#purchase a.btn {
	position:					relative;
	display:					block;
	width:						110px;
	height:						30px;
	margin:						0px 19px 0px 19px;
	padding:                    0px;
	text-indent:                -5555px;
	background:					url(../../images/product-purchase-assets.gif) no-repeat;
}

/* [2.1. Purchase Prices] */
#purchasePrices {
	position:					relative;
	float:						left;
	width:						474px;
	height:						130px;
	margin:						0px;
	padding:                    10px;
	background:					#2e2e2e url(../../images/product-prices-bg.gif) repeat-y left top;
}

#purchasePrices .top {
	position:					absolute;
	top:						0;
	left:						0;
	width:						494px;
	height:						10px;
	background:					#2e2e2e url(../../images/product-prices-top.gif) no-repeat left top;
}

#purchasePrices .bot {
	position:					absolute;
	bottom:						0;
	left:						0;
	width:						494px;
	height:						10px;
	background:					#2e2e2e url(../../images/product-prices-bot.gif) no-repeat left top;
}

/* [2.1.1. Table] */
#purchasePrices table#priceTable {
	width: 						474px;
	padding: 	                0px;
	margin:                     0px;
}

#purchasePrices table#priceTable td {
	height:						33px;
	padding: 	                0px;
	vertical-align:				middle;
	text-align: 				center;
	font:						11px Tahoma, Geneva, Verdana, Arial, Helvetica, sans-serif;
	font-weight:				normal;
	color:						#ffffff;
	background:					url(../../images/product-purchase-assets.gif) no-repeat -5px -120px;
}

#purchasePrices table#priceTable td.priceSelect {
	padding:               	    0px 0px 0px 5px;
	text-align: 				center;
	background:					none;
}

#purchasePrices table#priceTable td.priceVersion {
	padding:               	    0px 0px 0px 5px;
	text-align: 				left;
	font:						11px Tahoma, Geneva, Verdana, Arial, Helvetica, sans-serif;
	font-weight:				bold;
	color:						#ffffff;
	background:					none;
}

#purchasePrices table#priceTable td.priceCost {
	font:						11px Tahoma, Geneva, Verdana, Arial, Helvetica, sans-serif;
	font-weight:				bold;
	color:						#f7ab45;
}

#purchasePrices table#priceTable td .pricecheck {
	width:						auto;
	height:						auto;
	margin:						0px;
	padding:                    0px;
	border:						none;
	background:					none;
}

/* [2.2. Purchase Download] */
#purchaseDownload {
	position:					relative;
	float:						left;
	width:						148px;
	height:						115px;
	margin:						0px 0px 0px 4px;
	padding:                    35px 10px 0px 10px;
	background:					#232323 url(../../images/product-download-bg.gif) repeat-y left top;
}

#purchaseDownload .top {
	position:					absolute;
	top:						0;
	left:						0;
	width:						168px;
	height:						10px;
	background:					#2e2e2e url(../../images/product-download-top.gif) no-repeat left top;
}

#purchaseDownload .bot {
	position:					absolute;
	bottom:						0;
	left:						0;
	width:						168px;
	height:						10px;
	background:					#2e2e2e url(../../images/product-download-bot.gif) no-repeat left top;
}

#purchase a.downloadBt {
	background-position:		0px 0px;
}

#purchase a.downloadBt:hover, 
#purchase a.downloadBt:active {
	background-position:		-110px 0px;
}

/* [2.3. Purchase Login] */
#purchaseLogin {
	position:					relative;
	float:						left;
	width:						148px;
	height:						130px;
	margin:						0px 0px 0px 4px;
	padding:                    20px 10px 0px 10px;
	background:					#232323 url(../../images/product-login-bg.gif) repeat-y left top;
}

#purchaseLogin .top {
	position:					absolute;
	top:						0;
	left:						0;
	width:						168px;
	height:						10px;
	background:					#2e2e2e url(../../images/product-login-top.gif) no-repeat left top;
}

#purchaseLogin .bot {
	position:					absolute;
	bottom:						0;
	left:						0;
	width:						168px;
	height:						10px;
	background:					#2e2e2e url(../../images/product-login-bot.gif) no-repeat left top;
}

#purchase a.loginBt {
	background-position:		0px -60px;
}

#purchase a.loginBt:hover, 
#purchase a.loginBt:active {
	background-position:		-110px -60px;
}

#purchase a.registerBt {
	background-position:		0px -90px;
}

#purchase a.registerBt:hover, 
#purchase a.registerBt:active {
	background-position:		-110px -90px;
}

/* [2.4. Purchase Credits] */
#purchaseCredits {
	position:					relative;
	float:						left;
	width:						148px;
	height:						125px;
	margin:						0px 0px 0px 4px;
	padding:                    25px 10px 0px 10px;
	background:					#232323 url(../../images/product-credits-bg.gif) repeat-y left top;
}

#purchaseCredits .top {
	position:					absolute;
	top:						0;
	left:						0;
	width:						168px;
	height:						10px;
	background:					#2e2e2e url(../../images/product-credits-top.gif) no-repeat left top;
}

#purchaseCredits .bot {
	position:					absolute;
	bottom:						0;
	left:						0;
	width:						168px;
	height:						10px;
	background:					#2e2e2e url(../../images/product-credits-bot.gif) no-repeat left top;
}

#purchase a.creditsBt {
	background-position:		0px -30px;
}

#purchase a.creditsBt:hover, 
#purchase a.creditsBt:active {
	background-position:		-110px -30px;
}

/* [3. Related Area] */
#related {
	position:					relative;
	clear:						both;
	width:						684px;
	height:						auto;
	margin:						15px 0px 0px 0px;
	padding:                	11px 0px 10px 0px;
	text-align:					left;
	background-color:			#232323;
}

/* [3.1. Related Navigation] */
#relatedTabs {
	position:					relative;
	width:						664px;
	height:						43px;
	margin:						0px 10px 0px 10px;
	padding:                    0px;
	background:					#1d1d1d url(../../images/product-tabs-bg.gif) no-repeat left top;
}

#relatedTabs ul {
	position:					relative;
	width:						330px;
	height:						43px;
	margin:						0px;
	padding:                    0px 167px 0px 167px;
}

#relatedTabs ul li {
	position: 					relative;
	display:					block;
	float:						left;
	width:						110px;
	height:						31px;
	margin:						0px;
	padding:                    12px 0px 0px 0px;
	text-align:					center;
	font:						11px Tahoma, Geneva, Verdana, Arial, Helvetica, sans-serif;
	font-weight:				bold;
	color:						#8e8e8e;
	background:					url(../../images/product.gif) no-repeat -110px -90px;
	cursor:						pointer;
}

#relatedTabs ul li.hover {
	font:						11px Tahoma, Geneva, Verdana, Arial, Helvetica, sans-serif;
	font-weight:				bold;
	color:						#9cbddd;
	background-position:		-220px -90px;
	cursor:						pointer;
}

#relatedTabs ul li.active {
	font:						11px Tahoma, Geneva, Verdana, Arial, Helvetica, sans-serif;
	font-weight:				bold;
	color:						#ffffff;
	background-position:		0px -90px;
	cursor:						default;
}

/* [3.2. Related Comments] */
#relatedComments {
	position:					relative;
	clear:						both;
	width:						674px;
	height:						auto;
	margin:						0px 5px 0px 5px;
	padding:                    0px;
}

.commentItem {
	margin:						0px 5px 0px 5px;
}

.commentItem .comment .commentBar .info {
	width:						300px;
}

.commentItem .comment .commentBar .actions {
	width:						230px;
}

/* [3.2.1. Comment Paging] */
#relatedComments .commentPages {
	position:					relative;
	clear:						both;
	width:						652px;
	height:						28px;
	margin:						0px 5px 4px 5px;
	padding:                	4px 5px 5px 7px;
	background:					#1d1d1d url(../../images/product-paging-bg.gif) no-repeat left top;
}

/* [3.3. Related Keywords] */
#relatedKeywords {
	position:					relative;
	clear:						both;
	width:						674px;
	height:						auto;
	margin:						0px;
	padding:                    0px;
}

#relatedKeywords .wordsList {
	position:					relative;
	width:						624px;
	height:						auto;
	margin:						0px 10px 0px 10px;
	padding:                    20px;
	background:					#232323 url(../../images/product-keywords-bg.gif) repeat-y left top;
}

#relatedKeywords .wordsList .top {
	position:					absolute;
	top:						0;
	left:						0;
	width:						664px;
	height:						10px;
	background:					#2e2e2e url(../../images/product-keywords-top.gif) no-repeat left top;
}

#relatedKeywords .wordsList .bot {
	position:					absolute;
	bottom:						0;
	left:						0;
	width:						664px;
	height:						10px;
	background:					#2e2e2e url(../../images/product-keywords-bot.gif) no-repeat left top;
}

#relatedKeywords .wordsList p {
	text-align:					center;
	font:						12px/20px Tahoma, Geneva, Verdana, Arial, Helvetica, sans-serif;
	font-weight:				normal;
	color:						#8e8e8e;
}

#relatedKeywords .wordsList a {
	text-decoration:			underline;
	color:						#8e8e8e;
}

#relatedKeywords .wordsList a:hover, 
#relatedKeywords .wordsList a:active {
	color:						#9cbddd;
}

/* [3.4. Related Products] */
#relatedItems {
	position:					relative;
	clear:						both;
	width:						674px;
	height:						auto;
	margin:						0px;
	padding:                    0px;
}

/* [3.4.1. Item List] */
#relatedItems ul#itemList {
	position:					relative;
	width:						672px;
	height:						auto;
	margin:						0px 5px 0px 5px;
	padding:                	0px 1px 6px 1px;
}

#relatedItems ul#itemList li {
	position:					relative;
	float:						left;
	width:						206px;
	height:						110px;
	margin:						0px 6px 6px 0px;
	padding:                	7px;
	overflow:					hidden;
	text-align:					left;
	background:					transparent url(../../images/thumb-bg.gif) no-repeat left top;
}

#relatedItems ul#itemList li.last {
	margin:						0px 0px 6px 0px;
	clear:						right;
}

#relatedItems ul#itemList li p {
	position:					relative;
	float:						right;
	width:						89px;
	margin-top:					5px;
	overflow:					hidden;
}

#relatedItems ul#itemList li p a {
	text-decoration:			underline;
	color:						#ffffff;
}

#relatedItems ul#itemList li p a:hover,
#relatedItems ul#itemList li p a:active {
	color:						#9cbddd;
}

#relatedItems ul#itemList li img {
	position:					relative;
	float:						left;
	width:						110px;
	height:						110px;
	overflow:					hidden;
	margin-right:				7px;
}

#relatedItems ul#itemList li div.fthumb {
	position:					relative;
	float:						left;
	width:						110px;
	height:						110px;
	overflow:					hidden;
	margin-right:				7px;
}

/* [3.4.2. Item Paging] */
#relatedItems .itemPages {
	position:					relative;
	clear:						both;
	width:						652px;
	height:						28px;
	margin:						0px 10px 0px 10px;
	padding:                	4px 5px 5px 7px;
	background:					#1d1d1d url(../../images/product-paging-bg.gif) no-repeat left top;
}

/* [4. Favorites Popup] */
#layerfavorites {
	width: 						330px;
	height: 					370px;
    top: 						50%;
    left: 						50%;
    margin:						0px;
	padding:                    5px;
	text-align:					left;
    background-color: 			#ffffff;
    color: 						#323232;
	margin-top:					-170px;
	margin-left: 				-170px;
	z-index:					5000;
}

/* [4.1. Title] */
#layerfavorites .titlebox {
	position:					relative;
	width:						330px;
	height:						35px;
	margin:						0px 0px 5px 0px;
	padding:                    0px;
}

#layerfavorites .titlebox span {
	display:					block;
	float:						left;
	width:						240px;
	height:						15px;
	margin:						0px;
	padding:                    11px 5px 9px 20px;
	text-align:					left;
	font:						11px Tahoma, Geneva, Verdana, Arial, Helvetica, sans-serif;
	font-weight:				normal;
	color:						#676767;
}

#layerfavorites .titlebox a {
	display:					block;
	float:						right;
	width:						35px;
	height:						35px;
	margin:						0px 10px 0px 0px;
	padding:                    0px;
	background:					#ffffff url(../../images/popup-close.gif) no-repeat left top;
	text-indent:                -5555px;
}

/* [4.2. Content] */
#layerfavorites .contentbox {
	clear:						both;
	width:						300px;
	height:						300px;
	margin:						0px;
	padding:                    15px;
	font:						11px Tahoma, Geneva, Verdana, Arial, Helvetica, sans-serif;
	font-weight:				normal;
	color:						#323232;
	background: 				#e8e8e8 url(../../images/popup-favorites-bg.gif) no-repeat left top;
}

/* existing folder */
#layerfavorites .contentbox #exist_box {
	position:					relative;
	width:						300px;
	height:						70px;
	border-bottom:				1px solid #b7b7b7;
	z-index:					100;
}

#layerfavorites .contentbox #exist_box p {
	text-indent:                2px;
	font: 						11px Tahoma, Geneva, Verdana, Arial, Helvetica, sans-serif;
	font-weight:				bold;
	color:						#323232;
}

#layerfavorites .contentbox #exist_box form {
	position:					relative;
	float:						left;
	width:						300px;
	height:						35px;
	margin:						0px;
	padding:                	10px 0px 0px 0px;
}

#layerfavorites .contentbox #exist_box form label {
	float:						left;
	width:						auto;
	margin:						9px 0px 0px 0px;
	text-align:					left;
	font: 						11px Tahoma, Geneva, Verdana, Arial, Helvetica, sans-serif;
	font-weight:				normal;
	color:						#323232;
}

#layerfavorites .contentbox #exist_box form div.comboholder {
	position:					relative;
	display:					block;
	float:						left;
	height: 					30px;
	margin:						0px;
	padding:	 				0px;
}

#layerfavorites .contentbox #exist_box form input.favSelect {
	display: 					inline;
	width: 						143px;
	margin:	 					0px;
	padding:					8px 30px 6px 10px;
	border: 					none;
	background:					none;
	line-height:				16px;
	font: 						11px Tahoma, Geneva, Verdana, Arial, Helvetica, sans-serif;
	color:						#000000;
	background:					url(../../images/popup-favorites-assets.gif) no-repeat 0px 0px;
}

#layerfavorites .contentbox #exist_box form input.favSelect.hover {
	background-position:		-183px 0px;
}

#layerfavorites .contentbox #exist_box form input.favSelect.active {
	background-position:		-366px 0px;
}

#layerfavorites .contentbox #exist_box form .favSelectOptions {
	max-height: 				200px;
	padding:                    5px 1px 5px 1px;
	overflow: 					auto;
	text-align:					left;
	border: 					solid 3px #4d4d4d;
	background: 				#ffffff;
}

#layerfavorites .contentbox #exist_box form .favSelectOptions li {
	display: 					block;
	padding:                    3px 5px 3px 5px;
	font: 						11px Tahoma, Geneva, Verdana, Arial, Helvetica, sans-serif;
	color:						#1b1b1b;
}

#layerfavorites .contentbox #exist_box form .favSelectOptions li.hover {
	background: 				#e0e0e0;
}

#layerfavorites .contentbox #exist_box form .favSelectOptions li.sel {
	background: 				#e0e0e0;
}

#layerfavorites .contentbox #exist_box form input.existFavButton {
	float:						right;
	width: 						96px;
    height: 					30px;
	margin:						0px 0px 0px 10px;
	padding:	 				0px;
    border: 					none;
	background:					url(../../images/popup-favorites-assets.gif) no-repeat;
	background-position:		0px -130px;
	text-indent:				-5555px;	
	cursor: 					pointer;
}

#layerfavorites .contentbox #exist_box form input.existFavButton:hover, 
#layerfavorites .contentbox #exist_box form input.existFavButton:active {
	background-position:		-96px -130px;
}

/* create new folder */
#layerfavorites .contentbox #create_box {
	position:					relative;
	width:						300px;
	height:						225px;
	margin:						0px;
	padding:                    15px 0px 0px 0px;
}

#layerfavorites .contentbox #create_box p {
	text-indent:                2px;
	font: 						11px Tahoma, Geneva, Verdana, Arial, Helvetica, sans-serif;
	font-weight:				bold;
	color:						#323232;
}

#layerfavorites .contentbox #create_box #iconfavs {
	position:					relative;
	width:						300px;
	height:						38px;
	margin:						0px;
	padding:                    10px 0px 0px 0px;
}

#layerfavorites .contentbox #create_box #iconfavs img {
	position:					relative;
	float:						left;
	width:						34px;
	height:						34px;
	margin:						0px;
	padding:                    0px;
	border:						1px solid #e8e8e8;
}

#layerfavorites .contentbox #create_box #iconfavs img.sel {
	border:						1px solid #323232;
}

#layerfavorites .contentbox #create_box form {
	position:					relative;
	clear:						both;
	width:						300px;
	height:						150px;
	margin:						0px;
	padding:                	10px 0px 0px 0px;
}

#layerfavorites .contentbox #create_box form label {
	position:					relative;
	float:						left;
	clear:						left;
	width:						90px;
	height:						22px;
	margin:						0px 0px 3px 0px;
	padding:                    8px 10px 0px 0px;
	text-align:					right;
	font: 						11px Tahoma, Geneva, Verdana, Arial, Helvetica, sans-serif;
	font-weight:				normal;
	color:						#323232;
}

#layerfavorites .contentbox #create_box form div.inputholder {
	position:					relative;
	float:						left;
	width: 						198px;
	height: 					30px;
	margin:						0px 0px 5px 0px;
	padding:	 				0px;
	background:					url(../../images/popup-favorites-assets.gif) no-repeat;
	background-position:		0px -30px;
}

#layerfavorites .contentbox #create_box form div.textholder {
	position:					relative;
	float:						left;
	width: 						198px;
	height: 					70px;
	margin:						0px 0px 5px 0px;
	padding:	 				0px;
	background:					url(../../images/popup-favorites-assets.gif) no-repeat;
	background-position:		0px -60px;
}

#layerfavorites .contentbox #create_box form input.textinput {
	width: 						178px;
	margin:						8px 10px 6px 10px;
	padding:	 				0px;
	border: 					none;
	background:					none;
	line-height:				16px;
	font: 						11px Tahoma, Geneva, Verdana, Arial, Helvetica, sans-serif;
	color:						#000000;
}

#layerfavorites .contentbox #create_box form textarea {
	width: 						178px;
	height: 					52px;
	margin:						9px 10px 9px 10px;
	padding:	 				0px;
	border: 					none;
	background:					none;
	line-height:				13px;
	font: 						11px Tahoma, Geneva, Verdana, Arial, Helvetica, sans-serif;
	color:						#000000;
}

#layerfavorites .contentbox #create_box form input.newFavButton {
	float:						right;
	width: 						96px;
    height: 					30px;
	margin:						0px 0px 0px 10px;
	padding:	 				0px;
    border: 					none;
	background:					url(../../images/popup-favorites-assets.gif) no-repeat;
	background-position:		0px -130px;
	text-indent:				-5555px;	
	cursor: 					pointer;
}

#layerfavorites .contentbox #create_box form input.newFavButton:hover, 
#layerfavorites .contentbox #create_box form input.newFavButton:active {
	background-position:		-96px -130px;
}

#layerfavorites .contentbox #create_box form input.checkbox {
	float:						left;
	width:						auto;
	margin:						8px 10px 0px 0px;
	padding:                    0px;
	border:						none;
	background:					none;
}

/* [5. Demo Popup] */
a.closeBtn {
	position:					absolute;
	display:					none;
	top:						0px;
	right:						0px;
	width:						35px;
	height:						35px;
	margin:						0px 10px 0px 0px;
	padding:                    0px;
	background:					transparent url(../../images/demo-close.gif) no-repeat left top;
	text-indent:                -5555px;
	z-index:					5001;
}

#layerflashdemo {
    top: 						50%;
    left: 						50%;
    margin:						0px;
	padding:                    5px;
	text-align:					left;
    background-color: 			#ffffff;
    color: 						#323232;
	z-index:					5000;
}

/* [5.1. Title] */
#layerflashdemo .titlebox {
	position:					relative;
	width:						100%;
	height:						35px;
	margin:						0px 0px 5px 0px;
	padding:                    0px;
}

#layerflashdemo .titlebox span {
	display:					block;
	float:						left;
	width:						400px;
	height:						15px;
	margin:						0px;
	padding:                    11px 5px 9px 20px;
	text-align:					left;
	font:						11px Tahoma, Geneva, Verdana, Arial, Helvetica, sans-serif;
	font-weight:				normal;
	color:						#676767;
}

#layerflashdemo .titlebox a {
	display:					block;
	float:						right;
	width:						35px;
	height:						35px;
	margin:						0px 10px 0px 0px;
	padding:                    0px;
	background:					#ffffff url(../../images/popup-close.gif) no-repeat left top;
	text-indent:                -5555px;
}

/* [5.2. Content] */
#layerflashdemo .contentbox {
	clear:						both;
	overflow:					auto;
	margin:						0px;
	padding:                    0px;
	background: 				#e8e8e8;
}