﻿/***********************************************************************
						reset and clearing
*************************************************************************/
:link,:visited {
	text-decoration : none;
}

h1,h2,h3,h4,h5,h6,pre,code {
	font-size : 1em;
}
ul,ol
{
	list-style:none;
}
ul,ol,li,h1,h2,h3,h4,h5,h6,pre,form,body,html,p,blockquote,fieldset,input,a, img {
	margin : 0; padding : 0
}

a img,:link img,:visited img {
	border : none;
}

a
{
	color: #717171;
	text-decoration: none;
}

a:hover
{
	color: #EF1C23;
}
/* 
	**easy clearing 
	Any container with class="clearer" will expand around enclosed floated elements
*/
.clearer:after {
	content: '[HI MUM]'; 
	display: block; 
	height: 0; 
	clear: both; 
	visibility: hidden;
}
.clearer {
	display: inline-block;
}
/*\*/
.clearer {
	display: block;
}
/* end easy clearing */

/* Safari needs this - otherwise the ghost overflow, though painted 
correctly obscures links and form elements that by rights should be above it.
An unintended side-effect is that it cause such elements to vanish in IE 5.01
and 5.5, hence the child selector hack */
/**************************************************************************/

body 
{
	background-color: #ffffff;
	font-family:Arial, Helvetica, sans-serif;
	font-size:13px;	
	color:#8E8E8E;
	/*background-image: url(../images/bg/home_bg.jpg);*/
	background-repeat: repeat-x;
	line-height:1.3;
}

.container
{
	margin: 0 auto;
	position: relative;
	width: 950px;
}

h1
{
	font-size: 20px;
	line-height: 2em;
	font-weight: normal;
}

h2{} 
h3{}

p{padding: 10px 0;}
/****************header**********************/
#header
{
	padding-top: 20px;
	/*display: block;*/
	clear: both;
	z-index: 2;
	
}

#header #logo
{
	float: left;
	padding-bottom: 25px;
}

#dropdownmenu
{
	height: 200px;
	width: 100%;
	display: none;
	position: absolute;
	background-image: url(../images/bg/dropdown_menu_bg.jpg);
	background-repeat: repeat;
	background-position: left center;
}
#search_bar
{
	background: transparent url(../images/bg/search_bar.gif) scroll repeat-x 0 0;
	height: 46px;
}

.search 
{
	padding-top: 5px;
	float: right;
	/*width: 230px;*/
	
}

.searchBox
{
	width: 180px;
	padding-left: 30px;
	background: transparent url(../images/bg/searchfield_full.png) scroll no-repeat 0 0 ;
}

.search .left
{
	background: transparent url(../images/bg/searchfield_leftcap.png) scroll no-repeat 0 0 ;
	width: 31px;
	height: 34px;
	display: block;
	float: left;
	cursor:pointer;
	border: none;
}
.search .right
{
	background: transparent url(../images/bg/searchfield_rightcap.png) scroll no-repeat 0 0 ;
	width: 13px;
	height: 34px;
	display: block;
	float: left;
}

.search .search_text
{
	/*background:transparent url(../images/bg/searchfield_repeat.png) repeat-x scroll center top;*/
	background:none;
	border:0 none;
	margin:0;
	padding:10px 0 0;
	width:110px;
	height: 24px;
	float: left;
	line-height: normal;
}

.search #submit
{
	background-color:transparent;
	background-image:url(../images/bg/button_search_submit.png);
	background-position:left top;
	background-repeat:no-repeat;
	border:medium none;
	cursor:pointer;
	height:33px;
	margin:1px 0 0 16px;
	width:51px;
}


.search img#search_loading
{
	position:absolute;
	right:100px;
	z-index:999;
	padding-top: 10px;

}

.search span.indicate_text
{
	position: absolute;
	right: 140px;
	z-index: 10;
	top: 13px;
	display: block;
}
/******************homepage**********************/
#scrollBar
{
	margin-top: 230px;
}

#scrollBar li {
	display:inline;
	float:left;
	padding: 0 14px;
}

#scrollBar li  a{
	display: block;
	height: 79px;
}

#scrollBar li a.icon1
{
	background: transparent url(../images/icon/home_icon1.jpg) scroll no-repeat 0 0;
	width: 59px;
	height: 79px;
}

#scrollBar li a.icon1:hover
{
	background: transparent url(../images/icon/home_icon1_on.jpg) scroll no-repeat 0 0;
	width: 59px;
	height: 79px;
}

#scrollBar li a.icon2
{
	background: transparent url(../images/icon/home_icon2.jpg) scroll no-repeat 0 0;
	width: 101px;
	height: 79px;
}

#scrollBar li a.icon2:hover
{
	background: transparent url(../images/icon/home_icon2_on.jpg) scroll no-repeat 0 0;
	width: 101px;
	height: 79px;
}

