.spinner {
  margin: 100px auto;
  width: 40px;
  height: 40px;
  position: relative;
}

.cube1, .cube2 {
  background-color: #000;
  width: 15px;
  height: 15px;
  position: absolute;
  top: 0;
  left: 0;
  
  -webkit-animation: sk-cubemove 1.8s infinite ease-in-out;
  animation: sk-cubemove 1.8s infinite ease-in-out;
}

.cube2 {
  -webkit-animation-delay: -0.9s;
  animation-delay: -0.9s;
}

@-webkit-keyframes sk-cubemove {
  25% { -webkit-transform: translateX(42px) rotate(-90deg) scale(0.5) }
  50% { -webkit-transform: translateX(42px) translateY(42px) rotate(-180deg) }
  75% { -webkit-transform: translateX(0px) translateY(42px) rotate(-270deg) scale(0.5) }
  100% { -webkit-transform: rotate(-360deg) }
}

@keyframes sk-cubemove {
  25% { 
    transform: translateX(42px) rotate(-90deg) scale(0.5);
    -webkit-transform: translateX(42px) rotate(-90deg) scale(0.5);
  } 50% { 
    transform: translateX(42px) translateY(42px) rotate(-179deg);
    -webkit-transform: translateX(42px) translateY(42px) rotate(-179deg);
  } 50.1% { 
    transform: translateX(42px) translateY(42px) rotate(-180deg);
    -webkit-transform: translateX(42px) translateY(42px) rotate(-180deg);
  } 75% { 
    transform: translateX(0px) translateY(42px) rotate(-270deg) scale(0.5);
    -webkit-transform: translateX(0px) translateY(42px) rotate(-270deg) scale(0.5);
  } 100% { 
    transform: rotate(-360deg);
    -webkit-transform: rotate(-360deg);
  }
}
.sk-fading-circle {
  margin: 100px auto;
  width: 150px;
  height: 150px;
  position: relative;
}

.sk-fading-circle .sk-circle {
  width: 100%;
  height: 100%;
  position: absolute;
  left: 0;
  top: 0;
}

