/* CSS Document */

* {
	margin: 0;
	padding: 0;
}


body {
	/*font-family: "Verdana", Arial, Helvetica, sans-serif;
	font-size: 11px;*/
	color:#666666;
}


/* Header */

#header {
	width: 968px;
	height:100%;
	margin: 0 auto;
	padding: 25px 0 0 0;
	
}

#headerMain {
	width: 968px;
	height: 86px;
	margin: 0 auto;
}

#headerNav {
	float: left;
	width: 678px;
	height: 86px;
	margin: 0 auto;
	background-image:url(../images/header_backG.jpg);
}


#headerRight {
	float: left;
	width: 42px;
	height: 86px;
	margin: 0 auto;
	background-image:url(../images/header_right.jpg);
}



/* TOP MENU */

#menu {
	width: 678px;
	height: 86px;
	margin: 0 auto;
}

#menu ul {
	margin: 0;
	padding: 0;
	list-style: none;
}

#menu li.satu {
	display: block;
	float: left;
	width: 78px;
	height: 30px;
	margin-right:5px;
	padding: 25px 0 0 0;
	
}


#menu li.satuX {
	display: block;
	float: left;
	width: 78px;
	height: 30px;
	margin-right:5px;
	padding: 25px 0 0 0;
	background-image:url(../images/nav_hover.jpg);
	
}

#menu li.dua {
	display: block;
	float: left;
	width: 78px;
	height: 30px;
	margin-right:5px;
	padding: 25px 0 0 0;
}

#menu li.tiga {
	display: block;
	float: left;
	width: 78px;
	height: 30px;
	margin-right:5px;
	padding: 25px 0 0 0;
}

#menu li.empat {
	display: block;
	float: left;
	width: 78px;
	height: 30px;
	margin-right:5px;
	padding: 25px 0 0 0;
}

#menu li.lima {
	display: block;
	float: left;
	width: 78px;
	height: 30px;
	margin-right:5px;
	padding: 25px 0 0 0;
}

#menu li.enam {
	display: block;
	float: left;
	width: 78px;
	height: 30px;
	margin-right:5px;
	padding: 25px 0 0 0;
}

#menu li.tujuh {
	display: block;
	float: left;
	width: 78px;
	height: 30px;
	margin-right:5px;
	padding: 25px 0 0 0;
}

#menu li.delapan {
	display: block;
	float: left;
	width: 78px;
	height: 30px;
	padding: 25px 0 0 0;
}



#menu a {
	display: block;
	height: 41px;
	padding: 20px 0 0 0;
	font-family:Arial, Helvetica, sans-serif;
	font-size:14px;
	text-align: center;
	/*text-transform: uppercase;*/
	text-decoration: none;
	font-weight: normal;
	color: #FFFFFF;
	background: url(../images/nav_femBrief_01B) no-repeat;
}

#menuActive{
	background: url(../images/nav_hover.jpg) no-repeat;
}


#menu .satu a:hover {
	background-image: url(../images/nav_hover.jpg);
}

#menu .dua a:hover {
	background-image: url(../images/nav_hover.jpg);
}

#menu .tiga a:hover {
	background-image: url(../images/nav_hover.jpg);
}

#menu .empat a:hover {
	background-image: url(../images/nav_hover.jpg);
}

#menu .lima a:hover {
	background-image: url(../images/nav_hover.jpg);
}

#menu .enam a:hover {
	background-image: url(../images/nav_hover.jpg);
}

#menu .tujuh a:hover {
	background-image: url(../images/nav_hover.jpg);
}
#menu .delapan a:hover {
	background-image: url(../images/nav_hover.jpg);
}

#menu .delapan a:hover {
	background-image: url(../images/nav_hover.jpg);
}





/* CONTENT */

#content {
	clear: both;
	width: 968px;
	background: url(../images/backG_01.jpg) repeat-y center top;
	margin: 0 auto;
}

#contentBox {
	clear: both;
	width:920px;
	padding-top:10px;
	padding-left:24px;
	padding-right:24px;
	padding-bottom: 1px;
	background-image:url(../images/backG_01.jpg);
	overflow:hidden;
}

#contentArea {
	width:705px;
	background-color:#FFFFFF;
	padding:15px;
	float:left;
	margin-right:8px;
	overflow: hidden;
	
}

#contentArea02 {
	width:705px;
	padding:15px;
	background-color:#FFFFFF;
	float:left;
	margin-right:8px;

}

#listBrandArea {
	width:160px;
	height: inherit;
	overflow: hidden;
	background-color:#990000;
	padding-top:8px;
	padding-bottom:23px;
	padding-left:8px;
	padding-right:8px;
	float:left;
}

#listBrand {
	width:160px;
	overflow: hidden;
	background-color:#990000;
	padding:8px;
	float:left;
}

#listBrand02 {
	width:160px;
	overflow: hidden;
	height:inherit;
	background-color:#990000;
	padding:8px;
	float:left;
}

#listBrandin {
	width:160px;
	height:254px;
	background-color:#990000;
	overflow: auto;

}

#listBrandin02 {
	width:160px;
	overflow: auto;
	background-color:#990000;
	height:100%;

}

#flashBox {
	width:735px;
	background-color:#FFFFFF;
	float:left;
	margin-right:8px;
	
}

#promo {
	clear: both;
	width: 968px;
	background: url(../images/backG_01.jpg) repeat-y center top;
	margin: 0 auto;
}

#promoBox {
	clear: both;
	width:900px;
	padding-top:8px;
	padding-left:24px;
	padding-right:24px;
	padding-bottom: 1px;
	background-image:url(../images/backG_01.jpg);
	overflow:hidden;
}

