@media ( min-width: 60em ){
	/* Show the table header rows and set all cells to display: table-cell */
	.my-custom-breakpoint td,
	.my-custom-breakpoint th,
	.my-custom-breakpoint tbody th,
	.my-custom-breakpoint tbody td,
	.my-custom-breakpoint thead td,
	.my-custom-breakpoint thead th {
		display: table-cell;
		margin: 0;
	}
	/* Hide the labels in each cell */
	.my-custom-breakpoint td .ui-table-cell-label,
	.my-custom-breakpoint th .ui-table-cell-label {
		display: none;
	}
}
html{ margin: 10px;}
.ui-header .ui-title {
  margin-left: 10%; 
  margin-right: 10%;
}

div.mdgov_OverflowTable {
    width: 100%;
    overflow: auto;
    -webkit-overflow-scrolling: touch;
}

div.mdgov_OverflowTable table {
    width: 100%;
    white-space: nowrap;
}
#swipe-page :not(INPUT):not(TEXTAREA) {
			-webkit-user-select: none;
			-moz-user-select: none;
			-ms-user-select: none;
			-o-user-select: none;
			user-select: none;
		}

.custom-corners .ui-bar {
  -webkit-border-top-left-radius: inherit;
  border-top-left-radius: inherit;
  -webkit-border-top-right-radius: inherit;
  border-top-right-radius: inherit;
}
.custom-corners .ui-body {
  border-top-width: 0;
  -webkit-border-bottom-left-radius: inherit;
  border-bottom-left-radius: inherit;
  -webkit-border-bottom-right-radius: inherit;
  border-bottom-right-radius: inherit;
}
  .nav_up{
	padding:7px;
	background-color:white;
	border:1px solid #CCC;
	position:fixed;
	background:transparent url(../img/arrow-u-black.png) no-repeat top left;
	background-position:50% 50%;
	width:20px;
	height:20px;
	opacity:0.7;
	white-space:nowrap;
	cursor: pointer;
	-moz-border-radius: 3px 3px 3px 3px;
    -webkit-border-top-left-radius:3px;
	-webkit-border-top-right-radius:3px;
    -khtml-border-top-left-radius:3px;
	-khtml-border-top-right-radius:3px;
	filter:progid:DXImageTransform.Microsoft.Alpha(opacity=70);
}
.nav_down{
	padding:7px;
	background-color:white;
	border:1px solid #CCC;
	position:fixed;
	background:transparent url(../img/arrow-d-black.png) no-repeat top left;
	background-position:50% 50%;
	width:20px;
	height:20px;
	opacity:0.7;
	white-space:nowrap;
	cursor: pointer;
	-moz-border-radius: 3px 3px 3px 3px;
    -webkit-border-top-left-radius:3px;
	-webkit-border-top-right-radius:3px;
    -khtml-border-top-left-radius:3px;
	-khtml-border-top-right-radius:3px;
	filter:progid:DXImageTransform.Microsoft.Alpha(opacity=70);
}

.nav_left{
	padding:7px;
	background-color:white;
	border:1px solid #CCC;
	background:transparent url(../img/arrow-l-black.png) no-repeat top left;
	background-position:50% 50%;
	width:20px;
	height:20px;
	opacity:0.7;
	white-space:nowrap;
	cursor: pointer;
	-moz-border-radius: 3px 3px 3px 3px;
    -webkit-border-top-left-radius:3px;
	-webkit-border-top-right-radius:3px;
    -khtml-border-top-left-radius:3px;
	-khtml-border-top-right-radius:3px;
	filter:progid:DXImageTransform.Microsoft.Alpha(opacity=70);
}
.nav_right{
	padding:7px;
	background-color:white;
	border:1px solid #CCC;
	background:transparent url(../img/arrow-r-black.png) no-repeat top left;
	background-position:50% 50%;
	width:20px;
	height:20px;
	opacity:0.7;
	white-space:nowrap;
	cursor: pointer;
	-moz-border-radius: 3px 3px 3px 3px;
    -webkit-border-top-left-radius:3px;
	-webkit-border-top-right-radius:3px;
    -khtml-border-top-left-radius:3px;
	-khtml-border-top-right-radius:3px;
	filter:progid:DXImageTransform.Microsoft.Alpha(opacity=70);
}
.nav_div{
    top:40%;
    width:30px;
    height:50px;
    position:fixed;
}

