#login-box .panel-heading {
 border: none;
}

#login-box .panel-body {
 background: #2e3039;
 padding: 30px;
 color: #fff;
}

#login-box .panel-body a {
 color: #FFF;
}

#login-box .input-group {
 margin: 10px 0px;
}

#login-box .input-group .input-group-addon {

 background: #363b41;
 color: #606468;
 border: none;
 padding: 6px 20px;
}

#login-box input {
 background: #3b4148;
 border: none;
 color: #FFF;
}

.std {
 min-width: 120px;
 text-align: left;
}

.s-std {
 min-width: 110px;
}

.preloader {
 position: fixed;
 top: 0;
 left: 0;
 right: 0;
 bottom: 0;
 background: rgba(255, 255, 255, 0.2);
 z-index: 9999999;
 display: none
}

.preloader .spinner {
 width: 36px;
 height: 36px;
 position: absolute;
 left: 50%;
 top: 50%;
 margin: -18px 0 0 -18px;
}

.preloader .spinner div {
 height: 36px;
 width: 36px;
 position: relative;
 -webkit-animation: rotation .6s infinite linear;
 -moz-animation: rotation .6s infinite linear;
 -o-animation: rotation .6s infinite linear;
 animation: rotation .6s infinite linear;

 border-left: 3px solid rgba(26, 187, 156, .15);
 border-right: 3px solid rgba(26, 187, 156, .15);
 border-bottom: 3px solid rgba(26, 187, 156, .15);
 border-top: 3px solid rgba(26, 187, 156, .8);
 border-radius: 100%;
}

.loader {
 position: absolute;
 top: 0;
 left: 0;
 right: 0;
 bottom: 0;
 background: rgba(255, 255, 255, 0.5);
 z-index: 9999999;
 width: 100%;
 height: 100%;
 display: none;
}

.loader .spinner {
 width: 36px;
 height: 36px;
 position: absolute;
 left: 50%;
 top: 50%;
 margin: -18px 0 0 -18px;
}

.loader .spinner div {
 height: 36px;
 width: 36px;
 position: relative;
 -webkit-animation: rotation .6s infinite linear;
 -moz-animation: rotation .6s infinite linear;
 -o-animation: rotation .6s infinite linear;
 animation: rotation .6s infinite linear;

 border-left: 3px solid rgba(26, 187, 156, .15);
 border-right: 3px solid rgba(26, 187, 156, .15);
 border-bottom: 3px solid rgba(26, 187, 156, .15);
 border-top: 3px solid rgba(26, 187, 156, .8);
 border-radius: 100%;
}

@-webkit-keyframes rotation {
 from {
  -webkit-transform: rotate(0deg);
 }
 to {
  -webkit-transform: rotate(359deg)
 }
}

@-moz-keyframes rotation {
 from {
  -moz-transform: rotate(0deg)
 }
 to {
  -moz-transform: rotate(359deg)
 }
}

@-o-keyframes rotation {
 from {
  -o-transform: rotate(0deg)
 }
 to {
  -o-transform: rotate(359deg)
 }
}

@keyframes rotation {
 from {
  transform: rotate(0deg)
 }
 to {
  transform: rotate(359deg)
 }
}

.form-group {
 position: relative;
}

.form-group label.error {
 background: #ff2b75;
 color: #fff;
 position: absolute;
 font-size: 13px;
 font-weight: normal;
 top: 52px;
 right: 10px;
 padding: 5px;
 z-index: 3;
 border-radius: 2px;
 box-shadow: 0px 2px 2px rgba(0, 0, 0, 0.3);
}

.form-group label.error:after {
 border-bottom: 6px solid #ff2b75;
 border-left: 6px solid rgba(0, 0, 0, 0);
 border-right: 6px solid rgba(0, 0, 0, 0);
 content: '';
 display: inline-block;
 position: absolute;
 top: -6px;
 right: 20px;
}

.table-paging .paging-info {
 text-align: left;
}

.table-paging .paging-ul {
 text-align: right;
}

.search-form {
 height: 32px;
 margin: 0;
 width: 100%;
}

.search-form > .search-pane {
 margin: 0px;
 height: 30px;
 background: #FFF;
 border: 1px solid #00c2a9;
 width: CALC(100% - 2px);
}

.search-form > .search-pane > input {
 background: none;
 -webkit-border-radius: 0;
 -moz-border-radius: 0;
 border-radius: 0;
 -webkit-box-shadow: none;
 -moz-box-shadow: none;
 box-shadow: none;
 border: 0;
 float: left;
 margin: 0;
 padding: 0px 5px;
 line-height: 30px;
 width: CALC(100% - 38px);
 height: 30px;
 position: relative;
}

.search-form > .search-pane > input:focus {
 -webkit-box-shadow: none;
 -moz-box-shadow: none;
 box-shadow: none;
 outline: none;
}

.search-form > .search-pane button[type="submit"] {
 float: right;
 background: #00c2a9;
 color: #fff;
 border: 0;
 width: 30px;
 height: 30px;
 margin: 0;
}