.sk-fading-circle .sk-circle:before {
  content: '';
  display: block;
  margin: 0 auto;
  width: 15%;
  height: 15%;
  background-color: #fff;
  border-radius: 100%;
  -webkit-animation: sk-circleFadeDelay 1.2s infinite ease-in-out both;
  animation: sk-circleFadeDelay 1.2s infinite ease-in-out both;
  -webkit-border-radius:;
  -moz-border-radius:;
  -ms-border-radius:;
  -o-border-radius:;
}
.sk-fading-circle .sk-circle2 {
  -webkit-transform: rotate(30deg);
      -ms-transform: rotate(30deg);
          transform: rotate(30deg);
}
.sk-fading-circle .sk-circle3 {
  -webkit-transform: rotate(60deg);
      -ms-transform: rotate(60deg);
          transform: rotate(60deg);
}
.sk-fading-circle .sk-circle4 {
  -webkit-transform: rotate(90deg);
      -ms-transform: rotate(90deg);
          transform: rotate(90deg);
}
.sk-fading-circle .sk-circle5 {
  -webkit-transform: rotate(120deg);
      -ms-transform: rotate(120deg);
          transform: rotate(120deg);
}
.sk-fading-circle .sk-circle6 {
  -webkit-transform: rotate(150deg);
      -ms-transform: rotate(150deg);
          transform: rotate(150deg);
}
.sk-fading-circle .sk-circle7 {
  -webkit-transform: rotate(180deg);
      -ms-transform: rotate(180deg);
          transform: rotate(180deg);
}
.sk-fading-circle .sk-circle8 {
  -webkit-transform: rotate(210deg);
      -ms-transform: rotate(210deg);
          transform: rotate(210deg);
}
.sk-fading-circle .sk-circle9 {
  -webkit-transform: rotate(240deg);
      -ms-transform: rotate(240deg);
          transform: rotate(240deg);
}
.sk-fading-circle .sk-circle10 {
  -webkit-transform: rotate(270deg);
      -ms-transform: rotate(270deg);
          transform: rotate(270deg);
}
.sk-fading-circle .sk-circle11 {
  -webkit-transform: rotate(300deg);
      -ms-transform: rotate(300deg);
          transform: rotate(300deg); 
}
.sk-fading-circle .sk-circle12 {
  -webkit-transform: rotate(330deg);
      -ms-transform: rotate(330deg);
          transform: rotate(330deg); 
}
.sk-fading-circle .sk-circle2:before {
  -webkit-animation-delay: -1.1s;
          animation-delay: -1.1s; 
}
.sk-fading-circle .sk-circle3:before {
  -webkit-animation-delay: -1s;
          animation-delay: -1s; 
}
.sk-fading-circle .sk-circle4:before {
  -webkit-animation-delay: -0.9s;
          animation-delay: -0.9s; 
}
.sk-fading-circle .sk-circle5:before {
  -webkit-animation-delay: -0.8s;
          animation-delay: -0.8s; 
}
.sk-fading-circle .sk-circle6:before {
  -webkit-animation-delay: -0.7s;
          animation-delay: -0.7s; 
}
.sk-fading-circle .sk-circle7:before {
  -webkit-animation-delay: -0.6s;
          animation-delay: -0.6s; 
}
.sk-fading-circle .sk-circle8:before {
  -webkit-animation-delay: -0.5s;
          animation-delay: -0.5s; 
}
.sk-fading-circle .sk-circle9:before {
  -webkit-animation-delay: -0.4s;
          animation-delay: -0.4s;
}
.sk-fading-circle .sk-circle10:before {
  -webkit-animation-delay: -0.3s;
          animation-delay: -0.3s;
}
.sk-fading-circle .sk-circle11:before {
  -webkit-animation-delay: -0.2s;
          animation-delay: -0.2s;
}
.sk-fading-circle .sk-circle12:before {
  -webkit-animation-delay: -0.1s;
          animation-delay: -0.1s;
}

@-webkit-keyframes sk-circleFadeDelay {
  0%, 39%, 100% { opacity: 0; }
  40% { opacity: 1; }
}

@keyframes sk-circleFadeDelay {
  0%, 39%, 100% { opacity: 0; }
  40% { opacity: 1; } 
}
/*sdfsdf*/

.loaderFx {

	width: 93px;

	margin: 85px auto;

	font-size: 0;

	position: relative;
}

.empty-record{

        font: 11px/1.5 "Lucida Sans Unicode","Lucida Grande",sans-serif;

        width: 100%;text-align: center;background-color: #F1F5FA;

        height: 21px;

        padding: 10px 0;

}


/*input*/
.input-long { 
	width: 75% 
	}
.input-extra-long { 
	width: 200% 
	}
.input-medium {
        width: 50%;
}
.input-short {
        width: 20%;
}
.input-xshort{
	width: 10%;
}
.input-w15{
	width: 15%;
}

/*button arrow*/

.arrows a.next, .arrows a:visited.next, .arrows a.prev, .arrows a:visited.prev{

	height:24px;

	width:24px;

	float:left;

	margin-left: 5px;

	margin-top: -9px;

	}

.arrows a:hover.next, .arrows a:hover.prev{

	height:24px;

	width:24px;

	float:left;

	margin-left: 5px;

	margin-top: -9px;

	}

.arrows a.next, .arrows a:visited.next{

	background:url(../../img/table/next.png) top left no-repeat;

	}

.arrows a:hover.next{

	background:url(../../img/table/nexthover.png) top left no-repeat;

        cursor: pointer;

	}

.arrows a.prev, .arrows a:visited.prev{

	background:url(../../img/table/previous.png) top left no-repeat;

	}

.arrows a:hover.prev{

	background:url(../../img/table/previoushover.png) top left no-repeat;

        cursor: pointer;

	}

.arrowsnext a.next, .arrowsnext a:visited.next, .arrowsnext a.prev, .arrowsnext a:visited.prev{

	height:24px;

	width:24px;

	float:left;

	margin-left: 5px;

	margin-top: -9px;

	}

