/*!
 * mdx php framework v2.5
 * Copyright 2013 mdx, Inc.
 * Licensed under http://www.apache.org/licenses/LICENSE-2.0
 *
 * contact me mdanielk@gmail.com
 */
 
th, td {margin: 0; padding: 0.25em 0.5em;}
tr.selected {background-color:#818181; color: white;}
tr.selected a {color: white;}
body{
	font-family: 'Roboto', sans-serif;
	padding:0px !important;
    -webkit-touch-callout: none;
    -webkit-user-select: none;
    -khtml-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none;
}
.kotak-form{
    color:#272727;
    background-color:#eeeeee;
    border-color:#778788;
	padding-left:0px;
 }
.pos{
	background: #102872; 
	position: fixed; left: 0; top: 0; 
	z-index: 10;
	width: 100%; height: 100%;
	z-index: 999;
	padding: 0;
	margin: 0;
 }
.pos-header{
 	font-size:24px;
	color:#c0c0c0;
 }
.pos-content{
	background: #050e27;
	margin:0;
	padding:0;
	min-height:90%;
	height:100%;
	border-radius:10px;
	
}
.pos-content-head{
	background-color:#000;
	width:100%;
}
.pos-content-body{
	height: 60%;
	width:100%;	
	color:#000000;
	background-color:#ffffff;
	overflow-y: scroll;
	position:relative;
	top:0;
}
.pos-content-foot{
	background-color:#296d30;
	bottom:0;
	height:15%;
	padding:0px;
	position:fixed;
	width:100%;
}
#keyword{
	padding:6px;
	margin: 0px;
	font-size:12px;
	width:90%;
	background-color:#d7fddb;
	color:#1823e7;
	font-weight: bold;
}
.keyword_result{
	font-size:18px;
}
.bg-overlay{
	background-color:#000;
	width:100%;
	height:100%;
	position:fixed;
	z-index:1;
	display:none;
	opacity:0.7;
}
#alert-popup{
	display:none;
	background: #443942;
	text-align: center;
	padding: 10px; 	
	border: 2px solid #ddd;
	float: left;
	font-size: 1.2em;
	position: fixed;
	top: 40%; left: 40%;
	z-index: 99999;
	box-shadow: 0px 0px 20px #999;
	-moz-box-shadow: 0px 0px 20px #999; /* Firefox */
    -webkit-box-shadow: 0px 0px 20px #999; /* Safari, Chrome */
	border-radius:3px 3px 3px 3px;
    -moz-border-radius: 3px; /* Firefox */
    -webkit-border-radius: 3px; /* Safari, Chrome */
}
.box-payment{
	color:#fff;
}
.box-edit-data{
	color:#fff;
}
.box-alert{
	color:#fff;
}
#payment-popup_0{
	display:none;
	background: #051a78;
	min-width:400px;
	padding: 10px; 	
	border: 2px solid #ddd;
	float: left;
	font-size: 1.2em;
	position: fixed;
	top: 20%; left: 33%;
	z-index: 99999;
	box-shadow: 0px 0px 20px #999;
	-moz-box-shadow: 0px 0px 20px #999; /* Firefox */
    -webkit-box-shadow: 0px 0px 20px #999; /* Safari, Chrome */
	border-radius:3px 3px 3px 3px;
    -moz-border-radius: 3px; /* Firefox */
    -webkit-border-radius: 3px; /* Safari, Chrome */
}
#payment-popup{
	display:none;
	background: #051a78;
	min-width:500px;
	padding: 10px; 	
	border: 2px solid #ddd;
	float: left;
	font-size: 1.2em;
	position: fixed;
	top: 20%; left: 33%;
	z-index: 99999;
	box-shadow: 0px 0px 20px #999;
	-moz-box-shadow: 0px 0px 20px #999; /* Firefox */
    -webkit-box-shadow: 0px 0px 20px #999; /* Safari, Chrome */
	border-radius:3px 3px 3px 3px;
    -moz-border-radius: 3px; /* Firefox */
    -webkit-border-radius: 3px; /* Safari, Chrome */
}
#payment-result{
	display:none;
	background: #051a78;
	min-width:500px;
	padding: 10px; 	
	border: 2px solid #ddd;
	float: left;
	font-size: 1em;
	position: fixed;
	top: 5%; left: 33%;
	z-index: 99999;
	box-shadow: 0px 0px 20px #999;
	-moz-box-shadow: 0px 0px 20px #999; /* Firefox */
    -webkit-box-shadow: 0px 0px 20px #999; /* Safari, Chrome */
	border-radius:3px 3px 3px 3px;
    -moz-border-radius: 3px; /* Firefox */
    -webkit-border-radius: 3px; /* Safari, Chrome */
}
#edit-data-popup{
	display:none;
	background: #051a78;
	min-width:400px;
	padding: 10px; 	
	border: 2px solid #ddd;
	float: left;
	font-size: 1.2em;
	position: fixed;
	top: 10%; left: 33%;
	z-index: 99999;
	box-shadow: 0px 0px 20px #999;
	-moz-box-shadow: 0px 0px 20px #999; /* Firefox */
    -webkit-box-shadow: 0px 0px 20px #999; /* Safari, Chrome */
	border-radius:3px 3px 3px 3px;
    -moz-border-radius: 3px; /* Firefox */
    -webkit-border-radius: 3px; /* Safari, Chrome */
}
.nomor-transaksi{
	font-size:30px;
	color:#edd112;
	margin-top:10px;
}
.total-harga{
	font-size:32px;
	color:#ffffff;
	font-weight: bold;
	padding-top:10px;
	padding-bottom:10px;
	padding-right:30px;
	display:block;
	position:relative;
	bottom:0;
	float:right;
}
.line{
	padding:10px;
}
.line input{
	font-size:22px;
}
.left50{
  float: left;
  width: 50%;
}
.right50{
  float: right;
  width: 50%;
}
.putih,.putih a:link, .putih a:visited{
  color:#FFF;
}
.copyright{
  padding-top: 20px;
	text-align:center;
	font-family:"Trebuchet MS", Arial, Helvetica, sans-serif;
	font-size:11px;
}
.navbar-title{
	border:1px solid #ccc;
}
.dialog_hapus{
  border: 1px solid #c9d80c;
  padding: 5px;
  background-color: #5ecf4e;
  border-radius: 10px;
}
.parent-menu{
	text-transform:uppercase;
	font-weight:600;
	font-size:12px;
}
.alert-payment{
	font-weight:500;
	font-size:10px;
	color:red;
}
.invoice-print{
	background-color: #fff;
	color: #000;
	overflow:scroll;
	height:150px;
}
.btn-pos{
	line-height:12px !important;
}
#btn-batal{
	margin-top:20px;
	margin-right:20px;
	margin-left:20px;
	font-size:10px;
}
#btn-save-and-close{
	margin-top:6px;
	margin-left:10px;
}
#btn-bayar{
	width:60%;
	margin-top:6px;
	padding:10px;
	font-size:32px;
	color: #000 !important;
}
#btn-retur{
	width:60%;
	margin-top:6px;
	padding:10px;
	font-size:32px;
	color: #000 !important;
}
.pos-top-nav{
	color:aquamarine;
}
#table_history_pos{
	width:100%;
	overflow: auto;
	padding: 6px;
}
.table-pos thead{
	background-color:green;
	color:#fff;
}
.table-pos tr td{
	padding:0px 8px;	
}
.bg-odd  { 
	background-color: #def;
	cursor:pointer;
	}
