@charset "UTF-8";
/*Erik Meyer meyerweb.com/eric/thoughts/2007/05/01/reset-reloaded/*/
html, body, div, span, applet, object, iframe, h1, h2, h3, h4, h5, h6, p, blockquote, pre, a, abbr, acronym, address, big, cite, code, del, dfn, em, font, img, ins, kbd, q, s, samp, small, strike, strong, sub, sup, tt, var, dl, dt, dd, ol, ul, li, fieldset, form, label, legend, table, caption, tbody, tfoot, thead, tr, th, td{margin:0;padding:0;border:0;outline:0;font-weight:inherit;font-style:inherit;font-size:100%;font-family:inherit;}
:focus{outline:0;}
body{line-height:1;color:black;background:white;}
ul{list-style:none;}
table{border-collapse:separate;border-spacing:0;}
caption, th, td{text-align:left;font-weight:normal;}
blockquote:before, blockquote:after, q:before, q:after{content:"";}
blockquote, q{quotes:"" "";}
/* common */
.head-global, html {min-width:1000px;}
body { font-family:Arial, sans-serif; font-size:13px; color:#666; background-color:#EAEAEC; }
body * { word-wrap:break-word; }
/* text */
a { text-decoration:none; color:#307bb6; }
a[href]:hover { text-decoration:underline; color:#2c98ec; cursor:pointer; }
h1, h2, h3, h4, h5 { font-family:Arial, Helvetica, sans-serif; color:#636363; font-weight:bold; margin-bottom:0.25em;}
h1 { font-size:175%; }
h2 { font-size:150%; }
h3 { font-size:125%; }
h4 { font-size:100%; }
h5 { font-size:75%; }
p { line-height:normal; }
sub, sup { font-size:75%; line-height:0; }
strong, b { font-weight:bold; }
em, i, .more { font:italic 95% "Trebuchet MS", Arial, Helvetica, sans-serif; }
blockquote { font:italic 100% Georgia, "Times New Roman", Times, serif; }
blockquote { background-color:#DDE9F7; color:#555; padding:10px 15px; margin-bottom:10px; line-height:normal; }
code { font-family:"Courier New", Courier, monospace; }
.orange{ color: #ff8400; }
.green{ color: #3b9e00; }
.blue{ color: #167ede; }
.red{ color: #900; }
.grey{ color: #989898; }
.med{font-size:125%; line-height:1;}
.big{font-size:150%; line-height:1;}
small,.sml{ font-size:85%; }
/* text normal format */
.normal{
   line-height:normal;
}
.normal ul{
   list-style:disc;
   padding-left:7px;
}
.normal ol{
   padding-left:2em;
}
.normal ol.type01{
   list-style:decimal-leading-zero;
}
.normal ol li,
.normal ul li{
   margin:7px;
   padding:0;
   border:none;
}
.normal ol li:first-child,
.normal ul li:first-child{
   margin-top:0;
}
.normal ol ol,
.normal ol ul,
.normal ul ol,
.normal ul ul{
   margin-top:7px;
}
.normal > p {
   margin-bottom:12px !important;
}
/* block */
.clear:after { content:"."; display:block; height:0; overflow:hidden; clear:both; visibility:hidden; }
.clr-l { clear:left; }
.nowrap { white-space:nowrap !important; }
.fl { float:left; }
.fr { float:right; }
.vm { vertical-align:middle; }
.vt { vertical-align:top; }
.vb { vertical-align:bottom; }
.iblk { display:inline-block; }
.blk { display:block; }
.hr{ border-bottom:#bfbfbf dotted 1px; padding-bottom:7px; margin-bottom:10px; }
.hide { display:none; }
.tbl{ display:table }
.cell{ display:table-cell }
/* layout */
.half{width:48% !important; margin-right:2%}
.half:last-child{width:49.9% !important; margin:0 !important}
.trio{width:31% !important; margin-right:2%}
.trio2{width:62% !important; margin-right:2%}
.trio:last-child{width:32.9% !important; margin:0 !important}
.trio2:last-child{width:63.9% !important; margin:0 !important}
.quad{width:24% !important; margin-right:2%}
.quad2{width:46% !important; margin-right:2%}
.quad3{width:72% !important; margin-right:2%}
.quad:last-child{width:25.9% !important; margin:0 !important}
.quad2:last-child{width:47.9% !important; margin:0 !important}
.quad3:last-child{width:73.9% !important; margin:0 !important}
.full{width:100% !important}
/* rounded */
.snotif,
.rnd3{border-radius:3px; -moz-border-radius:3px; -webkit-border-radius:3px; -khtml-border-radius:3px}
.rnd4{border-radius:4px; -moz-border-radius:4px; -webkit-border-radius:4px; -khtml-border-radius:4px}
.rnd5{border-radius:5px; -moz-border-radius:5px; -webkit-border-radius:5px; -khtml-border-radius:5px}
.rnd6{border-radius:6px; -moz-border-radius:6px; -webkit-border-radius:6px; -khtml-border-radius:6px}
.rnd7{border-radius:7px; -moz-border-radius:7px; -webkit-border-radius:7px; -khtml-border-radius:7px}
.rnd-t{border-bottom:none !important; border-bottom-left-radius:0 !important; border-bottom-right-radius:0 !important; -moz-border-radius-bottomleft:0 !important; -moz-border-radius-bottomright:0 !important; -webkit-border-radius-bottomleft:0 !important; -webkit-border-radius-bottomright:0 !important; -khtml-border-radius-bottomleft:0 !important; -khtml-border-radius-bottomright:0 !important}
.rnd-b{border-top:none !important; border-top-left-radius:0 !important; border-top-right-radius:0 !important; -moz-border-radius-topleft:0 !important; -moz-border-radius-topright:0 !important; -webkit-border-radius-topleft:0 !important; -webkit-border-radius-topright:0 !important; -khtml-border-radius-topleft:0 !important; -khtml-border-radius-topright:0 !important}
.rnd-l{border-bottom-right-radius:0 !important; border-top-right-radius:0 !important; -moz-border-radius-bottomright:0 !important; -moz-border-radius-topright:0 !important; -webkit-border-radius-bottomright:0 !important; -webkit-border-radius-topright:0 !important; -khtml-border-radius-bottomright:0 !important; -khtml-border-radius-topright:0 !important}
.rnd-r{border-bottom-left-radius:0 !important; border-top-left-radius:0 !important; -moz-border-radius-bottomleft:0 !important; -moz-border-radius-topleft:0 !important; -webkit-border-radius-bottomleft:0 !important; -webkit-border-radius-topleft:0 !important; -khtml-border-radius-bottomleft:0 !important; -khtml-border-radius-topleft:0 !important}
blockquote, q{
   border-top-left-radius:6px;
   border-bottom-right-radius:6px;
   -moz-border-radius-topleft:6px;
   -moz-border-radius-bottomright:6px;
   -webkit-border-radius-topleft:6px;
   -webkit-border-radius-bottomright:6px;
   -khtml-border-radius-topleft:6px;
   -khtml-border-radius-bottomright:6px;
}
/* shadow */
.sdw{box-shadow:1px 2px 2px rgba(0,0,0,0.1); -moz-box-shadow:1px 2px 2px rgba(0,0,0,0.1); -webkit-box-shadow:1px 2px 2px rgba(0,0,0,0.1)}
.sdw-h, .sdw-h *{background:transparent url(../img/global/sep_sdw.png) no-repeat right -30px; display:block}
.sdw-h >span{background-position:0 0 !important}
.sdw-h >span >span{background-position:0 -15px !important; background-repeat:repeat-x; margin:0 100px; height:15px}
.sdw-ht, .sdw-ht *{background:url(../img/global/sep_sdw_up.png) no-repeat right -20px; display:block}
.sdw-ht >span{background-position:0 0 !important}
.sdw-ht >span >span{background-position:0 -10px !important; background-repeat:repeat-x; margin:0 100px; height:10px}
/* head global */
.head-global {
   position:absolute;
   top:0;
   width:100%;
   background-color:#dbdbdd;
   border-bottom:#bfbfbf solid 1px;
   z-index:1000;
   height:32px;
}
.head-global > div {
   margin:0 5px;
   position:relative;
}
.head-global > div > a {
   padding:6px 0;
   float:left;
   position:relative;
}
.head-global > div > a:first-child > span {
   border-left-color:#dbdbdd;
}
.head-global > div > a:last-child > span {
   border-right-color:#dbdbdd;
}
.head-global > div > a.selected,
.head-global > div > a.on,
.head-global > div > a:hover {
   background:#ededee;
   border-left:#c8c8c8 solid 1px;
   border-right:#f8f8f8 solid 1px;
   border-bottom:#c8c8c8 solid 1px;
   padding:6px 0;
}
.head-global > div > a.on {
   border-bottom-color:#ededee;
}
.head-global > div > a > span {
   display:block;
   height:20px;
   border-left:#e6e6e6 solid 1px;
   border-right:#c8c8c8 solid 1px;
   padding:0 9px;
   line-height:19px;
}
.head-global > div > a.selected > span,
.head-global > div > a.on > span,
.head-global > div > a:hover > span {
   border:none;
}
.head-global a.more > span {
   margin-right:5px;
   border-right:none;
   background:url(../img/global/p-down.png) no-repeat right center;
   padding-right:15px;
   font-size:11px;
   font-style:italic;
}
.head-global >.fl >a:first-child span {
   background:url(../img/global/siap_logo-d.png) no-repeat center 0;
   text-indent:-9999px;
   overflow:hidden;
   width:49px;
}
.head-global >.fl >a:first-child:hover span {
   background:url(../img/global/siap_logo.png) no-repeat center 0;
}
.head-global span.ic {
   text-indent:-9999px;
   overflow:hidden;
}
.head-global .ready {
   background-color:#e8cbce;
}
.head-global .ready:hover {
   background-color:#ededee;
}
.head-global .ic+dd {
   position:absolute;
   top:26px;
   left:0;
   background:url(../img/global/point-red.png) no-repeat center top;
   padding-top:4px;
   width:100%;
   text-align:center;
   display:none;
   z-index:1006;
}
.head-global .ready:hover .ic+dd {
   display:block;
}
.head-global .ic+dd:after {
   content:attr(alt);
   display:inline-block;
   background-color:#e20000;
   padding:4px;
   min-width:10px;
   color:#FFF;
   font-size:9px;
   border-radius:3px; -moz-border-radius:3px; -webkit-border-radius:3px; -khtml-border-radius:3px;
   box-shadow:1px 2px 2px rgba(0,0,0,0.1); -moz-box-shadow:1px 2px 2px rgba(0,0,0,0.1); -webkit-box-shadow:1px 2px 2px rgba(0,0,0,0.1);
}
.head-global a.profil >span {
   border-right-color:#dbdbdd;
}
.head-global .profil img {
   margin-right:5px;
}
/* box */
.box {
   border:#bfbfbf solid 1px;
   background-color:#fff;
}
.box-cont {
   padding:10px 12px;
}
.box-head {
   padding:7px 10px;
   border-bottom:#bfbfbf dotted 1px;
}
.box-head * {
   display:inline-block;
   margin-bottom:0;
}
.box-foot {
   padding:7px 10px;
   border-top:#bfbfbf dotted 1px;
   display:block;
   text-align:center;
   background-color:#dbdbdd;
}
.box:after, .box-head:after, .box-cont:after, .box-foot:after{ content: "."; display: block; height: 0; overflow:hidden; clear: both; visibility: hidden; }
/* menu */
.menu h4 {
   font:13px Helvetica, Arial, sans-serif;
   color:#777;
   padding:3px 5px;
   border-bottom:#CCC solid 1px;
   margin-bottom:5px;
}
.menu > ul > li > h4 {
   font-weight:bold;
}
.menu > ul > li > ul > li > h4 {
   font:italic 12px Georgia, "Times New Roman", Times, serif;
   border-bottom-color:#e9e9e9;
}
.menu{
   white-space:nowrap;
   vertical-align:top;
}
.menu ul {
   display:inline-block;
   padding-right:15px;
   vertical-align:top;
}
.menu li > ul {
   padding-bottom:5px;
}
.menu ul:last-child {
   padding-right:0;
}
.menu a {
   display:inline-block;
   padding:3px 5px 3px 25px;
   background:transparent url(../img/ic/ic16-cekbox.png) no-repeat 3px 2px;
   line-height:1.25;
}
.menu li.on > a,
.menu a:hover {
   background-image:url(../img/ic/ic16-cekbox_on.png);
}
/* menu @ global header */
.head-global .menu h4 {
   border-bottom-color:#bfbfbf;
}
.head-global .menu > ul > li > ul > li > h4 {
   border-bottom-color:#ddd;
}
/* menu vertical */
.menu-l ul{
   font-size:12px;
}
.menu-l li{
   position:relative;
   margin-bottom: 1px;
}
.menu-l li:hover{
   background-color:#e9e9e9;
}
.menu-l li.on{
   background-color:#dde9f7;
}
.menu-l li > a{
   display:block;
   padding:5px;
   word-wrap:break-word;
   text-decoration:none;
   position:relative;
   min-height:12px;
}
.siapku-frame-ll .menu-l li >a,
.menu-l.menu-ic li >a{
   padding-left:31px;
   margin-right:10px;
   background-repeat:no-repeat;
   background-position:5px 3px !important;
}
.menu-l li.on > a,
.menu-l li > a:hover{
   color:#307BB6;
}
.menu-l .more{
   background:url(../img/global/p-down.png) no-repeat 4px center;
}
.menu-l .more.fewer{
   background:url(../img/global/p-up.png) no-repeat 4px center;
}
.menu-l .more-cont{
   display:none;
}
.menu-l .ic-p-r{
   background-position:8px center;
}
.menu-l li >dd{
   position:absolute;
   z-index:10;
   top:5px;
   right:-1px;
   width:8px;
   height:15px;
   display:none;
   background:url(../img/skin/menu-point-l-fff.png) no-repeat right 0;
}
.menu-l li dd.snotif{
   top:4px;
   right:10px;
   background-color:#bbb;
   font:9px "Courier New", Courier, monospace;
   font-weight:bold;
   letter-spacing:-1px;
   color:#FFF;
   margin-left:3px;
   padding:1px 3px 0 2px;
   display:inline-block;
   min-width:5px;
}
.menu-l li.on > dd,
.menu-l li:hover > dd{
   display:block;
}
.menu-l h4{
   margin-bottom:7px;
   color:#989898;
}
/* menu vertical head global */
.head-global .menu-l li:hover{
   background-color:#ddd;
}
.head-global .menu-l ul{
   margin-right:10px;
}
.head-global .menu-l ul:last-child{
   margin-right:0;
}
.head-global .menu-l li.on {
    background-color: #fff;
}
/* application footer */
.foot-global{
   background-color:#EAEAEC;
   position:relative;
   bottom:0;
   padding:7px 0;
}
.foot-global .sdw-h {
   position:absolute;
   top:0;
   left:0;
   width:100%;
}
.foot-global table{
   width:100%;
   margin:0;
}
.foot-global td{
   border-right:#ccc solid 1px;
   border-left:#fff solid 1px;
   padding:0 10px;
   font-size:9px;
   font-weight:normal;
   line-height:1;
   color:#999;
}
.foot-global .telkom{
   width:55px;
   padding:3px 12px 7px;
   border-left:none;
}
.foot-global .telkom:after{
   content:url(../img/global/by_telkom-footer.png);
   width:55px;
   height:31px;
}
.foot-global .slogan{
   border-right:none;
}
.foot-global .version{
   border-left:none;
   text-align:right;
   font-size:11px;
}
.foot-global .siap-sml{
   width:33px;
   padding:5px 12px;
   border-right:none;
   background:url(../img/global/siap-sml.png) no-repeat center center;
}
/* notif */
.notifbox li{
   padding:5px 10px 5px 50px;
   position:relative;
   min-height:30px;
   border-top:#cbcbc6 dotted 1px;
   margin-bottom:0 !important;
   word-wrap:break-word;
}
.notifbox li > img {
   position:absolute;
   left:10px;
   width:30px;
   height:30px;
}
.notifbox li em.green{
   font-size:80%;
   padding-top:5px;
}
.notifbox li:first-child{
   border-top:none;
}
.notifbox li.new{
   background-color:#fff;
}
.notifbox li:hover {
   background-color:#e2e2f4;
   cursor:pointer;
}
/* notif @ global header */
.head-global .notifbox{
   width:300px;
   padding:0;
}
.head-global .notifbox p > em{
   font-size:85%;
}
/* search */
.global-search{
   position:relative;
   padding:0 10px;
   background:none;
}
.global-search >input[type="text"]{
   width:240px;
}
.global-search >input[type="text"]+.ic{
   position:absolute;
   top:12px;
   right:15px;
}
.global-search >.search-result{
   width:252px;
   position:absolute;
   left:13px;
   border:1px solid #bfbfbf;
   display:none;
   z-index:10;
}
.search-result h4{
   margin-bottom:2px !important;
}
.search-result >h4{
   background-color:#f3f3f3;
   padding:5px 10px;
   border-top:1px solid #dadada;
   border-bottom:#cbcbc6 dotted 1px;
   margin:0 !important;
}
.search-result > a:last-child{
   background:#f3f3f3 no-repeat center center;
    display: block;
   padding:5px 10px 7px;
    text-align: center;
   min-height:16px;
}
.search-result > a:last-child *{
   display:none;
}
.search-result ul li:first-child,
.search-result >h4:first-child{
   border-top:none;
}
.search-result li{
   padding:5px 10px 5px 50px;
   position:relative;
   border-top:#cbcbc6 dotted 1px;
   margin-bottom:0 !important;
   word-wrap:break-word;
   min-height:30px;
   background-color:#fff;
}
.search-result li > img {
   position:absolute;
   left:10px;
   width:30px;
   height:30px;
}
.search-result li >dd{
   font-size:11px;
}
.search-result li em.green{
   font-size:80%;
}
.search-result li.new{
   background-color:#fff;
}
.search-result li.select,
.search-result li:hover {
   background-color:#e2e2f4;
}
.global-search .search-result li{
   cursor:pointer;
}
/* search @ head global*/
.head-global .global-search >.search-result{
   top:33px;
}
/* search @ workspace*/
.workspc .global-search >input[type="text"]{
   margin:0;
}
.workspc .global-search >input[type="text"]+.ic{
   top:5px;
}

/* header katagori */
.head-cat{
   min-height:90px;
   padding:5px 15px 0 15px;
   background-color:#f3f3f3;
   border-bottom:#ddd solid 1px;
}
.head-cat h2{
   margin-top:15px;
   font-family: 'webfont',Helvetica,Arial,sans-serif;
   font-weight:normal;
   font-size: 21px !important;
   color:#999;
   text-align:right;
   text-transform:capitalize;
   text-shadow: 0 1px 1px #ffffff;
}
/* workspace */
.workspc{
   display:table;
   background-color:#fff;
   width:100%;
   height:100%;
}
.workspc >div{
   position:relative;
   vertical-align:top;
   display:table-cell;
}
.workspc >.workspc-l{
  padding:15px 0;
  border-right:#ddd solid 1px;
}
.workspc >.work-sidebar-l{
   width:170px;
   margin:10px 0;
   padding:25px 0 30px 15px;
}
.workspc >.work-main{
   width:auto;
   margin:10px 0;
   border-left:#dadada solid 1px;
   box-shadow:-4px 0 3px -3px rgba(0, 0, 0, 0.1);
   -moz-box-shadow:-4px 0 3px -3px rgba(0, 0, 0, 0.1);
   -webkit-box-shadow:-4px 0 3px -3px rgba(0, 0, 0, 0.1);
   padding:25px 20px 30px 20px;
}
.workspc >.work-main:last-child{
   border-right:none;
}
.workspc > .work-sidebar-r{
   width:180px;
   background-color:#EAEAEC;
   padding:15px 15px 30px 15px;
}
.workspc .title-big{
   font-family: 'webfont',Helvetica,Arial,sans-serif;
   font-size:24px;
   font-weight:normal;
   text-transform:capitalize;
   color:#7ab445 !important;
}
.work-sidebar-l .title-big{
   font-size:20px;
}
/* section area */
.section{
   margin-bottom:20px;
}
.work-sidebar-l .section{
   margin-right:10px;
}
.work-sidebar-l .menu-l{
   margin-right:0 !important;
}
/* profil card */
.namecard{
   position:relative;
   /* padding-bottom:7px; */
}
.namecard{
   padding-left:90px;
   min-height:80px;
}
.tiny-card .namecard{
   padding-left:30px;
   min-height:20px;
}
.sml-card .namecard{
   padding-left:40px;
   min-height:30px;
}
.med-card .namecard{
   padding-left:60px;
   min-height:50px;
}
.namecard h3{
   font-size:14px !important;
   margin-bottom:2px !important;
}
.tiny-card .namecard h3,
.sml-card .namecard h3{
   font-size:12px !important;
   color:#307BB6;
   font-weight:normal;
}
.med-card .namecard h3{
   font-size:13px !important;
}
.namecard .avatar,
.namecard img{
   position:absolute;
   top:0;
   left:0;
   width:80px; height:80px;
}
.tiny-card .namecard img{
   width:20px; height:20px;
}
.sml-card .namecard img{
   width:30px; height:30px;
}
.med-card .namecard img{
   width:50px; height:50px;
}
/* profil card @ head global */
.tips-modal .namecard {
   padding-left:100px;
}
.tips-modal .namecard .avatar,
.tips-modal .namecard img {
   top:10px;
   left:10px;
}
/* profil card @ sidebar left */
.work-sidebar-l .namecard {
   padding:7px;
   border-bottom:#dadada solid 1px;
   border-collapse:collapse;
   padding-left:97px;
   min-height:80px;
}
.work-sidebar-l .namecard:first-child {
   border-top:#dadada solid 1px;
}
.work-sidebar-l .tiny-card .namecard{
   padding-left:37px;
   min-height:20px;
}
.work-sidebar-l .sml-card .namecard{
   padding-left:47px;
   min-height:30px;
}
.work-sidebar-l .med-card .namecard{
   padding-left:67px;
   min-height:50px;
}
.work-sidebar-l .namecard .avatar,
.work-sidebar-l .namecard img{
   top:7px;
   left:7px;
}
.work-sidebar-l .namecard.on{
   background-color:#f3f3f3;
}
/* workspace to sidebar left pointer */
.work-sidebar-l .pointed-r,
.work-sidebar-l .pointed-t{
   position:relative;
   margin-right:0 !important;
   padding-right:10px;
}
.work-sidebar-l .pointed-r:after{
   content:url(../img/skin/blank.png);
   position:absolute;
   z-index:10;
   top:0;
   right:-1px;
   width:17px;
   height:100%;
   background:url(../img/skin/workspc-point.png) no-repeat 0 center;
}
.work-sidebar-l .pointed-t:before{
   content:url(../img/skin/blank.png);
   background:url(../img/skin/menu-point.png) no-repeat center bottom;
   position:absolute;
   width:100%;
   height:8px;
   left:0;
   top:-8px;
   z-index:1;
}
.work-sidebar-l .on.pointed-t:before{
   background-image:url(../img/sampah/menu-point-f3f3f3.png);
}
/* modal dialog */
.modalbox{
   position:fixed;
   top:0;
   width:100%;
   height:100%;
   z-index:1002;
   display:none;
   overflow:auto;
   background-color:rgba(0, 0, 0, 0.2);
}
.modalbox-dialog{
   margin:15px auto;
   max-width:90%;
   padding:15px;
}
.modalbox-cls{
   background:url(../img/ic/ic16-dialog_cls.png) no-repeat center center;
   float:right;
   width:16px;
   height:16px;
   opacity: 0.5;
   cursor:pointer;
}
.modalbox-cls:hover{
   opacity: 1;
}
/* drag & drop area */
.drop-box {
   background-color:#f3f3f3;
   border:#bfbfbf dashed 3px;
   padding:20px;
}
/* form */
form select, form .button, form .input,
form button, form input, form textarea{
   border-radius: 3px;
   -webkit-border-radius: 3px;
   -moz-border-radius: 3px;
}
form input[type=email], form input[type=text], form input[type=password], form textarea{
   width:240px;
}
form select,
form .input,
form input[type="text"], form input[type="password"], form input[type="email"], form textarea {
   padding: 6px 10px;
   color: #444444;
   font-weight: normal;
   font-size: 12px;
   line-height: 12px;
   background: #cccccc;
   background: -webkit-gradient(linear, left top, left bottom, from(#f3f3f3), to(#eee));
   background: -moz-linear-gradient(#f3f3f3, #eee);
   text-shadow: 0 1px 1px #ffffff;
   border: none;
   -webkit-box-shadow: inset 0 1px 2px rgba(0, 0, 0, 0.5), 0 1px 1px #ffffff;
   -moz-box-shadow: inset 0 1px 2px rgba(0, 0, 0, 0.5), 0 1px 1px #ffffff;
   box-shadow: inset 0 1px 2px rgba(0, 0, 0, 0.5), 0 1px 1px #ffffff;
   margin:7px 0;
}
form select {
   padding: 6px 6px;
   -webkit-appearance: none;
}
form .input:focus,
form select:focus,
form input[type="text"]:focus, form input[type="password"]:focus, form input[type="email"]:focus, form textarea:focus {
   background:#fff;
   text-shadow:none;
}
@media screen and (-webkit-min-device-pixel-ratio:0) {
   form select {
      background: url(../img/global/p-down-select.png) no-repeat right center;
      padding-right:20px;
   }
   form select:focus{
      background:#fff url(../img/global/p-down-select.png) no-repeat right center;
   }
   form select[multiple], form select[multiple]:focus{
      background-image:none;
   }
   form input[type=radio],
   form input[type=checkbox]{
      -webkit-appearance: none;
      width: 13px;
      height: 13px;
      background: #fff;
      border: 1px solid #bfbfbf;
      position:relative;
      vertical-align:text-bottom;
   }
   form input[type=radio]:hover,
   form input[type=checkbox]:hover {
      border-color:#a3ca61;
      background: #c9fb75;
   }
   form input[type=radio]:focus,
   form input[type=checkbox]:focus{
      border-color:#a3ca61;
      background: #c9fb75;
   }
   form input[type=checkbox]:checked:after {
      content: url(../img/ic/ic12-checkmark.png);
      display: block;
      position: absolute;
      top: -6px;
      left: -5px;
   }
   form input[type=radio] {
      -webkit-border-radius: 1em;
      -moz-border-radius: 1em;
      border-radius: 1em;
      width: 15px;
      height: 15px;
      margin-bottom:0;
   }
   form input[type=radio]:checked:after {
      content: '';
      display: block;
      position: relative;
      top: 3px;
      left: 3px;
      width: 7px;
      height: 7px;
      background: #666;
      -webkit-border-radius: 1em;
      -moz-border-radius: 1em;
      border-radius: 1em;
   }
}
form .button,
form button, form input[type="button"], form input[type="submit"]{
   background: #dadada;
   background: -webkit-gradient(linear, left top, left bottom, from(#fefefe), to(#dadada));
   background: -moz-linear-gradient(#fefefe, #dadada);
   border:#bfbfbf solid 1px;
   color:#666;
   text-shadow:1px 1px 1px #fff;
   width:auto;
   padding:3px 15px;
   cursor:pointer;
   font-weight:bold;
   font-size:14px;
   line-height:15px;
   margin:7px 0;
}
form .button:focus, form .button:hover,
form button:focus, form input[type="button"]:focus, form input[type="submit"]:focus,
form button:hover, form input[type="button"]:hover, form input[type="submit"]:hover{
   border:#a3ca61 solid 1px;
   background: #c9fb75;
   background: -webkit-gradient(linear, left top, left bottom, from(#effcd8), to(#c8fa72));
   background: -moz-linear-gradient(#effcd8, #c8fa72);
   color:#2c6c67;
}
form .button[disabled],
form button[disabled], form input[type="button"][disabled], form input[type="submit"][disabled]{
   background: #dadada;
   background: -webkit-gradient(linear, left top, left bottom, from(#fefefe), to(#dadada));
   background: -moz-linear-gradient(#eee, #ddd);
   border:#ccc solid 1px;
   color:#bbb;
   cursor:default;
}
form .button{
   min-height:18px;
   padding-top:4px;
   display:inline-block;
   text-align:center;
   text-decoration:none !important;
}
/* specific form */
.login-wrap form{
   background-color:#f3f3f3;
}
/* label */
form label{
   color:#007c72;
   display:inline-block;
}
form .tbl-form label{
   margin:7px 7px 7px 0;
}
form label[for]{
   cursor:pointer;
}
form label.req{
   padding-right:17px;
   background:url(../img/ic/astrx.png) no-repeat right center;
}
form label[alt]:after{
   content:" ("attr(alt)")";
   color:#ff8400;
   font-size:85%;
   font-style:italic;
}
.head-global form {
   background:none;
}
/* input file */
form input[type=file].hideit{
   visibility:hidden;
   position:absolute;
   width:1px;
   height:1px;
   overflow:hidden;
}
form .input-file-mask span{
   display:inline-block;
   white-space:nowrap;
   overflow:hidden;
   width:160px;
   vertical-align:text-bottom;
}
form .input-file-mask .button{
   font-size:12px;
   display:inline-block;
   min-width:0;
   min-height:12px;
   margin:0 7px 0 0;
   padding:3px 10px;
}
/* captcha */
form .captcha{
   position:relative;
}
form .captcha .ic{
   position:absolute;
   top:5px;
   right:5px;
}
/* field iconed */
form input[type=email][disabled],
form input[type=text][disabled],
form input[type=password][disabled],
.ic-field[type=email], .ic-field[type=text], .ic-field[type=password], textarea.ic-field{
   background-repeat:no-repeat !important;
   background-position:98% center !important;
   padding-right:20px !important;
   width:230px !important;
}
textarea.ic-field{
   background-position:98% 6px !important;
}
.ic-field.ic-del{
   background-color:#FFFBCC !important;
}
/* disabled */
form input[type=email][disabled],
form input[type=text][disabled],
form input[type=password][disabled]{
   background:#e5e5e5;
   color:#888;
   background-image:url(../img/ic/ic16-lock-d.png);
}
/* button */
.nav-cont{
   background:#f3f3f3;
   padding:7px;
   margin:10px 0;
}
.nav >*{
   font-size:12px;
   color:#007c72;
   float:left;
   margin-right:3px;
   padding:0 5px 1px;
   white-space:nowrap !important;
}
.nav >*:last-child{
   margin-right:0;
}
.nav >span{
   height:18px;
   vertical-align:bottom;
   padding-top:2px;
}
.nav >a{
   background: #dadada;
   background: -webkit-gradient(linear, left top, left bottom, from(#fefefe), to(#dadada));
   background: -moz-linear-gradient(#fefefe, #dadada);
   border:#bfbfbf solid 1px;
   border-radius: 3px;
   -webkit-border-radius: 3px;
   -moz-border-radius: 3px;
   cursor:pointer;
   position:relative;
}
.nav >a:hover{
   border-color:#a3ca61;
   background: #c9fb75;
   background: -webkit-gradient(linear, left top, left bottom, from(#effcd8), to(#c9fb75));
   background: -moz-linear-gradient(#effcd8, #c9fb75);
   color:#2c6c67;
}
.nav >a:before{
   content: url(../img/skin/blank.png);
   display:inline-block;
   float:right;
   width:16px;
   height:16px;
   opacity:0.5;
}
.nav >a.on{
   background: #fefefe;
   background: -webkit-gradient(linear, left top, left bottom, from(#dadada), to(#fefefe));
   background: -moz-linear-gradient(#dadada, #fefefe);
}
.nav >a.on:before,
.nav >a:hover:before{
   opacity:1;
}
.nav >a.select >span,
.nav >a.paging >span{
   display:inline-block;
   padding:3px 2px 0 7px;
   height:12px;
}
/* button icon */
.nav >a.select:before,
.nav >a.paging:before{
   background:url(../img/global/p-down.png) no-repeat center center;
}
.nav >a.prev:before{
   background:url(../img/global/p-left.png) no-repeat center center;
}
.nav >a.next:before{
   background:url(../img/global/p-right.png) no-repeat center center;
}
.nav >a.thumb:before{
   background:url(../img/ic/ic16-view-thumb.png) no-repeat center center;
}
.nav >a.list:before{
   background:url(../img/ic/ic16-view-list.png) no-repeat center center;
}
.nav >a.tbl:before{
   background:url(../img/ic/ic16-view-tbl.png) no-repeat center center;
}
.nav >a.mapview:before{
   background:url(../img/ic/ic12-loc-d.png) no-repeat center center;
}
.nav >a.date16:before{
   background:url(../img/ic/ic16-date.png) no-repeat center center;
}
.nav >a.time16:before{
   background:url(../img/ic/ic16-clock.png) no-repeat center center;
}
/* button group */
.nav-group .nav >a{
   margin-right:0;
   border-radius:0;
   -webkit-border-radius:0;
   -moz-border-radius:0;
   border-right:none;
}
.nav-group .nav >a:first-child{
   border-bottom-left-radius:3px; border-top-left-radius:3px;
   -moz-border-radius-bottomleft:3px; -moz-border-radius-topleft:3px;
   -webkit-border-radius-bottomleft:3px; -webkit-border-radius-topleft:3px;
   -khtml-border-radius-bottomleft:3px; -khtml-border-radius-topleft:3px;
}
.nav-group .nav >a:last-child{
   border-bottom-right-radius:3px; border-top-right-radius:3px;
   -moz-border-radius-bottomright:3px; -moz-border-radius-topright:3px;
   -webkit-border-radius-bottomright:3px; -webkit-border-radius-topright:3px;
   -khtml-border-radius-bottomright:3px; -khtml-border-radius-topright:3px;
   border-right:#bfbfbf solid 1px;
}
/* paging */
.nav-no li{
   padding:2px 5px;
   margin-right:3px;
}
.nav-no li{
   float:left;
   border:#d0dcbb solid 1px;
   cursor:pointer;
   font-size:12px;
}
.nav-no li:hover{
   background-color:#e0e0e0;
}
.nav-no li.on{
   background-color:#9aa48a;
   color:#fff;
   border-color:#9aa48a;
}
.tips-modal .nav-no{
   display:table-row;
}
.tips-modal .nav-no li{
   float:none;
   display:table-cell;
   text-align:right;
   margin:0 3px 3px 0;
   background-color:#f3f3f3;
   border-color:#FFF;
   padding:5px;
}
.tips-modal .nav-no li:hover{
   background-color:#e0e0e0;
}
.tips-modal .nav-no li.on{
   background-color:#9aa48a;
}
/* button on off */
.nav-group .nav.on-off >a{
   text-shadow:-1px -1px #999;
   text-align:center;
   font-weight:bold;
   color:#ddd;
   height:15px;
   width:40px;
   padding-top:5px;
   background: #999;
   background: -webkit-gradient(linear, left top, left bottom, from(#999), to(#ddd));
   background: -moz-linear-gradient(#999, #ddd);
}
.nav-group .nav.on-off >a:before{
   display:none;
}
.nav-group .nav.on-off.off >a:last-child,
.nav-group .nav.on-off.on >a:first-child{
   color:#900;
   text-shadow:1px 1px #fff;
   background: #dadada;
   background: -webkit-gradient(linear, left top, left bottom, from(#fefefe), to(#dadada));
   background: -moz-linear-gradient(#fefefe, #dadada);
}
.nav-group .nav.on-off.on >a:first-child{
   color:#090;
}
/* tool tips v2 */
.tips-modal,
.tips-msg {
   display:none;
   position:absolute;
   z-index:1005;
   min-width:15px;
   border:1px solid #FDD845;
   border-radius:5px; -moz-border-radius:5px; -webkit-border-radius:5px; -khtml-border-radius:5px;
   box-shadow:1px 1px 3px rgba(0,0,0,0.3); -moz-box-shadow:1px 1px 3px rgba(0,0,0,0.3); -webkit-box-shadow:1px 1px 3px rgba(0,0,0,0.3);
}
.tips-msg{
   max-width:250px;
   background:#fff6bf;
   font-family:"Trebuchet MS", Arial, Helvetica, sans-serif;
   font-style:italic;
   color:#666;
   line-height:1.3em;
   font-size:11px;
   padding:4px 7px;
}
/* tool modal */
.tips-modal{
   z-index:1004;
   background:#fff;
   border-color:#bfbfbf;
   padding:7px 10px;
}
.tips-modal > .point,
.tips-msg > .point {
   position:absolute;
   top:-9px;
   width:15px;
   height:9px;
   background:url(../img/sampah/help_p.png) no-repeat center bottom;
}
.tips-modal > .point{
   background-image:url(../img/skin/menu-point.png);
}
/* tool modal content */
.tips-msg > .msg p{
   margin-bottom:7px;
}
.tips-modal > *:last-child,
.tips-msg > .msg p:last-child{
   margin-bottom:0 !important;
}
/* tool modal @ global header */
.head-global .tips-modal {
   top:33px;
   background:#ededee;
   border-top:none !important; border-top-left-radius:0 !important; border-top-right-radius:0 !important; -moz-border-radius-topleft:0 !important; -moz-border-radius-topright:0 !important; -webkit-border-radius-topleft:0 !important; -webkit-border-radius-topright:0 !important;
   -moz-box-shadow:1px 2px 2px rgba(0, 0, 0, 0.1), inset 1px 0 #f8f8f8;
   -webkit-box-shadow:1px 2px 2px rgba(0, 0, 0, 0.1), inset 1px 0 #f8f8f8;
   box-shadow:1px 2px 2px rgba(0, 0, 0, 0.1), inset 1px 0 #f8f8f8;
}
.head-global .fr .tips-modal {
   right:-1px;
}
.head-global .tips-modal.searchbox {
   padding:0;
}
/* berita sekolah */
.news h3{
   font-size:13px !important;
   font-weight:normal;
   margin:0;
}
.news li{
   border-bottom:1px dotted #CBCBC6;
   padding:7px 10px 7px 43px;
   background:url(../img/ic/ic24-news.png) no-repeat 7px 4px;
}
.news li:last-child{
   border:none;
}
.news li >em{
   font-size:11px;
}
/* list more */
a.list-more{
   border-top:1px dotted #CBCBC6;
   display:block;
   padding:3px 7px 5px;
   text-align:center;
   background-color:#f3f3f3;
   font-size:11px;
   border-bottom-left-radius:6px; border-bottom-right-radius:6px;
   -moz-border-radius-bottomleft:6px; -moz-border-radius-bottomright:6px;
   -webkit-border-radius-bottomleft:6px; -webkit-border-radius-bottomright:6px;
   -khtml-border-radius-bottomleft:6px; -khtml-border-radius-bottomright:6px;
}
a.list-more:hover{
   background-color:#e9e9e9;
}
a.list-more:after{
   content:url(../img/global/p-down.png);
   display:inline-block;
   vertical-align:text-bottom;
   margin-left:3px;
   opacity:0.5;
}
a.list-more:hover:after{
   opacity:1;
}
/* object navigation */
.obj-nav{
   padding-left:10px;
   position:relative;
   padding-bottom:15px;
   margin-bottom:15px;
}
.obj-nav >dd{
   background:#f3f3f3 url(../img/global/p-left.png) no-repeat right 5px;
   position:absolute;
   top:0;
   right:100%;
   width:15px;
   height:100%;
   cursor:pointer;
}
.obj-nav:hover >dd{
   background-color:#e5e5e5;
}
/* member list */
.user-list >a{
   float:left;
   margin:0 3px 3px 0;
   height:30px;
   width:30px;
}
.user-list >a>img{
   width:100%;
   height:100%;
}
/* iklan berita */
.adv h4{
   margin-bottom:7px;
   color:#989898;
}
.adv li{
   border-top:#cbcbc6 dotted 1px;
   padding:5px 2px;
   margin-bottom:1px;
   font-size:11px;
   color:#838383;
   word-wrap:break-word;
}
.adv p{
   margin-bottom:2px !important;
}
.adv .more{
   padding-right:17px;
   background:url(../img/global/p-right.png) no-repeat right center;
   font-size:11px;
}
/* keterangan */
.desc{
   color:#8D8F8F;
}
/* iklan workmain */
.work-main .freearea:before,
.work-main .freearea:after,
.work-main .freearea{
   background: #f3f3f3;
   background: -webkit-gradient(linear, left top, left bottom, from(#fff), to(#f3f3f3));
   background: -moz-linear-gradient(#fff, #f3f3f3);
   border-bottom:#ddd solid 1px;
}
.work-main .freearea{
   padding:10px 0;
   position:relative;
}
.work-main .freearea:before,
.work-main .freearea:after{
   content:url(../img/skin/blank.png);
   position:absolute;
   top:0;
   width:20px;
   height:100%;
}
.work-main .freearea:before{
   left:-20px;
}
.work-main .freearea:after{
   right:-20px;
}

/*----------- css siap v.1.75 ------------------------------------------------------------------------------*/
/* app text */
.workspc h1{
   font-size:18px;
   margin-bottom:7px;
}
.workspc h2{
   font-size:16px;
   margin-bottom:7px;
}
.workspc h3{
   font-size:14px;
   margin-bottom:7px;
}
.workspc h4{
   font-size:12px;
   margin-bottom:7px;
}
.workspc h5 {
   font-size:10px;
   margin-bottom:7px;
}
.workspc p {
   margin-bottom:7px;
}

/* application menu 2 */
.app-menu2{
   border-bottom:#cbcbc6 solid 1px;
   margin-bottom:7px;
}
.app-menu2 > ul{
   padding-bottom:8px;
   list-style:none !important;
}
.app-menu2 > ul > li > ul{
   visibility:hidden;
   margin-bottom:10px;
}
.app-menu2 > ul:after{ content: "."; display: block; height: 0; overflow:hidden; clear: both; visibility: hidden; }
.app-menu2 > ul > li{
   display:inline-block;
   border-right:#dadada solid 1px;
   font-size:14px;
   margin:0 !important;
   vertical-align:bottom;
   position:relative;
}
.app-menu2 li.label,
.app-menu2 li:last-child{
   border:none;
}
.app-menu2 > ul > li > a{
   margin:0 10px;
}
.app-menu2 li em{
   font-size:11px;
}
.app-menu2 > ul > li.on > a{
   font-weight:bold;
   position:relative;
}
.app-menu2 > ul > li.on .point{
   background:url(../img/skin/menu-point.png) no-repeat center bottom;
   position:absolute;
   width:100%;
   height:8px;
   bottom:-9px;
   z-index:1;
}
.app-menu2 > ul > li.on > .point{
   left:0;
}
.app-menu2.fr{
   float:none !important;
   position:relative;
   min-height:26px;
}
.app-menu2.fr > ul{
   position:absolute;
   bottom:0;
   right:0;
}
.app-menu2.fr.resized{
   padding-bottom:26px;
}
.app-menu2.fr h1,
.app-menu2.fr h2,
.app-menu2.fr h3,
.app-menu2.fr h4{
   margin:0 0 7px;
   color:#bbb;
}
/* app-menu2 @ header */
.app-head-menu.app-menu2{
   position:relative;
   margin-bottom:0;
   border:none;
}
.app-head-menu.app-menu2 >ul{
   position:absolute;
   bottom:1px;
   padding-bottom:10px;
   left:10px;
}
.app-head-menu.app-menu2 >ul >li.on > .point{
   background-image:url(../img/skin/menu-point.png);
   bottom:-11px;
}
.app-head-menu.app-menu2 .menu li{
   white-space:nowrap;
}
.app-head-menu.app-menu2 .more{
   background:url(../img/global/p-down.png) no-repeat right center;
   padding-right:15px;
   font-size:11px;
}
.app-head-menu.app-menu2 >ul >li:first-child a{
   width:135px !important;
}
.app-head-menu.app-menu2 em{
   font-size:12px;
}
/* namecard */
.card{
   padding:0;
   background:#fff no-repeat center center;
   width:300px;
   min-height:50px;
   margin-bottom:10px;
}
.card .profil{
   position:relative;
   padding:10px;
   background-color:#FFF;
   min-height:80px;
}
.card .profil .msg{
   margin:0 0 0 90px;
}
.card .profil > img{
   position:absolute;
   left:10px;
   width:80px;
   height:80px;
}
.card .msg h4{
   margin:7px 0;
}
.card p{
   margin-bottom:7px;
   color:#666;
   font-size:11px;
}
.card .more{
   background:url(../img/global/p-down.png) no-repeat center 50%;
   width:16px;
   height:16px;
}
.card .more:hover{
   background-color:#CCC;
}
.card .stats{
   padding:5px 0;
   border-top:1px dotted #CBCBC6;
}
.card .stats >*{
   display:inline-block;
}
.card .ics.lbl{
   font-size:11px !important;
   color:#999;
}
.relation .stats{
   padding:5px 10px;
   text-align:right;
   background-color:#EAEAEC;
}
.relation .stats p{
   margin:0 7px 0;
   line-height:1;
}
.relation .stats .more{
   width:20px;
   height:20px;
}
/*--- sampah - overide css siap 1.0 --*/
html {
   overflow:auto !important;
   height:auto !important;;
}
#skn-content{overflow:inherit !important; height:auto !important;}
#skn-content .hr{ margin:0 !important; border:none; padding-bottom:0;}
.skn-panel .butt .ic{width:100%;}