/*********************************************************
 * @Author      :   William Jaya Saputra                 *
 * @Copyright   :   20.10.2008 - 20:16                   *
 *********************************************************/
 
/********************** KERANGKA UTAMA **************************/
body {
    margin-top      : 20px;
    margin-bottom   : 20px;
    font-family     : Arial;
    font-size       : 12px;
}
h3 {
border-bottom : 1px solid #d9d8d8;
}
a:link, a:visited, a:active {
    text-decoration : none;
}

#utama {
    margin          : auto;
    width           : 800px;
    border          : 1px solid #d9d8d8;
}

/********************** HEADER GRADASI **************************/
#header_gradasi {
    height              : 25px;
    background-image    : url(../images/header_gradasi.gif);
    background-repeat   : repeat-x;             
}

#header_tanggal {
    float               : right;
    margin-right        : 20px;
    margin-top          : -20px;
    font-size           : 11px;
}

/********************** HEADER LOGO **************************/
#header_logo {
    height          : 100px;
    width           : 275px;
    margin-left     : 55px; 
}
.hl {
    margin-top : 38px;
}
#searchform{
    float       : right;
    margin-top  : 5px; 
    margin-right: 20px;
}
#livechat {
    margin-top : -50px;
    margin-right : 45px;
    float: right;
}
.search{
    color       : #868a8c;
    font-family : verdana ;
}
#hotline{
    margin-top   : -110px;
    margin-right : 20px;
    float        : left;
}
/********************** MENU HORIZONTAL **************************/
#menuhorizontal{
    background      : url(../images/bgmenu.gif) center center repeat-x;
    margin-top      : 0px;
    height          : 26px;
}

.horizontalcssmenu ul{
    margin          : 0px;
    padding         : 0px;
    list-style-type : none;
}

/* Daftar Items Level Pertama */
.horizontalcssmenu ul li{
    position    : relative;
    display     : inherit;
    float       : left;
    height      : 26px;/* ubah ukuran tinggi sesuai dengan tinggi design menu tadinya 26px*/
}

/* Menu Link Items Style Level Pertama */
.horizontalcssmenu ul li a{
    display         : block;
    width           : 100px; /* Lebar */
    padding         : 6px;
    text-decoration : none;
    color           : white;
    font            : arial;
}

/* Menu Sub Level */
.horizontalcssmenu ul li ul{
    left            : 0px;
    top             : 0px;
    border-top      : 1px solid #D13528;
    position        : absolute;
    display         : block;
    visibility      : hidden;
    z-index         : 100;
}

/* Menu List Items Sub Level */
.horizontalcssmenu ul li ul li{
    display         : inline;
    float           : none;
}


/* Menu Links Style Sub level */
.horizontalcssmenu ul li ul li a{
    width           : 98px; /* Lebar */
    height          : 15px;
    border          : 1px solid #EE6464;
    color           : #FFFFFF;
    padding         : 2px 6px;
    background      : #D13528;
    border-width    : 0 1px 1px 1px;
}

.horizontalcssmenu ul li a:hover{
    background  : url(../images/bgmenuover.gif) center center repeat-x;
    margin-top : -1px;
}

.horizontalcssmenu ul li ul li a:hover{
    background  : url(../images/bgmenuover.gif) center center repeat-x;
    margin-top : -1px;
}

.horizontalcssmenu .arrowdiv{
    position    : absolute;
    right       : 0;
    background  : transparent url(menuarrow.gif) no-repeat center left;
}

* html p#iepara{ /*For a paragraph (if any) that immediately follows menu, add 1em top spacing between the two in IE*/
    padding-top : 1em;
}
    
/* Holly Hack buat IE \*/
* html .horizontalcssmenu ul li { float: left; height: 1%; }
* html .horizontalcssmenu ul li a { height: 1%; }      

/********************** BANNER **************************/  
#banner{
    height              : 150px;
    background-repeat   : no-repeat;  
}
.judul_banner {
margin-top  : 6px;
margin-left : -9px;
}
#list_banner{
    background-image    : url(../images/glossyback2.gif);
    background-repeat   : x-repeat;
    height              : 25px;
}
.tabel_pagar {
	border : 1px solid #a7a6a6;
	font-family : arial;
	font-size : 13px;
}
.tabel_pagar th {
	background-color : #d13528;
	color : #FFFFFF;
	padding : 3px;
}
.tabel_pagar td {
	border : 1px solid #edeaea;
	background-color : #f8f6f6;
	padding : 3px;
}
/********************** MENU VERTICAL **************************/  
.glossymenu, .glossymenu li ul{
    list-style-type     : none;
    margin              : 0px;
    padding             : 0px;
    width               : 145px; /*Lebar Menu Utama*/

/*border: 1px solid black;*/
}

.glossymenu li{
    position        : relative;
    border-bottom   : 1px solid #B5B4B4;
}

.glossymenu li a{
    background      : #868A8C;
/*background: white url(../images/glossyback.gif) repeat-x bottom left;*/
/*font: bold 12px Verdana, Helvetica, sans-serif;*/
    font            : arial 12px;
    color           : white;
    display         : block;
    width           : auto;
    padding         : 5px 0;
    padding-left    : 10px;
    text-decoration : none;
}