#scrollBar li a.icon3
{
	background: transparent url(../images/icon/home_icon3.jpg) scroll no-repeat 0 0;
	width: 94px;
	height: 79px;
}
#scrollBar li a.icon3:hover
{
	background: transparent url(../images/icon/home_icon3_on.jpg) scroll no-repeat 0 0;
	width: 94px;
	height: 79px;
}
#scrollBar li a.icon4
{
	background: transparent url(../images/icon/home_icon4.jpg) scroll no-repeat 0 0;
	width: 129px;
	height: 79px;
}
#scrollBar li a.icon4:hover
{
	background: transparent url(../images/icon/home_icon4_on.jpg) scroll no-repeat 0 0;
	width: 129px;
	height: 79px;
}
#scrollBar li a.icon5
{
	background: transparent url(../images/icon/home_icon5.jpg) scroll no-repeat 0 0;
	width: 71px;
	height: 79px;
}

#scrollBar li a.icon5:hover
{
	background: transparent url(../images/icon/home_icon5_on.jpg) scroll no-repeat 0 0;
	width: 71px;
	height: 79px;
}

.product
{
	display: block;
	float:left;
	width: 500px;
	height: 200px;
	text-align: right;
}


#amplified
{
	width: 500px;
	height: 500px;
	display: block;
	margin-top: -350px;
	float: left;
	
}

#flashcontent
{
	display: block;
	/*width: 603px;
	height: 358px;*/
	position: absolute;
	top: -150px;
	z-index: -1;
}


/***content**/

#content
{
	/*padding: 20px 0 50px 0 ;*/
	
}

#content .leftCol .section
{
	width: 300px;
}
/*******Eric Xue 15th April 2009 *********************************************************************************************/
#content .leftCol{float: left;display: block;/*width: 300px;*/width: 340px;}
#content .leftCol .category{width:100%;}
#content .leftCol .category h1{color:#919191;font-size:21px;font-weight:normal;padding-top:16px;line-height:22px;padding-bottom:4px;}
#content .leftCol .category h2{color:#919191;font-size:16px;font-weight:normal;}
#content .leftCol .category ul{float:left;padding-bottom:18px;}
#content .leftCol .category ul li{float:left;border-right:1px solid #919191;padding-right:8px;margin-right:8px;}
#content .leftCol .category ul li.last{padding-right:0px;border-right:none;}
#content .leftCol .category ul li a{color:#919191;}
#content .leftCol .category ul li a:hover{color:#ed1c24;}
#content .leftCol .category ul li a.hover{color:#ed1c24;}
#content .leftCol .category p{clear:both;width:330px;padding:0px 0 12px 0;}
#content .leftCol .category a{color:#ed1c24;}

#content .leftCol .products{width:100%;}
#content .leftCol .products h1{color:#919191;font-size:21px;font-weight:normal;padding-top:16px;line-height:22px;padding-bottom:4px;}
#content .leftCol .products .box{width:335px;border-bottom:1px solid #cccccc;padding:2px 0 4px 0;}
#content .leftCol .products .box span.plus{float:right;padding-right:5px;}
#content .leftCol .products .box span{font-weight:bold;display:inline;padding-right:10px;}
#content .leftCol .products .box span.open{display:block;width:300px;cursor:pointer;}
#content .leftCol .products .box ul{padding-top:10px;padding-bottom:8px;float:none;padding-left:8px;}
#content .leftCol .products .box li{float:none;padding:1px 0;}
#content .leftCol .products a.back{color:#ed1c24;display:block;padding-top:10px;}
#content .leftCol .products .hideContent{display:none;}

#content .leftCol .commercial{width:100%;}
#content .leftCol .commercial h1{color:#919191;font-size:21px;font-weight:normal;padding-top:16px;line-height:22px;padding-bottom:4px;}
#content .leftCol .commercial .box{width:335px;border-top:1px solid #cccccc;padding:2px 0 4px 0;}
#content .leftCol .commercial .box span.plus{float:right;padding-right:5px;}
#content .leftCol .commercial .box span{font-weight:bold;display:inline;padding-right:10px;}
#content .leftCol .commercial .box span.open{display:block;width:300px;cursor:pointer;}
#content .leftCol .commercial .box ul{padding-top:10px;padding-bottom:10px;float:none;padding-left:8px;}
#content .leftCol .commercial .box li{float:none;padding:1px 0;}
#content .leftCol .commercial a.back{color:#ed1c24;display:block;padding-top:10px;}
#content .leftCol .commercial .hideContent{display:none;}

