/* CSS Document */
body {margin: 0px;padding: 0px;background:#3a3839;font:12px "Lucida Sans Unicode",Arial, Helvetica, sans-serif;color:#fff;line-height: 18px;}

#wraptophome{ width: 100%; background: url(img/bgtiletophome.gif) top left repeat-x; height:231px;}
#wraptophome .tophome{ width: 988px; margin:0 auto; padding: 0; height:231px; position: relative; background: url(img/top_ornament_home.gif) top right no-repeat; z-index:1;}
#wraptophome .logohome{ position: absolute; top: 45px; right:0px;}
#wraptophome .anniversaryhome{ position: absolute; top: 26px; left:15px;}
#wraptophome .infohome{ position: absolute; top: 45px; right:12px;}


#wraptop{ width: 100%; background: url(img/bgtiletop.gif) top left repeat-x; height:132px;}
#wraptop .top{ width: 988px; margin:0 auto; padding: 0; height:132px; position: relative; background: url(img/top_ornament.gif) top right no-repeat; z-index:1;}
#wraptop .logo{ position: absolute; top: 0; left:8px;}
#wraptop .anniversary{ position: absolute; top: 0; left:285px;}
#wraptop .info{ position: absolute; top: 39px; right:257px;}

/* drop down menu */
.menuflyouthome{width: 588px;height: 43px;position: absolute;margin: 0;padding: 0; bottom:0; left: 415px;}
.menuflyout{width: 588px;height: 43px;position: absolute;margin: 0;padding: 0; bottom:0; left: 8px;}
		
#menu {font-size:14px; font-family: Helvetica, Arial, sans-serif; line-height:16px; padding:0; margin:0; list-style:none; width: 600px; height: 43px;left:0;}
#menu ul {padding:0; margin:0; list-style:none;}
#menu li {display:block; float:left; width:auto; height:43px;}
#menu li a {display:block; float:left; width:auto; height: 43px; text-indent:-999px; text-decoration:none;}
#menu li a.m1 {width: 85px; background: url("img/mn1.gif") top left no-repeat;}
#menu li a.m2 {width: 216px; background: url("img/mn2.gif") top left no-repeat;}
#menu li a.m3 {width: 99px; background: url("img/mn3.gif") top left no-repeat;}
#menu li a.m4 {width: 57px; background: url("img/mn4.gif") top left no-repeat;}
#menu li a.m5 {width: 56px; background: url("img/mn5.gif") top left no-repeat;}
#menu li a.m6 {width: 75px; background: url("img/mn6.gif") top left no-repeat;}
#menu li a.m1:hover, #menu li a.m2:hover, #menu li a.m3:hover, #menu li a.m4:hover, #menu li a.m5:hover, #menu li a.m6:hover{background-position: 0 -43px;}
#menu li a.active {background-position: 0 -43px;}

#menu table { border-collapse:collapse; top:0; left:0;font-size:1em;}
#menu li {float:left; margin-bottom:1px;}
#menu li ul {visibility:hidden; position:absolute; top:43px; left:0; width:300px; height:auto; padding:0 0 10px 0; margin: 0 0 0 0;}
#menu li ul li {display:block; display:inline; width:176px; height:auto; border:0; margin:0; padding:0; background:transparent;  height: 25px/*25px*/;line-height:18px;color:#464646;text-decoration:none;font-family: Arial, Helvetica,  sans-serif; font-size: 12px;}
#menu li ul li a {text-indent:8px; float: none; display:block;  margin:0 10px; padding: 2px 0; color:#000;background: url(img/dropdown.gif) top left no-repeat; width:176px; height: 21px;}

* html #menu li a:hover {position:relative; white-space:normal;background-position: 0 -25px;}
* html #menu li a:hover ul li a:hover {color:#fff;background-position: 0 -25px;}
#menu li:hover {position:relative;}
#menu li:hover ul li a:hover {color:#fff; background-position: 0 -25px;}

#menu li:hover ul, #menu li a:hover ul {
visibility:visible;
}

#menu li span {background:url(img/segitiga.gif) right center no-repeat; display: block; padding: 0; margin: 2px 4px 0 0;}

/* L2 */