.arrowsnext a:hover.next, .arrowsnext a:hover.prev{

	height:24px;

	width:24px;

	float:left;

	margin-left: 5px;

	margin-top: -9px;

	}

.arrowsnext a.next, .arrowsnext a:visited.next{

	background:url(../../img/table/next.png) top left no-repeat;

	}

.arrowsnext a:hover.next{

	background:url(../../img/table/nexthover.png) top left no-repeat;

        cursor: pointer;

	}

.arrowsnext a.prev, .arrowsnext a:visited.prev{

	background:url(../../img/table/previous.png) top left no-repeat;

	}

.arrowsprev a.next, .arrowsprev a:visited.next, .arrowsprev a.prev, .arrowsprev a:visited.prev{

	height:24px;

	width:24px;

	float:left;

	margin-left: 5px;

	margin-top: -9px;

	}

.arrowsprev a:hover.next, .arrowsprev a:hover.prev{

	height:24px;

	width:24px;

	float:left;

	margin-left: 5px;

	margin-top: -9px;

	}

.arrowsprev a.next, .arrowsprev a:visited.next{

	background:url(../../img/table/next.png) top left no-repeat;

	}

.arrowsprev a.prev, .arrowsprev a:visited.prev{

	background:url(../../img/table/previous.png) top left no-repeat;

	}

.arrowsprev a:hover.prev{

	background:url(../../img/table/previoushover.png) top left no-repeat;

        cursor: pointer;

	}

/*button arrow*/



/*tables*/

p label{

	display: block;

	font-size: 14px;

}

th.align-center,td.align-center{

	text-align: center !important;

}

.multi_edit_buttons{

	padding-left: 8px;

}

#loadNotice{

	z-index: 16000;

}

.POajaxloader{

    background-image: url(../img/ajax-loader.gif) !important;

    background-repeat: no-repeat !important;

    background-position: center center!important;

    /*background-size: 20px 20px;*/

}

.TreeAjaxLoader{

    background-image: url(../img/ajax-loader.gif) !important;

    background-repeat: no-repeat !important;

    background-position: left center !important;

    /*background-size: 20px 20px;*/

}

.medium-loader-lc{

    background: url(../img/big-loader.gif) !important;

    background-repeat: no-repeat !important;

    background-position: left center!important;

    background-size: 28px !important;

}

.medium-loader{

    background: url(../img/big-loader.gif) !important;

    background-repeat: no-repeat !important;

    background-position: center!important;

    background-size: 28px !important;

}

.big-loader{

    background: url(../img/big-loader.gif) !important;

    background-repeat: no-repeat !important;

    background-position: left center!important;

    background-size: 44px !important;

}

.modal-loader{

    background: url(../img/big-loader.gif) !important;

    background-repeat: no-repeat !important;

    background-position: center!important;

    margin-top: 10px;

    min-height: 50px;

}

.btnPO{

	width: 20px !important;

	height: 20px !important;

}

.btnPOremove{

	width: 20px;

	height: 20px;

	background: url(../img/cancel.png);

	background-repeat: no-repeat ;

	background-position: center center;

	cursor: pointer;

}

.btnFsType{

	background: url(../img/ajax-loader.gif) !important;

	background-repeat: no-repeat !important;

	background-position: right center!important;

}

.btnPOremove:hover{

	border: 1px solid;

	border-radius: 9px;

}

.t-c{

	text-align: center !important;

}

.t-r{

	text-align: right !important;

}

.btn-grid{

	float: right;

	min-width: 107px;

}

.dp-none{

	display: none !important;

}

.tb-cell{

	display: table-cell !important;

}



#bill-table tbody tr td:first-child,#bill-table thead tr th:first-child,#po-table tbody tr td:first-child,#po-table thead tr th:first-child,#po-table tfoot tr th:first-child{

	border-left: none !important;

}

#bill-table tbody tr td:last-child,#bill-table thead tr th:last-child,#po-table tbody tr td:last-child,#po-table thead tr th:last-child,#po-table tfoot tr th:last-child{

	border-right: none !important;

}