.ClassMoney{
    text-align:right;
}

.tab_nav {
    width: 50% !important;
    display: inline-block;

}
#preview {
  left:60%;
  position:absolute;
  width:40%;
  max-width:250px;
  top:25%;
}
#preview img{
  
  width:100%;
  
}
  #middleSpan  {
    width:160px;
    max-width:160px;
    display: table-cell;
    font: small-caps 12px arial;
   

    }
    #showPrint{
    display: inline-block;
    background-image: url(../img/page-loader.gif) !important; 
    z-index:9999 !important;
    background-repeat: no-repeat;
    background-position: center;
    width:800px;
    height:600px;
    } 
     
  #rightSpan{
    width:80px;
    max-width:80px;
    display: table-cell;
    font: small-caps 12px "Times New Roman";
      }
.customForm{
  min-width:100%;
}
.HeaderTabel{
  font: bold;
  text-align : center;
}
.HeadTitle{
 font: bold; height:15px;
  text-align:left;
}
.HeadC{
  font: bold; height:15px;
  text-align:center; border-top:thin solid #000000; border-bottom:thin solid #000000;
}
.HeadL{
  font: bold ; height:15px;
  text-align:left; border-top:thin solid #000000; border-bottom:thin solid #000000;
}
.HeadR{
  font: bold ; height:15px;
  text-align:right; border-top:thin solid #000000; border-bottom:thin solid #000000;
}
.HeadHarga{
  font: bold ; height:15px;
  text-align:right; border-top:thin solid #000000; border-bottom:thin solid #000000;
  
  width:100px;
}
.HeadFR{
  width:150px;
  text-align:right; border-top:thin solid #000000;
}
.HeadFL{
  text-align:left; border-top:thin solid #000000;
}
.HeadFC{
  font: bold; height:15px;
  text-align:center; border-top:thin solid #000000;
}
.HeadDL{
  text-align:left; border-bottom:thin solid #000000;
}
.HeadDC{
  font: bold;
  text-align:center; border-bottom:thin solid #000000;
}
.HeadDR{
  text-align:right; border-bottom:thin solid #000000;
}
.DetailC{
  font: small-caps;
  text-align:center;
}
.DetailL{
  font: small-caps;
  text-align:left; 
}
.DetailR{
  font: small-caps;
  text-align:right; 
 
}
.DetailBR{
  font: bold;
  text-align:right; 
 
}
.DetailNama{
  font: small-caps;
  text-align:left;
  width : 250px;
  position:fixed;
}
.DetailHarga{
  font: small-caps;
  text-align:right;
  width:100px;
 
}
.DetailKode{
  font: small-caps;
  text-align:left;
  width : 70px;
  position:fixed;
}

.SpanTTD{
float:left;
  font: small-caps;
  text-align:center;
  width:100px;
  margin:0px;
  padding:0px;
  
}
.SpanTTD2{

 float:left;
 color:white;
  font: small-caps;
  text-align:center;
  width:100px;
  margin:0px;
  padding:0px;
}
.DetailKodeR{
  font: small-caps;
  text-align:right;
  width : 50px;
  position:fixed;
}
.DetailNomor{
  font: small-caps;
  text-align:left;
  width : 15px;
}
.Detail2{
  font: small-caps;
  text-align:justify; 
}
.DetailCL{
   font: small-caps;
  text-align:left; 
  color : white;
}
.DetailL  span{
  float:right;
}
.HeadL  span{
  float:right;
}
.FooterX{
 position: fixed; left:0px; bottom: -40px; right: 0px; height: 130px;
}
.TStripe td{
background-color: #E0E0E0;
}
.TabelStripe tbody tr:nth-child(odd) td{
background-color: #E0E0E0;
}
.ui-datepicker{ z-index: 9999 !important;}
.ui-loader {
    z-index: 9999 !important;
}