.mt15 {
 margin-top: 15px;
}

.sec-btn, .tbl-btn {
 height: 60px;
 position: relative;
}

.tbl-btn .tag-kot, .tbl-btn .tag-bill {
 position: absolute;
 right: -10px;
 top: -3px;
 width: 30px;
 line-height: 15px;
 font-size: 9px;
 font-weight: 400;
 background: #008d4c;
 -webkit-transform: rotate(45deg);
 -moz-transform: rotate(45deg);
 -ms-transform: rotate(45deg);
 -o-transform: rotate(45deg);
}

.tbl-btn .tag-bill {
 right: auto;
 left: -10px;
 background: #d73925;
 -webkit-transform: rotate(-45deg);
 -moz-transform: rotate(-45deg);
 -ms-transform: rotate(-45deg);
 -o-transform: rotate(-45deg);
}

#kotModal {
 height: 100%;
 border-radius: 0;
 padding: 0px !important;
}

#kotModal .modal-dialog {
 width: 100%;
 height: 100%;
 padding: 0;
}

.loading-text {
 background: #FFF;
 width: 100%;
 text-align: center;
 line-height: 100px;
}

/***** USERLIST *****/
.userlist {
 padding: 0;
 margin: 0;
 list-style: none;
}

.userlist li a {
 display: block;
 text-decoration: none;
 border-radius: 3px;
 padding: 10px;
}

.userlist li img {
 margin-right: 10px;
 height: 50px;
 width: 50px;
 border-radius: 50px;
 border: 2px solid #00c2a9;
}

.userlist li a:hover {
 background: #00c2a9;
 color: #fff;
}

label.checklist {
 position: relative;
 display: inline-block;
}

label.checklist input {
 position: absolute;
 left: 8px;
 top: 8px;
}

label.checklist span {
 text-indent: 20px;
 padding: 6px 10px;
 display: block;
}

label.checklist input:checked + span {
 background-color: #00c2a9;
 color: #fff;
}

.tbl-btn .item-name {
 display: block;
 font-size: 12pt;
 letter-spacing: 2px;
 font-weight: 400;
 line-height: 20px;
}

.tbl-btn .item-small-name {
 display: block;
 font-size: 11px;
 font-weight: 400;
 line-height: 15px;
}

.checkbox {
 margin: 0;
 padding: 0;
 position: relative;
 cursor: pointer;
 display: inline-block;
 vertical-align: middle;
 font-size: 14px;
 font-weight: 400 !important;
}

.rdio-full {
 display: block;
 margin-bottom: 10px !important;
}

.rdio-full:first-child {
 margin-top: 5px;
}

.rdio-full:last-child {
 margin-bottom: 0 !important;
}

.checkbox input {
 position: absolute;
 opacity: 0
}

.checkbox span {
 position: relative;
 display: inline-block;
 margin-top: -2px;
 width: 17px;
 height: 17px;
 border-radius: 1px;
 background: rgba(250, 250, 250, 0.25);
 border: 1px solid #00c2a9;
 vertical-align: middle;
 margin-right: 5px;
}

.checkbox input:disabled ~ span {
 background: rgba(210, 214, 222, 0.25);
 border-color: #ecf0f5;
}

.checkbox span:hover {
 background: rgba(250, 250, 250, .75)
}

.checkbox span:after {
 content: "";
 position: absolute;
 top: 3px;
 right: 3px;
 bottom: 3px;
 left: 3px;
 border-radius: 1px;
 background-color: #fff;
 opacity: 0;
 -webkit-transition: all .15s ease-out;
 transition: all .15s ease-out;
 -webkit-transform: scale(.5);
 transform: scale(.5)
}

.checkbox input:checked + span:after {
 opacity: 1;
 -webkit-transform: scale(1);
 transform: scale(1);
 background-color: #00c2a9
}

.checkbox input:checked:disabled + span:after {
 background-color: #ecf0f5;
}

.checkbox.radio span, .checkbox.radio span:after {
 border-radius: 100%;
}

.tiles {
 list-style-type: none;
 margin: 10px 0;
 padding: 0;
 text-align: center;
 width: 100%;
}

.tiles > li {
 display: inline-block;
 text-align: center;
 float: none;
 margin: 0px 0px 8px 8px;
 position: relative;
}

.tiles > li > a {
 width: 150px;
 height: 150px;
 display: block;
 color: #fff;
 text-decoration: none;
 text-align: center;
}

.tiles > li > a span {
 font-size: 50px;
 display: block;
 padding-top: 20px;
}

.tiles > li > a span i {
 font-size: 50px;
}

.tiles > li > a span.title {
 font-size: 16pt !important;
 display: block;
 position: absolute;
 top: 90px;
 left: 0;
 right: 0;
 padding: 10px 2px;
 float: left;
 text-align: center;
 line-height: 22px;
}

.dropdown-menu > li.btns {
 padding: 5px;
}

.dropdown-menu > li.btns > a {
 display: inline-block;
 color: #777 !important;
 margin: 5px;
 line-height: 30px !important;
 padding: 5px 18px 5px 25px !important;
}

