/* CSS Documents */
/* border: 1px solid black;

/*-----------------------------------------------------------------
	GENERAL
-----------------------------------------------------------------*/
img{
	border		: 0px;
}

img.product{
	border		: 1px solid #c4c4c4;
}

img.noborder{
	border		: 0px !important;
}

.img_border{
	border: 3px solid #006699;
}

.img_left{
	float		: left;
	margin		: 0 10px 10px 0;
}

.img_right{
	float		: right;
	margin		: 0 0px 10px 10px;
}

.img_center{
	display		: block;
	margin		:  0 0 10px 0;;
	text-align	: center;
}

img.img_left{
	float		: left;
	padding		: 2px;
	margin		: 0 10px 10px 0;
}

img.img_right{
	float		: right;
	padding		: 2px;
	margin		: 0 20px 10px 10px;
}


form{
	margin		: 0px;
}

table.top tr td{
	vertical-align: top;
}

table tr.tr_title{
	background	: #a30017;
}

table tr.tr_title td{
	font-weight	: bold;
}

table tr.tr_line1{
	background	: #2b2b2b;
}


table tr.tr_line2{
	background: #111111;
}

.alert{
	color: #FF0000;
	font-size: 11px;
}

p{
	margin: 0px;
}

.img_thumb{
	text-align: center;
	width: 131px;
	height: 98px;
	border: 3px solid #006699;
	font-size: 1em;
	line-height: 98px;
	background: #FFFFFF;
}

.img_thumb img {
	margin-top: expression(( 98 - this.height ) / 2); 
}

html>body .img_thumb img{    /*hidden from IE 5-6 */
	margin-top: 0; /* to clean up, just in case IE later supports valign! */
	vertical-align: middle;
}



/*-----------------------------------------------------------------
	LAYOUT-GENERAL
-----------------------------------------------------------------*/
.float_left{
	float		: left;
}

.float_right{
	float		: right;
}

.clear{
	clear		: both;
	margin		: 0 0 5px 0;
}

.align_center{
	text-align	: center;
}

.align_right{
	text-align	: right;
}

ul{
	margin-top		: 0px;
	margin-bottom	: 0px;
}
li{
	margin-top		: 0px;
	margin-bottom	: 0px;
}

.bottombanner{
	float: left;
	margin: 0 10px 15px 0;
}



/*-----------------------------------------------------------------
	LAYOUT
-----------------------------------------------------------------*/

body{
	padding		: 0px;
	margin		: 0px;
	height		: 100%;
	width		: 100%;
	text-align	: center;
	background-color:#000000;
}

.wrap{
	margin		: 0px auto;
	width		: 929px;
	text-align	: left;
}	

#header{
	background	: url(../../images/bg_header.jpg) repeat-x;
	height		: 108px;	
	width		: 100%;
}	

.logo{
	width		: 170px;
}

.bg_news{
	background	: url(../../images/bg_news.jpg) no-repeat;
	width		: 678px;
	height		: 23px;
	padding		: 10px 0 0 20px;
}

.news_title{
	width		: 120px;
}

.box_atas{
	background	: url(../../images/box_atas.jpg) no-repeat;
	width		: 717px;
	height		: 15px;
}

.box_bawah{
	background	: url(../../images/box_bawah.jpg) no-repeat;
	width		: 717px;
	height		: 16px;
}

.box_tengah{
	background	: url(../../images/box_tengah.jpg) repeat-y;
	width		: 677px;
	height		: 55px;
	text-align	: left;
	padding		: 0 20px 0 20px;

}
	
.box_detail{
	float		: left;
	margin		: 0 8px;
}	

.sub_box_atas{
	background	: url(../../images/sub_box_atas.jpg) no-repeat;
	width		: 665px;
	height		: 24px;
	text-align	: left;
	padding		: 7px 0 0 32px;
}

.sub_box_tengah{
	background	: url(../../images/sub_box_tengah.jpg) repeat-y;
	width		: 675px;
	text-align	: left;
	padding		: 10px 11px 10px 10px;
	float		: left;
}

.sub_box_tengah2{
	background	: url(../../images/sub_box_tengah.jpg) repeat-y;
	width		: 675px;
	height		: 160px;
	text-align	: left;
	padding		: 10px 11px 10px 10px;
}

.sub_box_bawah{
	background	: url(../../images/sub_box_bawah.jpg) no-repeat;
	width		: 698px;
	height		: 20px;
	text-align	: left;
	float		: left;
}

