/* CSS Document */
body {background:#f4f4f6 url(../images/bg.gif) repeat top left; margin:0; padding:0; font:normal .8em Verdana, Helvetica, serif, Arial; color: #33331a; }
form {margin:0; padding:0;} input, select { font:normal .7em Verdana;} img {border:0;}
h1{ display: none; } h2{font-size:1.3em;}
h3{font-size:1.4em; margin: 0; padding: 0; text-transform: uppercase;}
h4{font-size:1.2em; margin: 0; padding: 0 0 9px; text-transform: uppercase;}
.smaller{font-size: .6em;}.small{font-size: .7em;}.normal{font-size: .8em;}.big{font-size: .9em;}.bigg{font-size: 1.1em;}.bigger{font-size: 1.2em;}.biggerr{font-size: 1.3em;}
.uppercase{ text-transform: uppercase; }

#loading{display:none; position: absolute; top: 2px; left:2px; background: #ffc; padding: 2px 4px; margin: 0;}
#loading2{display:none; position: relative; margin: 0; padding: 0; top: 0; left: 2px; }

a { text-decoration: none; color: #dead31; } a:visited, a:link { text-decoration: none;}
a:hover{text-decoration: none; color: #ff8000;} a:active{text-decoration: underline;}
.clearit{clear: both; height: 0; line-height: 0.0; font-size: 0; padding:0; margin:0;}
.bordernone{ border: none; } .padding3{ padding: 3px; } .thumb{ border: 3px double #ccc; }
.linethru{ text-decoration: line-through; }

.orange, .orange a{ color: #dead31; }.orange a:hover{ color: #111; }
.orange2, .orange2 a{ color: #b36d12; }.orange2 a:hover{ color: #111; }
.green, .green a{ color: #666628; }.green a:hover{ color: #111; }
.dark, .dark a{ color: #282813; }.dark a:hover{ color: #000; }
.white,.white a{ color: #fff;} .white a:hover{color: #eee;}
.black,.black a{ color: #111;} .black a:hover{color: #555;}
.rmore,.rmore a, .rmore a:link, .rmore a:visited { text-decoration: none; color: #dead31; font-family: Arial; }
.rmore a:hover { color: #FF8000;}
.rmore2,.rmore2 a, .rmore2 a:link, .rmore2 a:visited { text-decoration: none; color: #523a21; font: bold 1em Arial; }
.rmore2 a:hover { color: #33331a;}
.judul, .judul a, .judul a:active, .judul a:link{ color: #282813; font: bold 1.1em Arial; }
.judul a:hover{ color: #000; }

/*kepala*/
.kepaladasar {background:url(../images/header-side.gif) repeat-x; height:190px;}
.kepala { width:940px; height:190px; margin:0 auto; background:url(../images/bgkepala.gif) no-repeat; padding:0 10px; }
.kepalakiri { float:left; width:440px;}
.kepalakanan { float:right; width:500px; }

/*elemen kepala*/
.logo { float:left; margin-top: 72px; margin-right:10px;}
.logotext { float:left; margin-top:116px; font-size:1.1em; font-weight: bold; color:#fff; text-transform:uppercase; letter-spacing:1px; line-height:14px;}
.navatas {float:right;}
.inbox {background:url(../images/bgnavatas.gif) no-repeat; width:293px; height:35px; float:right; padding-top:10px; padding-right:0;}
.inbox select { font:normal 10px verdana; float:right; margin-right: 25px;}
.linkadd { font:normal 9px verdana; color:#666666; margin-top:5px; float:right;}
.linkadd a {color:#666666; text-decoration:none;}
.linkadd a:hover {color:#000; text-decoration:underline;}
.search{ background:url(../images/bgcari.gif) no-repeat; width:255px; height:48px; margin-top:40px; padding-top:10px; padding-left:14px; float:right;}
.search .textbox { font-size: 1em; border: 1px solid #bbb; width:170px; padding:4px; margin: 5px 10px 0 3px;  }

/*body*/
.badan {width:940px; margin:0 auto; padding: 5px 10px 30px; background: #edeff6 url(../images/bgbody.gif) repeat-y bottom;}
/*menu background*/
.menu_bg{ background: transparent url(../images/menu-bg.gif) no-repeat top; width: 939px; height: 30px; margin: 0 auto; padding: 5px 0 0 0; text-transform: uppercase;}
/*marque background*/
.marquee{ width: 939px; height:39px; background: transparent url(../images/bgmarquee.gif) no-repeat top; margin: 10px auto 0; }

/*kolom-kolom*/
.kolomkiri {width:205px; float:left; position: relative; left:1px; }
.kolomtengah {width:410px; float:left; position: relative; left:13px; top: -1px; }
.kolomtengah-l {width:720px; float:right; }
.kolomkanan {width:300px; float:right; position: relative; right:1px; }
.float-right{ float: right;}
.float-left{ float: left;}

/* sambutan depan */
.sambutan-bg{ background: transparent url(../images/sambutan-bg.gif) no-repeat top; width: 210px; height: 71px; }
.sambutan-title{ color: #dead31; font:bold 1.1em Arial; text-transform: uppercase; padding: 4px 0 0 5px; }

/* news depan */
.news-top{ background: transparent url(../images/news-top.gif) no-repeat top; width: 210px; height: 56px;}
.news-middle-bg{ background: transparent url(../images/news-middle.gif) repeat-y top; width: 210px; }
.news-bottom{ background: transparent url(../images/news-bottom.gif) no-repeat top; width: 210px; height: 9px;}

/* preview buku */
.center-bg{ background: #fff url(../images/center-bg.gif) no-repeat top; width: 410px; }
.center-bg-l{ background: #fff url(../images/center-bg-l.gif) no-repeat top; width: 720px; }
.content-preview{ width: 360px; position:relative; top:23px; left:20px; }
.content-title{ padding: 18px 0 0 21px; color: #33331a; font: bold 1.3em Arial; text-transform: uppercase; }
.content{ margin: 30px 10px 0 20px; } .content2{ margin: 30px 20px 0 20px; }
.content-selected { margin: 0; padding: 0; }
.content-selected p{ margin: 0; padding: 0 0 15px; }

#menu4 { padding: 6px 0 0 20px; font: bold 1.2em Arial; text-transform: uppercase; }
#menu4 a{ width: 150px; height: 40px; display: block; float: left; }
#menu4 .first b, #menu4 .second b{ padding: 3px 0 0 8px; display: block; }
#menu4 .second{ position: relative; left: 20px; }
#menu4 a{ color: #b36d12; text-decoration: none; background: transparent url(../images/tab-inactive.gif) no-repeat top; }
#menu4 a.wactive{ color: #3f2c18; text-decoration: none; background: transparent url(../images/tab-active.gif) no-repeat top; }
#parent4 ul, #parent4 li{ padding: 0; margin: 0; list-style-type: none; }

.tabnav { margin: 0; padding: 6px 0 0 15px; font: bold 1.2em Arial; text-transform: uppercase; position: relative; }
.tabnav li { display: block; float: left; list-style: none; width: 150px; height: 40px; margin-right: 10px; }
.tabnav li a { display: block; float: left; list-style: none; width: 150px; height: 40px; padding: 3px 0 0 8px; color: #b36d12; text-decoration: none; background: transparent url(../images/tab-inactive.gif) no-repeat top; text-align: left; }
.tabnav li a:active, .tabnav li.ui-tabs-selected a { display: block; float: left; list-style: none; width: 150px; height: 40px; padding: 3px 0 0 8px;  color: #3f2c18; text-decoration: none; background: transparent url(../images/tab-active.gif) no-repeat top; text-align: left;}

.tabdiv { margin: 25px 10px 0; background: #fff; padding: 0 10px; }
.ui-tabs-hide { display: none; }

/* member */
.member-depan{ text-align: right; color: #282813; } .member-depan a{ color: #282813; }

/* koleksi buku */
.koleksi-bg{ width: 300px; height: 70px; background: transparent url(../images/koleksi-bg.gif) no-repeat top; border-top:1px solid #523a21 }
.koleksi-title { color: #b36d12; font: bold 1.8em Arial; text-align: right; display: block; padding-top: 20px; }
/*.shoppingcart-bg{ width: 300px; height: 70px; background: transparent url(../images/bag_black.gif) no-repeat 0 20px; border-top:1px solid #523a21 }
.shoppingcart-title { color: #222; font: bold 1.8em Arial; text-align: right; display: block; padding-top: 20px; }*/
.shoppingcart-bg{ width: 300px; height: 70px; background: transparent url(../images/cart.gif) no-repeat 0 10px; border-top:1px solid #523a21 }
.shoppingcart-title { color: #b36d12; font: bold 1.8em Arial; text-align: right; display: block; padding-top: 20px; }
.shoppingcart td{ padding: 2px 2px 3px; }.shoppingcart th{ border-top: 1px solid #282813; border-bottom: 1px solid #282813; padding: 6px 2px; font-size: 1.1em; }
.shopping_detail th{ padding-bottom: 5px; border-bottom: 1px solid #ddd; font-size: 1em; }
.shoppingcart a, .shoppingcart-depan a{ color:#666628; } .shoppingcart a:hover, .shoppingcart-depan a:hover{ color:#111; }
.shoppingcart, .shoppingcart-depan img{ margin: 3px 0 0; }
.borderb{ border-bottom: 1px solid #eee; } .bgeee{ background: #f5f5f5; }
.checkout-button{background-color: #3d3d3d; color: #e9e9e9; width: 80px; padding: 3px 2px; font: bold .9em Verdana;cursor: pointer; border: none; }

.checkout-steps{ padding-bottom:0; margin: 0; font: bold 1.2em Arial; text-transform: uppercase; color: #e9ca7d; }
.checkout-steps .active{ color: #282813; }

.rek_bank{ margin-top: 5px;}
.rek_bank div{ float: left; padding: 5px; display: block;}
.rek_bank div:hover{ cursor: pointer;}
.rek_bank_div span{ float: left; display: block; }
.rek_bank input{ cursor: pointer;position: relative; top: -1px; }
.rek_bank label{ cursor: pointer; display: block; }

.konfirmasi{ margin: 15px 0 0; padding: 0; }
.konfirmasi div{ float:left; }

.ordered_list{ margin: 0; padding: 5px 0 0 30px; }
.ordered_list li{ margin: 0; padding: 5px 0 0 5px; }

.selectionForm label{ cursor: pointer; }
.selectionOutput{ background:#eee;border-top:1px solid #523a21;}
.selectionOutput input{ position: absolute; border:none; background:#eee; font:bold 1em Verdana, Arial; color:#33331a; margin-top: -10px; }
.selectionValue{ position: relative; left: -4px; border:1px solid #fff; font:normal 1em Verdana, Arial; color:#33331a; }

#parent1 ul{list-style-type: none;} #parent1 li{ background: #fff; color: #000; list-style-type: none; }
#parent1-menu a{ background: #dead31; color: #33331a; padding: 3px 5px; border: 1px solid #666628; position: relative; top: -12px; left: 50px; font-weight: bold; }
#parent1-menu a.wactive{ background: #666628; color: #dead31; }

.glidecontentwrapper{
position: relative; /* Do not change this value */ width: 300px;
height: 190px; /* Set height to be able to contain height of largest content shown*/
overflow: hidden;
}
.glidecontent{ /*style for each glide content DIV within wrapper.*/
position: absolute; /* Do not change this value */
background: white; visibility: hidden; width: 300px; }
.glidecontenttoggler{ /*style for DIV used to contain toggler links. */
width: 285px; margin-top: 6px; padding-bottom: 6px; position: relative; left: 15px;
text-align: left; /*How to align pagination links: "left", "center", or "right"*/
background: white; /*always declare an explicit background color for fade effect to properly render in IE*/
}
.glidecontenttoggler a{ /*style for every navigational link within toggler */
/*display: -moz-inline-box;*/ display: inline-block; border: 1px solid #666628; color: #33331a; padding: 3px 6px 3px 5px; margin-right: 5px; font-weight:bold; text-decoration: none; background: #dead31; text-align: center; }
.glidecontenttoggler a.selected{ /*style for selected page's toggler link. ".selected" class auto generated! */
background: #666628; color: #dead31; }
.glidecontenttoggler a.selected:hover{ color: #dead31; }
.glidecontenttoggler a:hover{ color: black; }
.glidecontenttoggler a.toc{ /*style for individual toggler links (page 1, page 2, etc). ".toc" class auto generated! */ }
.glidecontenttoggler a.prev, .glidecontenttoggler a.next{ /*style for "prev" and "next" toggler links. ".prev" and ".next" classes auto generated! */ display: none; visibility: hidden; }

/* pencarian buku */
.search-bg-top{ width: 300px; height: 72px; background: transparent url(../images/search-bg.gif) no-repeat top; }
.search-bottom{ width: 300px; height: 6px; background: transparent url(../images/search-bottom.gif) no-repeat top; }
.search-title { color: #dead31; font: bold 1.8em Arial; text-align: right; display: block; padding: 13px 9px 0 0; }
.search-bg{ background: #dead31; font-weight: bold; }
.search-bg .textbox{ border: 1px solid #33331a; padding: 4px; font: normal .9em Arial, Verdana; width: 270px; margin-top: 5px; }
.search-bg .button{ float: right; border: none; margin-top: 5px; }

/* galeri */
.galeri-bg{ width: 300px; height: 61px; background: transparent url(../images/galeri-bg.gif) no-repeat top; }
.galeri-title { color: #33331a; font: bold 1.2em Arial; display: block; padding: 10px 0 0 10px; }
.galeri-depan{ border: 1px solid #33331a; border-top: none; width: 298px; }

/* cart n info area #666628 */
.cart-info{ border: 1px solid #666628; margin: 10px 0 5px; padding: 3px; display: block; width: 360px; }
.cart-info a{ color: #666628; } .cart-info a:hover{ color: #111; }
.cart-info img{ vertical-align: middle; margin-right: 5px; }

.banner{ text-align: center; overflow: hidden; width: 100%; line-height: 0.0; font-size: 0; padding:0; margin:0; }
.banner img, .banner object{ margin: 4px 0 15px; }

.box_multimedia_img2{ width: 140px; height: 100px; padding: 3px; border: 1px solid #ccc; margin: 2px 4px 0 0; background: #fff;}
.multimedia_link div{ float: left; }

/*kaki*/
.kakidasar {background:url(../images/bgbawah.gif) repeat-x; height:50px;}
.kaki { background:url(../images/bgfooter.gif) no-repeat; width:940px; height:40px; padding:5px 10px; margin:0 auto; font: normal 9px verdana; color:#ccc;}
.kaki a { font: normal 9px verdana; color:#d5d2d2; text-decoration:underline;}
.kaki a:hover {text-decoration:none; color:#fff;}

/* jquery liscroll*/
code { width:93%; color: #000; display: block; padding: 1em; margin: 1em 0; background-color: #eee; border: 1px solid #d3d3d6; border-left-width: 5px; white-space: pre; /*overflow-x: auto;*/ }
/* liScroll style declarations */
.tickercontainer { width: 900px; height: 27px; margin: 1px 0 0 25px; padding: 0; overflow: hidden; }
.tickercontainer .mask { position: relative; width: 900px; overflow: hidden; border-top: none; }
ul.newsticker { position: relative; left: 750px; list-style-type: none; margin: 0; padding: 0; }
ul.newsticker li { float: left; margin: 0; padding: 0; padding-top: 8px; }
ul.newsticker, ul.newsticker a { white-space: nowrap; padding: 0; color: #fff; margin: 0 50px 0 0; }
ul.newsticker a:hover{ color: #ff8000;}
ul.newsticker span { margin: -2px 10px 0 10px; }

/* utk pagination dan link rss dan archive */
.pagination-n-archivefeed { margin-top: 10px; border-top: 1px solid #666628; padding-top: 15px; width: 368px; }

/* diggstyle pagination */
div.pagination { padding: 0; margin: 0; position: relative; left: -1px; }
div.pagination a { padding: 1px 4px 2px; margin: 2px; border: 1px solid #666628; text-decoration: none; color: #666628; background: #dead31; }
div.pagination a:hover, div.pagination a:active { border: 1px solid #33331a; color: #000; }
div.pagination span.current { padding: 1px 4px 2px; margin: 2px; border: 1px solid #666628; background: #666628;color: #dead31;}
div.pagination span.disabled { padding: 1px 4px 2px; margin: 2px; border: 1px solid #ddd; color: #ccc; }

.archivefeed img{ margin-left: 7px; }

/* ######### CSS for Shade Tabs. Remove if not using ######### */
.shadetabs{ padding: 3px 0; margin-left: 10px; margin-top: 1px; margin-bottom: 0; list-style-type: none; text-align: left; /*set to left, center, or right to align the menu as desired*/ }
.shadetabs li{ display: inline; margin: 0; }
.shadetabs li a{ text-decoration: none; position: relative; z-index: 1; padding: 3px 7px; margin-right: 3px; border: 1px solid #778; color: #2d2b2b; background-color: #eaeaea; }
.shadetabs li a:visited{color: #2d2b2b;}
.shadetabs li a:hover{color: #2d2b2b;}
.shadetabs li a.selected{ /*selected main tab style */ position: relative; /*top: 1px;*/ }
.shadetabs li a.selected{ /*selected main tab style */ background-color: #ffffff; border-bottom-color: white; }
.shadetabs li a.selected:hover{ /*selected main tab style */ text-decoration: none; }
.tabcontent{ display:none; text-align: left; margin-left: -5px; }

div.nav { float:left;position:relative; }
div.navflyout { display:none;position:absolute;left:0px;top:25px; }

.loginform{ color: #111; }
.loginform td{ padding: 6px 10px 0 0; }
.loginform input{ border:1px solid #e4e4e4; }
.loginform .textbox{ width: 100px; padding: 2px; font-size: 1em; }
.loginform .textbox-m{ width: 150px; padding: 2px; font-size: 1em; }
.loginform .textbox-l{ width: 200px; padding: 2px; font-size: 1em; }
.loginform #login_button, .submit{ background-color: #3d3d3d; color: #e9e9e9; width: 60px; padding: 3px 2px; font: bold .9em Verdana;cursor: pointer; }
.login-error-box{ margin: 10px 0 8px; padding: 5px 5px 7px 7px; border: 1px solid #000; background: #d10000; color: #fff; }
.login-error-box a{ color: #fff; } .login-error-box a:hover{ color: #000; }
.success-box{ margin: 4px 0 12px; padding: 5px 5px 7px 7px; border: 1px solid #e4e4e4; }

.pp_list ul{ margin: 4px 0 0 2px; padding: 0; }
.pp_list li {padding: 2px 0 2px 14px; background: transparent url(../images/list-grey.gif) no-repeat 0 .5em; list-style: none; display: block;}
.pp_list li a{ text-align: left;}
.pp_list li a:hover{ }

.datebox select, .datebox input{ border: 1px solid #b6b6b6; position: relative; left: -2px; top: -2px; padding: 1px 2px;}
.datebox img{ position: relative; left: -2px; top: -2px; }
.radioinput{ position: relative; left: -5px; } .radioinput input{ border:none; }
.expand{ padding: 3px 2px 2px; border: 1px solid #b6b6b6; margin-top: 2px; overflow: hidden;}
/*#msgbox{ margin: 0 0 0 10px; padding: 0 3px; }
.messagebox{border:1px solid #c93;background:#ffc;}
.messageboxok{width:auto;border:1px solid #349534;background:#C9FFCA;color:#008000;}
.messageboxerror{position:relative;width:auto;border:1px solid #CC0000;background:#F7CBCA;color:#CC0000;}*/
#msgbox{ margin: 0 0 0 5px; padding: 0; width: auto; }
.messagebox{}
.messageboxok{color:#008000;}
.messageboxerror{color:#FF3300;}

#frmRegister .textbox, #frmAccount .textbox, .frmAll .textbox{ border: 1px solid #ccc; padding: 2px 3px; font-size: .9em; margin-top:1px; }
#frmRegister label, .frmAll label{ cursor: pointer; vertical-align: middle; position: relative; top: -3px; }

.disabled { border: 1px solid #F2F2F2; background-color: #F2F2F2; }
.required, #member_name, .textbox {border: 1px solid #b6b6b6;}
/*.validation-failed {border: 1px solid #FF3300; color : #FF3300;}
.validation-passed {border: 1px solid #00CC00; color : #000;}*/
.validation-advice{ margin: 0 0 0 5px; padding: 0; color: #FF3300; display: inline; }
.submit{ font:bold .9em Verdana, Arial; padding: 3px 2px; border: 1px solid #ccc; background: #3d3d3d; cursor: pointer; width: 80px; color: #e9e9e9; }
.info{ border:1px solid #2a528d; color: #2a528d; font: normal .9em Verdana; padding:10px 5px; width:325px; background: url(../images/bg.jpg) repeat top; } .info img{ float: right; margin: -3px 3px 0 0; }

/* the style for css tooltips starts here */
a.tooltip p{ margin: 0; padding: 0; }
a.tooltip { text-decoration: none; }
a.tooltip b {display:none;}
a.tooltip:hover {border:0; position:relative; z-index:500; text-decoration:none;}
a.tooltip:hover b {display:block; position:absolute; top:18px; left:20px; padding:5px; font-weight:normal; color:#000; border:1px solid #888; background:#ffc; width:230px; font-size: .9em;}
a.tooltip:hover b em {position:absolute; left:20px; top:-6px; width:11px; height:6px; background:#fff url(../images/tooltip.gif) 0 0; display:block; font-size:1px;}

@media print {
.tabcontent {
display:block !important;
}
}