.glossymenu li ul{ /* Style Sub Menu*/
    position    : absolute;
    width       : 190px; /*Lebar Sub Menu*/
    left        : 0;
    top         : 0;
    display     : none;
}

.glossymenu li ul li{
    float   : left;
}

.glossymenu li ul a{
    width   : 180px; /*Lebar Sub Menu - 10px padding-left  */
}

.glossymenu .arrowdiv{
    position    : absolute;
    right       : 2px;
    background  : transparent url(../images/arrow.gif) no-repeat center right;
}

.glossymenu li a:visited, .glossymenu li a:active{
    color   : white;
}

.glossymenu li a:hover{
/*background: #989999;*/
background-image    : url(../images/glossyback2.gif);
}

/* Holly Hack for IE \*/
* html .glossymenu li { float: left; height: 1%; }
* html .glossymenu li a { height: 1%; }
/********************** JAM KERJA **************************/ 

#menushortcut {
margin-top : 15px;
    margin-left : 3px;
    width  : 141px;
    height : 92px;
}
/********************** CONTENT **************************/ 
#wrapper_left {
    position    : relative;
    text-align  : left;
    width       : 100%;
}
#wrapper_right {
    position    : relative;
    text-align  : left;
    width       : 100%;
}
#main_content {
    position    : relative;
    margin      : 0;
    padding     : 0;
    }
#menuvertical {
    position    : relative;
    float       : left;
    width       : 145px;
    z-index     : 100;
}
#rightcol{
    position:relative;
    float:right;
    width:175px;
    background:#e8e5e5;
    z-index:99;
}
#isi    {
    position    : relative;
    margin-left : 145px; 
    width       : 480px;
}
#rightcol_judul {
    border          : 1px solid #b5b4b4;
    background-image: url(../images/glossyback2.gif);
    height          : 25px;
}
.rightcoljudulmargin {
    color           : #FFFFFF;
    margin-top      : 5px;
    margin-left     : 8px;  
}
#rightcol_margin{
    margin-top      : 10px;
    margin-left     : 14px;
    width           : 175px;
}

#isi_judul {
    border          : 1px solid #b5b4b4;
    background-image: url(../images/glossyback2.gif);
    height          : 25px;
}
#isi_margin {
    margin-top      : 20px;
    margin-left     : 20px;
    margin-right    : 20px;
}
#isi_menu { 
    margin-left     : 240px;
    width           : 480px;
}
.huruf_isi_menu{
    font-size : 9px;
}

#judul{
    border          : 1px solid #b5b4b4;
    background-image: url(../images/glossyback2.gif);
    height          : 25px;
}
.judul {
    color           : #FFFFFF;
    margin-top      : 5px;
    margin-left     : 8px;
}


    
.list_produk {
    border : 1px solid #333333;
}
#kategori{
    border          : 1px solid #b5b4b4;
    background-image: url(../images/glossyback2.gif);
    height          : 25px;
}
.kategori {
    color           : #FFFFFF;
    margin-top      : 5px;
    margin-left     : 8px;
}   
/***********************PRODUK DETAIL***********************************/
#detail_gambar {
    width       :   280px;
    border      :   1px solid black;
    margin-bottom : 20px;
}
#detail_spec {
    width       :   280px;
}
#detail_deskripsi {
    margin-left     :   20px;
    width           :   137px;
    height          :   210px;
    float           :   right;  
}

/********************** STATISTIK **************************/ 
#statistik {
margin-top      : 16px;
margin-bottom   : 10px;
margin-left     : 20px;
margin-right    : 20px;
border          : 1px solid black;
background      : #D5D5D4;
padding         : 10px;
position        : relative;
float           : left;
width           : 125px;
z-index         : 100;
font-size       : 10px;
}

/********************** CONTENT ADMIN **************************/ 
#content_admin {
margin-top      : 10px;
margin-bottom   : 10px;
margin-left     : 185px;
margin-right    : 20px;
position        : relative;

}
.counter {
	margin-top : 120px;
	color : grey;
}
/********************** FOOTER **************************/ 
#footer {
    margin-top      : 30px;
    margin-bottom   : 15px; 
    position        : relative;
    clear           : both; /* pakai "clear:both;" --> untuk meratakan kolom kanan dan kiri */
    text-align      : center;
    font-size       : 11px;
    color           : #868a8c;
    }
#footer a:hover {
    color : #0067f0;
}
/*****************JUDUL produk detail*********************/
#judul_{
font-size       :   15px;
margin-bottom   :   10px;
}

/**********************Tanggal Posting********************************/
#tanggal_posting {
    margin-top      :   -40px;
    margin-bottom   :   40px;
}
.teks_posting {
    font-size       :   11px;
    color           :   #999999;
}
/*********************Judul Produk Detail*****************************************/
#detail_nama_produk {
    margin-top      :   -10px;
    margin-bottom   :   10px;
    font-size       :   15px;
}
/*********************Spec Tabel**************************************/
#spec {
    margin-top  : 25px;
}
.detail {
    font-size : 11px;
}
#hasil_cari {
    width       :   400px;
}
#gallery01{
margin-bottom   : 20px;
width           : 220px;
border          : solid 1px black;
}
#gallery02{
margin-bottom   : 20px;
width           : 160px;
border          : solid 1px black;
}
/********************* CONTENT FREE GIFT ***************************/
#content_freegift {
    border : 1px solid grey;
    background  : #f3f3f3;
}