.sub_box_content{
	float		: left;
	margin		: 0px 6px 10px 6px;
	width		: 120px;
	height		: 250px;
	font-size	: 11px;
}

.sub_box_content2{
	float		: left;
	margin		: 0 6px;
	width		: 120px;
	height		: 180px;
	font-size	: 11px;
}

.sub_box_content3{
	float		: left;
	margin		: 0 7px 7px 0;
	width		: 120px;
	height		: 250px;
	font-size	: 11px;
}

.sub_box_link{
	padding		: 2px 20px 0 0;
}

.wrap_right{
	margin-top	: 6px;
	width		: 200px;
	padding		: 0 0 50px 15px;
	background	: url(../../images/box_garis.jpg) repeat-y;
}

.bg_content{
	margin		: 0 auto;
	width		: 95%;
	padding		: 10px;
	background-color: #202020;
	border		: 1px solid #cacaca;
}

.bg_content2{
	width		: 95%;
	padding		: 10px;
	background-color: #f6f6f6;
	border		: 1px solid #cacaca;
}

.bg_content3{
	margin		: 0 auto;
	width		: 500px;
	padding		: 10px;
	background-color: #f6f6f6;
	border		: 1px solid #cacaca;
}

.bg_content4{
	margin		: 0 auto;
	width		: 350px;
	padding		: 10px;
	background-color: #202020;
	border		: 1px solid #cacaca;
}


#footer{
	background	: url(../../images/bg_footer.jpg) repeat-x;
	height		: 31px;	
	width		: 100%;
	padding		: 13px 0px 0px 0px;
	text-align	: left;
}

/* Product */
.otherCatalogPicture
{
  height		: 100px;
  width			: 290px;
}


.miniDivDetail
{
  border		: 1px solid #CCCCCC;
  width			: 70px;
  height		: 93px;
  float			: left;
  margin-top	: 9px;
  margin-right	: 9px;
}

.miniDivDetail img
{
  border		: 0px;
  width			: 70px;
  height		: 93px;
}	

#mainCatalogPicture
{
	width: 282px;
	text-align: center;
  padding		: 1px;
  border		: 1px solid #c4c4c4;
}

#product_wrap{
	width		: 710px;
	float		: left;
}


.float_left_product{
	float		: left;
	width		: 290px;
}

.float_right_product{
	float		: right;
	width		: 405px;
}

.

/*-----------------------------------------------------------------
	FONT
-----------------------------------------------------------------*/
.bold{
	font-weight	: bold;
}


body{
	font-family	: Arial, Helvetica, sans-serif;
	font-size	: 12px;
	color		: #ffffff;
	line-height : 130%;
}


#main_menu{
	font-size	: 12px;
}

h1{
	font-size	: 12px;
	font-weight	: bold;
	margin		: 0px;
}

h2{
	font-size	: 13px;
	font-weight	: bold;
	margin		: 0px;
	color		: #860017;
}

h3{
	font-size	: 11px;
	font-weight	: bold;
	text-decoration: underline;
	margin		: 0px;
}

h4{
	font-size	: 12px;
	font-weight	: bold;
	color		: #fcff00;
	margin		: 0px;
}

h5{
	font-size	: 11px;
	font-weight	: normal;
	color		: #fcff00;
	margin		: 0px;
}

h6{
	font-size	: 13px;
	font-weight	: bold;
	color		: #4ca100;
	margin		: 0 0 5px 0;
}




.smaller{
	font-size	: 11px;
}

.bigger{
	font-size	: 14px;
}

.red{
	color		: #ad004f;
	
}

.pink{
	color		: #fe0089;
}

.blue{
	color		: #009cff;
}

.yellow{
	color		: #deff00;
}

.red_block{
	padding		: 3px;
	color		: #ffffff;
	font-weight	: bold;
	background-color: #da0024;
}


.yellow_block{
	padding		: 3px;
	color		: #232323;
	font-weight	: bold;
	background-color: #ffff3c;
}

.green_block{
	padding		: 3px;
	color		: #860017;
	font-weight	: bold;
	background-color: #92edd4;
}


.text_strike{
	text-decoration:line-through;
}

hr{
	border-top: 0px;
	border-right: 0px;
	border-left: 0px;
	border-bottom: 1px dotted #CCCCCC;
}

#clock{
	background: url(../../images/ic_time.jpg) no-repeat;
	padding: 0 0 0 21px;
}