.tbl-btn {
 font-weight: 700;
}

.asterisk {
 color: #FF0000;
}

ul.sorting {
 list-style: none;
 padding: 0%;
 width: 100%;
 float: left;
}

ul.sorting li {
 display: inline-block;
 color: #2c3b41;
 margin: 5px;
 padding: 10px;
 background: #f5f5f5;
 border: 1px solid #2c3b41;
 cursor: move;
 border-radius: 1px;
}

.bggrey .form-control, .bggrey .input-group-addon {
 background: #f2f2f2;
}

.CalBtns {
 width: 100%;
 float: left;
 clear: both;
}

.CalBtns .btn {
 padding: 20px 0px;
 font-size: 16pt;
 width: CALC(33.333334% - 7px);
 margin: 4px 2px !important;
}

.CalBtns .btn.double {
 width: CALC(66.666667% - 7px);
}

.pad-10 {
 padding: 10px !important;
}

.btn {
 outline: none !important;
}

.size14 {
 font-size: 14px;
}

.mar-bottom-0 {
 margin-bottom: 0;
}

.form-control {
 padding: 5px 10px;
}

.form-group label:first-child {
 font-size: 14px;
 font-weight: 600;
 margin-bottom: 2px;
}

.required:before {
 content: '*';
 float: right;
 margin-left: 3px;
 color: #ff0606;
 font-size: 14px;
}

.box-header .box-title {
 font-size: 20px;
 font-weight: 600;
}

.table > thead > tr > th, .table > tbody > tr > th, .table > tfoot > tr > th, .table > thead > tr > td, .table > tbody > tr > td, .table > tfoot > tr > td {
 font-size: 14px;
}

.c-btn {
 padding: 5.5px 10px;
 z-index: 99;
}

.modal-dialog {
 margin: 0px auto;
}

.modal-title {
 font-weight: 800;
}

.modal-header .close {
 color: #fff;
 opacity: 1;
 margin-top: 0;
}

.modal-primary .modal-footer {
 background: #fff !important;
}

@media (min-width: 992px) {
 .modal-lg {
  width: 991px;
 }
}

.form-control.o0 {
 background: transparent !important;
 border: none !important;
}

.list-group-item > a[data-toggle="collapse"]:before {
 float: right;
 font-family: "spfonts";
 content: '\e82b';
}

.list-group-item > a[data-toggle="collapse"][aria-expanded="true"]:before {
 content: '\e831';
}

.list-group-item {
 position: relative;
}

.list-group-item > button.pull-right {
 position: absolute;
 right: 10px;
 z-index: 1000;
}

.group-btn {
 padding: 5.5px 10px;
}

th[data-ajaxify="true"], td[data-ajaxify="true"] {
 cursor: pointer;
}

hr.nomargin {
 margin: 2px 0px;
}

.form-group .QtyDesc {
 background: #ff9c00;
 color: #fff;
 position: absolute;
 font-size: 13px;
 font-weight: normal;
 top: auto;
 bottom: -40px;
 left: 0px;
 padding: 5px;
 z-index: 1;
 border-radius: 2px;
 box-shadow: 0px 2px 2px rgba(0, 0, 0, 0.3);
}

.form-group .QtyDesc:after {
 border-bottom: 6px solid #ff9c00;
 border-left: 6px solid rgba(0, 0, 0, 0);
 border-right: 6px solid rgba(0, 0, 0, 0);
 content: '';
 display: inline-block;
 position: absolute;
 top: -6px;
 right: 50%;
 margin-right: -6px;
}

.btn .badge.amt {
 bottom: -2px;
 left: -2px;
 right: auto;
 position: absolute;
}

.Grid tbody tr:nth-child(1) [rel="RowDel"],
tbody.Grid tr:nth-child(1) [rel="RowDel"] {
 visibility: hidden;
}
#protbldiv .btn{
 white-space: normal;
}


label.switch {
 position: relative;
 display: inline-block;
 width: 38px;
 height: 20px;
}

/* Hide default HTML checkbox */
label.switch input {
 opacity: 0;
 width: 0;
 height: 0;
}

/* The slider */
label.switch .slider {
 position: absolute;
 cursor: pointer;
 top: 0;
 left: 0;
 right: 0;
 bottom: 0;
 background-color: #ccc;
 -webkit-transition: .4s;
 transition: .4s;
 border-radius: 20px;
}

label.switch .slider:before {
 position: absolute;
 content: "";
 height: 16px;
 width: 18px;
 left: 2px;
 bottom: 2px;
 background-color: white;
 -webkit-transition: .4s;
 transition: .4s;
 border-radius: 50%;
}

label.switch input:checked + .slider {
 background-color: #2196F3;
}

label.switch input:focus + .slider {
 box-shadow: 0 0 1px #2196F3;
}

label.switch input:checked + .slider:before {
 -webkit-transform: translateX(16px);
 -ms-transform: translateX(16px);
 transform: translateX(16px);
}
