/* CSS Document */
@charset "utf-8";
@import url(https://fonts.googleapis.com/css?family=Open+Sans:400,300,400italic,700&subset=latin,greek,greek-ext,latin-ext);
/* Reset Browser */
html, body, div, span, applet, object, iframe, h1, h2, h3, h4, h5, h6, p, blockquote, pre, a, abbr, acronym,
address, big, cite, code, del, dfn, em, font, ins, kbd, q, s, samp, small, strike, strong, sub, sup, tt, var,
dl, dt, dd, ol, ul, li, fieldset, form, label, legend, table, caption, tbody, tfoot, thead, tr, th, td {
	border: 0;
	font-family: inherit;
	font-size: 100%;
	font-style: inherit;
	font-weight: inherit;
	margin: 0;
	outline: 0;
	padding: 0;
	vertical-align: baseline;
}
:focus { outline: 0; }
body { background: url(images/background.jpg) #FDFEF9; line-height: 1; font-size: 13px;
	font-family: 'Open Sans', sans-serif; color: #474f4f; font-weight: 400; min-width:1200px; }
ol, ul { list-style: none; }
table { border-collapse: separate; border-spacing: 0; }
caption, th, td { font-weight: normal; text-align: left; }
blockquote:before, blockquote:after, q:before, q:after { content: ""; }
blockquote, q { quotes: "" ""; }
a { color: #5e5e5e; text-decoration: none; }
a img { border: 0; }
article, aside, details, figcaption, figure, footer, header, hgroup, menu, nav, section { display: block; }
audio, canvas, video { display: inline-block; }
audio:not([controls]) { display: none; }
del { color: #333; }
ins { background: none; text-decoration: none; }
hr { background-color: #ccc; border: 0; height: 1px; margin: 24px; margin-bottom: 1.714285714rem; }
sub, sup { font-size: 75%; line-height: 0; position: relative; vertical-align: baseline; }
sup { top: -0.5em; }
sub { bottom: -0.25em; }
small { font-size: 9px; line-height: 12px; color: #888888; }
img { border: 0; -ms-interpolation-mode: bicubic; }
em { font-style: italic; }
.clear { clear: both; }
.hidden { display: none; }
.pointer { cursor: pointer; }
input, select, textarea { font-size: 12px; line-height: 16px; font-family: 'Open Sans', sans-serif; }
input:not([type]), input[type="text"], input[type="search"], input[type="password"], input[type="email"], select, textarea, input[type="number"] {
	padding: 4px;
	border: 1px solid #0F5959;
	border-radius: 4px;
	background: #e0efed;
	color: #0F5959;
}
input:not([type]), input[type="text"]:hover, select:hover, input[type="search"]:hover,
input[type="email"]:hover, input[type="password"]:hover, textarea:hover, input[type="number"]:hover {
	border: 1px solid #F78A3C; background: #e0efed; }
input:not([type]), input[type="text"]:focus, select:focus, input[type="password"]:focus, input[type="search"]:focus,
input[type="email"]:focus, textarea:focus, input[type="number"]:focus {
	color: #383838; background: #FFF; border: 1px solid #17a697; box-shadow: 0 0 2px #999; }
input:not([type]), input[type="submit"], input[type="button"], .button {
	-moz-box-shadow:inset 0px 1px 0px 0px #ffad72;
	-webkit-box-shadow:inset 0px 1px 0px 0px #ffad72;
	box-shadow:inset 0px 1px 0px 0px #ffad72;
	background:-webkit-gradient(linear, left top, left bottom, color-stop(0.05, #f78a3c), color-stop(1, #d93240));
	background:-moz-linear-gradient(top, #f78a3c 5%, #d93240 100%);
	background:-webkit-linear-gradient(top, #f78a3c 5%, #d93240 100%);
	background:-o-linear-gradient(top, #f78a3c 5%, #d93240 100%);
	background:-ms-linear-gradient(top, #f78a3c 5%, #d93240 100%);
	background:linear-gradient(to bottom, #f78a3c 5%, #d93240 100%);
	filter:progid:DXImageTransform.Microsoft.gradient(startColorstr='#f78a3c', endColorstr='#d93240',GradientType=0);
	background-color:#f78a3c;
	-moz-border-radius:8px;
	-webkit-border-radius:8px;
	border-radius:8px;
	border:1px solid #f78a3c;
	display:inline-block;
	cursor:pointer;
	color:#ffffff;
	font-size:14px;
	padding:8px 20px;
	text-decoration:none;
}
input:not([type]), input[type="submit"]:hover, input[type="button"]:hover, .button:hover {
	background:-webkit-gradient(linear, left top, left bottom, color-stop(0.05, #d93240), color-stop(1, #f78a3c));
	background:-moz-linear-gradient(top, #d93240 5%, #f78a3c 100%);
	background:-webkit-linear-gradient(top, #d93240 5%, #f78a3c 100%);
	background:-o-linear-gradient(top, #d93240 5%, #f78a3c 100%);
	background:-ms-linear-gradient(top, #d93240 5%, #f78a3c 100%);
	background:linear-gradient(to bottom, #d93240 5%, #f78a3c 100%);
	filter:progid:DXImageTransform.Microsoft.gradient(startColorstr='#d93240', endColorstr='#f78a3c',GradientType=0);
	background-color:#d93240;
}
input:not([type]), input[type="submit"]:active, input[type="button"]:active, .button:active { background: #DC3A40; }
input[type="text"]:disabled, input[readonly="readonly"] { background: #FFF; border: 1px solid #CCC; }
input[readonly="readonly"]:hover, input[readonly="readonly"]:focus { background: #FFF; border: 1px solid #CCC; box-shadow: none; }
input:not([type]), input[type="search"], input[type="search"]:hover, input[type="search"]:focus {
	background-image: url(images/search.png);
	background-position: 3px 3px;
	background-repeat: no-repeat;
	padding: 4px 4px 4px 28px;
}
.notif {
	line-height: 18px;
	margin: 8px 0;
	text-align: center;
	color: #FFF;
	display: none;
}
.notif.nomargin { margin: 0px; }
.notif.margintop { margin: 10px auto 0px; }
.notif.nomargin-center { margin: 0px 5px; }
a.button:hover { text-decoration: none; }
.notif div { border: 1px solid #FFF; box-shadow: 0 0 4px #999; padding: 8px; border-radius: 4px; }
.notifno { background: #d93240; }
.notifyes { background: #0f5959; }
.smallnotif.notif div { padding: 0px 5px; border-radius: 0px; border: 0px; box-shadow: none; }
.smallnotif.notif .notifno { color: #d93240; background: none; }
.left { text-align: left; }
.center { text-align: center; }
.right { text-align: right; }
.none { display: none; }
strong { font-weight: 700; }
.desctop {
	font-size: 10px;
	line-height: 14px;
	border: none;
	color: #5EA4A7;
	font-weight: normal;
	margin: 0;
	padding: 0;
	display: block;
	position: absolute;
	top: 29px;
	left: 112px;
}

/* Tipografi */
h2 {
	font-size: 24px;
	font-weight: 700;
	line-height: 36px;
	color: #f78a3c;
	padding: 8px 0 0 48px;
	margin-bottom: 32px;
	border-bottom: 1px dotted #f78a3c;
}
h2#user { background: url(images/icon_user.png) left center no-repeat; }
h2#cash { background: url(images/icon_cash.png) left center no-repeat; margin-bottom: 4px; }
h2#credit { background: url(images/icon_credit.png) left center no-repeat;}
h2#inventory { background: url(images/icon_inventory.png) left center no-repeat; }
h2#production { background: url(images/icon_working.png) left center no-repeat; }
h2#option { background: url(images/icon_general.png) left center no-repeat; }
h2#report { background: url(images/icon_report.png) left center no-repeat; }
h2#home { background: url(images/icon_home.png) left center no-repeat; }
h2#order { background: url(images/icon_order.png) left center no-repeat; }
h2#jualbeli { background: url(images/icon_jualbeli.png) left center no-repeat; margin-bottom: 4px; }
h2#member { background: url(images/teamwork.png) left center no-repeat; }
h2#happy { background: url(images/icon_happy.png) left center no-repeat; margin-bottom: 4px; }
h2#import { background: url(images/icon_upload.png) left center no-repeat; margin-bottom: 4px; }
h3 {
	font-size: 18px;
	font-weight: 400;
	line-height: 24px;
	color: #f78a3c;
	padding: 8px 0 6px 0;
}
p { line-height: 18px; padding: 8px; }

/* Header */
header {
	background: #0f5959;
	border-bottom: 3px solid #17a697;
	box-shadow: 0 2px 4px #999;
	display: block;
}
.headwrap {
	height: 48px;
	margin: 0 32px;
	position: relative;
	z-index: 500;
}
.headwrap h1.deflogo {
	display: block;
	float: left;
	width: 150px;
	padding: 8px 0 0 0;
}
.headwrap h1.cnlogo {
	display: block;
	float: left;
	max-width: 160px;
	text-align: center;
	background: #FFF;
	padding: 12px 16px;
	border-left: 2px solid #17A697;
	border-bottom: 2px solid #17A697;
	border-right: 2px solid #17A697;
	border-radius: 0 0 8px 8px;
}
footer {
	text-align: center;
	padding: 16px 0;
	font-size: 10px;
	line-height: 16px;
	color: #999;
}
/* Menu CSS */
.cssmenu {
	float: right;
	width: 50%;
}
#cssmenu, #cssmenu > ul {
  background: url(images/highlight-bg.png) repeat;
  padding-bottom: 3px;
  font-weight: 600;
}
#cssmenu:before,
#cssmenu:after,
#cssmenu > ul:before,
#cssmenu > ul:after {
  content: "";
  display: table;
}
#cssmenu:after,
#cssmenu > ul:after {
  clear: both;
}
#cssmenu {
  width: auto;
  zoom: 1;
}
#cssmenu > ul {
  background: #0F5959;
  margin: 0;
  padding: 0;
  position: relative;
}
#cssmenu > ul li {
  margin: 0;
  padding: 0;
  list-style: none;
}
#cssmenu > ul > li {
  float: left;
  position: relative;
}
#cssmenu > ul > li > a {
  padding: 12px 14px;
  display: block;
  color: white;
  font-size: 13px;
  text-decoration: none;
  text-transform: uppercase;
  text-shadow: 0 -1px 0 #0d0d0d;
  text-shadow: 0 -1px 0 rgba(0, 0, 0, 0.7);
  line-height: 18px;
}
#cssmenu > ul > li:hover > a {
  background: url(images/highlight-bg.png) repeat;
  text-shadow: 0 -1px 0 #97321f;
  text-shadow: 0 -1px 0 rgba(122, 42, 26, 0.64);
}
#cssmenu > ul > li > a > span {
  line-height: 18px;
}
#cssmenu > ul > li.active > a,
#cssmenu > ul > li > a:active {
  background: #104444;
}
/* Childs */
#cssmenu > ul ul {
  opacity: 0;
  visibility: hidden;
  position: absolute;
  /*top: 120px;*/
  background: #0F5959;
  margin: 0;
  padding: 0;
  z-index: -1;
}
#cssmenu > ul li:hover ul {
  opacity: 1;
  visibility: visible;
  margin: 0;
  color: #000;
  z-index: 2;
  /*top: 64px;*/
  left: 0;
}
#cssmenu > ul ul:before {
  content: "";
  position: absolute;
  top: -10px;
  width: 100%;
  height: 20px;
  background: transparent;
}
#cssmenu > ul ul li {
  list-style: none;
  padding: 0;
  margin: 0;
  width: 100%;
}
#cssmenu > ul ul li a {
  padding: 12px 16px;
  display: block;
  color: white;
  font-size: 11px;
  text-decoration: none;
  text-transform: uppercase;
  width: 200px;
  border-left: 4px solid transparent;
  -webkit-transition: all 0.35s ease-in-out;
  -moz-transition: all 0.35s ease-in-out;
  -ms-transition: all 0.35s ease-in-out;
  transition: all 0.35s ease-in-out;
  font-weight: 400;
}
#cssmenu > ul ul li a:hover {
  border-left: 4px solid #17A697;
  background: url(images/hover.png) repeat;
}
#cssmenu > ul ul li a:activer {
  background: url(images/menu-bg.png) repeat;
}
#cssmenu > ul ul li.active a {
  border-left: 4px solid #17A697;
  background: url(images/hover.png) repeat;
}
.has-sub:last-child  ul li a {
	width: 128px !important;
}
/*
.last-menu ul li a {
	width: 128px !important;
}
*/
/* Data Table */
.dataTable th {
	background: #17a697;
	text-align:center;
	color: #FFF;
	line-height: 18px;
}
.dataTable td {
	vertical-align: middle;
	line-height: 18px;
}
.dataTable th.sorting_desc, .dataTable th.sorting_asc {
	background: #109083;
}
.dataTable .odd {
	background: #edefeb;
}
.dataTable tbody tr:hover {
	background: #c8e5e7;
}
.dataTables_length, .dataTables_filter {
	margin-bottom: 16px;
}
.dataTables_filter input {
	width: 170px;
}
/* Middle */
article {
	display: block;
	padding: 16px 0;
	position: relative;
}
.wrapper {
	margin: 0 32px;
	min-height: 320px;
	background: #FFF;
	position: relative;
	border: 1px solid #cecece;
	border-radius: 0 8px 8px 8px;
	padding: 32px;
}
.notip { border-radius: 8px; }
.loginbox {
	width: 50%;
	max-width: 480px;
	min-width: 320px;
	margin: 128px auto 32px auto;
	text-align: center;
	border: 1px solid #999e95;
	padding: 32px 16px;
	border-radius: 8px;
	background: #FFF;
	box-shadow: 0 0 24px #EFEFEF;
	position: relative;
}
.loginbox input {
	display: block;
	margin: 4px auto;
}
.loginbox .loginsubmit {
	margin: 16px auto 0 auto;
}
.loginbox h2 {
	text-align: center;
	text-transform: uppercase;
	padding: 0 0 24px;
	border: none;
	margin: 0;
}
#login_loader {
	right: 148px;
	top: 196px;
}
.topnav {
	padding: 8px 32px 0 32px;
}
.topnav a {
	padding: 8px 16px;
	display: inline-block;
	background: #17A697;
	border-radius: 4px 4px 0 0;
	color: #FFF;
	position: relative;
}
.topnav a:hover {
	background: #0F5959;
}
.topnav a.active {
	background: #FFF;
	color: #0F5959;
	border-top: 1px solid #cecece;
	border-left: 1px solid #cecece;
	border-right: 1px solid #cecece;
	cursor: default;
	z-index: 10;
	top: 1px;
}
.newbutton {
	position: absolute;
	right: 32px;
	top: 32px;
	display: block;
	width: auto;
}
.editbutton {
	position: absolute;
	right: 32px;
	top: 32px;
	display: block;
	width: auto;
}
.tabicon {
	opacity: 0.7;
	cursor: pointer;
}
.tabicon:hover {
	opacity: 1;
}
.tabicon.disable:hover {
    opacity: 0.7;
}
.ui-tooltip {
	padding: 8px 16px;
	line-height: 14px;
}
.logouticon {
	float: right;
	display: block;
	margin: 12px 0 0 16px;
	cursor: pointer;
	opacity: 0.6;
}
.logouticon:hover {
	opacity: 1;
}
.stdtable {
	width: 98%;
	border-top: 1px dotted #d8d9d6;
}
.stdtable td {
	padding: 6px 4px;
	border-bottom: 1px dotted #d8d9d6;
	vertical-align: middle;
	line-height: 18px;
}
.stdtable.table-full th { background: #17A697; color: #fff; padding: 6px 4px; line-height: 18px; }
.stdtable.table-log th { background: #eaeaea; color: #000; padding: 6px 4px; line-height: 18px; }
.top { vertical-align: top !important; padding-top: 8px !important; }
.floatleft {
	width: 49.5%;
	float: left;
}
.floatright {
	width: 49.5%;
	float: right;
}
.custombox {
	height: 248px;
	overflow: auto;
}
.custombox table {
	border-top: none;
}
.submitarea {
	margin: 48px 0 8px 0;
	width: 50%;
	position: relative;
}
.loader {
	position: absolute;
	display: none;
}
.rolelist {
	display: none;
}
.popup {
	position: fixed;
	top: 45%;
	left: 50%;
	margin-left: -240px;
	margin-top: -72px;
	width: 480px;
	height: auto;
	color: #FFF;
	border-radius: 8px;
	padding: 16px;
	line-height: 18px;
	text-align: center;
	border: 1px solid #FFF;
	box-shadow: 0 0 8px #333;
	display: none;
	z-index: 10;
}
.popdel {
	background: #d93240;
}
.popnew {
	background: #efefef;
	color: #474f4f;
}
#adduser_loader {
	top: 2px;
	left: 240px;
}
#popnewcash {
	margin-top: -172px;
	width: 400px;
	margin-left: -200px;
}
.popup h3, .poptrans h3 {
	color: #f78a3c;
	text-align: left;
	font-size: 18px;
	line-height: 28px;
	font-weight: 700;
	padding: 0;
	margin: 0;
}
.popup .submitarea, .poptrans .submitarea {
	width: auto;
	margin: 16px 0 8px 0;
}
#addcash_loader, #addcategory_loader, #pm_loader, #inv_loader, #sell_loader,
#dump_loader, #buy_loader, #wip_loader, .pop_loader {
	right: 48px;
	bottom: 2px;
}
.hello {
	text-align: right;
	width: 30%;
	position: absolute;
	right: 40px;
	top: 24px;
	font-style: italic;
	color: #0F5959;
	text-shadow: 1px 1px 1px #FFF;
	opacity: 0.8;
}
.hello a {
	font-weight: 700;
	color: #0F5959;
}
.hello a:hover {
	color: #F78A3C;
}
.catbox {
	padding-bottom: 16px;
}

element.style {
    display: block;
}
#popnewcategory {
    margin-left: -200px;
    margin-top: -200px;
    width: 400px;
}
.row_in {
	background: #d2efd8 !important;
}
.row_out {
	background: #efe0e1 !important;
}
.row_in td, .row_out td {
	border-bottom: 1px dotted #FFF;
}
.row_in:hover, .row_out:hover {
	background: #C8E5E7 !important;
}
.progress {
  height: 20px;
  margin-bottom: 20px;
  overflow: hidden;
  background-color: #f5f5f5;
  border-radius: 4px;
  -webkit-box-shadow: inset 0 1px 2px rgba(0, 0, 0, .1);
          box-shadow: inset 0 1px 2px rgba(0, 0, 0, .1);
}
.progress-bar {
  float: left;
  width: 0;
  height: 100%;
  font-size: 12px;
  line-height: 20px;
  color: #fff;
  text-align: center;
  background-color: #428bca;
  -webkit-box-shadow: inset 0 -1px 0 rgba(0, 0, 0, .15);
          box-shadow: inset 0 -1px 0 rgba(0, 0, 0, .15);
  -webkit-transition: width .6s ease;
       -o-transition: width .6s ease;
          transition: width .6s ease;
}
.fileinput-button {
  position: relative;
  overflow: hidden;
  display: inline-block;
}
.fileinput-button input {
  position: absolute;
  top: 0;
  right: 0;
  margin: 0;
  opacity: 0;
  -ms-filter: 'alpha(opacity=0)';
  font-size: 200px;
  direction: ltr;
  cursor: pointer;
}
.uparea {
	height:100px;
	padding: 4px 0;
	border-bottom: 1px dotted #d8d9d6;
}
/* Fixes for IE < 8 */
@media screen\9 {
  .fileinput-button input {
    filter: alpha(opacity=0);
    font-size: 100%;
    height: 100%;
  }
}

#general_loader {
	left: 120px;
    top: 2px;
}
.buttonsmall {
	background: #17A697;
	color: #FFF;
	padding: 4px 8px;
	border-radius: 4px;
	font-size: 12px;
	line-height: 16px;
}
.buttonsmall:hover {
	background: #0F5959;
}
.userphotoup {
	position: relative;
	border-radius: 0;
	width: 144px;
	text-align: center;
	display: block;
	padding: 5px 8px;
}
.userpicbox {
	width: 200px;
	position: relative;
}
.userpicdel {
	position: absolute;
	top: -6px;
	left: -6px;
	z-index: 5;
	opacity: 1;
	background: #FFF;
	border-radius: 16px;
	padding: 2px;
}
.userpicdel:hover {
	box-shadow: 0 0 4px #000;
}
.userpicprogress {
	width: 160px;
	position: relative;
	top: -10px;
}
.cashsaldo {
	position: absolute;
	width: 40%;
	text-align: right;
	top: 12px;
	right: 32px;
	font-size: 28px;
	color: #17A697;
	font-weight: 300;
	line-height: 34px;
}
.singlecashsaldo {
	top: 38px;
}
.cashsaldo .jnumber { font-size: 28px; color: #17A697; font-weight: 300; padding: 0px; border: none; }
.cashsaldo .jnumber:hover, .cashsaldo .jnumber:focus { border: none; color: #17A697; } 
.cashsaldoall {
	position: absolute;
	width: 30%;
	text-align: right;
	top: 40px;
	right: 32px;
	font-size: 11px;
	color: #999;
	font-weight: 300;
	line-height: 34px;
}
.cashdesc {
	float: left;
	width: 20%;
}
.cashtot {
	float: right;
	width: 20%;
	text-align: right;
}
.tooltop {
	padding: 8px 0 8px 8px;
	background: #8fd4d9;
	position: relative;
	margin-bottom: 16px;
}
select.datetop {
	font-size: 14px;
	line-height: 18px;
	padding: 5px;
}
.lowbar {
	padding: 2px 0 16px 0;
	color: #F78A3C;
	font-size: 12px;
}
.ltool {
	float: left;
	width: 49%;
	min-width: 512px;
}
.rtool {
	float: right;
	width: 30%;
	text-align: right;
	padding: 2px 106px 0 0;
}
.lapkasrtool {
	padding: 0 8px 0 0;
	text-align: right;
	position: relative;
	bottom: -8px;
}
/*
.rtool.production { padding-right: 20px; }
.rtool.padding-btm-add { padding-right: 175px; }
.rtool.production_0 { padding-right: 20px !important; }
*/
.tabtool {
	display: inline-block;
	padding: 10px 24px;
	background: #0f5959;
	border-radius: 8px 8px 0 0;
	color: #FFF;
	font-size: 14px;
	line-height: 18px;
}
.tabtool:hover {
	background: #17a697;
	color: #FFF;
}
.activetabtool, .activetabtool:hover {
	background: #FFF;
	color: #0f5959;
	font-weight: 700;
}
.topicon {
	opacity: 0.5;
	cursor: pointer;
}
.topicon:hover {
	opacity:1;
}
.rtrans {
	background: #17A697;
	padding: 18px 20px 0 20px;
	height: 34px;
	color: #FFF;
	font-size: 18px;
	position: absolute;
	top: 0;
	right: 0;
	cursor: pointer;
}
.rtrans:hover {
	background: #0F5959;
}
.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: 400px;
	display: none;
}
.cashout { background: #ffecec; }
.cashin { background: #d4f7d4; }
.cashtrans { background: #d3fffc; }
.bold { font-weight: 700; }
tr.out, tr.minus, tr.min, tr.invtype_2, tr.invtype_3, tr.orderstat_0, tr.orderstat_1 { background: #efe0e1 !important; }
tr.in, tr.plus, tr.invtype_1, tr.orderstat_2 { background: #d2efd8 !important; }
tr.trans { background: #c2eff2 !important; }
tr.out td, tr.in td, tr.trans td, tr.minus td, tr.min td, tr.plus td, tr.invtype_1 td, tr.invtype_2 td, tr.invtype_3 td,
tr.orderstat_0 td, tr.orderstat_1 td, tr.orderstat_2 td {
	border-bottom: 1px dotted #FFF !important;
}
tr.out:hover, tr.in:hover, tr.trans:hover, tr.minus:hover, tr.min:hover, tr.plus:hover, tr.invtype_1:hover,
tr.orderstat_0:hover, tr.orderstat_1:hover, tr.orderstat_2:hover {
	background: #e9e9e9 !important;
}
.cdate { background: #d4f7d4; }
#deltrans_loader, #deldethp_loader { right: 108px; bottom: 18px; }
.saldotop {
	position: absolute;
	text-align: right;
	width: 30%;
	font-size: 20px;
	line-height: 30px;
	color: #0F5959;
	right: 32px;
	top: -44px;
	font-weight: 700;
	text-shadow: 1px 1px 1px #FFF;
}
.datatable tr td a:hover { color: #333; text-decoration: underline; }
.dataTable thead th { vertical-align: middle; }
.tabdetail td {
	padding: 8px;
	border-top: 1px dotted #999999;
}
.tabdetail {
	border-bottom: 1px dotted #999999;
}
.boxdetail {
	border-bottom: 2px solid #F78A3C;
	margin: 0 0 32px 0;
	position: relative;
	padding-bottom: 8px;
}
.boxeditdet {
	width: 80px;
	position: absolute;
	text-align: right;
	right: 0;
	bottom: 12px;
}
.boxeditdet img { opacity: 0.6; cursor: pointer; }
.boxeditdet img:hover { opacity: 1; }
.daftrans { position: relative; }
.daftransbutton {
	position: absolute;
    right: 0;
    top: -40px;
    width: 35%;
	text-align: right;
}
.foldertab {
	position: relative;
	bottom: -2px;
}
.catdetail {
	cursor: pointer;
}
.catdetail:hover {
	background: #e0f8fa;
}
#popinv {
	width: 420px;
	margin-left: -227px;
	margin-top: -270px;
}
.atabin:hover { color: #000; text-decoration: underline; }
.detailtool { position: relative; top: -4px; }
.daftransbutton_product {
    width: 35%;
	position: relative;
	top: -16px;
}
.tabreport td {
	padding: 6px;
	border-bottom: 1px dotted #999999;
	font-size: 13px;
	line-height: 18px;
}
.tabreportsmall td {
	padding: 4px;
	font-size: 12px;
	line-height: 16px;
	background: #eaeaea;
}
.tdbold { font-weight: 700; background: #CCC; }
.lapblock { width: 49%; }
.lapleft { float: left; }
.lapright { float: right; }
.rightchart { margin: 36px auto 0 auto; display: block; }
.lapbottom { padding: 48px 0 0 0; }
.lapbottom h3 { padding-bottom: 32px; }
.bottomchart { display: block; }
.trgreen { background: #d2efd8; }
.trred { background: #efe0e1; }
.trblue { background: #c2eff2; }
.trpink { background: #ffedee; }
.blockchart { display: block; margin: 0 auto; }
.halfchart { width: 49.5%; float: left; }
.laprightpad { padding-top: 48px; }
.halfchart h3 { text-align: center; padding-bottom: 16px; }
.fullchart { padding: 96px 0 0 0; }
.hpenj { margin: 0 0 16px 0; display:block; padding: 64px 0 4px 0; border-bottom: 1px dotted #f78a3c; }
#send_loader {
	position: absolute;
	right: 86px;
	bottom: 18px;
}
.hometitle {
	margin-bottom: 24px;
	border-bottom: 1px dotted #0F5959;
}
.homeleft {
	float: left;
	width: 30%;
}
.homeright {
	float: right;
	width: 65%;
}
.shortbox {
	display: block;
	border: 1px solid #c9d2d2;
	padding: 16px 16px 16px 72px;
	font-size: 14px;
	line-height: 18px;
	border-radius: 8px;
	background-repeat: no-repeat;
	background-position: 16px center;
	text-shadow: 1px 1px 1px #FFF;
	margin: 0 0 4px 0;
	background-color: #eff3f3;
}
.lastshort { margin-bottom: 24px; }
.shortbox:hover {
	background-color: #8fd4d9;
	border: 1px solid #FFF;
	box-shadow: 0 0 2px #bcbcbc;
	color: #0f5959;
	font-weight: 700;
}
#order.shortbox { background-image: url(images/icon_order.png); }
#production.shortbox { background-image: url(images/icon_working.png); }
#report.shortbox { background-image: url(images/icon_report.png); }
#cash.shortbox { background-image: url(images/icon_cash.png); }
#jualbeli.shortbox { background-image: url(images/icon_jualbeli.png); }
.homesubtitle { padding: 0 0 36px 0; margin: 0; }
.homechart .bottomchart { display: block; margin: 0 auto; width: 98% !important; }
.reportlink { padding: 64px 0 0 0; }
.reportlink .shortbox {
	width: 37%;
	margin: 2px 0.5%;
	float: left;
}
.grey { background: #eeefea; }
.green { background: #0f5959; color: #FFF; padding: 6px 8px !important; }
.nowrap { white-space: nowrap; }
.submitjual { width:auto; text-align:right; padding-right: 24px; }
.submitjual #general_loader { right: 240px; left: auto; }
.submitjual #general_notif { float: left; max-width: 60%; width: auto; }
.linkprod { font-weight: 700; }
.linkprod:hover { text-decoration: underline; }
#pes_loader { top: 4px; right: 48px; }
.tdborder { border-top: 2px solid #333 !important; }
.tdgrey { background: #dbe3e2; }
.input_top_stok { padding: 8px 4px 8px 28px !important; background-position: 4px 7px !important; position: relative; top: -2px; }
.smallsaldo { font-size: 14px; }
.roundchart h4 { text-align: center; padding-bottom: 8px; font-size: 14px; line-height: 18px; color: #8fd4d9; }
.resetlink { font-style: italic; }
.resetlink:hover { text-decoration: underline; }
#appresetloader { top: 172px; right: 72px; }
a.underline:hover { text-decoration: underline; }

/* START BAKTI */
.daftarfile { min-height: 24px; padding: 16px; border: 1px solid #999; border-radius: 8px; }
.orderfileprogress {
    position: relative;
    width: 60% !important;
	float: right;
	margin: 3px 0 0 0;
}
.thefile { padding: 4px 0 0 0; border-bottom: 1px dotted #CCCCCC; }
.imgfile { margin-right: 12px; border: 1px solid #999; }
.linkfile { position: relative; bottom: 8px; }
.linkfile:hover { color: #000; text-decoration: underline; }
.delfile { display: block; float: right; margin: 6px 0 0 0; opacity: 0.6; cursor: pointer; } 
.delfile:hover { opacity: 1; }
#order_loader { right: 400px; bottom: 2px; }
.ordertop { height: 36px; }
.ordertop .search { position: relative; top: 5px; left: 4px; padding: 5px 4px 5px 28px; }
.deflink {
	display: block;
	position: absolute;
	left: 216px;
	top: 14px;
	padding: 6px 10px;
	width: 36px;
	background: #17A697;
	color: #FFF;
	border-radius: 4px;
}
.deflink:hover { background: #0F5959; }
.showstatus { position: absolute; top: 13px; left: 216px; }
.smalltable td { font-size: 11px; line-height: 15px; background: #e7e7e7; }
.smhead td { text-align: center; background: #727272; color: #FFF; }
.linkicon { margin: 0 0 -4px 8px; }
.middle { vertical-align: middle; }
.vertical-bottom { vertical-align: text-bottom; }

/* Tambahan Banyumas */
#popnewperson { top: 35%; }
.toolicon { position: absolute; bottom: 10px; right: 5px;}
.toolicon.relative { position: relative; bottom: auto; right: auto; margin: 10px 5px 10px auto; text-align: right;}
.toolicon a { cursor: pointer; position: relative; margin-left: 5px; }
.toolicon a img { opacity: 0.6; }
.toolicon a:hover img, .toolicon a:active img { opacity: 1; }
.export_icon { position: absolute; right: 225px; display: inline-block; }
#inner_production .ltool { width: 62%; }
#inner_production .rtool { position: relative; width: 80px; display: inline-block; margin-right: 10px; vertical-align: sub; float: none; padding: 0px; }

#table_log .log_10 { background-color: #d2efd8; }
#table_log .log_20 { background-color: #eac8af; }
#table_log .log_30 { background-color: #f1d1d4; }
#table_log .log_40 { background-color: #c2eff2; }
#table_log .log_50 { background-color: #c2caf2; }
#table_log td { border-bottom: 1px dotted #FFF !important; }
.box-produk-tool { position: absolute; right: 0px; top: 0px; }
.box-produk-tool .rtrans { position: relative; display: inline-block; }

@media screen and (max-width: 1730px){
    #style-pembelian .boxleft { float: none; width: 50% !important; } 
    #style-pembelian .boxright { float: none; width: 100% !important; margin-top: 25px; } 
}

#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 0; font-size: 14px; }

/* #datatable { display: none; }
.bukukasdata #datatable { display: table !important; }
*/
.catbox { display: none; }

/* TAMBAHAN */
.produkphotoup { width: 140px; height: 20px; font-size: 16px; text-align: center; margin: 10px auto 5px; }
.foto-produk { position: relative; margin-bottom: 20px; }
.wrap-progress-upload { position: absolute; bottom: -25px; width: 100%; }
.wrap-progress-upload .progress { margin-bottom: 0px; }
.wrap-list-thumb { position: relative; padding: 15px 15px 10px; width: 100%; }
.wrap-list-thumb .list-thumb { position: relative; display: inline-block; margin: 0px 20px 15px 0px; }
.wrap-list-thumb .list-thumb:nth-child(4n) { margin-right: 0px; }
.btn-rtrans { background: #17A697; padding: 15px 20px 15px 15px; color: #FFF; font-size: 16px; cursor: pointer; display:inline-block; margin-bottom: 15px; }
.btn-rtrans:hover { background: #0F5959; }
.new_prodvarian { position: relative; border: 1px solid #d8d9d6; width:100%; max-width:530px; padding: 10px 10px; }
.new_prodvarian .stdtable { border-top: 0px; }
.new_prodvarian .stdtable tr:last-child td {border-bottom: 0px; }
.standartable { width: 98%; border: 1px solid #d8d9d6; }
.standartable td { padding: 6px 4px; border-bottom: 1px dotted #d8d9d6; vertical-align: middle; line-height: 18px; }
.standartable tr:last-child td { border-bottom:0px; }
.submitarea.nomargin { margin: 15px auto 10px; }
.view_keterangan { position: relative; width: 100%; max-height: 180px; overflow: auto; }
.top-icon-print { position: absolute; top: 40px; right: 32px; cursor: pointer; } 
.checkbox-medium { width: 19px; height: 19px; vertical-align: middle; }
#openingkasir.block { display: block; }

.table_openclosingkasir .closing_balance td:nth-child(8) { background: #ceeaef; }
.table_openclosingkasir .closing_minus td:nth-child(8) { background: #efcece; } 
.table_openclosingkasir .closing_plus td:nth-child(8) { background: #ceefd8; }
.tabledetail_openclosingkasir .oc_balance { background: #ceeaef; }
.tabledetail_openclosingkasir .oc_minus { background: #efcece; } 
.tabledetail_openclosingkasir .oc_plus { background: #ceefd8; }

.dataTable tr.hsactiveAD_2 td:nth-child(6){ background: #a6e0e4; }
.dataTable tr.hsactiveAD_3 td:nth-child(7){ background: #a6e0e4; }
.dataTable tr.hsactiveAD_4 td:nth-child(8){ background: #a6e0e4; }
.dataTable tr.hsactive_2 td:nth-child(5){ background: #a6e0e4; }
.dataTable tr.hsactive_3 td:nth-child(6){ background: #a6e0e4; }
.dataTable tr.hsactive_4 td:nth-child(7){ background: #a6e0e4; }

.inner .select2-container .select2-selection--single { height: auto; }

.inner.relative { position: relative; display: block; }
.panel-notif2 { position: absolute; top: 10px; right: 0px; max-width: 50%; text-align: right; }
.panel-notif { position: relative; max-width: 100%; text-align: right; }
.panel-notif h3.promoultah { color: #17a697; }
.panel-notif .promoultah img { vertical-align: bottom; margin-right: 10px; }
.panel-notif .content-notif { position: relative; padding-right: 15px; }
.panel-notif .content-notif .batal_promo { position: absolute; top: 0px; right: 0px; }
.biginput { width: 200px; height: 30px; font-size: 20px; }
.sell_saldo_view { display: inline-block; 
  -webkit-transition: all 0.4s ease-in-out;
  -moz-transition: all 0.4s ease-in-out;
  -ms-transition: all 0.4s ease-in-out;
  transition: all 0.4s ease-in-out;
}
.sell_saldo_view.none { display: none; }

.arrow-left { width: 0; height: 0; border-top: 15px solid transparent; border-bottom: 15px solid transparent; border-right: 15px solid #17a697; display: inline-block; cursor: pointer;
  -webkit-transition: all 0.1s ease-in-out;
  -moz-transition: all 0.1s ease-in-out;
  -ms-transition: all 0.1s ease-in-out;
  transition: all 0.1s ease-in-out; 
}
.arrow-left.arrow-right {  border-right: 0px; border-left: 15px solid #17a697; }
.wrap_exporticon { position: relative; display: inline-block; vertical-align: middle; margin-right: 20px; }

/* DatePicker */
.ui-datepicker { width: 20em; }
.ui-datepicker td span, .ui-datepicker td a { font-size: 12px; }
.ui-datepicker select { border-color: rgb(169, 169, 169); color: black; background-color: white; }
.ui-datepicker .ui-datepicker-buttonpane { display: none; }

/*
.printarea { text-align: center; width: 30mm; height: 20mm; margin: 1mm 0; }
.printarea p { font-size: 10px; line-height: 10px; font-weight: bold; margin-bottom: 3px; padding: 0px; }
@media print {
  body * {
    visibility: hidden;
  }
  #section-to-print, #section-to-print * {
    visibility: visible;
  }
  #section-to-print {
    position: absolute;
    left: 0;
    top: 0;
  }
}
*/
@media screen {
  #printSection {
      display: none;
  }
}

@media print {
  body * {
    visibility:hidden;
  }
  #printSection, #printSection * {
    visibility:visible;
  }
  #printSection {
    position:absolute;
    left:0;
    top:0;
  }
}


/* ----- tambahan ------- */
/* tes upload excel */
.import-reload { display: none; }
.progress {
  	height: 20px;
  	margin-bottom: 20px;
  	overflow: hidden;
  	background-color: #f5f5f5;
  	border-radius: 4px;
  	-webkit-box-shadow: inset 0 1px 2px rgba(0, 0, 0, .1);
 	box-shadow: inset 0 1px 2px rgba(0, 0, 0, .1);
}
.progress-berkas { width: 72%; float:right; margin: 5px auto; height: 25px; }
.progress-bar {
  	float: left;
  	width: 0;
  	height: 100%;
  	font-size: 12px;
  	line-height: 20px;
  	color: #fff;
  	text-align: center;
  	background-color: #428bca;
  	-webkit-box-shadow: inset 0 -1px 0 rgba(0, 0, 0, .15);
   	box-shadow: inset 0 -1px 0 rgba(0, 0, 0, .15);
  	-webkit-transition: width .6s ease;
  	-o-transition: width .6s ease;
  	transition: width .6s ease;
}
.progress-import { width: 100%; float:none; margin: 5px auto; height: 25px; display: none; }
.progress-import.open { display: block; }
.info-progress { font-size: 14px; line-height: 18px; }
.info-progress.msg-error { color: #d93240; }
.import-reload { display: none; margin-bottom: 10px; }

.overf {
    max-height: 500px;
    max-width: 790px;
    overflow: scroll;
    display: block;
}
.overf1 {
    max-height: 235px;
    max-width: 790px;
    overflow: scroll;
    display: block;
}

.inner.report .date { vertical-align: top; font-family: 'Open Sans', sans-serif; height:23px; margin-top: 0px; }

/* Notification */
	.badge-notif {
        position:relative;
	}
	.badge-notif[data-badge]:after {
	        content:attr(data-badge);
	        position:absolute;
	        top:5px;
	        left:26px;
	        font-size:.7em;
	        background:#e53935;
	        color:white;
	        width:18px;
	        height:18px;
	        text-align:center;
	        line-height:18px;
	        border-radius: 50%;
	}
	.badge-notif_ {
	        position:relative;
	}
	
	.li_notif {
		/* padding: 15px 14px; */
	    padding: 12px 14px;
	    display: block;
	    color: white;
	    font-size: 13px;
	    text-decoration: none;
	    text-transform: uppercase;
	    text-shadow: 0 -1px 0 #0d0d0d;
	    text-shadow: 0 -1px 0 rgba(0, 0, 0, 0.7);
	    line-height: 18px;
	    cursor: pointer;
	}
	.li_notif:hover {
	  	background: url(images/highlight-bg.png) repeat;
	  	text-shadow: 0 -1px 0 #97321f;
	  	text-shadow: 0 -1px 0 rgba(122, 42, 26, 0.64);
	}
	.li_notif > span {
	  	line-height: 18px;
	}
	.li_notif:active {
	  	background: #104444;
	}
/* end notification */