@charset "utf-8";
a img,
hr,
img {
    border: 0;
}
.kasbutton,
.kasdown img,
.navtitle,
.pointer,
.tanya_hapus {
    cursor: pointer;
}
header,
sub,
sup {
    position: relative;
}
.public_menu a:hover,
a,
a.button:hover,
ins {
    text-decoration: none;
}
.headwrap,
.wizard,
article {
    min-width: 300px;
}
.judulkas,
.navusername {
    text-transform: capitalize;
}
.desckas,
.judulkas {
    text-shadow: 1px 1px 1px #fff;
}
table,
table.dataTable {
    border-collapse: separate;
    border-spacing: 0;
}
.dataTables_wrapper:after,
blockquote:after,
blockquote:before,
q:after,
q:before {
    content: "";
}
#dkripkas,
.desckas,
.option_bookdesc,
.option_booktitle {
    text-overflow: ellipsis;
}
#dkripkas,
.nowrap,
.option_bookdesc,
.option_booktitle,
.sukseskas,
table.dataTable tbody td.dt-body-nowrap,
table.dataTable tbody th.dt-body-nowrap,
table.dataTable td.dt-nowrap,
table.dataTable tfoot td.dt-head-nowrap,
table.dataTable tfoot th.dt-head-nowrap,
table.dataTable th.dt-nowrap,
table.dataTable thead td.dt-head-nowrap,
table.dataTable thead th.dt-head-nowrap,
table.dataTable.nowrap td,
table.dataTable.nowrap th {
    white-space: nowrap;
}
a,
abbr,
acronym,
address,
applet,
big,
blockquote,
body,
caption,
cite,
code,
dd,
del,
dfn,
div,
dl,
dt,
em,
fieldset,
font,
form,
h1,
h2,
h3,
h4,
h5,
h6,
html,
iframe,
ins,
kbd,
label,
legend,
li,
object,
ol,
p,
pre,
q,
s,
samp,
small,
span,
strike,
strong,
sub,
sup,
table,
tbody,
td,
tfoot,
th,
thead,
tr,
tt,
ul,
var {
    border: 0;
    font-family: inherit;
    font-size: 100%;
    font-style: inherit;
    font-weight: inherit;
    margin: 0;
    outline: 0;
    padding: 0;
    vertical-align: baseline;
}
body,
input,
select,
textarea {
    font-family: "Open Sans", sans-serif;
}
.childrole,
.ktpdesc,
.notifpepeku,
.resetkas,
em {
    font-style: italic;
}
:focus {
    outline: 0;
}
body {
    background: #fff;
    line-height: 1;
    font-size: 14px;
    color: #3d4850;
    font-weight: 400;
}
ol,
ul {
    list-style: none;
}
caption,
td,
th {
    font-weight: 400;
    text-align: left;
}
blockquote,
q {
    quotes: "" "";
}
a {
    color: #5e5e5e;
}
article,
aside,
details,
figcaption,
figure,
footer,
header,
hgroup,
menu,
nav,
section {
    display: block;
}
audio,
canvas,
video {
    display: inline-block;
}
.hidden,
.none,
.notif,
audio:not([controls]) {
    display: none;
}
del {
    color: #333;
}
ins {
    background: 0 0;
}
hr {
    background-color: #ccc;
    height: 1px;
    margin: 24px 24px 1.714285714rem;
}
sub,
sup {
    font-size: 75%;
    line-height: 0;
    vertical-align: baseline;
}
sup {
    top: -0.5em;
}
sub {
    bottom: -0.25em;
}
small {
    font-size: 10px;
    line-height: 14px;
    color: #888;
}
img {
    -ms-interpolation-mode: bicubic;
}
.clear {
    clear: both;
}
input,
select,
textarea {
    font-size: 14px;
    line-height: 18px;
}
#notearea,
#notearea:focus,
#notearea:hover,
.isinote {
    font-family: Delius, cursive;
}
input:not([type]),
input[type="number"],
input[type="password"],
input[type="text"],
select,
textarea {
    padding: 4px;
    border: 1px solid #9ea5aa;
    border-radius: 4px;
    background: #ececec;
    color: #5e5e5e;
}
input:not([type]),
input[type="number"]:hover,
input[type="password"]:hover,
input[type="text"]:hover,
select:hover,
textarea:hover {
    border: 1px solid #0a5d9f;
    background: #efefef;
}
input:not([type]),
input[type="number"]:focus,
input[type="password"]:focus,
input[type="text"]:focus,
select:focus,
textarea:focus {
    color: #3d4850;
    background: #fff;
    border: 1px solid #9ea5aa;
    box-shadow: 0 0 2px #868c91;
}
.button,
input:not([type]),
input[type="button"],
input[type="submit"] {
    background: #0a5d9f;
    border: none;
    cursor: pointer;
    border-radius: 6px;
    padding: 8px 16px;
    color: #feffff;
}
.button:hover,
input:not([type]),
input[type="button"]:hover,
input[type="submit"]:hover {
    background: #006abe;
}
.button:active,
input:not([type]),
input[type="button"]:active,
input[type="submit"]:active {
    position: relative;
    top: 1px;
}
input[readonly="readonly"],
input[type="text"]:disabled {
    background: #fff;
    border: 1px solid #ccc;
}
input[readonly="readonly"]:focus,
input[readonly="readonly"]:hover {
    background: #fff;
    border: 1px solid #ccc;
    box-shadow: none;
}
.notif {
    line-height: 18px;
    margin: 8px 0;
    text-align: center;
    color: #fff;
}
.notif div {
    border: 1px solid #fff;
    padding: 8px;
    border-radius: 4px;
}
.notifno {
    background: #9e0039;
}
.notifyes {
    background: #00a651;
}
.left {
    text-align: left;
}
.center {
    text-align: center;
}
.motto,
.right {
    text-align: right;
}
strong {
    font-weight: 700;
}
header {
    height: 48px;
    width: 100%;
    background: #e1e1e1;
    z-index: 15;
    border-bottom: 1px solid #c6c6c6;
}
.headwrap {
    margin: 0 18px;
}
.logo {
    float: left;
    margin: 7px 0 0;
    display: block;
}
.logo span {
    font-size: 24px;
    font-weight: bold;
    color: #2FA2EA;
    margin: 0px auto 0px 5px;
    vertical-align: super;
}
.motto {
    position: absolute;
    color: #54585b;
    font-weight: 300;
    font-size: 14px;
    width: 278px;
    right: 16px;
    top: 18px;
}
.userbox {
    float: right;
    width: 50%;
    position: relative;
}
.public_menu {
    position: absolute;
    width: 210px;
    background: #3d4850;
    top: 50px;
    left: 0;
    z-index: 20;
    display: none;
}
.public_menu a {
    color: #e1e1e1;
    display: block;
    padding: 12px 16px;
}
.public_menu a:hover {
    background: #0a5d9f;
    color: #e1e1e1;
}
article {
    width: 100%;
    margin: 0 auto;
    position: absolute;
    min-height: 100%;
}
article a {
    color: #000;
}
article a:hover {
    text-decoration: underline;
}
.bulannav a:hover,
.kasbutton:hover,
.kasdown a:hover,
.navblock a:hover,
.regnotifbutton,
.usernav a:hover {
    text-decoration: none;
}
.loginarea {
    padding: 48px 0 72px;
    margin: 58px 0 0;
    line-height: 18px;
    background: #fff;
}
.loginbox .inputlogin {
    display: block;
    margin: 8px auto;
    width: 100%;
    padding: 8px 0;
    text-align: center;
}
.loginarea h2 {
    color: #0a5d9f;
    font-size: 32px;
    line-height: 38px;
    text-align: center;
    font-weight: 300;
    margin-bottom: 28px;
}
.loginbox {
    width: 300px;
    margin: 0 auto;
    position: relative;
}
#logloader {
    position: absolute;
    right: 86px;
    top: 162px;
    display: none;
}
#mainlognotif a {
    color: #fc0;
}
.rememberbox {
    float: left;
    width: 184px;
    padding: 10px 0 0;
}
.rememberbox small {
    font-size: 9px;
    line-height: 12px;
    color: #9ea5aa;
    margin: 0 0 0 6px;
    padding-top: 4px;
    display: block;
}
.buttonlogin {
    display: block;
    float: right;
    margin: 4px 0 0;
}
.checkremember {
    margin: 0 0 0 6px;
}
.startnotif {
    text-align: center;
    padding: 16px 0;
    background: #fff;
    margin: 16px auto 72px;
    border-top: 1px solid #fff;
    border-bottom: 1px solid #fff;
    color: #3d4850;
}
.registerbox {
    width: 318px;
    margin: 0 auto;
    text-align: left;
    position: relative;
}
.registerbox .inputlogin {
    display: block;
    margin: 4px 0 16px 2px;
    width: 92.5%;
    padding: 8px;
    text-align: left;
}
.grecaptcha,
.setujubox {
    padding-bottom: 24px;
}
#selamatbox p,
.bookcreated {
    text-align: center;
}
.registerbox .buttonreg {
    margin: 0 0 0 2px;
}
.setujubox {
    font-size: 12px;
    line-height: 16px;
}
#regcaptcha {
    width: 318px;
    margin: 0 auto;
}
#mainregnotif {
    margin-top: 24px;
}
.regloader {
    position: absolute;
    right: 4px;
    bottom: 6px;
}
#passloader {
    position: absolute;
    left: 100px;
    top: 58px;
    display: none;
}
#selamatbox p {
    padding-bottom: 32px;
    line-height: 20px;
}
.notifpepeku {
    font-size: 12px;
}
#mainlognotif {
    padding: 16px 0 0;
}
#passnotif #passleft {
    margin-right: 112px;
}
#changepassbox {
    position: relative;
}
#changepassbox #newpassloader {
    position: absolute;
    right: 24px;
    top: 144px;
    display: none;
}
.inputchangepass {
    margin: 8px auto 16px;
    display: block;
}
.footlogin {
    padding: 72px 0 32px 240px;
}
.regnotifbutton {
    color: #0a5d9f;
    font-weight: 700;
}
.bulankas,
.judulkas,
.navusername,
.thebalance,
.topwizard h2 {
    font-weight: 300;
}
.wizard {
    margin: 0 auto;
    width: 96%;
}
.wizard strong {
    display: block;
    margin: 16px 0 0;
}
.wizard input {
    display: block;
    margin: 4px auto;
}
.topwizard {
    width: 320px;
    margin: 0 auto;
}
.topwizard img {
    overflow: hidden;
    float: left;
    margin-top: 15px;
}
.topwizard h2 {
    color: #0a5d9f;
    font-size: 32px;
    padding-top: 30px;
}
.setupbutton {
    display: inline-block !important;
    margin: 32px 16px 16px !important;
}
.ppquestion strong {
    display: inline;
}
#create_book_notif {
    width: 712px;
    margin: 0 auto;
}
.createbooknotifbox {
    margin: 0 auto;
    position: relative;
}
.create_book_loader {
    position: absolute;
    top: -67px;
    right: -28px;
}
.pepekuimporbutton,
.pepekuuserbutton {
    display: block;
    position: relative;
    margin: 0 auto;
    padding: 0;
}
.pepekuuserbutton {
    width: 280px;
}
.pepekuimporbutton {
    width: 290px;
}
.pepekuimporbutton input {
    margin: 32px 2px !important;
}
.loginpepeku_loader {
    position: absolute;
    right: -8px;
    top: 34px;
    display: none;
}
.pepekuimpor strong,
.sukseskas strong {
    display: inline;
}
#loginpepeku_notif {
    max-width: 600px;
    margin: 0 auto;
}
#loginpepeku_notif a {
    color: #f90;
}
#imporpepeku_notif .notifyes {
    background: #2e3b49 !important;
}
.loginpepeku_loader2 {
    padding-bottom: 16px;
}
.cashbookoke {
    background: #00a651;
    font-size: 14px;
    padding: 30px 0;
    color: #fff;
}
.cashbookoke h2 {
    color: #fff;
    margin-bottom: 0;
}
.bulankas,
.navblock a,
.navblock ul,
.navblock ul li {
    display: block;
}
.navleft {
    width: 240px;
    background: #60676f;
    position: absolute;
    left: 0;
    top: 0;
    z-index: 10;
    height: 100%;
    overflow: auto;
}
.navblock {
    color: #d1d1d1;
    font-size: 14px;
    line-height: 18px;
}
.navtitle {
    padding: 8px 0 8px 56px;
    color: #fff;
    font-size: 16px;
    line-height: 20px;
    background-color: #3e4751;
    background-repeat: no-repeat;
    background-position: 16px 8px;
}
.navblock ul li.plus a,
.navblock ul li.search a {
    font-size: 12px;
    line-height: 16px;
    padding: 4px 0 4px 32px;
}
.navtitle:hover {
    background-color: #2e353d;
}
#navtitle_user {
    background-image: url(gambar/icon_user.png);
}
#navtitle_bukukas {
    background-image: url(gambar/icon_kas.png);
}
#navtitle_asset {
    background-image: url(gambar/icon_utangpiutang.png);
}
#navtitle_laporan {
    background-image: url(gambar/icon_laporan.png);
}
#navtitle_peralatan {
    background-image: url(gambar/icon_peralatan.png);
}
#navtitle_pengaturan {
    background-image: url(gambar/icon_pengaturan.png);
}
#navtitle_premium {
    background-image: url(gambar/icon_premium.png);
}
#navtitle_network {
    background-image: url(gambar/icon_net.png);
}
#navtitle_referral {
    background-image: url(gambar/icon_referral.png);
}
.navblock ul li {
    background: url(gambar/dot.png) 16px 17px no-repeat #60676f;
    border-bottom: 1px solid #4e545c;
    color: #d1d1d1;
}
.navblock ul li.current_menu,
.navblock ul li.plus:hover,
.navblock ul li:hover {
    background-color: #0a5d9f;
}
.navblock ul li.plus {
    background: url(gambar/plus.png) 16px 9px no-repeat #60676f;
}
.navblock ul li.search,
.navblock ul li.search a:hover {
    background-image: url(gambar/cari_kecil.png);
    background-position: 16px 9px;
    background-repeat: no-repeat;
}
.navblock ul li.plus a {
    color: #c8ced4;
}
.navblock ul li.plus a:hover {
    color: #fff;
    text-decoration: none;
}
.navblock ul li.search a {
    color: #c8ced4;
}
.navblock ul li.search a:hover {
    color: #fff;
    background-color: #0a5d9f;
}
.navblock ul li.current_menu a {
    color: #fff;
}
.navblock ul li a {
    color: #c8ced4;
    font-size: 14px;
    line-height: 18px;
    display: block;
    padding: 12px 0 12px 32px;
}
.navblock a:hover {
    color: #fff;
}
#navitem_user {
    background: #353535;
    padding: 10px 10px 18px 16px;
}
.usernav a {
    background: #b1b5b8;
    color: #2c3e50;
    padding: 2px 8px;
    margin: 0 4px 0 0;
    border-radius: 4px;
    font-size: 11px;
    line-height: 15px;
}
.usernav a:hover {
    background: #dadada;
    color: #1c2630;
}
.navusername {
    padding: 0 10px 8px 4px;
    font-size: 14px;
    line-height: 18px;
}
.navblock a {
    color: #cfd6d9;
}
.blockright {
    padding: 8px 8px 8px 240px;
}
.bloktengah {
    margin: 0 auto;
    width: 90%;
    min-width: 640px;
    min-height: 500px;
}
.kastitle {
    float: left;
    width: 48%;
}
.kasicon {
    float: left;
    width: 64px;
    height: 64px;
    overflow: hidden;
    margin-top: 10px;
}
.kastitlekanan {
    float: left;
    width: 80%;
    color: #2e3b49;
}
.judulkas {
    color: #0a5d9f;
    font-size: 30px;
    line-height: 36px;
    padding: 8px 0 0;
}
.desckas {
    color: #3d4850;
    font-size: 14px;
    padding: 4px 0 0;
    line-height: 18px;
}
.kassaldo {
    float: right;
    width: 40%;
    text-align: right;
    font-size: 14px;
    line-height: 24px;
    color: #3e4751;
}
.thebalance {
    color: #0a5d9f;
    font-size: 30px;
    padding-bottom: 8px;
    padding-top: 4px;
}
.kasbody {
    padding: 28px 0 0;
}
.kastop {
    padding: 16px 4px 8px;
}
.bukutop,
.hapiuttop {
    height: 50px;
    position: relative;
    margin: 20px 3px 10px;
}
.searchbukutop {
    border-radius: 8px 8px 0 0;
    background: #939393;
    text-align: right;
    padding: 16px 14px 0 0;
}
.searchbukutop select {
    padding: 7px;
}
.searchbukutop #find_search {
    padding: 9px 6px;
}
.kastool {
    height: 52px;
    float: right;
    width: 542px;
    margin-right: -4px;
}
.moonleft {
    height: 52px;
    float: left;
    width: 200px;
    position: relative;
}
.kasrightborder {
    float: right;
    width: 14px;
    height: 52px;
}
.kasdown {
    position: absolute;
    top: -50px;
    right: 1px;
    width: auto;
}
.utangdown {
    top: -66px;
}
.utangdetildown {
    top: -56px;
}
.kasdown img {
    opacity: 0.4;
}
.kasdown img:hover {
    opacity: 1;
}
.bulankas {
    font-size: 18px;
    line-height: 20px;
    color: #3e4751;
}
.bulannav {
    width: 250px;
    height: 32px;
    text-align: center;
    float: left;
    margin: 10px 0 0;
}
.bulannav a {
    display: inline-block;
    width: 20px;
    height: 20px;
}
.bulannav .bulan_nav_left {
    background: url(gambar/icon_month-back.png) center top no-repeat;
    float: left;
}
.bulannav .bulan_nav_left:hover {
    background: url(gambar/icon_month-back.png) center bottom no-repeat;
    float: left;
}
.bulannav .bulan_nav_right {
    background: url(gambar/icon_month-next.png) center top no-repeat;
    float: right;
}
.bulannav .bulan_nav_right:hover {
    background: url(gambar/icon_month-next.png) center bottom no-repeat;
    float: right;
}
.kasbutton {
    float: right;
    display: block;
    background: #cc0;
    border-radius: 4px;
    padding: 8px 16px 8px 42px;
    font-size: 13px;
    line-height: 18px;
    color: #fff;
    margin: 8px 5px 0 8px;
}
.bukubeli,
.bukutengah {
    margin: 0 4px;
    padding: 16px 1px;
    position: relative;
}
.kastool #pengeluaran {
    background: url(gambar/button_pengeluaran.png) 10px 4px no-repeat #6f3d4f;
}
.kastool #pemasukan {
    background: url(gambar/button_pemasukan.png) 10px 4px no-repeat #436e58;
}
.kastool #transfer {
    background: url(gambar/button_transfer.png) 10px 4px no-repeat #3d5b74;
}
.kastool #pengeluaran:hover {
    background: url(gambar/button_pengeluaran.png) 10px 4px no-repeat #9e0039;
}
.kastool #pemasukan:hover {
    background: url(gambar/button_pemasukan.png) 10px 4px no-repeat #00a651;
}
.kastool #transfer:hover {
    background: url(gambar/button_transfer.png) 10px 4px no-repeat #0a5d9f;
}
.bukutengah {
    background: #e1e1e1;
    border-radius: 8px 8px 0 0;
}
.bukubeli {
    background: #fff;
    border-radius: 4px;
    border: 1px solid #aaa;
}
.catat,
.tabbg {
    position: absolute;
}
.tabbg {
    width: 101%;
    background: #3e4751;
    height: 37px;
    top: 57px;
    left: -0.5%;
}
.listmasuk {
    background: #e0ffe3;
}
.listkeluar {
    background: #ffeaea;
}
.listtrans {
    background: #d6eff9;
}
.listmasuk td.tabtype {
    background-color: #e0ffe3 !important;
}
.listkeluar td.tabtype {
    background-color: #ffeaea !important;
}
.listtrans td.tabtype {
    background-color: #d6eff9 !important;
}
.catatleft {
    float: left;
    width: 110px;
}
.catatright {
    float: right;
    width: auto;
    width: 349px;
}
.catatitem {
    height: 36px;
    border-bottom: 1px dotted #797979;
    color: #272727;
}
.catatitem select {
    padding: 2px 4px;
    max-width: 95%;
}
.catatleft .catatitem {
    padding: 13px 0 0 8px;
    height: 27px;
}
.catatright .catatitem {
    height: 34px;
    padding: 6px 0 0 8px;
}
#checkdueleft {
    height: 50px;
}
#checkdueright {
    height: 57px;
}
#duedatecheck {
    margin-top: 10px;
}
.catat {
    width: 460px;
    border: 2px solid #fff;
    border-radius: 4px;
    padding: 16px 16px 20px;
    margin: 0 4px 16px 0;
    right: 0;
    top: 0;
    z-index: 50;
    box-shadow: 0 0 2px #777;
    display: none;
}
.catat_pengeluaran {
    background: #ffdfdf;
}
.catat_pemasukan {
    background: #daf5db;
}
.catattipe {
    color: #fff;
    margin-bottom: 8px;
}
.catat_pengeluaran .catattipe {
    background: #6f3d4f;
}
.catat_pemasukan .catattipe {
    background: #436e58;
}
.catatbutton {
    text-align: right;
    padding: 10px 6px 0 0;
    position: relative;
}
#btl_voucher,
#cateditcancel,
#child_cancel,
#cust_cancel,
#hp_batal,
#trans_batal,
#trans_trans_batal,
.option_back,
.trans_hapus {
    background: #6e7b89 !important;
    border: 1px solid #6e7b89 !important;
}
#btl_voucher:hover,
#cateditcancel:hover,
#child_cancel:hover,
#cust_cancel:hover,
#hp_batal:hover,
#trans_batal:hover,
#trans_trans_batal:hover,
.option_back:hover,
.trans_hapus:hover {
    background: #1c2630 !important;
}
.catatleft #itemdesc {
    height: 59px;
}
.catatright #itemdesc {
    height: 66px;
}
#itemdesc textarea {
    width: 325px;
    height: 48px;
    font-size: 12px;
    line-height: 16px;
}
.catat_loader {
    position: absolute;
    right: 200px;
    top: 14px;
    display: none;
}
.capital,
.capitalize,
.kapital {
    text-transform: capitalize !important;
}
.glow:hover {
    border-radius: 2px;
    box-shadow: 0 0 4px #575757;
    background: #fff;
}
.noticefirst,
.option_bookbox:hover {
    box-shadow: 0 0 4px #999;
}
.trans_hapus {
    float: left;
    display: none;
}
.tanya_hapus {
    padding: 4px 16px;
    background: #930;
    border-radius: 4px;
    display: inline-block;
    margin: 8px 0 0;
}
.tanya_hapus:hover {
    background: #440400;
}
#catat_trans_transfer {
    background: #e9f9ff;
}
.catattipe {
    background: #3d5b74;
}
.catattipefix {
    padding: 13px 0 0 8px !important;
    height: 27px !important;
}
.blockred {
    background: #ffdfdf;
    position: relative;
}
.blockgreen {
    background: #daf5db;
    position: relative;
}
.transfersimbol {
    position: absolute;
    display: block;
    width: auto;
    height: auto;
    right: 8px;
    top: 8px;
}
.catatarea,
.katbox,
.katnamebox,
.option_bookbox,
.ordbox {
    position: relative;
}
.transfernoactive {
    background-color: #bababa !important;
    cursor: default;
}
.smallsaldo {
    font-size: 11px;
    color: #3e4751;
}
.sharebox {
    background: #e1e1e1;
    margin: 24px 4px 0;
    border-radius: 4px;
}
.preshare {
    float: left;
    padding: 14px 16px;
    background: #7d7d7d;
    color: #d4d4d4;
    font-size: 16px;
    line-height: 20px;
    border-radius: 4px 0 0 4px;
    margin-right: 12px;
}
.addthis_sharing_toolbox {
    padding: 8px 8px 4px;
    clear: none !important;
}
.bukutengah .tabdesc {
    font-size: 12px;
    line-height: 16px;
}
.noticefirst {
    text-align: center;
    background: #3e4751;
    padding: 8px;
    color: #fff;
    font-size: 13px;
    line-height: 18px;
    border-radius: 4px;
    margin: 10px 3px;
    border: 1px solid #fff;
    display: none;
}
.mainicon {
    float: left;
    height: 52px;
    overflow: hidden;
    width: 52px;
    margin: 10px 20px 0 0;
}
.option_bookbox {
    float: left;
    background: #fff;
    width: 248px;
    height: 162px;
    border-radius: 8px;
    padding: 16px;
    margin: 0 16px 16px 0;
    border: 1px solid #e1e1e1;
}
.option_bookicon {
    float: left;
    height: 120px;
    width: 64px;
}
.option_booktext {
    float: left;
    width: 176px;
}
.option_booktitle {
    font-size: 16px;
    font-weight: 300;
    line-height: 22px;
    overflow: hidden;
}
.option_bookdesc {
    font-size: 10px;
    line-height: 14px;
    overflow: hidden;
}
.option_booktop {
    padding-bottom: 8px;
    border-bottom: 1px solid #999;
}
.option_bookdown {
    font-size: 11px;
    line-height: 16px;
    padding: 8px 0 0;
}
.new_book img {
    display: block;
    margin: 32px auto 0;
}
.new_book {
    border: 2px solid #c2c2c2;
    background: #f4f4f4;
}
.h3katbox,
.kas_detil h2 {
    border-bottom: 1px dotted #999;
    font-weight: 700;
}
.kas_detil h2 {
    color: #274a70;
    font-size: 20px;
    line-height: 28px;
    margin-bottom: 16px;
    padding-bottom: 8px;
    text-shadow: 1px 1px 1px #fff;
}
.h3katbox {
    font-size: 18px;
    line-height: 24px;
    padding: 0 0 4px;
    margin: 0 0 12px;
}
.katedit,
.tabbay,
.totbay {
    padding: 0 16px 0 0;
}
.katbox {
    width: 48%;
    float: left;
    margin: 0 16px 0 0;
}
.ordbox {
    margin: 0;
}
.katedit {
    float: right;
    width: 52px;
    text-align: right;
}
.tabbay,
table.dataTable td.dt-left,
table.dataTable th.dt-left {
    text-align: left;
}
.tabbay {
    float: left;
}
.katbutton,
.totbay {
    text-align: right;
    float: right;
}
.katnamebox {
    margin: 0 0 8px;
    padding: 0 0 4px;
    border-bottom: 1px dotted #ccc;
}
.katname {
    margin: 4px 0 0;
    display: inline-block;
}
.katbutton {
    width: 100px;
    margin-top: -10px;
}
.newcat {
    margin-top: 32px;
    border: 1px solid #c9c9c9;
    padding: 8px;
    border-radius: 4px;
}
.newkatname {
    padding-bottom: 6px;
}
.option_back {
    float: right;
    display: block;
    width: 102px;
    margin: -8px 0 0;
}
.katdel,
.katdel_loader,
.katnamedit,
.loader_newkat {
    display: none;
}
.loader_newkat {
    position: absolute;
    right: 110px;
    top: 28px;
}
.cateditbutton {
    padding: 3px 8px 4px !important;
    border-radius: 4px !important;
}
.renamekat_loader {
    position: absolute;
    right: 8px;
    top: -2px;
    display: none;
}
.katdel {
    background: #900;
    color: #fff;
    line-height: 16px;
    padding: 16px;
    border-radius: 4px;
    border: 1px solid #fff;
    box-shadow: 0 0 4px #333;
    position: relative;
}
.katdel_loader {
    position: absolute;
    left: 250px;
    bottom: 20px;
}
.nocat {
    line-height: 20px;
    text-align: center;
}
a.kat_prem_button {
    margin: 8px 0;
    display: inline-block;
    color: #fff !important;
}
.taboption {
    width: 96%;
}
.taboption td {
    padding: 8px 16px;
    border-bottom: 1px dotted #999;
}
.noborder td {
    border: none;
}
.kas-submit {
    position: relative;
}
#kas_loader {
    position: absolute;
    left: 100px;
    top: 4px;
    display: none;
}
.optionwrap {
    padding: 24px 24px 32px;
    position: relative;
    border-radius: 4px;
    border: 1px solid #aaa;
    font-size: 14px;
    line-height: 18px;
    background: #fff;
}
.optionbookbuttonarea {
    position: absolute;
    width: 100%;
    bottom: 4px;
    left: 0;
}
.bookbuttonedit {
    display: block;
    float: right;
    padding: 4px 8px !important;
    margin: 0 4px 0 0;
}
.deficon {
    margin: 0 4px 0 8px;
}
.kasikonoption {
    border-radius: 14px;
    border: 1px solid #fff;
    background: #fff;
}
.kasikonoption:hover {
    box-shadow: 0 0 2px #1e1e1e;
}
.bukasloader {
    position: absolute;
    left: 84px;
    bottom: 2px;
    display: none;
}
.notifkasoption {
    position: absolute;
    z-index: 5;
    width: 100%;
    left: 0;
    bottom: -14px;
    font-size: 12px;
    line-height: 16px;
}
.savearea {
    text-align: right;
    padding-top: 16px;
    position: relative;
}
.childicon,
.childuser {
    float: left;
    padding: 8px;
}
#main_notif {
    float: left;
    width: 50%;
}
#main_loader {
    position: absolute;
    right: 128px;
    bottom: 4px;
    display: none;
}
.childtext,
.childuser,
.childuserbox {
    position: relative;
}
.ketchild p {
    font-size: 13px;
    line-height: 17px;
}
.childuserbox {
    margin-top: 48px;
    min-height: 300px;
}
#childuserlist {
    font-size: 15px;
    color: #3f3f3f !important;
}
.childuser {
    width: 240px;
    height: 100px;
    border: 1px solid #999;
    border-radius: 8px 8px 0 0;
    margin: 8px;
    background: #fff;
}
.childicon {
    width: 48px;
    height: 48px;
    background: #ccc;
}
.childtext {
    float: right;
    width: 164px;
}
.childname {
    font-weight: 700;
    text-transform: capitalize;
    padding-bottom: 4px;
    border-bottom: 1px dotted #999;
    font-size: 13px;
}
.childmail {
    font-size: 11px;
    color: #878787;
    margin-top: 5px;
}
.childrole {
    font-size: 12px;
    color: #878787;
}
.childuserbutton {
    padding: 1px 8px !important;
    font-size: 13px;
}
.childedit {
    background: #ccc;
    padding: 6px;
    text-align: right;
    position: absolute;
    left: 0;
    bottom: 0;
    width: 244px;
}
.addchild {
    position: absolute;
    right: 0;
    top: -6px;
    padding: 4px 8px !important;
    font-size: 13px;
    display: block;
}
.addchild:active,
.addchild:focus {
    top: -5px !important;
    right: 0 !important;
    position: absolute !important;
}
.newchild {
    border: 1px solid #999;
    border-radius: 4px;
    z-index: 10;
    padding: 16px;
    margin: 24px 0;
}
#childloader {
    position: absolute;
    left: 210px;
    bottom: 4px;
    display: none;
}
.notifchilddel {
    position: absolute;
    bottom: 0;
    left: 0;
    width: 100%;
    margin: 0;
}
.notifchilddel span {
    margin: 0;
}
.childlistloader {
    position: absolute;
    right: 0;
    top: 0;
    display: none;
}
.childboxleft,
.childboxright {
    float: left;
}
.childsubmitbox {
    padding: 16px 0 0;
    position: relative;
}
.custombox {
    border-top: solid 1px #ccc;
    margin-top: 16px;
}
.cashopt {
    padding: 0 0 0 48px;
}
.custcek {
    padding: 4px 0;
    border-bottom: solid 1px #ccc;
}
.option_belibox {
    float: left;
    background: #fff;
    width: 295px;
    height: 100px;
    border-radius: 8px;
    padding: 16px;
    margin: 0 16px 16px 0;
    border: 1px solid #e1e1e1;
    position: relative;
    line-height: 16px;
    font-size: 12px;
}
.verino,
.veripen,
.veriyes {
    width: 15px;
    height: 100px;
    float: left;
}
.veriyes {
    background: #436e58;
}
.verino {
    background: #6f3d4f;
}
.veripen {
    background: #3d5b74;
}
.detil_tgl {
    font-size: 16px;
    font-weight: 200;
    line-height: 24px;
}
.detil_beli {
    margin: 0 25px;
}
table.dataTable {
    width: 100%;
    margin: 0 auto 16px;
    clear: both;
}
table.dataTable tfoot th,
table.dataTable thead th {
    color: #fff;
    font-weight: 300;
    font-size: 14px;
}
table.dataTable thead td,
table.dataTable thead th {
    padding: 10px 18px;
}
table.dataTable thead td:active,
table.dataTable thead th:active {
    outline: 0;
}
table.dataTable tfoot td,
table.dataTable tfoot th {
    padding: 10px 18px 6px;
}
table.dataTable thead .sorting,
table.dataTable thead .sorting_asc,
table.dataTable thead .sorting_desc {
    cursor: pointer;
}
table.dataTable thead .sorting {
    background: url(gambar/sort_both.png) center right no-repeat #2e3b49;
}
table.dataTable thead .sorting_asc {
    background: url(gambar/sort_asc.png) center right no-repeat #2e3b49;
}
table.dataTable thead .sorting_desc {
    background: url(gambar/sort_desc.png) center right no-repeat #2e3b49;
}
table.dataTable thead .sorting_asc_disabled {
    background: url(gambar/sort_asc_disabled.png) center right no-repeat #2e3b49;
}
table.dataTable thead .sorting_desc_disabled {
    background: url(gambar/sort_desc_disabled.png) center right no-repeat #2e3b49;
}
table.dataTable tbody tr.selected {
    background-color: #b0bed9;
}
table.dataTable tbody td,
table.dataTable tbody th {
    padding: 8px;
    vertical-align: middle;
    font-size: 14px;
    line-height: 18px;
}
table.dataTable.display tbody td,
table.dataTable.display tbody th,
table.dataTable.row-border tbody td,
table.dataTable.row-border tbody th {
    border-top: 1px solid #fff;
}
table.dataTable.display tbody tr:first-child td,
table.dataTable.display tbody tr:first-child th,
table.dataTable.row-border tbody tr:first-child td,
table.dataTable.row-border tbody tr:first-child th {
    border-top: none;
}
table.dataTable.cell-border tbody td,
table.dataTable.cell-border tbody th {
    border-top: 1px solid #ddd;
    border-right: 1px solid #ddd;
}
table.dataTable.cell-border tbody tr td:first-child,
table.dataTable.cell-border tbody tr th:first-child {
    border-left: 1px solid #ddd;
}
table.dataTable.cell-border tbody tr:first-child td,
table.dataTable.cell-border tbody tr:first-child th {
    border-top: none;
}
table.dataTable.display tbody tr.odd.selected,
table.dataTable.stripe tbody tr.odd.selected {
    background-color: #abb9d3;
}
table.dataTable.display tbody tr.even:hover,
table.dataTable.display tbody tr.odd:hover,
table.dataTable.display tbody tr:hover,
table.dataTable.hover tbody tr.even:hover,
table.dataTable.hover tbody tr.odd:hover,
table.dataTable.hover tbody tr:hover {
    background-color: #f5f5f5;
}
table.dataTable.display tbody tr.even:hover.selected,
table.dataTable.display tbody tr.odd:hover.selected,
table.dataTable.display tbody tr:hover.selected,
table.dataTable.hover tbody tr.even:hover.selected,
table.dataTable.hover tbody tr.odd:hover.selected,
table.dataTable.hover tbody tr:hover.selected {
    background-color: #a9b7d1;
}
table.dataTable.display tbody tr > .sorting_1,
table.dataTable.display tbody tr > .sorting_2,
table.dataTable.display tbody tr > .sorting_3,
table.dataTable.order-column tbody tr > .sorting_1,
table.dataTable.order-column tbody tr > .sorting_2,
table.dataTable.order-column tbody tr > .sorting_3 {
    background-color: #f9f9f9;
}
table.dataTable.display tbody tr.selected > .sorting_1,
table.dataTable.display tbody tr.selected > .sorting_2,
table.dataTable.display tbody tr.selected > .sorting_3,
table.dataTable.order-column tbody tr.selected > .sorting_1,
table.dataTable.order-column tbody tr.selected > .sorting_2,
table.dataTable.order-column tbody tr.selected > .sorting_3 {
    background-color: #acbad4;
}
table.dataTable.display tbody tr.odd > .sorting_1,
table.dataTable.order-column.stripe tbody tr.odd > .sorting_1 {
    background-color: #f1f1f1;
}
table.dataTable.display tbody tr.odd > .sorting_2,
table.dataTable.order-column.stripe tbody tr.odd > .sorting_2 {
    background-color: #f3f3f3;
}
table.dataTable.display tbody tr.odd > .sorting_3,
table.dataTable.order-column.stripe tbody tr.odd > .sorting_3 {
    background-color: #f5f5f5;
}
table.dataTable.display tbody tr.odd.selected > .sorting_1,
table.dataTable.order-column.stripe tbody tr.odd.selected > .sorting_1 {
    background-color: #a6b3cd;
}
table.dataTable.display tbody tr.odd.selected > .sorting_2,
table.dataTable.order-column.stripe tbody tr.odd.selected > .sorting_2 {
    background-color: #a7b5ce;
}
table.dataTable.display tbody tr.odd.selected > .sorting_3,
table.dataTable.order-column.stripe tbody tr.odd.selected > .sorting_3 {
    background-color: #a9b6d0;
}
table.dataTable.display tbody tr.even > .sorting_1,
table.dataTable.order-column.stripe tbody tr.even > .sorting_1 {
    background-color: #f9f9f9;
}
table.dataTable.display tbody tr.even > .sorting_2,
table.dataTable.order-column.stripe tbody tr.even > .sorting_2 {
    background-color: #fbfbfb;
}
table.dataTable.display tbody tr.even > .sorting_3,
table.dataTable.order-column.stripe tbody tr.even > .sorting_3 {
    background-color: #fdfdfd;
}
table.dataTable.display tbody tr.even.selected > .sorting_1,
table.dataTable.order-column.stripe tbody tr.even.selected > .sorting_1 {
    background-color: #acbad4;
}
table.dataTable.display tbody tr.even.selected > .sorting_2,
table.dataTable.order-column.stripe tbody tr.even.selected > .sorting_2 {
    background-color: #adbbd6;
}
table.dataTable.display tbody tr.even.selected > .sorting_3,
table.dataTable.order-column.stripe tbody tr.even.selected > .sorting_3 {
    background-color: #afbdd8;
}
table.dataTable.display tbody tr.even:hover > .sorting_1,
table.dataTable.display tbody tr.odd:hover > .sorting_1,
table.dataTable.display tbody tr:hover > .sorting_1,
table.dataTable.order-column.hover tbody tr.even:hover > .sorting_1,
table.dataTable.order-column.hover tbody tr.odd:hover > .sorting_1,
table.dataTable.order-column.hover tbody tr:hover > .sorting_1 {
    background-color: #eaeaea;
}
table.dataTable.display tbody tr.even:hover > .sorting_2,
table.dataTable.display tbody tr.odd:hover > .sorting_2,
table.dataTable.display tbody tr:hover > .sorting_2,
table.dataTable.order-column.hover tbody tr.even:hover > .sorting_2,
table.dataTable.order-column.hover tbody tr.odd:hover > .sorting_2,
table.dataTable.order-column.hover tbody tr:hover > .sorting_2 {
    background-color: #ebebeb;
}
table.dataTable.display tbody tr.even:hover > .sorting_3,
table.dataTable.display tbody tr.odd:hover > .sorting_3,
table.dataTable.display tbody tr:hover > .sorting_3,
table.dataTable.order-column.hover tbody tr.even:hover > .sorting_3,
table.dataTable.order-column.hover tbody tr.odd:hover > .sorting_3,
table.dataTable.order-column.hover tbody tr:hover > .sorting_3 {
    background-color: #eee;
}
table.dataTable.display tbody tr.even:hover.selected > .sorting_1,
table.dataTable.display tbody tr.odd:hover.selected > .sorting_1,
table.dataTable.display tbody tr:hover.selected > .sorting_1,
table.dataTable.order-column.hover tbody tr.even:hover.selected > .sorting_1,
table.dataTable.order-column.hover tbody tr.odd:hover.selected > .sorting_1,
table.dataTable.order-column.hover tbody tr:hover.selected > .sorting_1 {
    background-color: #a1aec7;
}
table.dataTable.display tbody tr.even:hover.selected > .sorting_2,
table.dataTable.display tbody tr.odd:hover.selected > .sorting_2,
table.dataTable.display tbody tr:hover.selected > .sorting_2,
table.dataTable.order-column.hover tbody tr.even:hover.selected > .sorting_2,
table.dataTable.order-column.hover tbody tr.odd:hover.selected > .sorting_2,
table.dataTable.order-column.hover tbody tr:hover.selected > .sorting_2 {
    background-color: #a2afc8;
}
table.dataTable.display tbody tr.even:hover.selected > .sorting_3,
table.dataTable.display tbody tr.odd:hover.selected > .sorting_3,
table.dataTable.display tbody tr:hover.selected > .sorting_3,
table.dataTable.order-column.hover tbody tr.even:hover.selected > .sorting_3,
table.dataTable.order-column.hover tbody tr.odd:hover.selected > .sorting_3,
table.dataTable.order-column.hover tbody tr:hover.selected > .sorting_3 {
    background-color: #a4b2cb;
}
table.dataTable.no-footer {
    border-bottom: 1px solid #111;
}
table.dataTable.compact thead td,
table.dataTable.compact thead th {
    padding: 5px 9px;
}
table.dataTable.compact tfoot td,
table.dataTable.compact tfoot th {
    padding: 5px 9px 3px;
}
table.dataTable.compact tbody td,
table.dataTable.compact tbody th {
    padding: 4px 5px;
}
table.dataTable td.dataTables_empty,
table.dataTable td.dt-center,
table.dataTable th.dt-center {
    text-align: center;
}
table.dataTable td.dt-right,
table.dataTable th.dt-right {
    text-align: right;
}
table.dataTable td.dt-justify,
table.dataTable th.dt-justify {
    text-align: justify;
}
table.dataTable tfoot td.dt-head-left,
table.dataTable tfoot th.dt-head-left,
table.dataTable thead td.dt-head-left,
table.dataTable thead th.dt-head-left {
    text-align: left;
}
table.dataTable tfoot td.dt-head-center,
table.dataTable tfoot th.dt-head-center,
table.dataTable thead td.dt-head-center,
table.dataTable thead th.dt-head-center {
    text-align: center;
}
table.dataTable tfoot td.dt-head-right,
table.dataTable tfoot th.dt-head-right,
table.dataTable thead td.dt-head-right,
table.dataTable thead th.dt-head-right {
    text-align: right;
}
table.dataTable tfoot td.dt-head-justify,
table.dataTable tfoot th.dt-head-justify,
table.dataTable thead td.dt-head-justify,
table.dataTable thead th.dt-head-justify {
    text-align: justify;
}
table.dataTable tbody td.dt-body-left,
table.dataTable tbody th.dt-body-left {
    text-align: left;
}
table.dataTable tbody td.dt-body-center,
table.dataTable tbody th.dt-body-center {
    text-align: center;
}
table.dataTable tbody td.dt-body-right,
table.dataTable tbody th.dt-body-right {
    text-align: right;
}
table.dataTable tbody td.dt-body-justify,
table.dataTable tbody th.dt-body-justify {
    text-align: justify;
}
table.dataTable,
table.dataTable td,
table.dataTable th {
    -webkit-box-sizing: content-box;
    -moz-box-sizing: content-box;
    box-sizing: content-box;
}
.dataTables_wrapper {
    position: relative;
    clear: both;
    zoom: 1;
}
.dataTables_wrapper .dataTables_length {
    float: left;
    margin: 0 0 16px 20px;
    font-weight: 300;
}
.dataTables_wrapper .dataTables_length select {
    font-size: 12px;
    padding: 2px;
}
.dataTables_wrapper .dataTables_filter {
    float: right;
    text-align: right;
    margin-bottom: 16px;
}
.dataTables_wrapper .dataTables_filter input {
    border-radius: 4px;
    font-size: 12px;
    border: 1px solid #999;
    background: url(gambar/search.png) 3px 4px no-repeat #e3e3e3;
    margin: 0 8px 0 0.5em;
    padding: 2px 2px 2px 24px;
    width: 142px;
}
.dataTables_wrapper .dataTables_filter input:hover {
    border: 1px solid #333;
    background: url(gambar/search.png) 3px 4px no-repeat #efefef;
}
.dataTables_wrapper .dataTables_info {
    clear: both;
    float: left;
    margin: 0 0 0 20px;
}
.dataTables_wrapper .dataTables_paginate {
    float: right;
    text-align: right;
    margin: -4px 8px 0 0;
}
.dataTables_wrapper .dataTables_paginate .paginate_button {
    box-sizing: border-box;
    display: inline-block;
    min-width: 1.5em;
    padding: 2px;
    margin-left: 2px;
    text-align: center;
    text-decoration: none !important;
    cursor: pointer;
    color: #333 !important;
    border: 1px solid transparent;
}
.dataTables_wrapper .dataTables_paginate .paginate_button.current,
.dataTables_wrapper .dataTables_paginate .paginate_button.current:hover {
    color: #333 !important;
    border: 1px solid #cacaca;
    background-color: #fff;
    background: -webkit-gradient(linear, left top, left bottom, color-stop(0, #fff), color-stop(100%, #dcdcdc));
    background: -webkit-linear-gradient(top, #fff 0, #dcdcdc 100%);
    background: -moz-linear-gradient(top, #fff 0, #dcdcdc 100%);
    background: -ms-linear-gradient(top, #fff 0, #dcdcdc 100%);
    background: -o-linear-gradient(top, #fff 0, #dcdcdc 100%);
    background: linear-gradient(to bottom, #fff 0, #dcdcdc 100%);
}
.dataTables_wrapper .dataTables_paginate .paginate_button.disabled,
.dataTables_wrapper .dataTables_paginate .paginate_button.disabled:active,
.dataTables_wrapper .dataTables_paginate .paginate_button.disabled:hover {
    cursor: default;
    color: #3d4850 !important;
    border: 1px solid transparent;
    background: 0 0;
    box-shadow: none;
}
.boxstatus,
.closenote,
.closestdesc,
.download img,
.downnote,
.folderreport,
.smallnote {
    cursor: pointer;
}
.dataTables_wrapper .dataTables_paginate .paginate_button:hover {
    color: #fff !important;
    border: 1px solid #111;
    background-color: #585858;
    background: -webkit-gradient(linear, left top, left bottom, color-stop(0, #585858), color-stop(100%, #111));
    background: -webkit-linear-gradient(top, #585858 0, #111 100%);
    background: -moz-linear-gradient(top, #585858 0, #111 100%);
    background: -ms-linear-gradient(top, #585858 0, #111 100%);
    background: -o-linear-gradient(top, #585858 0, #111 100%);
    background: linear-gradient(to bottom, #585858 0, #111 100%);
}
.dataTables_wrapper .dataTables_paginate .paginate_button:active {
    outline: 0;
    background-color: #2b2b2b;
    background: -webkit-gradient(linear, left top, left bottom, color-stop(0, #2b2b2b), color-stop(100%, #0c0c0c));
    background: -webkit-linear-gradient(top, #2b2b2b 0, #0c0c0c 100%);
    background: -moz-linear-gradient(top, #2b2b2b 0, #0c0c0c 100%);
    background: -ms-linear-gradient(top, #2b2b2b 0, #0c0c0c 100%);
    background: -o-linear-gradient(top, #2b2b2b 0, #0c0c0c 100%);
    background: linear-gradient(to bottom, #2b2b2b 0, #0c0c0c 100%);
    box-shadow: inset 0 0 3px #111;
}
.dataTables_wrapper .dataTables_processing {
    position: absolute;
    top: 50%;
    left: 50%;
    width: 100%;
    height: 40px;
    margin-left: -50%;
    margin-top: -25px;
    padding-top: 20px;
    text-align: center;
    background-color: #fff;
    background: -webkit-gradient(linear, left top, right top, color-stop(0, rgba(255, 255, 255, 0)), color-stop(25%, rgba(255, 255, 255, 0.9)), color-stop(75%, rgba(255, 255, 255, 0.9)), color-stop(100%, rgba(255, 255, 255, 0)));
    background: -webkit-linear-gradient(left, rgba(255, 255, 255, 0) 0, rgba(255, 255, 255, 0.9) 25%, rgba(255, 255, 255, 0.9) 75%, rgba(255, 255, 255, 0) 100%);
    background: -moz-linear-gradient(left, rgba(255, 255, 255, 0) 0, rgba(255, 255, 255, 0.9) 25%, rgba(255, 255, 255, 0.9) 75%, rgba(255, 255, 255, 0) 100%);
    background: -ms-linear-gradient(left, rgba(255, 255, 255, 0) 0, rgba(255, 255, 255, 0.9) 25%, rgba(255, 255, 255, 0.9) 75%, rgba(255, 255, 255, 0) 100%);
    background: -o-linear-gradient(left, rgba(255, 255, 255, 0) 0, rgba(255, 255, 255, 0.9) 25%, rgba(255, 255, 255, 0.9) 75%, rgba(255, 255, 255, 0) 100%);
    background: linear-gradient(to right, rgba(255, 255, 255, 0) 0, rgba(255, 255, 255, 0.9) 25%, rgba(255, 255, 255, 0.9) 75%, rgba(255, 255, 255, 0) 100%);
}
.dataTables_wrapper .dataTables_filter,
.dataTables_wrapper .dataTables_info,
.dataTables_wrapper .dataTables_length,
.dataTables_wrapper .dataTables_paginate,
.dataTables_wrapper .dataTables_processing {
    color: #3d4850;
    font-size: 12px;
    line-height: 18px;
}
.dataTables_wrapper .dataTables_scroll {
    clear: both;
}
.dataTables_wrapper .dataTables_scroll div.dataTables_scrollBody {
    -webkit-overflow-scrolling: touch;
}
.dataTables_wrapper .dataTables_scroll div.dataTables_scrollBody td > div.dataTables_sizing,
.dataTables_wrapper .dataTables_scroll div.dataTables_scrollBody th > div.dataTables_sizing {
    height: 0;
    overflow: hidden;
    margin: 0 !important;
    padding: 0 !important;
}
.dataTables_wrapper.no-footer .dataTables_scrollBody {
    border-bottom: 1px solid #111;
}
.dataTables_wrapper.no-footer div.dataTables_scrollBody table,
.dataTables_wrapper.no-footer div.dataTables_scrollHead table {
    border-bottom: none;
}
.dataTables_wrapper:after {
    visibility: hidden;
    display: block;
    clear: both;
    height: 0;
}
th.sorting_disabled {
    background: #2e3b49;
}
.bodyreport {
    background: #fff;
    padding: 8px;
    border-radius: 8px;
    min-height: 360px;
}
.selectcashbar {
    border-radius: 8px;
    padding: 8px 16px;
    margin: 8px 0 16px;
    background: #e2e2e2;
    box-shadow: 1px 1px 2px #999 inset;
    position: relative;
    height: 32px;
}
#bulannavreport {
    margin: 20px 20px 0 0;
    float: right;
}
.reportbulanarea {
    width: 50%;
    background: #818181;
    position: absolute;
    bottom: 0;
    right: 0;
    height: 72px;
    border-radius: 6px 6px 0 0;
}
.folderreport,
.iconreport {
    position: relative;
    top: 1px;
}
#bulankasreport {
    font-size: 22px;
    color: #ffff;
    padding-top: 4px;
}
.h3report {
    font-size: 24px;
    color: #2c3e50;
    line-height: 28px;
    padding: 16px 0 4px 12px;
    margin: 0 0 24px;
    border-bottom: 1px dotted #818181;
    background: #e6e6e6;
    border-radius: 8px 8px 0 0;
}
.tabreport {
    width: 98%;
    border-bottom: 1px dotted #c7c7c7;
}
.tabreport td {
    padding: 8px;
    border-top: 1px dotted #c7c7c7;
    line-height: 18px;
    vertical-align: middle;
}
.line,
.linetop {
    border-top: 1px solid #333 !important;
    font-weight: 700;
}
.reportleft {
    float: left;
    width: 48%;
}
.reportright {
    float: right;
    width: 48%;
}
.saldoawak {
    margin: 48px 0 0;
}
.line {
    border-bottom: 1px solid #333 !important;
    background: #f2f2f2;
}
.noline {
    border: none !important;
}
.strong {
    font-weight: 700;
}
#allcash {
    margin: 4px 0 0;
}
.reportbox {
    padding: 32px 0;
}
.exin {
    margin: 32px 0 0;
}
.notifreport {
    font-size: 20px;
    line-height: 26px;
    padding: 72px 0;
    text-align: center;
    color: silver;
}
.tduang {
    width: 96px;
}
.tdmatauang {
    width: 32px;
}
.tdtanggal {
    width: 172px;
}
.reportblank {
    text-align: center;
    color: #a6a6a6;
}
.premtransfer {
    text-align: center;
    line-height: 18px;
}
.annualbox {
    border: 1px solid #aaa;
    border-radius: 4px;
    padding: 1.2em 1.6em;
}
.tdplusmin {
    width: 18px;
}
.tdgray {
    background: #f2f2f2;
}
.subreport {
    font-size: 12px;
    line-height: 16px;
    width: 70%;
    background: #e8e8e8;
    color: #4d4d4d;
}
.subreport td {
    padding: 2px 4px;
}
.hover:hover {
    text-decoration: underline;
}
.loadnotif {
    text-align: center;
    padding: 32px 16px;
    width: 240px;
    background: #fff;
    position: fixed;
    top: 50%;
    left: 50%;
    margin: -60px 0 0 -120px;
    border-radius: 8px;
    box-shadow: 0 0 32px #000;
    z-index: 100;
}
.reportloadtext {
    padding: 16px 0 8px;
}
.reportarea {
    min-height: 480px;
}
#bodynotes {
    padding-top: 36px;
}
.daftarnotes {
    display: none;
    font-size: 9px;
    line-height: 11px;
}
.smallnote {
    width: 148px;
    height: 148px;
    margin: 8px;
    float: left;
    background-image: url(gambar/head-note.png);
    background-position: left top;
    background-repeat: no-repeat;
    border: 1px solid #bfbfbf;
    position: relative;
}
#thenote,
.smallnote:hover {
    border: 1px solid #fff;
}
.smallnote:hover {
    box-shadow: 0 0 6px #959595;
}
.isinote {
    padding: 8px 8px 54px;
    margin: 16px 0 0;
    background: url(gambar/ujung-note.png) right bottom no-repeat;
    height: 70px;
    font-size: 12px;
    line-height: 16px;
    color: #5e5e5e;
}
.noteyellow {
    background-color: #f3db6e;
}
.notered {
    background-color: #ffaeac;
}
.notegreen {
    background-color: #c1de98;
}
.noteblue {
    background-color: #9ee2f5;
}
.notegrey {
    background-color: #cbcbcb;
}
.notewhite {
    background-color: #fff;
}
.popnotebg {
    background: rgba(133, 133, 133, 0.5);
    width: 100%;
    position: absolute;
    left: 0;
    top: 0;
    display: none;
}
#thenote,
.imgnewnote,
.notebottom {
    position: relative;
}
.popnote {
    width: 300px;
    min-height: 300px;
    margin: 96px auto 0;
}
#notearea,
#notearea:focus,
#notearea:hover {
    background: 0 0;
    border: none;
    resize: none;
    box-shadow: none;
    width: 274px;
    height: 280px;
    padding: 12px;
    font-size: 14px;
    line-height: 20px;
}
.noteleft {
    float: left;
    width: 132px;
    margin-left: 8px;
}
.noteright {
    float: right;
    width: 148px;
    text-align: right;
    padding: 0 8px 0 0;
}
.noteright input[type="button"] {
    padding: 5px 14px;
}
.notebottom {
    padding: 8px 0;
    background: rgba(255, 255, 255, 0.4);
}
.headnote {
    height: 32px;
    background: rgba(102, 102, 102, 0.5);
}
.imgnewnote {
    width: 48px;
    height: 48px;
    top: 56px;
    display: block;
    margin: 0 auto;
}
.closenote,
.downnote,
.noteloader {
    position: absolute;
}
.closenote {
    left: 4px;
    top: 4px;
    transition: ease-in 0.2s;
}
.downnote {
    right: 5px;
    top: 5px;
    transition: ease-in 0.2s;
}
.closenote:hover {
    top: 3px;
}
.closenote:active,
.downnote:hover {
    top: 4px;
}
.downnote:active {
    top: 5px;
}
.noteloader {
    border-radius: 16px;
    top: -40px;
    right: 8px;
    display: none;
}
.notifcatatan {
    margin: 48px auto 0;
    display: none;
}
#delnotebutton {
    padding: 7px 4px 2px 7px;
    position: relative;
    top: 3px;
    right: 24px;
}
.notifnotedel {
    position: absolute;
    top: -46px;
    width: 100%;
    left: 0;
    color: #fff;
    text-align: center;
    margin: 0;
}
.feature,
.htop,
.pricelabel,
.top,
.toptext {
    position: relative;
}
.notifnotedel .tanya_hapus {
    margin: 0;
}
.taboptaccount {
    width: auto;
}
.taboptaccount td {
    padding: 6px;
}
.download {
    float: right;
    width: 100px;
    margin: 36px 2px 0 0;
    text-align: right;
}
.download img {
    margin: 0 2px;
    opacity: 0.5;
}
.download img:hover {
    opacity: 1;
}
.download a,
.download a:hover {
    text-decoration: none;
}
footer {
    padding: 24px 0 16px;
}
footer,
footer a {
    text-align: center;
    font-size: 10px;
    line-height: 16px;
    color: #9ea5aa;
}
footer a:hover {
    color: #0a5d9f;
}
.copyright {
    padding: 4px 0 0;
}
.boxads {
    height: auto;
    background: #fff;
    margin: 0 4px;
    padding: 6px 0 26px;
}
.adsarea,
.boxadsreport {
    min-height: 24px;
    background: #3e4751;
    border-radius: 4px;
    padding: 4px;
    overflow: hidden;
}
.adsarea {
    margin: 0 1px;
    box-shadow: 0 0 4px #333 inset;
}
.boxadsreport {
    margin-bottom: 16px;
    box-shadow: 1px 1px 2px #999 inset;
}
.pricelabel {
    float: right;
    right: -32px;
    top: -40px;
    display: block;
    z-index: 2;
}
.upgradewrap {
    padding: 24px 0 32px !important;
}
.toptext {
    font-weight: 300;
    text-align: right;
    float: right;
    top: 36px;
    right: -34px;
    width: 360px;
}
.compinput,
.feature,
.invleft,
.upgrade {
    float: left;
}
.firsttext {
    font-size: 46px;
    color: #2c3e50;
    line-height: 54px;
    padding-right: 16px;
}
.secondtext {
    font-size: 20px;
    color: #7f7f7f;
    line-height: 28px;
    padding-top: 4px;
}
.htop {
    display: block;
    padding: 18px 0 18px 32px;
    color: #fff;
    font-weight: 300;
    background: #a4aaac;
    font-size: 46px;
    top: -34px;
    line-height: 50px;
    margin-top: 40px;
}
.feature {
    width: 40%;
    height: 124px;
    background: #f3f3f3;
    border-radius: 8px;
    box-shadow: -2px 2px 4px #999 inset;
    margin: 0 4.8% 76px;
}
.featuretext {
    width: 52%;
    margin: 14px 0 0 45%;
    color: #2c3e50;
}
p {
    padding: 8px 0;
    font-size: 13px;
    line-height: 18px;
}
.navbutton,
.subscribe,
h4 {
    font-size: 14px;
}
h4 {
    font-weight: 700;
}
.feature img {
    display: block;
    position: absolute;
    top: -48px;
    left: -22px;
}
#featdown {
    height: 182px;
}
.boxfeature {
    padding-top: 54px;
}
.subscribe {
    background: #969fa2;
    padding: 50px 0 18px 32px;
    color: #fff;
    margin-top: -64px;
    display: block;
}
.bigsubs {
    font-size: 46px;
    font-weight: 300;
    line-height: 50px;
}
.price,
.upgrade .button {
    font-size: 24px;
    text-align: center;
}
.upgradebox {
    padding: 32px 0;
}
.upgrade {
    width: 18.5%;
    height: auto;
    position: relative;
    margin: 8px 3%;
}
#save10,
#save12\.5,
.closestdesc,
.price,
.pricesmall,
.statusdesc,
.upgrade .button {
    position: absolute;
}
.upgrade .bgup {
    width: 100%;
    height: auto;
}
.price {
    width: 100%;
    color: #fff;
    top: 26px;
}
.upgrade .button {
    width: 78%;
    bottom: 20px;
    left: 10%;
    font-weight: 700;
    padding: 8px 0;
    display: block;
}
.upgrade .button:focus,
.upgrade .button:hover {
    position: absolute;
    bottom: 21px;
    top: auto;
}
#save10 {
    right: -32px;
    top: -20px;
}
#save12\.5 {
    right: -40px;
    top: -28px;
}
.subscribe .butupgrade {
    margin: 4px 16px 0 0;
    display: block;
    float: right;
}
.loginfirst {
    text-align: center;
    font-size: 16px;
    line-height: 22px;
    padding: 24px 0;
}
.backarea {
    background: #ccc;
    padding: 8px 16px;
}
h2.thanks {
    font-size: 28px;
    line-height: 36px;
    padding: 36px 0 16px;
}
.thanksbox .backcash {
    display: block;
    margin: 32px auto 16px;
}
.thanksbox h2,
.thanksbox p {
    text-align: center;
}
.underline:hover {
    text-decoration: underline;
}
.userbox div {
    float: right;
}
.boxusername {
    border-right: 1px solid #c6c6c6;
    color: #3d4850;
    width: auto;
    padding: 18px 16px 0 0;
    height: 28px;
}
.boxstatus {
    height: 40px;
    padding: 5px 10px 0;
}
.boxstatus:hover {
    background: #e1e1e1;
}
.statusdesc {
    width: 248px;
    height: auto;
    background: #fff;
    border: 1px solid #ccc;
    border-radius: 4px;
    padding: 16px;
    font-size: 12px;
    line-height: 16px;
    top: 72px;
    right: 16px;
    display: none;
}
.closestdesc {
    right: -8px;
    top: -8px;
}
.boxlogout {
    padding: 8px 10px 0;
    border-left: 1px solid #c6c6c6;
    height: 40px;
}
.logoutlink {
    display: block;
    width: 32px;
    height: 32px;
    background: url(gambar/logout_icon.png) center top no-repeat;
    margin: 0 auto;
}
.logoutlink:hover {
    background: url(gambar/logout_icon.png) center bottom no-repeat;
}
.pricesmall {
    font-size: 13px;
    text-decoration: line-through;
    text-align: center;
    top: 8px;
    width: 100%;
    color: rgba(255, 255, 255, 0.6);
}
.plwupgrade {
    text-align: center;
    font-size: 24px;
    background: #e9f9ff;
    padding: 8px 0;
    color: #03638a;
    display: none;
}
.invdelask,
.invdelask small,
.invtab th {
    color: #fff;
}
.plwtext {
    position: relative;
    top: -6px;
}
.upgradebody {
    line-height: 18px;
}
.konfirmasi {
    padding: 26px;
}
.konfirmasi input,
.konfirmasi select {
    margin: 4px 0;
}
.konfirmnotif {
    position: relative;
    padding-top: 16px;
}
.konfirmloader {
    position: absolute;
    left: 160px;
    top: 22px;
    display: none;
}
#notifkonfirm {
    max-width: 460px;
}
.invoiceline input {
    margin: 2px 0;
}
.invleft {
    max-width: 48%;
}
.inright {
    float: right;
    max-width: 48%;
}
#invoiceline_1 .inright {
    text-align: right;
}
.invoiceline {
    border-bottom: 1px solid #ccc;
    padding: 16px 0;
}
#invtabtotal,
.invtab td {
    border-bottom: 1px solid #999;
}
.invcoverarea {
    padding: 8px 0 0;
    position: relative;
}
.invcover {
    position: absolute;
    width: 100%;
    height: 100%;
    background: rgba(255, 255, 255, 0.5);
    z-index: 5;
    top: 0;
    left: 0;
}
.invoiceframe h4 {
    font-size: 16px;
    line-height: 24px;
}
#invoiceline_4 textarea,
.invcheck,
.invtab td textarea {
    font-size: 12px;
    line-height: 16px;
}
#invoiceline_2 .invleft {
    padding-top: 26px;
}
.invtab {
    border-top: 1px solid #999;
}
.invtab th {
    text-align: center;
    background: #6b787b;
    padding: 8px 0;
}
.invtab td {
    vertical-align: top;
    padding: 4px;
}
.invaddline {
    text-align: right;
    padding: 8px 0 24px;
}
#invtabtotal td {
    vertical-align: baseline;
    border-bottom: none;
}
.tdinvdel,
.tdmiddle {
    vertical-align: middle !important;
}
.invaddbutton {
    font-size: 13px !important;
    line-height: 15px;
    padding: 4px 8px !important;
}
.invtotal {
    background: #ccc;
}
.invact {
    padding: 8px 16px 8px 32px !important;
    background-repeat: no-repeat !important;
    background-position: 8px 9px !important;
}
#invsend,
.invsend {
    background-image: url(gambar/invoice-mail.png) !important;
}
#invsave {
    background-image: url(gambar/invoice-save.png);
}
#invdown {
    background-image: url(gambar/invoice-down.png);
}
#invrefresh {
    background-image: url(gambar/invoice-refresh.png);
}
#invwhatsapp,
.invwhatsapp {
    background-image: url(gambar/invoice-whatsapp.png) !important;
    background-size: 18px !important;
    background-position-y: 7px !important;
}
.invthid,
.invthqty {
    width: 48px;
}
.invdesc {
    width: 98%;
    height: 64px;
}
.linetotal,
.thlinetotal,
.unitthprice {
    width: 128px;
}
.tdinvdel {
    background: #e7e7e7 !important;
    width: 32px;
}
.invtotalarea {
    position: relative;
}
.invstampimg {
    position: absolute;
    z-index: 8;
}
.invstampimg_paid {
    right: 270px;
    top: -14px;
}
.invstampimg_urgent {
    right: 400px;
    top: -14px;
}
.invstampimg_past {
    right: 530px;
    top: -14px;
}
.invstampimg_approved {
    right: 410px;
    top: 60px;
}
.invstampimg_received {
    right: 540px;
    top: 60px;
}
.invstampimg_final {
    right: 670px;
    top: 60px;
}
.complogo {
    padding-bottom: 8px;
    margin-bottom: 8px;
    border-bottom: 1px dotted #ccc;
    position: relative;
}
.fileupload,
.uploadbox,
.uploadbox div,
.uploadbox input,
.uploadbutton {
    cursor: pointer !important;
    display: block;
}
.uploadbox:hover {
    text-decoration: underline;
}
.caldownsmall,
.downsmall {
    display: none;
}
.boxdownline {
    font-size: 12px !important;
    line-height: 16px !important;
}
.ktpdesc {
    font-size: 12px;
    line-height: 18px;
}
.uploadbox {
    width: 240px;
    position: relative;
}
.fileinput-button input {
    height: 34px;
    font-size: 11px !important;
    display: block;
    max-width: 171px;
}
.uploadbox .progress {
    height: 16px;
    border: 1px solid #294d77;
    border-radius: 4px;
    background: #d5d5d5;
    width: 150px;
    margin-left: -75px;
    position: absolute;
    top: -72px;
    left: 50%;
    display: none;
}
.invdelask,
.popdownmail {
    border: 2px solid #fff;
    box-shadow: 0 0 8px #000;
}
.uploadbox .progress .progress-bar {
    background: #294d77;
    height: 16px;
}
.invremoveicon {
    position: absolute;
    top: 4px;
    left: 4px;
    opacity: 0.5;
}
.invremoveicon:hover {
    opacity: 1;
}
#invoiceline_6 {
    position: relative;
}
.invloader {
    position: absolute;
    left: 465px;
    top: 20px;
    display: none;
}
.invediticon {
    opacity: 0.4;
}
.invediticon:hover {
    opacity: 1;
}
.invdelask {
    position: fixed;
    top: 42%;
    left: 50%;
    background: #900;
    padding: 16px;
    border-radius: 8px;
    line-height: 16px;
    width: 260px;
    height: auto;
    text-align: center;
    display: none;
    z-index: 100;
}
.invdelaskloader {
    position: absolute;
    right: 16px;
    bottom: 14px;
    display: none;
}
.invmailfrom {
    float: left;
    width: 320px;
}
.invmailto {
    float: left;
    width: 280px;
}
.invmail {
    padding: 16px;
    margin: 24px 0 0;
    border: 1px solid #ccc;
    border-radius: 8px;
    max-width: 720px;
    display: none;
    line-height: 20px;
}
.invmail input[type="text"] {
    margin-bottom: 4px;
}
.invmailbutton {
    text-align: right;
    padding-top: 10px;
}
.invnoactivebutton {
    background-color: #bababa;
    margin: 0 4px;
    border: 0;
    border-radius: 6px;
    color: #fff;
    display: inline-block;
    line-height: 21px;
    position: relative;
}
#bodyinvoice {
    padding-top: 36px;
    min-width: 75%;
}
.custlisttab td,
.invbooktab td {
    border-bottom: 1px solid #ccc;
}
.pleaseupgrade {
    width: 100%;
    height: 100%;
    position: fixed;
    background: rgba(0, 0, 0, 0.6);
    top: 0;
    left: 0;
    z-index: 100;
}
.pleaseupgradebox {
    width: 50%;
    height: auto;
    background: #e9e9e9;
    position: fixed;
    top: 50%;
    margin-top: -150px;
    left: 50%;
    margin-left: -25%;
    border-radius: 8px;
    border: 2px solid #fff;
    box-shadow: 0 0 16px #000;
}
.upgradeinside {
    margin: 16px 16px 24px;
    text-align: center;
}
.upgradeinside h2 {
    font-size: 32px;
    line-height: 40px;
    font-weight: 300;
    color: #2c3e50;
    padding-bottom: 16px;
}
.upgradetexttop {
    font-size: 16px;
    line-height: 24px;
    padding-bottom: 24px;
}
.upgradeinside img {
    width: 128px;
    height: auto;
}
.upgradetextbottom {
    padding: 16px 0;
    line-height: 20px;
}
.premkonfirm {
    display: block;
    float: right;
    height: 200px;
    width: auto;
}
.konfirmasipem {
    padding: 32px;
}
.h3konfirm,
.imgbank {
    padding: 8px 0;
}
.h3konfirm {
    text-align: center;
    color: #2c3e50;
    background: #ccc;
}
#invstamp {
    display: flex;
    flex-wrap: nowrap;
    width: 100%;
}
.inpstamp {
    margin-right: 20px;
}
.titleedithapiutform,
.titlehapiutform {
    padding: 8px;
    border-radius: 4px;
}
.alsocat {
    padding: 8px 0 8px 8px;
    border-bottom: 1px dotted #797979;
    color: #272727;
}
.kastool #newdebt {
    background: url(gambar/button_plus.png) 10px 6px no-repeat #6f3d4f;
}
.kastool #newdebt:hover {
    background: url(gambar/button_plus.png) 10px 6px no-repeat #9e0039;
}
.kastool #newcredit {
    background: url(gambar/button_plus.png) 10px 6px no-repeat #436e58;
}
.kastool #newcredit:hover {
    background: url(gambar/button_plus.png) 10px 6px no-repeat #00a651;
}
.kastool #debtgreen,
.kastool #debtred {
    background-repeat: no-repeat;
    background-position: 10px 6px;
}
.helphapiut {
    opacity: 0.6;
    position: relative;
    left: -0.8px;
}
.helphapiut:hover {
    opacity: 1;
}
.hapiut_title {
    font-size: 18px;
    line-height: 24px;
    font-weight: 300;
}
.hapiut_ket {
    font-size: 12px;
    line-height: 15px;
    color: #656565;
}
.kasiconhapiutdetil {
    margin-top: 8px;
}
.edithapiuticon {
    opacity: 0.4;
    cursor: pointer;
    position: relative;
    bottom: -2px;
    left: 8px;
}
.edithapiuticon:hover {
    opacity: 1;
}
.kastool #debtred {
    background-color: #6f3d4f;
}
.kastool #debtred:hover {
    background-color: #9e0039;
}
.kastool .plusdebt {
    background-image: url(gambar/button_plus.png);
}
.kastool #debtgreen {
    background-color: #436e58;
}
.kastool #debtgreen:hover {
    background-color: #00a651;
}
.kastool .mindebt {
    background-image: url(gambar/button_min.png);
}
.edithapiut .catat {
    right: auto;
    left: 4px;
    top: -96px;
}
.buttongrey {
    background: #6e7b89 !important;
    border: 1px solid #6e7b89 !important;
}
.buttongrey:hover {
    background: #1c2630 !important;
}
.notif small {
    color: #fff;
}
#catat_hpitem {
    top: auto;
    right: 0;
    left: auto;
}
.notifdelitem,
.popup {
    position: fixed;
    top: 40%;
}
.notifdelitem {
    left: 50%;
    width: 360px;
    z-index: 1000;
    box-shadow: 0 0 32px #333;
}
.delhpitemloader {
    position: absolute;
    left: 48px;
    bottom: 8px;
    display: none;
}
.kastoolhapiut {
    width: 240px;
}
.debtdatesmall {
    display: none;
}
.kastoolhapiutdetil {
    width: 400px;
}
.icontophapiut {
    padding: 6px 0 0;
}
.kastitlekananhapiut {
    width: auto;
}
.toolhapiut {
    height: 52px;
    float: left;
    width: 100px;
    position: relative;
}
.autohidehapiut {
    font-size: 18px;
    line-height: 24px;
    font-weight: 300;
    display: block;
    padding: 12px 0 0;
}
#appimporloader,
#appprosesloader,
#appresetloader,
.loader_checkout,
.loader_discode {
    display: none;
    position: absolute;
}
.autohidehapiut a:hover {
    text-decoration: none;
}
#btnbatal:hover,
.impor_reset a:hover,
.resetkas:hover {
    text-decoration: underline;
}
.reportbulanarea .lap_tgl {
    font-size: 20px;
    background: #818181;
    color: #fff;
    border: none;
    line-height: 26px;
    font-weight: 300;
    text-align: right;
    padding: 0;
    cursor: pointer;
    width: 180px;
}
.reportbulanarea .lap_tgl:active,
.reportbulanarea .lap_tgl:focus,
.reportbulanarea .lap_tgl:hover {
    background: #818181;
    border: none;
    color: #c4c4c4;
    box-shadow: none;
}
.reportbulanarea .bulankastgl {
    padding: 22px 28px 0 0 !important;
    float: right !important;
    text-align: right;
}
.bottominput td,
.navbutton,
.popup {
    text-align: center;
}
.resetkas,
.resetkastitle {
    color: #8d9295;
    font-size: 12px;
    line-height: 16px;
}
.resetkas {
    cursor: pointer;
}
.resetkas:hover {
    color: #3f3f3f;
}
.impor_reset {
    font-size: 12px;
    line-height: 16px;
    padding: 32px 0 0;
}
.impor_reset a {
    color: #888;
}
.impor_reset a:hover {
    color: #3f3f3f;
}
.popup,
.popup small {
    color: #fff;
}
.popup {
    width: 360px;
    height: auto;
    left: 50%;
    margin-left: -150px;
    z-index: 500;
    background: #900;
    padding: 16px;
    line-height: 18px;
    border-radius: 8px;
    border: 2px solid #fff;
    box-shadow: 0 0 16px #000;
}
.popup input[type="button"] {
    background: #000;
}
.popup input[type="button"]:hover {
    background: #333;
}
#appresetloader {
    right: 24px;
    top: 100px;
}
#appimporloader {
    right: 60px;
    top: 144px;
}
#appprosesloader {
    right: 32px;
    top: 172px;
}
.loader_checkout {
    right: 145px;
}
.loader_discode {
    right: 300px;
    top: 144px;
}
.bukubeli .notif {
    margin: 8px 10px;
}
.navblock .premium-nav {
    display: block;
}
#trketedit {
    color: red;
    margin-top: 10px;
}
.premium-nav {
    margin-bottom: 32px;
}
.activ {
    display: block !important;
}
#colduedate,
#colduedate2,
.bottominput,
.catlabel,
.navbutton,
.nominaltab,
.option_back_small,
.shortdate,
.small_bulan_nav_left,
.small_bulan_nav_right,
.smallbalance,
.smallogo,
.smalltool,
.userlabel {
    display: none;
}
.navbutton {
    position: absolute;
    width: 92px;
    left: 0;
    top: 0;
    line-height: 24px;
    color: #3d4850;
    cursor: pointer;
    height: 36px;
    padding: 12px 0 0;
}
.navbutton:hover {
    background: #3d4850;
    color: #fff;
}
.shortdate {
    font-size: 16px;
}
.sdsmall {
    font-size: 13px;
}
table#bukukas th {
    background-color: #3e4751;
}
table#taborder th {
    background-color: #2e3b49;
}
.bottominput {
    position: fixed;
    bottom: 0;
    width: 100%;
}
.bottominput td {
    height: 38px;
    vertical-align: middle;
}
.bottominput img {
    height: auto;
    width: 100%;
    cursor: pointer;
}
.img_transfer {
    max-width: 102px;
}
.img_income {
    max-width: 142px;
}
.img_expense {
    max-width: 148px;
}
.td_img_transfer {
    background: #526471;
}
.td_img_income {
    background: #425755;
}
.td_img_expense {
    background: #6d4a55;
}
.kastitlehapiutdetil {
    width: 52%;
}
.alwidget img {
    width: 1px;
    height: 1px;
}
.tabcekout {
    width: 100%;
    padding-left: 5px;
    padding-right: 5px;
    margin-top: 20px;
}
.tabcekout td {
    width: 30%;
    text-align: right;
    padding: 10px;
    border: 1px solid #acacac;
    border-left: none;
    border-bottom: none;
}
.tabcekout th {
    width: 70%;
    padding: 10px;
    border: 1px solid #acacac;
    border-right: none;
    border-bottom: none;
}
.trtot th {
    border-bottom: 1px solid #acacac;
}
.usebtn {
    display: inline;
    width: 100px;
    text-align: right;
    margin-top: -10px;
    margin-left: 10px;
}
#downfile,
.boxangkabln {
    text-align: center;
}
.vcrname {
    margin: 0;
}
.vcrinput {
    margin-left: 0;
}
.barisakhir {
    width: 100%;
    margin-top: 30px;
}
.barisakhir p {
    float: left;
}
.btnaksi {
    float: right;
    display: inline;
}
.cart_area {
    background: #fff;
    margin: 0;
    padding: 1px;
    position: relative;
}
.iconcart {
    float: left;
    height: 58px;
    overflow: hidden;
    width: 58px;
    margin: 10px 10px 0 0;
}
.boxbelikiri {
    float: left;
    width: 192px;
    height: 192px;
    border-radius: 100%;
    background: #419f61;
    border: solid #368854;
    margin: 30px 40px 20px;
}
.boxangkabln {
    margin-top: 50px;
}
.pangka {
    font-size: 150px;
    font-weight: 700;
    color: #fffdff;
}
.boxthanks-1,
.pbulan,
.voucheryes {
    font-weight: lighter;
}
.pbulan {
    font-size: 23px;
    color: #fffdff;
    margin-top: 40px;
}
.boxbelikanan {
    float: left;
    width: 500px;
    margin: 30px 40px 20px 5px;
}
.boxthanks-1 {
    font-size: 30px;
    font-family: Open Sans;
    margin-bottom: 5px;
}
.boxvoucher {
    padding: 7px 0;
    margin-bottom: 12px;
}
.boxbelibawah {
    width: auto;
    background: #939393;
    border-radius: 5px;
    padding: 5px;
    margin: 30px 10px 0;
}
.cekoutbtn {
    float: right;
}
.batalbtn {
    float: left;
}
.voucheryes {
    background: #419f61;
    color: #fff;
    border-radius: 5px;
    width: 560px;
}
#btnbatal {
    background: #fff;
    color: #000;
    border: none;
}
#nmkas {
    font-size: 25px;
    padding-top: 6px;
    line-height: 28px;
}
#dkripkas {
    font-size: 13px;
    padding-top: 0;
    overflow: hidden;
}
#hp_cash,
#hp_cat,
#hpitem_cash,
#hpitem_cat,
#reportselectbook,
#trans_cat,
#transferkasfrom,
#transferkasto {
    width: 150px;
}
.ui-autocomplete .ui-menu-item {
    padding: 0 !important;
}
.ui-autocomplete .ui-menu-item-wrapper {
    padding: 6px 2em 6px 0.8em !important;
}
.ui-autocomplete .ui-state-active {
    border: none !important;
    color: #fff !important;
    background: #007fff !important;
    margin: 0 auto !important;
    -webkit-transition: 0.4s ease;
    -moz-transition: 0.4s ease;
    -o-transition: 0.4s ease;
}
.popdownmail {
    background: #0a5d9f;
    padding: 16px;
    border-radius: 8px;
    color: #fff;
    line-height: 16px;
    height: auto;
    display: none;
    z-index: 100;
    margin: 0 auto;
    max-width: 720px;
    position: absolute;
    top: 20%;
    left: 35%;
}
#atmailcancel,
#atmailsend {
    background: #fff;
    color: #222;
}
#atmailcancel:hover,
#atmailsend:hover {
    background: #e1e1e1;
}
#main_use {
    width: 224px;
}
#tglcusreportfrom {
    padding: 24px 0 0 !important;
    text-align: left;
    left: -300px;
    position: relative;
}
#lap_tgl_from,
#lap_tgl_to,
.customtoreport,
.noticeprofile {
    text-align: center;
}
#tglcusreportto {
    padding: 24px 20px 0 0 !important;
    right: -170px;
    position: relative;
}
.customtoreport {
    font-size: 22px;
    color: #fff;
    padding: 26px 0 0;
    float: right;
    line-height: 20px;
    font-weight: 300;
    width: 80px;
    right: -170px;
    position: relative;
}
#bulancustomarea {
    width: 55%;
}
#main_compaddress1,
#main_compaddress2 {
    margin-bottom: 10px;
}
.atchoosefile {
    margin-top: 15px;
}
.noticeprofile {
    background: #3e4751;
    padding: 8px;
    color: #fff;
    font-size: 13px;
    line-height: 18px;
    border-radius: 4px;
    margin: 10px 3px;
    border: 1px solid #fff;
    box-shadow: 0 0 4px #999;
    position: relative;
}
.noticeprofile .star {
    position: absolute;
    top: 0;
    bottom: 0;
    margin: auto;
    height: 32px;
}
.kbox,
.networkbox,
.networkwrap {
    position: relative;
}
.noticeprofile .star.left {
    left: 10px;
}
.noticeprofile .star.right {
    right: 10px;
}
.noticeprofile .ct_notif {
    width: calc(100% - 75px);
    display: inline-block;
}
#noticeprofilekas {
    display: none;
}
.optionchild {
    margin-bottom: 32px;
}
.networkwrap {
    margin-top: 50px;
    padding: 24px 0;
    border-radius: 4px;
    font-size: 14px;
    line-height: 18px;
    background: #fff;
}
.networkbox {
    float: left;
    background: #fff;
    width: 440px;
    height: 100px;
    border-radius: 8px;
    margin: 0 20px 20px 0;
    border: 7px solid #3e4751;
    line-height: 16px;
    font-size: 12px;
}
.konfirmleft,
.konfirmright {
    padding: 5px;
}
.kbox {
    width: 40%;
    float: left;
    margin: 0 4%;
}
.konfirmasi_box {
    padding-top: 30px;
}
.imgnet {
    display: block;
    max-width: 100%;
    height: auto;
}
#mainchild_loader {
    position: absolute;
    right: 80px;
    display: none;
}
.sendmail_loader {
    position: absolute;
    right: 260px;
    display: none;
}
#DataTable_overlay {
    height: 100%;
    width: 100%;
    position: absolute;
    top: 0;
    left: 0;
    z-index: 99999;
    background-color: gray;
    -moz-opacity: 0.75;
    opacity: 0.75;
    display: none;
}
#DataTable_overlay h2 {
    position: fixed;
    margin-left: 40%;
    top: 40%;
}
.loadingnotif {
    text-align: center;
    padding: 32px 16px;
    width: 240px;
    background: #fff;
    position: fixed;
    top: 50%;
    left: calc(50% + 100px);
    margin: -60px 0 0 -135px;
    border-radius: 8px;
    box-shadow: 0 0 32px #60676f;
    z-index: 100;
}
.reportloadtext {
    padding: 16px 0 8px 0;
    font-size: 14px;
}
.summarydetailtab {
    width: 100%;
    margin: 20px auto 30px;
}
.summarydetailtab td {
    padding: 8px;
    vertical-align: middle;
    line-height: 16px;
}
.content_ref {
    padding: 28px 24px;
    width: calc(100% - 50px);
}
.banner_referral {
    width: 100%;
    height: auto;
    margin-bottom: 20px;
}
.referensi_register {
    margin-top: 52px;
    padding: 24px 24px 32px;
    border: 1px solid #aaa;
    border-radius: 4px;
}
.referensi_register input {
    padding: 10px;
    width: calc(100% - 22px);
    font-size: 17px;
    border: 1px solid #aaa;
    background: #ececec;
    color: #5e5e5e;
}
.referensi_register input.invalid {
    background-color: #fdd;
}
.referensi_register .checkbox_term {
    display: inline-block;
}
.referensi_register .checkbox_term.invalid {
    background-color: #fdd;
}
.referensi_register .checkbox_term input[type="checkbox"] {
    display: inline-block;
    width: auto;
    vertical-align: text-bottom;
}
.referensi_register .checkbox_term label {
    font-weight: 700;
}
.referensi_register .tab {
    display: none;
    -webkit-transition: 0.4s ease;
    -moz-transition: 0.4s ease;
    -o-transition: 0.4s ease;
}
.referensi_register .tab.open {
    display: block;
}
.referensi_register .tab-termcond > .thecontent {
    max-height: 550px;
    overflow: auto;
    margin-bottom: 30px;
}
.referensi_register .wrapbtn {
    position: relative;
    overflow: auto;
    margin-top: 20px;
}
.referensi_register button {
    background: #0a5d9f;
    border-radius: 6px;
    color: #feffff;
    border: none;
    padding: 10px 20px;
    font-size: 17px;
    cursor: pointer;
}
.referensi_register button:hover {
    background: #0a5d9f;
}
.referensi_register #prevBtn {
    background-color: #60676f;
}
.referensi_register #nextBtn:disabled {
    opacity: 0.5;
}
.referensi_register .step {
    height: 15px;
    width: 15px;
    margin: 0 2px;
    background-color: #bbb;
    border: none;
    border-radius: 50%;
    display: inline-block;
    opacity: 0.5;
}
.referensi_register .step.active {
    opacity: 1;
}
.referensi_register .step.finish {
    background-color: #04aa6d;
}
.referensi_register ::-webkit-scrollbar {
    width: 5px;
}
.referensi_register ::-webkit-scrollbar-track {
    box-shadow: inset 0 0 5px #edeeee;
    border-radius: 10px;
}
.referensi_register ::-webkit-scrollbar-thumb {
    background: #60676f;
    border-radius: 10px;
}
.thecontent h1 {
    font-size: 32px;
    line-height: 40px;
    font-weight: 700;
    margin-bottom: 20px;
}
.thecontent h2 {
    font-size: 24px;
    line-height: 20px;
    font-weight: 700;
    margin-bottom: 20px;
}
.thecontent h3 {
    font-size: 22px;
    line-height: 28px;
    margin-bottom: 15px;
    font-weight: 700;
}
.thecontent h4 {
    font-size: 16px;
    line-height: 22px;
    margin-bottom: 15px;
}
.thecontent h5 {
    font-size: 14px;
    line-height: 20px;
    margin-bottom: 15px;
}
.thecontent h6 {
    font-size: 12px;
    line-height: 20px;
    margin-bottom: 15px;
}
.thecontent p {
    font-size: 16px;
    line-height: 22px;
    margin-bottom: 15px;
}
.thecontent a {
    color: #0a5d9f;
    font-size: 16px;
    cursor: pointer;
    font-style: italic;
    font-weight: 700;
}
.thecontent a:hover {
    color: #3e4751;
    text-decoration: underline;
}
.thecontent img {
    max-width: 100%;
    height: auto;
}
.thecontent img,
.thecontent img.alignleft {
    float: left;
    display: block;
    margin: 0 30px 17px 0;
}
.thecontent img.aligncenter {
    float: none;
    margin: 0 auto 17px;
}
.thecontent img.alignright {
    float: right;
    margin: 0 0 17px 30px;
}
.thecontent ul {
    list-style: disc;
    margin-bottom: 15px;
    padding-left: 40px;
}
.thecontent ol {
    list-style: decimal;
    margin-bottom: 15px;
    padding-left: 40px;
}
.thecontent ol li,
.thecontent ul li {
    font-size: 16px;
    line-height: 20px;
    padding-left: 8px;
}
.wrapuserref_detail {
    padding: 0 20px;
}
.wrapuserref_detail .topcontent {
    margin-bottom: 20px;
}
.wrapuserref_detail .topcontent img {
    width: 150px;
    height: auto;
    margin-right: 35px;
    display: inline-block;
    vertical-align: middle;
}
.wrapuserref_detail .topcontent .contentitle {
    width: calc(100% - 200px);
    display: inline-block;
    text-align: left;
    vertical-align: middle;
}
.wrapuserref_detail .topcontent .contentitle p {
    text-align: left;
    padding: 0;
    font-size: 16px;
    line-height: 22px;
}
.wrapuserref_detail .topcontent .contentitle h2 {
    text-align: left;
    font-weight: 700;
    padding: 0;
    margin: 10px 0;
}
.btn_viewrefcomm {
    position: absolute !important;
    top: 25px !important;
    right: 20px;
}
.poptrans {
    background: #efefef none repeat scroll 0 0;
    color: #474f4f;
    border: 1px solid #fff;
    border-radius: 8px;
    box-shadow: 0 0 16px #333;
    height: auto;
    left: 50%;
    line-height: 18px;
    margin-left: -217px;
    margin-top: -230px;
    padding: 16px;
    position: fixed;
    text-align: center;
    top: 50%;
    width: 700px;
    display: none;
}
.poptrans h3 {
    padding: 5px 0 25px 0;
}
#poptrans input[type="email"],
#poptrans input[type="number"] {
    padding: 4px;
    border: 1px solid #999;
    border-radius: 4px;
    background: #e3e3e3;
    color: #5e5e5e;
}
.poptrans .submitarea {
    position: relative;
    width: auto;
    margin: 16px 0 8px 0;
}
.poptrans.popdel {
    background: #ffdfdf;
    width: 500px;
    margin-left: -187px;
}
.poptrans .editloader {
    position: absolute;
    right: 116px;
    top: 2px;
    display: none;
}
.detailtab td {
    border-bottom: 1px dotted #ccc;
    padding: 8px;
    vertical-align: middle;
    line-height: 16px;
}
.summarydetailtab {
    width: 100%;
    margin: 20px auto 30px;
}
.summarydetailtab td {
    padding: 8px;
    vertical-align: middle;
    line-height: 16px;
}

