body, html {
 width:100%;
 height:100%;
 margin:0;
 padding:0;
 overflow-y: hidden;
 overflow-x: hidden;
 background: #dedcb6;
}
.small-view > thead > tr > th {
 font-size: 14px;
}
.small-view > tbody > tr > td {
 font-size: 13px;
}
.small-components {
 transform: scale(0.875);
 transform-origin: left;
}
.bg {
 background: transparent url(../img/pattern.png) repeat top left;
}
.scroller {
 overflow-y: scroll;
}
::-webkit-scrollbar {
 width: 6px;
}
::-webkit-scrollbar-track {
 background: #f1f1f1;
}
::-webkit-scrollbar-thumb {
 background: #bdbdbd;
}
::-webkit-scrollbar-thumb:hover {
 background: #9e9e9e;
}
a:hover {
 cursor: pointer;
}
nav {
 background: #FCFAD1;
}
.z-depth-1, nav, .card-panel, .card, .toast, .btn, .btn-large, .btn-floating, .dropdown-content, .collapsible, .side-nav {
 -webkit-box-shadow: 0 1px 1px 0 rgba(0,0,0,0.14), 0 1px 0px 0 rgba(0,0,0,0.12), 0 3px 0px -2px rgba(0,0,0,0.2);
 box-shadow: 0 1px 1px 0 rgba(0,0,0,0.14), 0 1px 0px 0 rgba(0,0,0,0.12), 0 3px 0px -2px rgba(0,0,0,0.2);
}
.container {
 width: 70%;
 margin:25% auto;
}
.containers {
 width: 100%;
 margin:0 auto;
}
form#frmlogin {
 background:#FCFAD1;
 padding:20px;
 -webkit-box-shadow: 0px 2px 5px 0px rgba(0,0,0,0.35);
 -moz-box-shadow: 0px 2px 5px 0px rgba(0,0,0,0.35);
 box-shadow: 0px 2px 5px 0px rgba(0,0,0,0.35);
}
.no-found {
 display:none;
 width: 99%;
 margin:5px;
 padding: 10px;
 background: white;
}
.searchbar {
 margin-left:230px;
}
.searchbar input.normal {
 color:#000;
 background:rgba(255,255,255,0.4);
 border-bottom: 1px solid #000;
 box-shadow: 0 1px 0 0 #000;
 padding:5px;
}
.searchbar input.normal::-webkit-input-placeholder {
 color: #7f8c8d;
}
.searchbar input.normal::-moz-placeholder {
 color: #7f8c8d;
}
.searchbar input.normal:-ms-input-placeholder {
 color: #7f8c8d;
}
.searchbar input.normal:-moz-placeholder {
 color: #7f8c8d;
}
.title {
 font:bold 52px "Roboto";
}
.strike {
 text-decoration: line-through;
 color: red;
}
#imgfoto:hover {
 cursor: pointer;
}
.brand-logo {
 font-size: 48px;
 font-weight: bold;
}
.no-margin {
 margin:0;
}
.no-margin-top {
 margin:0 5px 5px 5px;
}
.no-margin-bottom {
 margin-bottom:0;
}
.margin {
 margin:5px;
}
.margin-top {
 margin-top:5px;
}
.margin-top.sm {
 margin-top: 1%;
}
.margin-top.md {
 margin-top: 2%;
}
.margin-top.lg {
 margin-top: 4%;
}
.margin-left.md {
 margin-left: 14px;
}
.margin-left.sm {
 margin-left: 5px;
}
.margin-right {
 margin-right: 10px;
}
.margin-right.sm {
 margin-right: 5px;
}
.margin-bot {
 margin-bottom: 5px;
}
.margin-bot.sm {
 margin-bottom: 1%;
}
.margin-bot.md {
 margin-bottom: 2%;
}
.no-padding-top {
 padding: 0 5px 5px 5px;
}
.no-padding-bot {
 padding: 5px 5px 0 5px;
}
.padding {
 padding:5px;
}
.padding-bot {
 padding-bottom:5px;
}
.paddingLeft {
 padding-left:10px;
}
.paddingRight {
 padding-right:5px;
}
.paddingLeftRight {
 padding: 0 5px;
}
.border-top {
 border-top: 1px solid rgba(0,0,0,0.1);
}
.border-bot {
 border-bottom: 1px solid rgba(0,0,0,0.1);
}
.round {
 border-radius: 5px;
}
.txt-small {
 font:normal 13px "Roboto";
}
.strike {
 text-decoration: line-through;
}
.image-cropper {
 padding-top:7px;
 width: 48px;
 height: 64px;
 position: relative;
 overflow: hidden;
}
.rounded {
 display: block;
 margin: 0 auto;
 height: 48px;
 width: 48px;
 -webkit-border-radius: 50%;
 -moz-border-radius: 50%;
 -ms-border-radius: 50%;
 -o-border-radius: 50%;
 border-radius: 50%;
 background:url("../img/photo_man.jpg")no-repeat center top;
 background-size:cover;
}
.card {
 -webkit-box-shadow: none;
 box-shadow: none;
}
table.condensed > thead > tr > th, table.condensed > tbody > tr > td {
 padding:5px;
}
.w100p {
 width:100%;
}
.w2p {
 width: 2%;
}
.w5p {
 width: 5%;
}
.w10p {
 width:10%;
}
.w20p {
 width:20%;
}
.w23p {
 width: 23%;
}
.w30p {
 width:30%;
}
.w50p {
 width:50%;
}
.w70p {
 width:70%;
}
.w75p {
 width:75%;
}
.w80p {
 width:80%;
}
.w85p {
 width:85%;
}
.w88p {
 width:88%;
}
.row {
 margin-bottom:8px;
}
.valign-top {
 vertical-align: top;
}
.min-height {
 min-height: 52px;
}
.list-data .row-item > div.valign-top {
 vertical-align: top;
}
.crabbys-green-text {
 color: #8cb08c;
}
.notif-badge {
 position:relative;
}
.notif-badge[data-badge]:after {
 content:attr(data-badge);
 position:absolute;
 top:10px;
 right:5px;
 display: inline-block;
 height: 22px;
 width: 22px;
 line-height: 22px;
 -moz-border-radius: 11px;
 border-radius: 11px;
 background-color: #ff8a80;
 color: #000;
 text-align: center;
 font-size: 12px;
}
#toast > .material-icons {
 width: 24px;
}
.pointer {
 cursor: pointer;
}
.flag-order {
 position:absolute;
 top:5px;
 left:5px;
 z-index:2;
 font-size:12px;
 color:#fff;
 padding:3px;
 background:rgba(70, 141, 235, 0.76);
}
.highcharts-credits {display:none;}
.inline {display:inline-block;}
.marker {
  display: inline-block;
  height: 25px;
  width: 25px;
  line-height: 25px;
  -moz-border-radius: 13px;
  border-radius: 13px;
  background-color: #ff8a80;
  color: #000;
  text-align: center;
}
/*override Materialize css*/
.width-60 {
 width: 60%;
}
.width-70 {
 width: 70%;
}
.modal.more-height {
 max-height: 85%;
}
.modal .modal-content {
 padding: 24px 24px 14px 24px;
}
.modal.modal-fixed-footer.more-height {
 height: 85%;
}
.modal.modal-fixed-footer .modal-content {
 position: absolute;
 height: calc(100% - 30px);
 max-height: 100%;
 width: 100%;
 overflow-y: auto;
}
.modal.modal-fixed-footer.more-height .modal-content {
 height: calc(100% - 20px);
}
@media (min-width: 601px) and (max-width: 992px) {
 .container {
  width: 400px;
  margin:1% auto;
 }
 nav .brand-logo {
  left: 10%;
 }
 .rows {
  display: -webkit-box;
  display: -moz-box;
  display: -ms-flexbox;
  display: -webkit-flex;
  display: flex;
  -webkit-flex-flow: row wrap;
  flex-wrap:wrap;
 }
 .rows > * {
  flex: 0 0 23.4%;
 }
 .modal.sm {
  width: 30% !important;
  height: 39% !important;
 }
 #list-orders {
  padding:0;
 }
 #list-orders > .list-header {
  font-weight: bold;
 }
 #list-orders > .list-header > .qty, #list-orders > .list-data > .row-item > .qty {
  width:10%;
  margin:0;
 }
 #list-orders > .list-header > .nama, #list-orders > .list-data > .row-item > .nama {
  width:50%;
  margin:0;
 }
 #list-orders > .list-header > .harga, #list-orders > .list-data > .row-item > .harga {
  width:18%;
  margin:0;
 }
 #list-orders > .list-header > .subtotal, #list-orders > .list-data > .row-item > .subtotal {
  width:22%;
  margin:0;
 }
 #contextmenu {
  position: absolute;
  top: 50%;
  left:10px;
  height: 35px;
  z-index: 99;
 }
 #contextmenu.horizontal > ul {
  margin:-4px 0 0 0;
  padding:0;
 }
 #contextmenu.horizontal > ul > li {
  display:inline-block;
 }
 .btn-small {
  width: 45px;
  height: 45px;
  border-radius: 45px;
  display: inline-block;
  line-height: 50px;
  text-align: center;
 }
 .btn-xsmall {
  width: 35px;
  height: 35px;
  border-radius: 35px;
  display: inline-block;
  line-height: 40px;
  text-align: center;
 }
 .truncated {
  white-space: nowrap;
  overflow-x: hidden;
  text-overflow: ellipsis;
 }
 .alert {
  position: fixed;
  display:none;
  padding:10px;
  top: 18%;
  left:28%;
  max-width:400px;
  color:#000;
  -moz-border-radius: 5px;
  -webkit-border-radius: 5px;
  -khtml-border-radius: 5px;
  border-radius: 5px;
  opacity: 1;
  transform: scaleX(1);
 }
 .card.horizontal .card-image {
  max-width: 100%;
  padding:5px;
 }
 .card .card-content, .card .card-action {
  padding:5px;
 }
 .show {
  display:block;
  -webkit-animation: fadeIn 0.3s;
  animation: fadeIn 0.3s;
 }
 /*override Materialize css*/
 .modal.more-height {
  max-height: 83%;
 }
 .modal .modal-content {
  padding: 24px 24px 14px 24px;
 }
 .modal.modal-fixed-footer.more-height {
  height: 83%;
 }
 .modal.modal-fixed-footer .modal-content {
  position: absolute;
  height: calc(100% - 30px);
  max-height: 100%;
  width: 100%;
  overflow-y: auto;
 }
 .modal.modal-fixed-footer.more-height .modal-content {
  height: calc(100% - 20px);
 }
 .smartphone, .tablet, .laptop, .desktop {display: none;}
 .tablet {display: block;}
}
@media (min-width: 993px) {
 .container {
  width: 400px;
  margin:5% auto;
 }
 .rows {
  display: -webkit-box;
  display: -moz-box;
  display: -ms-flexbox;
  display: -webkit-flex;
  display: flex;
  -webkit-flex-flow: row wrap;
  flex-wrap:wrap;
 }
 .rows > * {
  flex: 0 0 23.4%;
 }
 .modal.sm {
  width: 30% !important;
  height: 30% !important;
 }
 #list-orders {
  padding:0;
 }
 #list-orders > .list-header {
  font-weight: bold;
  border-bottom: 1px solid rgba(160,160,160,0.5);
 }
 #list-orders > .list-header > .qty, #list-orders > .list-data > .row-item > .qty {
  width:10%;
  margin:0;
 }
 #list-orders > .list-header > .nama, #list-orders > .list-data > .row-item > .nama {
  width:40%;
  margin:0;
 }
 #list-orders > .list-header > .harga, #list-orders > .list-data > .row-item > .harga {
  width:25%;
  margin:0;
 }
 #list-orders > .list-header > .subtotal, #list-orders > .list-data > .row-item > .subtotal {
  width:25%;
  margin:0;
 }
 #contextmenu {
  position: absolute;
  top: 50%;
  left:10px;
  height: 35px;
  z-index: 99;
 }
 #contextmenu.horizontal > ul {
  margin:-4px 0 0 0;
  padding:0;
 }
 #contextmenu.horizontal > ul > li {
  display:inline-block;
 }
 #contextdiskon {
  position: absolute;
  top: 50%;
  left:120%;
  height: 35px;
  z-index: 99;
  background:#fff;
  width: 13.5%;
  -webkit-transition: all .3s linear 0s;
  transition: all .3s linear 0s;
 }
 #contextdiskon.slide {
  left:86%;
 }
 .btn-small {
  width: 45px;
  height: 45px;
  border-radius: 45px;
  display: inline-block;
  line-height: 50px;
  text-align: center;
 }
 .btn-xsmall {
  width: 35px;
  height: 35px;
  border-radius: 35px;
  display: inline-block;
  line-height: 40px;
  text-align: center;
 }
 .truncated {
  white-space: nowrap;
  overflow-x: hidden;
  text-overflow: ellipsis;
 }
 .alert {
  position: fixed;
  display:none;
  padding:10px;
  top: 15%;
  left:35%;
  max-width:380px;
  color:#000;
  -moz-border-radius: 5px;
  -webkit-border-radius: 5px;
  -khtml-border-radius: 5px;
  border-radius: 5px;
  opacity: 1;
  transform: scaleX(1);
 }
 .card.horizontal .card-image {
  max-width: 100%;
  padding:5px;
 }
 .card .card-content, .card .card-action {
  padding:5px;
 }
 .show {
  display:block;
  -webkit-animation: fadeIn 0.3s;
  animation: fadeIn 0.3s;
 }
 .margin-top.lg {
  margin-top: 7%;
 }
 .smartphone, .tablet, .laptop, .desktop {display: none;}
 .laptop {display: block;}
}
@media (min-width: 1200px) {
 .container {
  width: 400px;
  margin:5% auto;
 }
 .rows {
  display: -webkit-box;
  display: -moz-box;
  display: -ms-flexbox;
  display: -webkit-flex;
  display: flex;
  -webkit-flex-flow: row wrap;
  flex-wrap:wrap;
 }
 .rows > * {
  flex: 0 0 23.8%;
 }
 .rows > .meja {
  flex: 0 0 19%;
 }
 .menubox {
  flex-grow:1;
  width:10%;
 }
 .sub-nav {
  padding:2px;
 }
 .sub-nav > ul > li {
  font-size:13px;
  display: inline-block;
  text-align:center;
  width:120px;
  padding:5px;
  line-height:12px;
  border-right:solid 1px #cecece;
 }
 .sub-nav > ul > li:last-child {
  border-right:none;
 }
 .sub-nav > ul > li a i:after {
  margin-top:-10px;
  font-family: "Material Icons";
  content:"keyboard_arrow_down";
 }
 .sub-nav > ul > li i {
  display:block;
  color:rgb(167, 167, 167);
  margin-bottom:5px;
 }
 .sub-nav > ul > li a:hover > i {
  color:green;
 }
 .sub-nav > ul > li a.active > i {
  color:green;
 }
 .sub-nav > ul > li > ul.dropdown-content {
  margin-top: 49px;
 }
 ul.dropdown-content li a {
  font-size:13px;
 }
 .card.horizontal .card-image {
  max-width: 100%;
  padding:5px;
 }
 .card .card-content, .card .card-action {
  padding:5px;
 }
 .modal.sm {
  width: 25% !important;
  height: 30% !important;
 }
 .modal.md {
  width: 45% !important;
 }
 .modal.md.half {
  width: 45% !important;
  height: 50% !important;
 }
 .chart-hilite {
  width:45%;
  height:320px;
 }
 #list-orders {
  padding:0;
 }
 #list-orders > .list-header {
  font-weight: bold;
 }
 #list-orders > .list-header > .qty, #list-orders > .list-data > .row-item > .qty {
  width:10%;
  margin:0;
 }
 #list-orders > .list-header > .nama, #list-orders > .list-data > .row-item > .nama {
  width:50%;
  margin:0;
 }
 #list-orders > .list-header > .harga, #list-orders > .list-data > .row-item > .harga {
  width:18%;
  margin:0;
 }
 #list-orders > .list-header > .subtotal, #list-orders > .list-data > .row-item > .subtotal {
  width:22%;
  margin:0;
 }
 #contextmenu {
  position: absolute;
  top: 50%;
  left:10px;
  height: 35px;
  z-index: 99;
 }
 #contextmenu.horizontal > ul {
  margin:0;
  padding:0;
 }
 #contextmenu.horizontal > ul > li {
  display:inline-block;
 }
 #contextdiskon {
  position: absolute;
  top: 50%;
  left:120%;
  height: 35px;
  z-index: 99;
  background:#fff;
  width: 12.6%;
  -webkit-transition: all .3s linear 0s;
  transition: all .3s linear 0s;
 }
 #contextdiskon.slide {
  left:87%;
 }
 .btn-small {
  width: 35px;
  height: 35px;
  border-radius: 35px;
  display: inline-block;
  line-height: 40px;
  text-align: center;
 }
 .btn-xsmall {
  width: 25px;
  height: 25px;
  border-radius: 25px;
  display: inline-block;
  line-height: 30px;
  text-align: center;
 }
 .truncated {
  white-space: nowrap;
  overflow-x: hidden;
  text-overflow: ellipsis;
 }
 .alert {
  position: fixed;
  display:none;
  padding:10px;
  top: 15%;
  left:38%;
  max-width:350px;
  color:#000;
  -moz-border-radius: 5px;
  -webkit-border-radius: 5px;
  -khtml-border-radius: 5px;
  border-radius: 5px;
  opacity: 1;
  transform: scaleX(1);
 }
 .show {
  display:block;
  -webkit-animation: fadeIn 0.3s;
  animation: fadeIn 0.3s;
 }
 .smartphone, .tablet, .laptop, .desktop {display: none;}
 .desktop {display: block;}
}
@-webkit-keyframes fadeIn {
 from {opacity: 0;top:12%;transform: scaleX(0.7);}
 to {opacity: 1;top:15%;transform: scaleX(1);}
}
@keyframes fadeIn {
 from {opacity: 0;top:12%;transform: scaleX(0.7);}
 to {opacity:1 ;top:15%;transform: scaleX(1);}
}