.m-auto{

	margin: 0 auto;

}

.block{

	display: block !important;

}

/*XALERT*/

#tooltip	{

	background-color: #8c8c8c;

	border: 1px solid #767676;

	color: #fff;

	font-family: Arial;

	font-size: 10px;

	font-weight: normal;

	opacity: 0.85;

	padding: 0 10px;

	position: absolute;

	text-align: center;

	z-index: 3000;

	}

#tooltip h6, #tooltip div	{

	font-family: Arial;

	font-size: 11px;

	line-height: 20px;

	margin: 0;

	}

/*********END OF XALERT****/





.ajaxloader{

    background-image:  url(../img/ajax-loader.gif) !important;

    background-repeat: no-repeat !important;

    background-position: center center!important;

    /*background-size: 29px 28px;*/

}

.pointer{

	cursor: pointer !important;

}

.dgclose{

	background-image:  url(../img/close.png) !important;

	background-repeat: no-repeat !important;

	background-position: center center!important;

	width: 20px;

	height: 20px;

}

#xblock select{

	display: table-cell;

}

#lde-table td.btn-l:last-child{

	padding: 0;

}

#lde-table tbody tr{

        cursor: pointer;

}

#lde-table thead tr th.left,#lde-table tbody tr td.left{

        text-align: left !important;

}

#lde-table thead tr th.right{

        padding-right: 17px !important;

}

#lde-table thead tr th.right,#lde-table tbody tr td.right{

        text-align: right !important;

}

#lde-table thead tr th.center,#lde-table tbody tr td.center{

        text-align: center !important;

}

#tooltip {

    background-color: #8C8C8C;

    border: 1px solid #767676;

    color: #FFFFFF;

    font-family: Arial;

    font-size: 10px;

    font-weight: normal;

    opacity: 0.85;

    padding: 0 10px;

    position: absolute;

    text-align: center;

    z-index: 3000;

}

#tooltip h6, #tooltip div {

    font-family: Arial;

    font-size: 11px;

    line-height: 20px;

    margin: 0;

}



@media (max-width: 992px) {

  .cancel-bill{

	left: 15px;

  }

}

/*///////////////////////////////*/

.parentTypes{

	padding-left: 30px;

	padding-bottom: 5px;

}

.parentTypes .form-group{

	margin-bottom: 5px !important; 

}

#header-search{

    height: 35px;

}

.t-r{

  text-align: right;

}

.t-l{

  text-align:left;

}

.t-c{

  text-align:center;

}

.f-l{

	float: left;

}

.f-r{

	float: right;

}

.modal-header{

    padding: 8px !important;

}

.mode-swipe,.mode-columntoggle,.tablesaw-modeswitch{

	display:none;

}

#lde-table tbody tr.no-records-found td{

	text-align:center;

}

tr.no-records-found{

	display: none;

}

.table-js-control td.err {

    box-shadow: inset 0 0 8px red;

}

td.btn-tbl{

	padding: 3px !important;

}

#hackmemore .selectize-input,#hackmemoreI .selectize-input,#hackmemoreA .selectize-input,#hackmemoreB .selectize-input{

    min-height: 29px;

	padding: 2.5px 8px 3px;

}

#hackmemore .form-control,#hackmemoreI .form-control,#hackmemoreA .form-control,#hackmemoreB .form-control{

    height: 30px;

	border: none;

    border-bottom: 1px solid #ccc;

	border-radius: 0;

	padding: 6px;

}

#hackmemore td,#hackmemoreI td,#hackmemoreA td,#hackmemoreB td{

	padding: 3px 5px;

}

.grey:focus, .grey:hover {

    border: 1px solid #3c8dbc;

    box-shadow: 0 0 5px #3c8dbc inset;

}

.grey {

    background-color: #eee;

    font-weight: 500;

}

.totalDue{

	font-size: 17px;

}

#xtotalbal,#xtotalbalv{

	font-weight: 400;

}

.date input{

	padding-left: 6px;

	padding-right: 6px;

}