table tr td label { display: block; margin-bottom: 5px; }
.item-checkbox { display: block; margin-bottom: 5px; text-align: left; }
.childuser.nonactive { background: #3e4751; color: #fff; }
.inv_opsicashbook { position: absolute; right: 12px; bottom: 4px; }
.inv_opsicashbook small { display: block; text-align: right; }
.relative { position: relative; }

@media only screen and (max-width: 1240px) {
    .navleft {
        left: -250px;
    }
    .blockright {
        padding: 8px;
    }
    .logo {
        float: none;
        margin: 0 auto;
        padding-top: 7px;
        text-align: center;
    }
    .boxusername {
        display: none;
    }
    .userbox {
        width: 130px;
        position: absolute;
        right: 0;
        top: 0;
    }
    .navbutton {
        display: block;
    }
    .statusdesc {
        right: 16px;
    }
    .footlogin {
        padding: 32px 8px;
    }
    .longdate {
        display: none;
    }
    .shortdate {
        display: inline-block;
    }
    #bukukas th,
    #taborder th {
        width: auto !important;
    }
    .tabreport td {
        font-size: 13px;
        line-height: 18px;
    }
    .editdebtbox,
    .paydebt {
        margin-left: -150px;
    }
    .upgradeinside img {
        width: 72px;
        height: auto;
    }
    .debtdatesmall {
        display: block;
    }
    .debtdatebig {
        display: none;
    }
    .orddatebig {
        display: block;
    }
    .kastitlehapiutdetil {
        width: 55%;
    }
    .boxbelikiri {
        float: none;
        margin: 0 auto;
        width: 192px;
    }
    .boxbelikanan {
        float: none;
        margin: 10px auto;
        text-align: center;
    }
    .option_belibox {
        width: 28%;
    }
    .invdelask {
        top: 45% !important;
        left: 35% !important;
    }
    .notifdelitem {
        top: 33% !important;
        left: 34% !important;
    }
    .loader_discode {
        right: 200px;
        top: 324px;
        display: none;
    }
    .loadnotif {
        margin: -60px 0 0 -135px;
    }
    #bulancustomarea {
        width: 50% !important;
    }
    .popdownmail {
        top: 22%;
        left: 20%;
    }
    .voucheryes {
        position: relative;
        right: 51px;
    }
    .networkbox {
        left: 8%;
    }
    .loadingnotif {
        left: 50%;
    }
}
@media only screen and (max-width: 1100px) {
    #tglcusreportfrom,
    #tglcusreportto {
        text-align: center !important;
        width: 100%;
    }
    #tglcusreportfrom {
        padding: 0 !important;
        margin: 0;
        left: 0 !important;
    }
    #tglcusreportto {
        padding: 20px 0 0 !important;
        right: 0 !important;
    }
    .customtoreport {
        padding: 0 !important;
        text-align: center;
        width: 100%;
        margin: 0;
        display: block;
        top: 25px;
        position: absolute;
        right: 0 !important;
    }
    .networkbox {
        left: 5%;
        width: 400px;
    }
}
@media only screen and (max-width: 960px) {
    .bukutop,
    .kastool {
        height: auto;
    }
    .kasrightborder,
    .tabdesc {
        display: none;
    }
    .bloktengah,
    .bukubeli,
    .bukutengah {
        min-height: 200px;
    }
    #bulannavreport,
    .subscribe {
        position: relative;
    }
    .dataTables_wrapper .dataTables_info,
    .dataTables_wrapper .dataTables_paginate {
        float: none;
        text-align: center;
        margin: 0 auto 10px;
    }
    .dataTables_wrapper .dataTables_paginate {
        margin-top: 0.5em;
    }
    .kastitlekanan {
        float: none;
    }
    .kassaldo,
    .kastitle {
        width: 49%;
    }
    .boxbelikiri {
        float: none;
        margin: 0 auto;
        width: 192px;
    }
    .boxbelikanan {
        float: none;
        margin: 20px auto;
    }
    .desckas {
        text-overflow: ellipsis;
        overflow: hidden;
        white-space: nowrap;
    }
    .bulankas {
        float: none;
        background: 0 0;
        width: 100%;
    }
    .kastool {
        float: right;
        text-align: right;
        padding-bottom: 8px;
    }
    .featuretext,
    .upgradebox {
        text-align: center;
    }
    .kasbutton,
    .upgrade {
        display: inline-block;
        float: none;
    }
    .bulannav {
        top: 0;
    }
    .bukutengah {
        margin: 0;
        border-radius: 8px 8px 0 0;
    }
    .bukubeli {
        margin: 0;
        border-radius: 0;
    }
    .bloktengah {
        width: 96%;
    }
    .judulkas {
        font-size: 23px;
        line-height: 28px;
    }
    .subreport {
        width: 100%;
    }
    .tdtanggal {
        width: auto !important;
    }
    .option_bookbox {
        width: 240px;
    }
    .katbox {
        float: none;
        width: auto;
        margin: 0;
    }
    .katboxright {
        padding-top: 32px;
    }
    .bordtop {
        border-top: 1px dotted #999;
        padding-top: 16px;
        margin-top: 16px;
    }
    .boxads {
        margin: 0;
    }
    .upgrade {
        width: 180px;
        margin: 16px 48px;
    }
    .hpfrom,
    .invbduedate,
    .kasdown,
    .kasiconhapiutdetil,
    .seconddebttool {
        display: none;
    }
    #featdown,
    .feature {
        height: 224px;
    }
    .feature img {
        left: 50%;
        top: -48px;
        margin-left: -64px;
        width: 128px;
        height: auto;
    }
    .featuretext {
        margin: 96px 8px 0;
        width: auto;
    }
    .searchbukutop {
        background: #939393;
        padding: 16px;
    }
    .edithapiut .catat {
        margin: 0;
    }
    .option_belibox {
        width: 44%;
    }
    .invdelask {
        top: 43% !important;
        left: 35% !important;
        width: 260px !important;
    }
    .kastoolhapiut,
    .kastoolhapiutdetil {
        background: 0 0;
    }
    .networkbox {
        left: 0;
        margin: 0 0 20px 20px;
    }
}
@media only screen and (max-width: 900px) {
    .invstampimg_paid,
    .invstampimg_urgent {
        top: -14px;
        width: 120px !important;
        height: 87px !important;
    }
    .invstampimg_paid {
        right: 250px;
    }
    .invstampimg_urgent {
        right: 350px;
    }
    .invstampimg_past {
        right: 250px;
        top: 56px;
        width: 120px !important;
        height: 87px !important;
    }
    .invstampimg_approved,
    .invstampimg_received {
        top: 122px;
        width: 120px !important;
        height: 87px !important;
    }
    .invstampimg_approved {
        right: 350px;
    }
    .invstampimg_received {
        right: 250px;
    }
    .invstampimg_final {
        right: 350px;
        top: 56px;
        width: 120px !important;
        height: 87px !important;
    }
    .invdesc {
        min-width: 205px;
    }
    .notifdelitem {
        top: 33% !important;
        left: 27% !important;
    }
    #bulancustomarea {
        width: 50% !important;
    }
    #tglcusreport {
        padding: 0 20px 0 0 !important;
    }
    .networkbox {
        left: 0;
        width: 320px;
    }
}
@media only screen and (max-width: 742px) {
    .scrolltabinv {
        overflow-x: scroll;
        white-space: nowrap;
        max-width: 100%;
        height: auto;
    }
    .loader_discode {
        position: absolute;
        right: 120px;
        top: 332px;
        display: none;
    }
    #create_book_notif {
        width: 660px;
        margin: 0 auto;
    }
    .bulannav,
    .kastool {
        float: none;
        width: 100%;
    }
    .tabbg {
        display: none;
    }
    .kastool {
        text-align: center;
        height: auto;
        padding-bottom: 8px;
    }
    .bulannav {
        top: -45px;
    }
    #catat_trans,
    #catat_trans_transfer {
        left: 50%;
        right: auto;
        margin: 0 0 0 -230px;
    }
    .kastoolhapiutdetil {
        text-align: right;
    }
    #newcredit,
    #newdebt {
        float: right;
    }
    #bulannavreport {
        margin: 70px 20px 0 0;
        position: absolute;
    }
    .bukutop {
        background: 0 0;
    }
    .popup {
        left: 42%;
    }
    .voucheryes {
        width: 626px;
        right: 85px;
    }
    .networkbox {
        left: 0;
        width: 400px;
        float: none;
        margin: 20px auto;
    }
}
@media only screen and (max-width: 680px) {
    #bukukas th,
    #taborder th {
        color: #d1d1d1;
        font-weight: 300;
        padding: 12px 0;
        border-right: 1px solid #525e6b;
        font-size: 14px;
    }
    #bukukas td:last-child,
    #bukukas th:last-child,
    #taborder td:last-child,
    #taborder th:last-child {
        border-right: none;
    }
    #bukukas td,
    #taborder td {
        padding: 8px;
        border-right: 1px solid #fff;
        line-height: 16px;
        vertical-align: middle;
    }
    .kassaldo,
    .kastitle {
        float: none;
        width: 100%;
    }
    .bulankas,
    .kassaldo,
    .kastitlekanan {
        text-align: center;
    }
    #bukukas .tabbalance,
    #taborder .tabbalance,
    .kasicon,
    .motto,
    .thebalance {
        display: none;
    }
    .small_bulan_nav_left:hover,
    .small_bulan_nav_right:hover,
    .smalltool a:hover {
        text-decoration: none;
    }
    .bodyreport,
    .bulankas,
    .catat,
    .titlehapiutform {
        border-radius: 0;
    }
    #bukukas td,
    #taborder td,
    .taboption td {
        vertical-align: middle;
    }
    .bloktengah {
        min-width: 0;
        width: 100%;
    }
    .kastitle {
        padding: 16px 0;
        border-bottom: 1px solid #999;
    }
    .kassaldo {
        padding: 4px 0 8px;
        background: #c5c5c5;
    }
    .blockright,
    .judulkas,
    .kasbody,
    .kastop {
        padding: 0;
    }
    .kastitlekanan {
        width: 100%;
    }
    .smallbalance {
        display: inline;
    }
    .smallsaldo {
        color: #505050;
        line-height: 14px;
    }
    .edithapiut .catat {
        top: auto;
        left: 0;
        bottom: 0;
    }
    .bukubeli,
    .bukutengah {
        padding: 0;
        border-bottom: 2px solid #939393;
    }
    .userbox {
        display: none;
    }
    .logo {
        float: right;
        padding: 3px 0 0;
        position: relative;
        right: -8px;
    }
    #catat_trans,
    #catat_trans_transfer,
    .catat {
        left: 0;
        right: auto;
        margin: 0;
    }
    .bottominput {
        display: block;
        border-top: 2px solid #fff;
        box-shadow: 0 0 4px #333;
    }
    .footlogin {
        padding: 16px 8px 64px;
    }
    .catat {
        position: fixed;
        bottom: 0;
        top: auto;
        width: 100%;
        padding: 0 0 16px;
        border-left: 0;
        border-right: 0;
        box-shadow: 0 0 4px #515151;
    }
    .catathapiut {
        bottom: 0;
    }
    .bulannav {
        margin-top: 20px;
        margin-left: 0;
        position: relative;
        top: -1px;
    }
    .small_bulan_nav_left,
    .small_bulan_nav_right {
        width: 21px;
        height: 24px;
        display: block;
        position: absolute;
    }
    .small_bulan_nav_left {
        background: url(gambar/bulan-nav-left.png) center top no-repeat;
        left: 8px;
        top: 14px;
    }
    .small_bulan_nav_left:hover {
        background: url(gambar/bulan-nav-left.png) center bottom no-repeat;
    }
    .small_bulan_nav_right {
        background: url(gambar/bulan-nav-right.png) center top no-repeat;
        right: 8px;
        top: 14px;
    }
    .small_bulan_nav_right:hover {
        background: url(gambar/bulan-nav-right.png) center bottom no-repeat;
    }
    .fulllogo {
        display: inline-block;
        width: auto;
        height: 32px; 
    }
    .smallogo {
        display: none;
    }
    .logo {
        text-align: right; 
    }
    .bodyoptkas,
    .selectcashbar,
    .smalltool div,
    small {
        text-align: center;
    }
    .smalltool {
        display: block;
        border-top: 4px solid #5d5d5d;
    }
    .smalltool div {
        float: left;
        width: 32.5%;
        padding: 10px 0 6px;
        border-right: 1px solid #4e545c;
        border-bottom: 1px solid #4e545c;
        border-left: none;
    }
    .navleft {
        top: -11px;
        z-index: 60;
        height: 102%;
    }
    .refreshlink {
        display: block;
        width: 32px;
        height: 32px;
        background: url(gambar/icon_refresh.png) center top no-repeat;
        margin: 0 auto;
    }
    .refreshlink:hover {
        background: url(gambar/icon_refresh.png) center bottom no-repeat;
    }
    .tdkategori {
        padding: 8px 8px 0 !important;
    }
    .nominaltab {
        margin: 8px -8px 0;
        padding: 4px 8px;
        background: rgba(255, 255, 255, 0.6);
        color: #5f5f5f;
        display: block;
    }
    header {
        height: 36px;
        position: fixed;
        top: 0;
    }
    .navbutton {
        font-size: 14px;
        height: 30px;
        padding: 6px 0 0;
        width: 72px;
    }
    body {
        padding-top: 32px;
    }
    .catatleft {
        display: none;
    }
    .catatright {
        float: none;
        width: 100%;
    }
    #itemdesc textarea {
        width: 94%;
    }
    .catlabel {
        font-size: 12px;
        width: 82px;
        display: inline-block;
    }
    .catlabeldesc {
        padding-bottom: 8px;
        display: block;
    }
    .mainicon,
    .subreport .tdmatauang {
        display: none;
    }
    .catatright #itemdesc {
        height: auto;
        padding: 6px 0 8px 8px;
    }
    .catatbutton {
        padding: 10px 6px 0;
    }
    .selectcashbar {
        height: auto;
    }
    .reportleft {
        float: none;
        width: 100%;
    }
    .reportright {
        float: none;
        width: 100%;
        padding-top: 24px;
    }
    .reportbulanarea {
        position: relative;
        right: 0;
        width: 100%;
        height: 48px;
        border-radius: 0;
        margin: 6px 0 0;
    }
    #bulankasreport {
        float: none;
        width: 100%;
        font-size: 16px;
    }
    .selectcashbar {
        padding: 8px 0 0;
    }
    .tabreport {
        width: 100%;
    }
    .tabreport td {
        width: auto !important;
    }
    small {
        display: block;
    }
    .notetitle {
        border: none;
    }
    .adsarea,
    .debt_tool,
    .debtblock,
    .hapiuttop,
    .kastoolhapiut,
    .optionwrap,
    .searchbukutop {
        border-radius: 0;
    }
    #bodynotes {
        padding-top: 0;
    }
    #invoiceline_1 .inright,
    .option_bookbox,
    .rememberbox small,
    .smallleft {
        text-align: left;
    }
    .option_bookbox {
        margin: 8px;
        display: inline-block;
        float: none;
    }
    .boxusername,
    .download > img {
        display: none;
    }
    .option_bookname {
        text-align: left;
        padding-left: 8px;
    }
    .optionwrap {
        border-left: none;
        border-right: none;
        font-size: 13px;
        padding: 16px 16px 24px;
    }
    .taboption {
        width: 100%;
    }
    .taboption td {
        padding: 4px;
    }
    .option_back {
        margin: -8px 8px 0 0;
    }
    .boxads {
        padding-bottom: 26px;
    }
    .adsarea {
        margin: 0;
        border-bottom: 1px solid #525e6b;
        padding: 0;
    }
    .bigsubs,
    .invnumb input {
        display: block;
    }
    .bigsubs {
        font-size: 32px;
        padding-bottom: 8px;
    }
    .upgrade {
        margin: 16px;
    }
    .upgradebox {
        padding-top: 0 !important;
    }
    .toptext {
        width: 260px;
        right: 0;
    }
    .pricelabel {
        width: 180px;
        height: auto;
        right: -16px;
        right: 0;
    }
    .firsttext {
        font-size: 28px;
        line-height: 32px;
    }
    .secondtext {
        font-size: 14px;
    }
    .htop {
        font-size: 24px;
        top: 0;
    }
    .tabdebthistory,
    .upgradebox p {
        font-size: 12px;
        line-height: 16px;
    }
    .boxfeature {
        padding-top: 64px;
    }
    article {
        width: 100%;
        margin: 16px auto 0;
    }
    .feature {
        height: 240px;
    }
    #featdown {
        height: 280px;
    }
    .public_menu {
        top: 37px;
    }
    .invleft {
        float: none;
        max-width: none;
    }
    .inright {
        float: none;
        padding-top: 28px;
        max-width: none;
    }
    .debtdesc,
    .tabutangdesc {
        display: none;
    }
    #invoicebox {
        padding: 8px;
    }
    .custlisttab th,
    .invbooktab th {
        background: #2c3e50;
        color: #fff;
        padding: 8px 0;
    }
    .invbooktab td {
        padding: 4px;
        min-width: 48px;
    }
    .debtsmall {
        float: none;
        margin-bottom: 16px;
    }
    .debt_tool_right {
        width: 50%;
    }
    .editdebtbox,
    .newdebtbox,
    .paydebt {
        bottom: 0;
        top: auto;
        margin: 0;
        left: 0;
        right: auto;
        height: 95%;
        max-width: 100%;
        overflow: auto;
        border-radius: 0;
        border-top: none;
        border-left: none;
        border-bottom: none;
        position: fixed;
        padding: 3% 16px;
    }
    .editdebtbox textarea,
    .newdebtbox textarea,
    .paydebt textarea {
        height: 38px !important;
    }
    .addsign {
        font-size: 10px;
        line-height: 14px;
    }
    .debtbig {
        font-size: 14px;
        line-height: 18px;
        top: 0;
    }
    .debtto,
    .upgradetextbottom {
        font-size: 12px;
        line-height: 16px;
    }
    .preshare {
        float: none;
        margin-right: 0;
    }
    .pleaseupgradebox {
        width: 300px !important;
        margin-left: -150px;
    }
    .upgradeinside img {
        width: 64px;
        height: auto;
    }
    .upgradetexttop {
        display: block;
        padding: 0;
    }
    .iconcart,
    .moonlefthapiut,
    .premkonfirm {
        display: none;
    }
    .searchbukutop {
        text-align: center;
        line-height: 48px;
    }
    .reportbulanarea .bulankastgl {
        float: none;
        padding: 12px 0 !important;
        text-align: center;
    }
    .boxbelikanan {
        float: none;
        margin: 20px auto;
        width: 100%;
    }
    .boxbelikiri {
        margin-top: 20px;
    }
    .boxbelibawah {
        margin-bottom: 20px;
    }
    .option_belibox {
        width: 75%;
        text-align: left;
        margin-left: 60px;
    }
    .invstampimg_paid,
    .invstampimg_urgent {
        top: -14px;
        width: 120px !important;
        height: 87px !important;
    }
    .subscribe {
        padding-top: 30px;
        margin-top: -55px;
    }
    .invqty {
        margin-left: 8px !important;
    }
    .invstampimg_paid {
        right: 250px;
    }
    .invstampimg_urgent {
        right: 350px;
    }
    .invstampimg_past {
        right: 250px;
        top: 56px;
        width: 120px !important;
        height: 87px !important;
    }
    .invstampimg_approved,
    .invstampimg_received {
        top: 122px;
        width: 120px !important;
        height: 87px !important;
    }
    .invstampimg_approved {
        right: 350px;
    }
    .invstampimg_received {
        right: 250px;
    }
    .invstampimg_final {
        right: 350px;
        top: 56px;
        width: 120px !important;
        height: 87px !important;
    }
    #tglcusreportfrom,
    #tglcusreportto {
        width: 180px !important;
        padding: 12px !important;
        position: relative;
    }
    .notifdelitem {
        top: 33% !important;
        left: 20% !important;
    }
    #create_book_notif {
        width: 510px;
        margin: 0 auto;
    }
    .boxstatus:hover {
        background: #60676f;
    }
    #newcredit,
    #newdebt {
        margin-right: 8px;
    }
    #bulannavreport {
        margin-top: 60px;
        top: -45px;
        margin-right: auto;
    }
    .kastoolhapiutdetil {
        display: block;
        background: #e9e9e9;
        text-align: center;
    }
    .labelcheckdue {
        margin-left: 84px;
    }
    #catatkas {
        display: none;
    }
    .hapiuttop,
    .kastoolhapiut {
        background: 0 0;
        box-shadow: none;
        border-top: none;
        margin: 10px 0;
    }
    .bottominput.disablecatat {
        background: #e1e1e1;
    }
    .disablecatat td {
        opacity: 0.6;
    }
    #bulancustomarea {
        width: 100% !important;
    }
    #tglcusreportfrom {
        text-align: left;
        left: -360px !important;
    }
    #tglcusreportto {
        right: -120px !important;
    }
    .customtoreport {
        right: -123px !important;
        position: relative;
        width: 80px !important;
        padding: 15px 0 !important;
        top: 0 !important;
    }
    .voucheryes {
        width: 490px;
        right: 0;
        margin: 0 auto;
    }
}
@media only screen and (max-width: 600px) {
    .kbox {
        width: 100%;
    }
    .konfirmasi_box {
        padding: 30px 10px 0;
    }
}
@media only screen and (max-width: 590px) {
    #invstamp {
        display: flex;
        flex-wrap: wrap;
    }
    .scrolltabinv {
        overflow-x: scroll;
        white-space: nowrap;
        max-width: 100%;
        height: auto;
    }
    .invdelask {
        top: 40% !important;
        left: 24% !important;
        width: 240px !important;
    }
    .loader_discode {
        position: absolute;
        right: 20px;
        top: 336px;
        display: none;
    }
    #tglcusreportfrom {
        left: -310px !important;
    }
    #tglcusreportto,
    .customtoreport {
        right: -180px !important;
    }
}
@media only screen and (max-width: 520px) {
    .invstampimg_approved,
    .invstampimg_final,
    .invstampimg_paid,
    .invstampimg_past,
    .invstampimg_received,
    .invstampimg_urgent {
        right: 250px;
        width: 120px !important;
        height: 87px !important;
    }
    .invbdate,
    .invloader {
        display: none;
    }
    .invstampimg_paid {
        top: -27px;
    }
    .invstampimg_urgent {
        top: 20px;
    }
    .invstampimg_past {
        top: 68px;
    }
    .invstampimg_approved {
        top: 115px;
    }
    .invstampimg_received {
        top: 160px;
    }
    .invstampimg_final {
        top: 205px;
    }
    .invloader {
        position: relative;
        left: 50px;
        top: 20px;
    }
    .notifdelitem {
        top: 33% !important;
        left: 15% !important;
        width: 340px !important;
    }
    #create_book_notif {
        width: 400px;
        margin: 0 auto;
    }
    #tglcusreportfrom {
        left: -280px !important;
        padding: 12px 0 !important;
    }
    #tglcusreportto {
        right: -165px !important;
        padding: 12px 0 !important;
    }
    .customtoreport {
        right: -162px !important;
    }
    .voucheryes {
        width: 450px;
    }
}
@media only screen and (max-width: 480px) {
    #tglcusreportto,
    .customtoreport {
        text-align: center !important;
        width: 100% !important;
        right: 0 !important;
    }
    #bulancustomarea {
        height: 72px;
    }
    #tglcusreportfrom {
        padding: 0 !important;
        text-align: center !important;
        width: 100% !important;
        margin: 0;
        left: 0 !important;
    }
    #tglcusreportto {
        padding: 20px 0 0 !important;
    }
    .customtoreport {
        padding: 0 !important;
        margin: 0;
        display: block;
        top: 25px !important;
        position: absolute;
        left: 0;
    }
    .voucheryes {
        width: 340px;
    }
}
@media only screen and (max-width: 420px) {
    .bulankas,
    .h3report {
        text-align: center;
    }
    #hp_ampm,
    #hp_ampm_due,
    #hp_jam,
    #hp_jam_due,
    #hp_menit,
    #hp_menit_due,
    #hp_trans_ampm,
    #hp_trans_ampm_due,
    #hpitem_ampm,
    #hpitem_jam,
    #hpitem_menit,
    #hpitem_trans_ampm,
    #trans_ampm,
    #trans_jam,
    #trans_menit,
    #trans_trans_ampm,
    #trans_trans_jam,
    #trans_trans_menit,
    .iconreport,
    .tabnominal,
    .tabtype {
        display: none;
    }
    #featdown,
    .feature,
    .newchild,
    .thanksbox img {
        height: auto;
    }
    .dataTables_wrapper .dataTables_filter,
    .dataTables_wrapper .dataTables_length {
        float: none;
        text-align: center;
        margin: 0 auto 10px;
        padding-top: 10px;
    }
    .dataTables_wrapper .dataTables_filter {
        margin-top: 0.5em;
    }
    #bukukas,
    #taborder {
        font-size: 12px;
    }
    article {
        min-width: 200px;
    }
    .bodyreport {
        padding: 8px 0;
    }
    .selectcashbar {
        border-radius: 0;
        margin: 0 0 16px;
    }
    .ui-tabs {
        padding: 0 !important;
        border: 0 !important;
    }
    .ui-corner-all {
        border-radius: 0 !important;
    }
    .ui-tabs .ui-tabs-nav .ui-tabs-anchor {
        padding: 4px 8px !important;
        font-size: 12px;
    }
    .ui-tabs .ui-tabs-nav li {
        margin: 0 !important;
    }
    .ui-tabs .ui-tabs-panel {
        padding: 16px 5px !important;
    }
    .h3report,
    .reportbox {
        padding: 8px 0;
    }
    .h3report {
        border-radius: 0;
        font-size: 18px;
        line-height: 24px;
        background: #818181;
        color: #fff;
    }
    .andesc,
    .reportleft .tdmatauang,
    .tabreport .tdmatauang {
        display: none !important;
    }
    .notifreport {
        font-size: 16px;
        line-height: 20px;
    }
    .smallnote {
        width: 130px;
    }
    .popnote {
        width: 280px;
        margin: 20px auto 0;
    }
    .noteright {
        width: 130px;
    }
    .option_bookbox {
        display: block;
        float: none;
        text-align: left;
        margin: 8px auto;
    }
    .taboption #desc_buku,
    .taboption #newdesc,
    .taboption #newname {
        width: 148px !important;
    }
    .option_back {
        display: none;
    }
    .option_bookname {
        text-align: center;
        padding: 0;
    }
    .option_back_small {
        display: block;
        float: right;
        margin: 32px 8px 0 0;
        padding: 4px 8px !important;
        background: #999 !important;
        border: none !important;
    }
    .option_back_small:hover {
        background: #2c3e50 !important;
    }
    .katbutton {
        float: none;
        padding: 0;
        text-align: left;
        width: auto;
        margin-top: 8px;
    }
    .loader_newkat {
        right: 8px;
        bottom: 8px;
        top: auto;
    }
    .renamecat {
        display: block;
        margin-bottom: 8px;
    }
    .useroptionbox {
        font-size: 13px;
        line-height: 18px;
    }
    .useroptionbox td {
        vertical-align: middle;
    }
    .addchild {
        font-size: 12px;
        position: static;
        margin-bottom: 16px;
    }
    .addchild:active,
    .addchild:focus {
        position: static !important;
    }
    .newchild {
        position: relative;
        bottom: 0;
        left: 0;
        top: auto;
        width: calc(100% - 22px);
        background: #fff;
        padding: 16px 10px !important;
    }
    .loginbox,
    .registerbox {
        width: 260px;
    }
    .taboptaccount td {
        vertical-align: baseline;
        padding: 4px !important;
    }
    .userlabel {
        font-size: 12px;
        display: block;
    }
    .bigsubs,
    .loginarea h2 {
        font-size: 24px;
    }
    .tdoptuserleft {
        display: none;
    }
    footer {
        padding: 24px 8px 16px;
    }
    .grecaptcha {
        margin: 0 -24px;
    }
    .boxadsreport {
        padding: 0;
        border-radius: 0;
    }
    .choosepepeku {
        max-width: 260px;
    }
    .loginarea h2 {
        line-height: 30px;
    }
    .upgradebox {
        padding: 0 16px 16px !important;
    }
    .headwrap {
        min-width: 0;
    }
    .toptext {
        top: -16px;
        right: 0;
        float: left;
        text-align: left;
        margin: 0 0 0 16px;
    }
    .htop,
    .subscribe {
        text-align: center;
    }
    .firsttext {
        padding-right: 0;
    }
    .htop {
        padding: 16px;
    }
    .feature {
        float: none;
        width: auto;
    }
    .featuretext {
        margin: 8px 8px 0;
        padding: 92px 8px 16px;
    }
    .subscribe {
        padding: 16px;
        margin-top: 10px;
    }
    .thanksbox img {
        width: 160px;
    }
    h2.thanks {
        font-size: 20px;
        line-height: 24px;
    }
    #showdebt {
        width: 64px;
    }
    #debt_pay,
    .debtbutton {
        font-size: 12px;
        padding: 4px !important;
        position: relative;
        top: 4px;
    }
    .pleaseupgradebox {
        width: 240px !important;
        margin-left: -120px;
    }
    .upgradeinside img {
        height: auto;
        width: 48px;
    }
    .upgradebutton input {
        display: block;
        margin: 0 auto 8px;
    }
    .searchbukutop input,
    .searchbukutop select {
        display: block;
        width: 90%;
        margin: 4px auto;
    }
    .searchbukutop #find_search {
        padding: 8px 0;
        text-align: center;
    }
    #hp_alsocash,
    #hpitem_alsocash {
        display: block;
        margin: 8px 0 0;
    }
    .iconcart,
    .invbdate,
    .invbduedate {
        display: none;
    }
    #catat_hpitem {
        top: auto;
    }
    .boxbelikanan {
        float: none;
        margin: 20px auto;
        width: 100%;
    }
    .boxbelibawah {
        margin-bottom: 20px;
    }
    .boxbelikiri {
        margin-top: 10px;
    }
    .tabcekout th {
        width: 60%;
    }
    .tabcekout td {
        width: 40%;
    }
    .option_belibox {
        margin: 10px 0 0 40px;
    }
    .invdelask {
        top: 40% !important;
        left: 18% !important;
        width: 220px !important;
    }
    .invid {
        width: 30px !important;
    }
    .invdesc {
        height: 40px !important;
        width: 100px !important;
    }
    .invbtotval {
        width: 130px;
    }
    .custlisttab,
    .custlisttab td,
    .invbooktab {
        padding: 5px;
    }
    #custact {
        width: 58px !important;
    }
    .invstampimg_approved,
    .invstampimg_final,
    .invstampimg_paid,
    .invstampimg_past,
    .invstampimg_received,
    .invstampimg_urgent {
        right: 220px;
        width: 120px !important;
        height: 87px !important;
    }
    #childpassnote {
        word-wrap: break-word !important;
        display: table-cell;
    }
    .invqty {
        margin-left: 2px !important;
    }
    .invstampimg_paid {
        top: -14px;
    }
    .invstampimg_urgent {
        top: 28px;
    }
    .invstampimg_past {
        top: 70px;
    }
    .invstampimg_approved {
        top: 110px;
    }
    .invstampimg_received {
        top: 150px;
    }
    .invstampimg_final {
        top: 190px;
    }
    .notifdelitem {
        top: 33% !important;
        left: 10% !important;
        width: 320px !important;
    }
    .loader_discode {
        position: absolute;
        right: 10px;
        top: 362px;
        display: none;
    }
    .topwizard img {
        overflow: hidden;
        float: left;
        margin: 8px 0 0 30px;
    }
    .topwizard h2 {
        margin-right: 25px;
    }
    #create_book_notif {
        width: 310px;
        margin: 0 auto;
    }
    .popup {
        left: 47%;
        width: 280px;
    }
    .networkbox {
        width: 320px;
        height: 100px;
        margin-bottom: 15px;
    }
    .inv_opsicashbook { position: relative; right: 0; bottom: 0; margin-top: 8px; }
    .inv_opsicashbook small { display: inline-block; text-align: right; color:#fff; }
}
@media only screen and (max-width: 360px) {
    .invstampimg_approved,
    .invstampimg_final,
    .invstampimg_paid,
    .invstampimg_past,
    .invstampimg_received,
    .invstampimg_urgent {
        right: 180px;
        width: 120px !important;
        height: 87px !important;
    }
    .invstampimg_paid {
        top: -14px;
    }
    .invstampimg_urgent {
        top: 28px;
    }
    .invstampimg_past {
        top: 70px;
    }
    .invstampimg_approved {
        top: 110px;
    }
    .invstampimg_received {
        top: 150px;
    }
    .invstampimg_final {
        top: 190px;
    }
    .taboptaccount input[type="text"] {
        width: 200px !important;
    }
    #bankuser,
    #child_mail,
    #child_name,
    #namauser,
    #rekuser {
        width: 160px !important;
    }
    #main_use {
        width: 209px !important;
    }
    .option_belibox {
        margin-left: 6% !important;
    }
    .notifdelitem {
        top: 33% !important;
        left: 8% !important;
        width: 300px !important;
    }
    .invbtotval {
        display: none;
    }
    .loader_discode {
        position: absolute;
        right: 10px;
        top: 362px;
        display: none;
    }
    .hapiuttop {
        height: auto;
    }
    .loadnotif {
        left: 45%;
    }
    .voucheryes {
        width: 280px;
    }
}
@media only screen and (max-width: 320px) {
    .invstampimg_approved,
    .invstampimg_final,
    .invstampimg_paid,
    .invstampimg_past,
    .invstampimg_received,
    .invstampimg_urgent {
        right: 200px;
        width: 90px !important;
        height: 67px !important;
    }
    .invstampimg_paid {
        top: -10px;
    }
    .invstampimg_urgent {
        top: 30px;
    }
    .invstampimg_past {
        top: 70px;
    }
    .invstampimg_approved {
        top: 190px;
    }
    .invstampimg_received {
        top: 150px;
    }
    .invstampimg_final {
        top: 110px;
    }
    .invdelask {
        top: 35% !important;
        left: 13% !important;
        width: 200px !important;
    }
    #child_mail,
    #child_name {
        width: 150px !important;
    }
    .taboptaccount td {
        padding: 3px !important;
    }
    .konfirmasipem {
        padding: 10px;
    }
    .detil_tgl {
        font-size: 15px !important;
    }
    .notifdelitem {
        top: 33% !important;
        left: 8% !important;
        width: 270px !important;
    }
    .invbooktab {
        padding: 2px;
    }
    .networkbox {
        width: 270px;
        height: 100px;
        margin-bottom: 15px;
    }
}
@media print {
    .download,
    .navleft,
    .ui-tooltip,
    header {
        display: none !important;
    }
    .ui-widget-content {
        border: none !important;
    }
    .blockright {
        padding: 0;
    }
}
.paypalbtn {
    width: 78%;
    left: 10%;
    font-weight: 700;
    padding: 0 0;
    display: block;
    position: absolute;
    bottom: 20px;
}
.thank-paypal {
    padding: 15px 0;
}
.thank-paypal span {
    display: block;
    margin-bottom: 10px;
}
.thank-paypal span.small {
    font-size: 14px;
    line-height: 20px;
    margin-bottom: 0;
}
.icon-you-save {
    position: absolute;
    right: -40px;
    top: -28px;
}
.label-you-save {
    position: absolute;
    right: -27px;
    top: 8px;
    color: #fff;
    font-size: 20px;
    font-weight: 700;
    transform: rotate(8deg);
    width: 58px;
    text-align: center;
}
.bulankas select,
.bulankas select:active,
.bulankas select:focus,
.bulankas select:hover {
    border-radius: 0;
    border: 0;
    border-bottom: 1px solid #9ea5aa;
    background: 0 0;
    box-shadow: none;
}
.reportbulanarea .bulankas select {
    color: #fff;
}
.reportbulanarea .bulankas select option {
    background: #fff;
    color: #5e5e5e;
}
.bulannav .bulan_nav_left,
.bulannav .bulan_nav_right {
    margin-top: 6px;
}
.reportleft.reportdetail {
    width: 58%;
}
.reportright.reportdetail {
    width: 40%;
}
.notebottom.notifno{
    background: #9e0039;
    color: #fff;
    text-align: center;
}