#content .rightCol{width: 600px;float: right;display: block;}
#content .rightCol .detailImage{width:100%;padding:0px 0 10px; height: 330px;}
#content .rightCol .sliderImages{width:590px;}
#content .rightCol .sliderImagesInner{width:33px;float:left;}
#content .rightCol .sliderImages .show{position:relative;width:523px;overflow:hidden;float:left; }
#content .rightCol .sliderImages .showPortfolio{position:relative;width:523px;overflow:hidden;float:left; padding-top:15px;}
#content .rightCol .sliderImages .productWrapper{float:left;width:6000px;z-index:1;}
#content .rightCol .rightHandler{float:left;padding:40px 0 0;}
#content .rightCol .leftHandler{float:left;padding:40px 0 0;}
#content .rightCol .sliderImages ul{float:left;width:523px;position:relative;}
#content .rightCol .sliderImages li{float:left;padding:0 7px;}

#content .rightCol .sliderImagesNew{width:590px;}
#content .rightCol .sliderImagesInner{width:33px;float:left;}
#content .rightCol .sliderImagesNew .show{position:relative;width:600px;overflow:hidden;float:left; padding-top:15px;}
#content .rightCol .sliderImagesNew .productWrapper{float:left;width:6000px;z-index:1;}
#content .rightCol .rightHandler{float:left;padding:40px 0 0;}
#content .rightCol .leftHandler{float:left;padding:40px 0 0;}
#content .rightCol .sliderImagesNew ul{float:left;width:590px;position:relative;}
#content .rightCol .sliderImagesNew li{float:left;}

#popUp{width:214px;height:115px;background:transparent url(../images/popUp.png) scroll no-repeat 0 0;position:absolute;top:115px;left:715px;
display:none;}
#popUp h1{font-weight:normal;font-size:16px;text-align:left;padding:12px 0 0 12px;line-height:18px;}
#popUp h1 span{}
#popUp p{padding:1px 0 1px 12px;text-align:left;font-size:11px;}
#popUp p span{padding:0 5px 0 0;font-weight:bold;}
#popUp p span.normal{padding:0;font-weight:normal;}
#popUp p a{color:#ed1c24;font-weight:bold;}
#content .rightCol .detailImage .ozMade
{
	 background: transparent url(../images/oz_made.gif) no-repeat right bottom;
	 width: 100%;
	 height: 100%;
}
/*******Eric Xue 15th April 2009 *********************************************************************************************/

div.hr
{
	height: 1px;
	display: block;
	background-color: #CCCCCC;
	font-size: 1px;
	margin-top: 15px;
	margin-bottom: 5px;
}

form input.text, input.small_text, textarea, select
{
	border: 1px solid #cccccc;
	color: #717171;
	font-size: 13px;
	padding: 2px;
}

form input.small_text
{
	width: 150px;
}

form button#btnSubmit
{
	background: transparent url(../images/bg/button_bg.jpg) scroll no-repeat 0 0;
	height: 33px;
	width: 100px;
	border: none;
	cursor: pointer;
}

form span.mandatory
{
	color: Red;
}

div.grad_box
{
	background: transparent url(../images/bg/grad_box_bg.jpg) scroll repeat-y 0 0;
	width: 500px;
	/*line-height: 1em;*/
	margin-bottom: 20px;
} 

div.grad_box_top
{
	background: transparent url(../images/bg/grad_box_top.jpg) scroll no-repeat 0 0;
	width: 500px;
	height: 15px;
	display: block;
	font-size: 1px;
	
}

div.grad_box_expand
{		
	background: transparent url(../images/bg/grad_box_expand.jpg) scroll no-repeat 0 0;
	width: 500px;
	display: block;
	padding-left: 20px;
	padding-top: 5px;
	
}

div.grad_box_bot
{	
	background: transparent url(../images/bg/grad_box_bot.jpg) scroll repeat-y 0 0;
	width: 500px;
	height: 14px;
	display: block;
	font-size: 1px;
	
}

ul#sitemap
{
	list-style-position: outside;
	list-style-type: circle; 
	margin-left: 15px;
	margin-top: 10px;
	line-height: 2em;
		
}

ul#sitemap li ul
{
	margin-left: 30px;
	padding: 5px 0;
	font-size: 0.9em;
}

/**************footer****************/
#pageFooter
{
	height: 25px;
	font-size: 10px;
	margin-top: 40px; 
}
#pageFooter span
{
	float: right;
}
#pageFooter li
{
	display:inline;
	background-image:url(../images/bg/footer_sep.gif);
	background-position:right center;
	background-repeat:no-repeat;
	float: left;
	list-style-type:none;
	margin:0;
	position:relative;
	padding: 0 15px;
}

#pageFooter li.first
{
	padding-left: 0;
}

#pageFooter li.last
{
	background-image: none;
	
}

#pageFooter li.site_built
{
	float: right;
	background-image: none;
}

.pics img {width:587px; height:348px;}