/*-----------------------------------------------------------------
	LINK
-----------------------------------------------------------------*/
a, a:visited{
	color		: #deff00;
	text-decoration: none;
}

a:hover{
	color		: #ffc600;
}

a.cat, a.cat:visited{
	color: #fcff00;
	text-decoration: none;
	font-weight: bold;
	display: block;
	border-top: 1px dotted #ffffff;
	margin-top: 10px;
}

a.cat:hover{
	text-decoration: underline;
}

a.menu2, a.menu2:visited{
	color: #ffffff;
	text-decoration: none;
	font-weight: bold;
}

a.menu2:hover, a.menu2:active{
	color: #ffffff;
	text-decoration: underline;
}

a.menu, a.menu:visited{
	margin		: 55px 1px 0 2px;
	padding		: 7px 0 0 0;
	height		: 23px;
	width		: 139px;
	background	: url(../../images/btn_off.jpg) no-repeat;
	
	font-family	: Century Gothic;
	display		: block;
	float		: left;
	font-size	: 14px;
	color		: #ffffff;
	font-weight	: bold;
	text-align	: center;
	text-decoration: none;
}

a.menu:hover, a.menu:active{
	background	: url(../../images/btn_on.jpg) no-repeat;
}

/*-----------------------------------------------------------------
	FORM
-----------------------------------------------------------------*/
input.text_search{
	width		: 160px;
}

input.text{
	width		: 100%;
	border		: 1px solid #00b4ff;
	font-size : 11px;
}

select.select2{
	width		: 100%;
	border		: 1px solid #00b4ff;
}

textarea.textarea{
	width		: 100%;
	height		: 60px;
	border		: 1px solid #00b4ff;
}

input.button{
	padding: 0px;
	background	: #d6d6d6;
	border		: 1px solid #00b4ff;
}

/*script scroler start*/
#pscroller1{
width: 540px;
height: 17px;
}

#pscroller2{
border:1px solid black;
width: 200px;
height: 100px;
}

/*end scroler*/

/*-----------------------------------------------------------------
	TRANSMENU
-----------------------------------------------------------------*/
/*MULAI Transmenu*/
/* this is the clipping region for the menu. it's width and height get set by script, depending on the size of the items table */
.transMenu { position:absolute; overflow:hidden; left:0px;	top:0px;}

/* this is the main container for the menu itself. it's width and height get set by script, depending on the size of the items table */
.transMenu .content {	position:absolute;}

/* this table comprises all menu items. each TR is one item. It is relatively positioned so that the shadow and background transparent divs can be positioned underneath it */
.transMenu .items { position:relative; left:0px; top:0px; z-index:2; width: 114px; }
.transMenu.top .items { border-top:none; }

/* each TR.item is one menu item */
.transMenu .item { color: black; font-size:12px; font-family:Arial text-decoration:none;
	/* this is a hack for mac/ie5, whom incorrectly cascades the border properties of the parent table to each row */
	font-weight: bold;
	border:none;
	cursor:pointer;
	cursor:hand;
	} 
	
/* this DIV is the semi-transparent white background of each menu. the -moz-opacity is a proprietary way to get transparency in mozilla, the filter is for IE/windows 5.0+. */
/* we set the background color in script because ie mac does not use it; that browser only uses a semi-transparent white PNG that the spacer gif inside this DIV is replaced by */
.transMenu .background { position:absolute; left:0px; top:0px; z-index:1; -moz-opacity:.8; filter:alpha(opacity=80);}

/* same concept as .background, but this is the sliver of shadow on the right of the menu. It's left, height, and background are set by script. In IE5/mac, it uses a PNG */
.transMenu .shadowRight { position:absolute; z-index:3; top:3px; width:2px; -moz-opacity:.4; filter:alpha(opacity=40);}

/* same concept as .background, but this is the sliver of shadow on the bottom of the menu. It's top, width, and background are set by script. In IE5/mac, it uses a PNG */
.transMenu .shadowBottom {	position:absolute; 	z-index:1;	left:3px; height:2px; -moz-opacity:.4; filter:alpha(opacity=40);}

/* this is the class that is used when the mouse is over an item. script sets the row to this class when required. */
.transMenu .item.hover { background:none; color: #fe0089; }

/* this is either the dingbat that indicates there is a submenu, or a spacer gif in it's place. We give it extra margin to create some space between the text and the dingbat */
.transMenu .item img { margin-left:0px; }

/*SELESAI Transmenu*/