* { padding:0; margin:0; }
body, td, th {
        font-family: "Arial Narrow", Arial, Helvetica, sans-serif;
        font-size: small;
        color: #663300;
}
body {
        margin:10px 0px; background:#FFFFFF url('body-bg.gif') repeat-x fixed top left; 
}
table {
        border-collapse: collapse;
}
table td {
        border: 1px solid #CCCCCC;
        text-align: left;
}
a:link {
        color: #0000FF;
        text-decoration: none;
}
a:visited {
        text-decoration: none;
        color: #000080;
}
a:hover {
        text-decoration: underline;
        color: #000080;
}
a:active {
        text-decoration: none;
        color: #0000FF;
}
.geser-kiri {
        padding-left:10px;
}
.page-bottom {
        background:url('page-bottom.gif') repeat-x bottom left;
        height:2px
}
.tombol {
        font-family: Arial, Helvetica, sans-serif;
        color: #000099;
        background-color: #FFFFFF;
        border: 2px solid #FF9900;
        font-size: 14px;
        font-weight: bold;
}
.text-box {
        font-family: Arial, Helvetica, sans-serif;
        font-weight: bold;
        color: brown;
}
.text-box:focus {
        background-color:#FFFFCC;
}
.clear {
        clear:both;
        height:0;
}
.brown {
        color:#663300;
}
.white {
        color:yellow;
        font-size: 14px;
        font-weight: bold;
}
#wrapper {
        width:850px;
        margin:0 auto;
        border:solid 2px #CCCCCC;
        background-color:#FFFFFF;
}
#wrapper #head {
        width:100%;
        height:100px;
        background:#FFFFFF url('page-top-bg.gif') repeat-x center;
}
#wrapper #head #title {
        float:left;
        width:500px;
        height:70px;
        padding-top: 20px;
        padding-left: 10px;
}
#wrapper #head #logo {
        float:right;
        width:300px;
        height:100px;
}
#wrapper #head h1 {
        font-family: "Century Gothic", Arial;
        color: brown;
        font-size: 24px;
        margin: 0px;
        padding: 0px;
}
#wrapper #head h2 {
        font-family: "Century Gothic", Arial;
        font-size: small;
        color: white;
        font-weight: lighter;
        margin: 0;
        padding: 0;
}


#wrapper #page {
        width:100%;

}
#wrapper #page #search-box {
        background-color: #FFFFFF;
        background-image: url('search-box.gif');
        background-repeat: no-repeat;
        background-position:  center;
        clear: both;
        height: 79px;
        width: 552px;
        margin-right: auto;
        margin-left: auto
}
#wrapper #page #search-box #form {
        height: 80px;
        width: 470px;
        clear: both;
        margin-right: auto;
        margin-left: 100px;
        margin-top: 5px;
}
#wrapper #page #search-box2 {
        background-color: #FFFFFF;
        background-image: url('search-box2.gif');
        background-repeat: no-repeat;
        background-position:  center;
        clear: both;
        height: 85px;
        width: 300px;
        margin-right: auto;
        margin-left: auto
}
#wrapper #page #search-box2 #form2 {
        width: 90%;
        clear: both;
        margin-right: auto;
        margin-left: auto;
        padding-top: 20px;
}
#wrapper #footer {
        border-top:1px solid #FFFFFF; width:100%;
        padding-top:3px;
        padding-bottom:3px;
        text-align:center;
        color:#FFFFFF;
        background:#FFFFFF url('footer-bg.gif') repeat-x top left;        
}

 hr {

  border: 0px none;

 color: #a8a8a8;

background-color: #a8a8a8;

height: 1px

}



table { border-collapse:collapse; }

table#row1 { background-color: #f3faff; }

table#row2 { background-color: #e6edf3; }



.highlight { background-color: #D5EAFF; }