#frameBox01 {
	width:920px;
	padding:8px;
	height:196px;
	background-color:#FFF;
	float:left;
	margin-right:8px;
}

#frameBox02 {
	width:705px;
	padding:0px;
	float:left;
}


.bannerBox01 {
	width:364px;
	height:196px;
	float:left;
	margin-right:0px;
}

.bannerBox02 {
	width:270px;
	height:196px;
	float:left;
	
}	
.bannerBox03 {
	width:270px;
	height:196px;
	float:left;

	
}

.bannerBox02in1 {
	width:270px;
	height:60px;
	margin-bottom:6px;
	border: 1px solid #ccc;

}

.bannerBox02in2 {
	width:270px;
	height:60px;
	border: 1px solid #ccc;
	
	

}


#frameStudyCase01 {
	width:240px;
	height:196px;
	padding:8px;
	background-color:#ffffff;
	float:left;


}
.frameStudyCase01 {
	width:240px;
	height:195px;
	overflow: auto;
	FONT-SIZE: 11px; 
	font-weight: normal; 
	COLOR: #333333; 
	FONT-FAMILY: verdana; 
	TEXT-DECORATION: none;
}

/* Logo */

#logo {
	float: left;
	width: 248px;
	height: 86px;
	background-image:url(../images/logo.jpg);
}

#logo a {
	display: block;
	width: 248px;
	height: 86px;
	
}


h1, h2, h3 {
	margin-bottom: 5px;
	font-family: "Verdana", Arial;
	font-weight: normal;

}

h1 {
	font-size: 15px;
}

h2 {
	font-size: 13px;
}

h3 {
	font-size: 11px;
	color:#669900;
	font-weight: bold;
}




/* BANNER TOP */

.bannerBig01 {

	float:left
	width: 735px;
	margin-right: 8px;
}


/* Footer */

#footerBox {
	width: 968px;
	height:18px;
	background-color:#FFCC00;
	background: url(../images/footer.jpg);
	margin: 0 auto;
	overflow:hidden;
}





/* SPACE */
#space01 {
	height:5px;
}
#space02 {
	height:10px;
}

#space03{
	height:20px;
}

/*ADD BOX*/

#addBox01 {
	margin-top:8px;
	height:160px;
	width:497px
	
}

#addBox02 {
	clear: both;
	width: 510px;
	background-color:#F4E8E8;
	margin: auto;
	overflow:hidden;
}

#addBox03 {
	margin-bottom: 8px;
	overflow:hidden;
}


#addText01 {
	margin-top:10px;
	margin-bottom:10px;
	overflow:hidden;
}

#addText02 {
	margin-bottom:10px;
	overflow:hidden;
	
}


/*Thumb BOX*/

#thumbBox01 {
	width:115px;
	height:155px;
	margin-right:8px;
	float:left;
	overflow:hidden;
}




/* Shadow */
.out{
  display:block;
  background:#CCC;
  position:relative;
  width:225px;
  }
.in {
  background:#fff;
  border:1px solid #CCC;
  position:relative;
  text-align:center;
  padding:7px;
  left:-3px;
  top:-3px;
  }
  
.out2{
  display:block;
  background:#CCC;
  position:relative;
  width:144px;
  }
.in2 {
  background:#fff;
  border:1px solid #CCC;
  position:relative;
  text-align:center;
  padding:7px;
  left:-3px;
  top:-3px;
  }  
  
.out3{
  display:block;
  background:#CCC;
  position:relative;
  width:320px;
  }
.in3 {
  background:#fff;
  border:1px solid #CCC;
  position:relative;
  text-align:center;
  padding:7px;
  left:-3px;
  top:-3px;
  }  
  

.out4{
  display:block;
  background:#CCC;
  position:relative;
  width: auto;
  margin-left:10PX;
  margin-top:10px;
  }
.in4 {
  background: #FFECEC;
  border:1px solid #CCC;
  position:relative;
  text-align:left ;
  padding:7px;
  left:-3px;
  top:-3px;
  }    


#scrollingBrand {
     overflow: auto; 
	 height: 245px; 
	 width: 90%;
     background-color:#8C0000; 
	 border:1px solid #8C0000;
      margin: 0px auto; 
	  padding:5px; 
	  font-family: Verdana, Arial, Helvetica, sans-serif;
	  font-size: 12px;
	  line-height: 25px;       
      color: #FFFFFF; 
	  text-align: left;
  }
  
  
  #scrollingText1 {
     overflow: auto; 
	 height: 188px; 
	 width: 200px;
     background-color:#FFF; 
	 border:1px solid #FFF;
      margin: 0px auto; 
	  padding:0px; 
	  font-family: Verdana, Arial, Helvetica, sans-serif;
	  font-size: 11px;
	  line-height:15px;       
      color: #666; 
	  text-align: left;
  }
  

.scrollCustom01{
scrollbar-face-color:#CC0000;
scrollbar-base-color:#8C0000;
scrollbar-arrow-color:#FFFFFF;
scrollbar-track-color:#990000;
scrollbar-shadow-color:#660000;
scrollbar-highlight-color:#CC0000;
scrollbar-3dlight-color:#CC0000;
scrollbar-darkshadow-Color:#660000;
}



.scrollCustom02{
scrollbar-face-color:#EBF5FF;
scrollbar-base-color:#EBF5FF;
scrollbar-arrow-color:black;
scrollbar-track-color:#FFFFFF;
scrollbar-shadow-color:#FFFFFF;
scrollbar-highlight-color:#EBF5FF;
scrollbar-3dlight-color:#78AAFF;
scrollbar-darkshadow-Color:#78AAFF;
}