.bg-odd:hover { 
	font-weight:bold;
}
.bg-odd-2  { 
	background-color: #def;
	}
.bg-even { 
	background-color: #fff; 
	padding:4px 0px;
	cursor:pointer;	
	}
.bg-even-2 { 
	background-color: #fff; 
	padding:4px 0px;
	}
.bg-even:hover { 
	font-weight:bold;
}
.table-pos{
	width:100% !important;
	white-space:nowrap;
	
}
.kode-produk{
	font-size:10px;
	padding-left:20px;
	font-style:italic;
}
.nama-produk{
	font-size:16px;
	color: purple;
	font-weight:600;
}
#modalContextContent{
	padding:8px;
	font-size:14px;
}
@media (max-height: 500px) {
	.pos-content-body{
		height: 50%;
	}
}
@media (max-width: 800px) {
	.total-harga{
		font-size:18px;
		padding-top:0px;
	}
	#payment-popup{
		top: 20%;
		margin: 0px auto;
		left:2%;
		min-width:90%;
	}
	.pos-content-foot{
		height:15%;
	}
	#edit-data-popup{
		top: 20%;
		margin: 0px auto;
		left:2%;
		min-width:90%;
	}
	#payment-result{
		top: 10%;
		margin: 0px auto;
		left:1%;
		min-width:90%;
		height: 290px;
		font-size: 11px;
	}
	.line{
		padding:auto;
		float:left;
	}
	.pos-top-nav .btn{
		font-size: 10px;
	}
	#btn-bayar{
		font-size:20px;
	}
	#btn-retur{
		font-size:20px;
	}
}

@media (max-width: 480px) {
    .table-pos {
		width:140%;
		overflow: auto;
	}
    .table-pos thead tr th{
		font-size:10px;
	}
	.table-pos tbody tr td{
		font-size:12px;
		margin: 0;
		padding: 2px 4px;
		line-height:12px;
	}
	.total-harga{
		font-size:18px;
		padding-top:10px;
	}
	.line{
		padding:auto;
		float:left;
		clear:both;
	}
	#alert-popup{
		top:30%;
		left:20%;
	}
	#table_change_password{
		font-size: 11px;
	}
	#table_history_pos{
		font-size: 11px;
	}
	
}