#menu ul li ul{visibility:hidden; position:absolute; left:176px; top:0; width:200px; height:auto; padding:0 0 10px 0; margin: 0 0 0 0; background:transparent url(img/bgsubmenu.gif);}
#menu ul li ul li {display:block; display:inline; width:176px; height:auto; border:0; margin:0; padding:0; background:transparent;  height: 25px/*25px*/;line-height:18px;color:#464646;text-decoration:none;font-family: Arial, Helvetica,  sans-serif; font-size: 12px;}
#menu ul li ul li a {text-indent:8px; float: none; display:block;  margin:0 10px; padding: 2px 0; color:#000;background: url(img/dropdown.gif) top left no-repeat; width:176px; height: 21px;}

* html #menu ul li ul li a:hover {position:relative; white-space:normal;background-position: 0 -25px;}
* html #menu ul li ul li a:hover ul li a:hover {color:#fff;background-position: 0 -25px;}
#menu li ul ul li:hover {position:relative;}
#menu li ul ul li:hover ul li a:hover {color:#fff; background-position: 0 -25px;}


#menu li:hover ul ul, #menu li a:hover ul ul{
visibility:hidden;
}

#menu ul li:hover ul, #menu ul li a:hover ul {
visibility:visible;
}



/* end menu drop */

.menutop{ margin:0; padding: 0; position: absolute; top:6px; right:0; color:#a0a0a0; font-family: Arial,Helvetica, sans-serif;}
.menutop ul{margin:0; padding:0;}
.menutop li{ float: left; margin:0; padding:0 6px; list-style: none; height: 28px; display: block; line-height: 24px;}
.menutop li a, .menutop li a:link, .menutop li a:visited, .menutop li a:active{ color:#a0a0a0; text-decoration: none;}
.menutop li a:hover{ color:#575757; text-decoration: none;}
.menutop li.bahasa{ margin: 0; padding: 0 10px; border-left:1px solid #a0a0a0; border-right:1px solid #a0a0a0;}
.menutop li a.active{ color:#cc0000; text-decoration: none;}

/* content */

#wrapcontent{ width: 100%; margin:0; padding:0; background-color: #ad1e00 ;}
#wrapcontent .contenthome{ width: 988px;/*988px*/ height: 326px;/*346px*/ margin:0 auto; padding: 8px 0 12px 0; background:#ad1e00 url(img/bgmerah.jpg) top center no-repeat;}
#wrapcontent .contenthome .col1{ margin:0; padding:0; width:414px; float: left; position: relative;}
#wrapcontent .contenthome .col1 .man{ margin:0; padding:0; position: absolute; left: 0; top:-232px;}
#wrapcontent .contenthome .col2{ margin:0; padding:0; width:315px; float: left;}
#wrapcontent .contenthome .col2 .title{ margin:0; padding:10px 0; font-size:24px; font-weight: bold; font-family:"Lucida Sans", Arial, Helvetica, sans-serif;}
/*#wrapcontent .contenthome .col2 .biasa{ margin:0; padding:0 0 20px 0; font-size:20px; font-family:"Lucida Sans", Arial, Helvetica, sans-serif; line-height: 22px;}*/
#wrapcontent .contenthome .col2 .biasa{ margin:0; padding:0 0 20px 0; font-size:16px; font-family:"Lucida Sans", Arial, Helvetica, sans-serif; line-height: 22px;font-weight:bold;}
#wrapcontent .contenthome .col2 ul{margin:6px 0 0 0; padding: 0;}
#wrapcontent .contenthome .col2 li{margin:0; padding: 0; list-style: none; line-height: 16px;}
#wrapcontent .contenthome .col2 li .tgl{margin:0; padding: 0; color:#000; font-size:10px;}
#wrapcontent .contenthome .col2 li img{margin:0 10px 20px 0; padding: 0; float: left;}
#wrapcontent .contenthome .col2 li a, #wrapcontent .contenthome .col2 li a:link, #wrapcontent .contenthome .col2 li a:active, #wrapcontent .contenthome .col2 li a:visited{ margin:0; padding:0; color:#ffff00; text-decoration: none;}
#wrapcontent .contenthome .col2 li a:hover{color:#ffff00; text-decoration: underline;}
#wrapcontent .contenthome .col3{ margin:0; padding:0; width:259px; float: right; position: relative;}

#wrapcontent .content{ width: 988px;/*988px*/ height: 445px;/*455*/ margin:0 auto; padding: 0; background: #ad1e00 url(img/bgmerah.jpg) top center no-repeat;}
#wrapcontent .content .title{font-family: Helvetica, Arial, sans-serif; font-size: 16px; margin: 0; padding:12px 0 22px 0; font-weight: bold; color:#fff;text-transform: uppercase;}
#wrapcontent .content .titleright{margin: 0; padding: 12px 30px 0 0; float: right; color:#750000; font: 14px Helvetica, Arial, sans-serif;font-weight: bold;}
#wrapcontent .content .titleright a{ text-decoration: none; color:#750000;}
#wrapcontent .content .over{ width: 730px; height:375px; margin: 0; padding: 0; overflow: auto; position: relative;}
#wrapcontent .content .over .leftover{ width: 273px; margin: 0; padding: 0; float: left;}
#wrapcontent .content .over .leftover .title{font-family:"Lucida Sans Unicode", Arial, Helvetica, sans-serif; font-size: 16px; text-align: right; margin: 0; padding:0 0 7px 0; line-height: 25px; font-weight: normal;}
#wrapcontent .content .over .leftover ul.menutips li{ font: 12px "Lucida Sans", Arial, Helvetica, sans-serif; color:#410000; font-size: 12px; margin:0; padding: 4px 0;}
#wrapcontent .content .over .leftover ul.menutips li a{color:#410000; text-decoration: none;}
#wrapcontent .content .over .leftover ul.menutips li a.active{color:#fff; text-decoration: none;}
#wrapcontent .content .over .leftover ul.menutips li a:hover{color:#fff; text-decoration: none;}

#wrapcontent .content .over .rightover{ width: 412px; margin: 0 0 0 25px; padding: 0; float: left;}
/*#wrapcontent .content .over .rightover .title{font-family: Helvetica, Arial, sans-serif; font-size: 16px; margin: 0; padding:12px 0 22px 0; font-weight: bold; color:#fff;text-transform: uppercase;}*/

/* khusus HRD */
#wrapcontent .content .over .lefthrd{ width: 476px; margin: 0; padding: 0; float: left;}
#wrapcontent .content .over .lefthrd .title{font-family:"Lucida Sans Unicode", Arial, Helvetica, sans-serif; font-size: 16px; text-align: right; margin: 0; padding:0 0 7px 0; line-height: 25px; font-weight: normal;}
#wrapcontent .content .over .righthrd{ width: 190px; margin: 0 0 0 25px; padding: 0; float: left;}
#wrapcontent .content .over .righthrd ul{ margin:0 0 0 20px; padding:0;}
#wrapcontent .content .over .righthrd li{ font: 12px "Lucida Sans", Arial, Helvetica, sans-serif; color:#410000; font-size: 12px; margin:0; padding: 4px 0;}
#wrapcontent .content .over .righthrd li a, #wrapcontent .content .over .righthrd li a:link, #wrapcontent .content .over .righthrd li a:active, #wrapcontent .content .over .righthrd li a:visited{color:#410000; text-decoration: none;}
#wrapcontent .content .over .righthrd li a:hover{color:#fff; text-decoration: none;}
#wrapcontent .content .over .righthrd li a.active{color:#ffe400; text-decoration: none;}

/* khusus gallery */
#wrapcontent .content .over .leftgallery{ width: 476px; margin: 0; padding: 0; float: left;}
#wrapcontent .content .over .leftgallery ul{ margin:0; padding:0;}
#wrapcontent .content .over .leftgallery li{ margin:0; padding: 0 20px 20px 0; float: left; list-style: none;}
#wrapcontent .content .over .leftgallery li img{ padding: 0; margin:0; border:1px solid #fff;}


/* khusus testimony */
#wrapcontent .content .over .testi{ margin:0; padding:0;}
#wrapcontent .content .over .testi ul{ margin:0 0 0 130px; padding: 0;}
#wrapcontent .content .over .testi li{ margin:0; padding: 0; list-style: none; font: 12px "Lucida Sans", Arial, Helvetica, sans-serif; color:#fff; font-size: 12px;}
#wrapcontent .content .over .testi li img{ margin: 0 20px 12px 0; padding: 0; float: left; border: 1px solid #fff;}
#wrapcontent .content .over .testi li a, #wrapcontent .content .over .testi li a:link, #wrapcontent .content .over .testi li a:active, #wrapcontent .content .over .testi li a:visited{ color:#7b0300; text-decoration: none; font-size: 10px;}
#wrapcontent .content .over .testi li a:hover{color:#7b0300; text-decoration: underline; font-size: 10px;}
#wrapcontent .content .over .testi a{margin:0; padding:0; color:#ffff00; text-decoration: none;}
#wrapcontent .content .over .testi a:hover{color:#ffff00; text-decoration: underline;}


/* khusus faq */
#wrapcontent .content .over .faq{ margin:0; padding:0;}
#wrapcontent .content .over .faq ul{ margin:0; padding: 0;}
#wrapcontent .content .over .faq li{ margin:0 0 20px 0; padding: 0; list-style: none; font: 12px "Lucida Sans", Arial, Helvetica, sans-serif; color:#ffe400; font-size: 12px;}
#wrapcontent .content .over .faq li .answer{ color:#fff;}
#wrapcontent .content .over .faq li a, #wrapcontent .content .over .faq li a:link, #wrapcontent .content .over .faq li a:active, #wrapcontent .content .over .faq li a:visited{ color:#7b0300; text-decoration: none; font-size: 10px;}
#wrapcontent .content .over .faq li a:hover{color:#7b0300; text-decoration: underline; font-size: 10px;}

/* khusus tips */
#wrapcontent .content .over .lefttips{ width: 322px; margin: 0; padding: 0; float: left; color:#ffe400;}
#wrapcontent .content .over .lefttips .title{font-family:"Lucida Sans Unicode", Arial, Helvetica, sans-serif; font-size: 16px; text-align: right; margin: 0; padding:0 0 7px 0; line-height: 25px; font-weight: normal;}
#wrapcontent .content .over .lefttips a{ color:#470200; font-size: 10px; text-decoration: none;}
#wrapcontent .content .over .lefttips a:hover{ color:#470200; text-decoration: underline;}
#wrapcontent .content .over .righttips{ width: 323px; margin: 0 0 0 48px; padding: 0; float: left;}
#wrapcontent .content .over .righttips ul.menutips{ margin:0 0 0 20px; padding:0;}
#wrapcontent .content .over .righttips ul.menutips li{ font: 12px "Lucida Sans", Arial, Helvetica, sans-serif; color:#410000; font-size: 12px; margin:0; padding: 4px 0;}
#wrapcontent .content .over .righttips ul.menutips li a{color:#410000; text-decoration: none;}
#wrapcontent .content .over .righttips ul.menutips li a.active{color:#fff; text-decoration: none;}
#wrapcontent .content .over .righttips ul.menutips li a:hover{color:#ffe400; text-decoration: none;}

#wrapcontent .content .over .righttips .tithig{ color:#410000; font-size: 12px; font-weight: bold; margin:20px 0; padding:0; border-top: 1px solid #410000;}

#wrapcontent .content .over .righttips .high{ margin:0; padding:0; color:#fff;}
#wrapcontent .content .over .righttips .high ul{ margin:0; padding:0;}
#wrapcontent .content .over .righttips .high li{ font: 12px "Lucida Sans", Arial, Helvetica, sans-serif; color:#fff; font-size: 12px; margin:0; padding: 4px 0; list-style: none;}
#wrapcontent .content .over .righttips .high li a, #wrapcontent .content .over .righttips li a:link, #wrapcontent .content .over .righttips .high li a:active, #wrapcontent .content .over .righttips li a:visited{color:#410000; text-decoration: none; font-size: 10px;}
/*#wrapcontent .content .over .righttips .high li a:active{color:#fff; text-decoration: none;}*/
#wrapcontent .content .over .righttips .high li a:hover{color:#ffe400; text-decoration: none;}


/* khusus contact */
#wrapcontent .content .over .leftcont{ width: 306px; margin: 0; padding: 0; float: left;}
#wrapcontent .content .over .leftcont .title{font-family:"Lucida Sans Unicode", Arial, Helvetica, sans-serif; font-size: 16px; text-align: right; margin: 0; padding:0 0 7px 0; line-height: 25px; font-weight: normal;}
#wrapcontent .content .over .rightcont{ width: 323px; margin: 0 0 0 25px; padding: 0; float: left;}
#wrapcontent .content .over .rightcont ul{ margin:0 0 0 20px; padding:0;}
#wrapcontent .content .over .rightcont li{ font: 12px "Lucida Sans", Arial, Helvetica, sans-serif; color:#410000; font-size: 12px; margin:0; padding: 4px 0;}
#wrapcontent .content .over .rightcont li a, #wrapcontent .content .over .rightcont li a:link, #wrapcontent .content .over .rightcont li a:active, #wrapcontent .content .over .rightcont li a:visited{color:#410000; text-decoration: none;}
#wrapcontent .content .over .rightcont li a:hover{color:#fff; text-decoration: none;}

/* form */
form{margin:0; padding:0;}
.inputstyle{ padding:0 0 0 2px; background: url(img/inputbg.gif) no-repeat left top; float: left; margin: 0px; width: 199px; height: 21px;}
.textareastyle{ padding:0 0 0 2px; background: url(img/textarea.gif) no-repeat left top; float: left; margin: 0px; width: 199px; height: 84px;}
.textareastyle textarea{ border:none;}
.inputstyle span{ padding:2px 8px 4px 4px; display: block; background: url(img/bginputpendek.gif) top right no-repeat; float: left;}
.inputstyle input{ border: 0; background: none; margin: 0 ; padding:0;}
.tombol button{width:78px; height:24px; line-height:24px; border:none; background:url(img/button.gif) no-repeat 0 0; color:#000; cursor:pointer; text-align:center; margin: 0 5px 0 0; padding: 0;}


/* highlight home */
#wrapcontent .contenthome .col3 .highlighthome{ position: absolute; margin:0; padding: 0; top: 0; right:0; width: 227px;/*227px*/ height: auto/*370px*/; display: block;  float: left;background:#000 url(img/highlightbghome2.gif) top left no-repeat;}
#wrapcontent .contenthome .col3 .highlighthome span .isi{ padding:9px 9px 0 9px; margin:0;}
#wrapcontent .contenthome .col3 .highlighthome span{ background: url(img/highlightbghome3.gif) bottom left no-repeat; margin:0; padding: 0 0 10px 0; width: 227px; display: block; float: left;}
#wrapcontent .contenthome .col3 .highlighthome .titleats{ font-family:"Lucida Sans", Arial, Helvetica, sans-serif; font-size: 14px; font-weight: bold; text-align: center; margin: 0; padding:0 0 7px 0;}
.grsmrh{border-bottom:1px solid #f10b00; margin: 0 ; padding:0; height:8px;}
#wrapcontent .contenthome .col3 .highlighthome ul{margin:0; padding: 0;}
#wrapcontent .contenthome .col3 .highlighthome li{ margin: 0; padding: 0 0 10px 0; font:12px "Lucida Sans Unicode",Arial, Helvetica, sans-serif;color:#afafaf; list-style: none; line-height: 16px; }
#wrapcontent .contenthome .col3 .highlighthome li a, #wrapcontent .contenthome .col3 .highlighthome li a:link, #wrapcontent .contenthome .col3 .highlighthome li a:active, #wrapcontent .contenthome .col3 .highlighthome li a:visited{ display: block; text-decoration: none; color:#afafaf;}
#wrapcontent .contenthome .col3 .highlighthome li a:hover{ color:#fff; text-decoration: underline;}
#wrapcontent .contenthome .col3 .highlighthome li .title1{ font-family:"Lucida Sans", Arial, Helvetica, sans-serif; font-size: 12px; margin: 0; padding:6px 0 7px 0; font-weight: bold; color:#f10b00; border-top:1px solid #f10b00;}
#wrapcontent .contenthome .col3 .highlighthome li .title2{ font-family:"Lucida Sans", Arial, Helvetica, sans-serif; font-size: 16px; margin: 0; padding:6px 0 7px 0; color:#fff;font-weight: bold; border-top:1px solid #f10b00;}
#wrapcontent .contenthome .col3 .highlighthome form{margin: 0; padding:0;}
#wrapcontent .highlighthome .col3 button{ background:#fefefe; border:none; margin:4px 0 0 0; padding:0;}

/* highlight dalam */

#wrapcontent .right{width: 227px;/*227px*/ height: 421px/*560px*/; position: relative; float: right; z-index:99;}

#wrapcontent .right .highlight{ position: absolute; margin:0; padding: 0; top: -83px; right:0; width: 227px;/*227px*/ /*height: 542px560px*/; background: #000 url(img/highlightbghome4.gif) top left no-repeat;}
#wrapcontent .right .highlight span{ background: url(img/highlightbghome3.gif) bottom left no-repeat; margin:0; padding: 0 0 10px 0; width: 227px; display: block; float: left;}
#wrapcontent .right .highlight span .isi{ padding:9px 9px 0 9px; margin:0;}
#wrapcontent .right .highlight .titleats{ font-family:"Lucida Sans", Arial, Helvetica, sans-serif; font-size: 14px; font-weight: bold; text-align: center; margin: 0; padding:0 0 7px 0;}
.grsmrh{border-bottom:1px solid #f10b00; margin: 0 ; padding:0; height:8px;}
#wrapcontent .right .highlight ul{margin:0; padding: 0;}
#wrapcontent .right .highlight li{ margin: 0; padding: 0 0 10px 0; font:12px "Lucida Sans Unicode",Arial, Helvetica, sans-serif;color:#afafaf; list-style: none; line-height: 16px; }
#wrapcontent .right .highlight li a, #wrapcontent .right .highlight li a:link, #wrapcontent .right .highlight li a:active, #wrapcontent .right .highlight li a:visited{ display: block; text-decoration: none; color:#afafaf;}
#wrapcontent .right .highlight li a:hover{ color:#fff; text-decoration: underline;}
#wrapcontent .right .highlight li .title1{ font-family:"Lucida Sans", Arial, Helvetica, sans-serif; font-size: 12px; margin: 0; padding:6px 0 7px 0; font-weight: bold; color:#f10b00; border-top:1px solid #f10b00;}
#wrapcontent .right .highlight li .title2{ font-family:"Lucida Sans", Arial, Helvetica, sans-serif; font-size: 16px; margin: 0; padding:6px 0 7px 0; color:#fff;font-weight: bold; border-top:1px solid #f10b00;}
#wrapcontent .right .highlight form{margin: 0; padding:0;}
#wrapcontent .right .highlight button{ background:#fefefe; border:none; margin:4px 0 0 0; padding:0;}



/* footer */

#wrapfooter{ width: 100%; background: url(img/footerbg.gif) top left repeat-x; height: 44px;}
#wrapfooter .footer{ width: 988px; margin:0 auto; padding: 0; color:#b9b9b9; font-size: 11px; line-height: 40px;}

.red{ color:#ff2c00;}
.maroon{ color:#410000;}
.uk14{font-size: 14px;}
.clearer{ clear: both;}
.map{ color:#000;}
.listmap{ margin: 10px 0 0 0; padding: 0; color:#FFFFFF; font:12px "Lucida Sans",Arial, Helvetica, sans-serif;}
.listmap ul{ margin: 0; padding: 0;}
.listmap li{ margin: 0; padding: 0 20px; float: left; list-style: none;}
.listmap li a, .listmap li a:link, .listmap li a:visited, .listmap li a:active{ color:#000; text-decoration: none;}
.listmap li a:hover, .listmap li a.active{ color:#fff; text-decoration: none;}

#wrapcontent .content .over .rightover li a{color:#fff; text-decoration: none;}
#wrapcontent .content .over .rightover li a:hover{color:#FFE400; text-decoration: none;}

#wrapcontent .content .over .leftover ul.submenu li{ font: 14px "Lucida Sans", Arial, Helvetica, sans-serif; color:#fff; font-size: 12px; margin:0; padding: 4px 0; list-style:none;text-align:right;}
#wrapcontent .content .over .leftover ul.submenu li a{color:#fff; text-decoration: none;}
#wrapcontent .content .over .leftover ul.submenu li a.active{color:#FFE400; text-decoration: none;}
#wrapcontent .content .over .leftover ul.submenu li a:hover{color:#FFE400; text-decoration: none;}