/*
example:
 @include linx(white, blue, green, red);
*/
.btn-primary, .btn-default, .btn-secondary {
  padding: 0px 10px;
  font-family: Arial, Verdana, Georgia, Times, "Times New Roman", serif;
  text-transform: capitalize;
  outline: 0;
  height: auto;
  border: 1px solid #0bb1c0;
  font-size: 1em;
  border-radius: 3px;
  line-height: 2;
   }
   .btn-primary{
   background: #0bb1c0;
   color: #fff;
  	border: 1px solid #0bb1c0;
   }
  @media only screen and (max-width: 767px) {
    .btn-primary {
      font-size: 0.875em; } }
  .btn-primary:visited, .btn-primary:focus {
    background: #0bb1c0;
    color: #fff;}
  .btn-primary:hover {
    background: #fff;
    color: #0bb1c0;
    border: 1px solid #0bb1c0; }
  .btn-primary:active {
    background: #fff;
    color: #0bb1c0 !important;
    border: 1px solid #0bb1c0; }
  .btn-primary:disabled {
    background: #d9d9d9;
    pointer-events: none;
    border: 1px solid #bdbdbd; }

.btn-secondary {
  background: #fff;
  color: #0bb1c0;
  border: 1px solid #0bb1c0;
  }
  @media only screen and (max-width: 767px) {
    .btn-secondary {
      font-size: 0.875em; } }
  .btn-secondary:visited, .btn-secondary:focus {
    background: #fff;
    color: #0bb1c0;
    border: 1px solid #0bb1c0; }
  .btn-secondary:hover {
    background: #0bb1c0;
    color: #fff;
    border: 1px solid #fff; }
  .btn-secondary:active {
    background: #0bb1c0;
    color: #fff !important;
    border: 1px solid #fff; }
  .btn-secondary:disabled {
    background: #d9d9d9;
    pointer-events: none;
    border: 1px solid #bdbdbd; }
  .btn-secondary:hover {
    border: 1px solid #0bb1c0; }

.btn-default {
  background: #bdbdbd;
  color: #f8f8f8;
  border: 1px solid #f8f8f8;
  }
  @media only screen and (max-width: 767px) {
    .btn-default {
      font-size: 0.875em; } }
  .btn-default:visited, .btn-default:focus {
    background: #bdbdbd;
    color: #f8f8f8;
    border: 1px solid #f8f8f8; }
  .btn-default:hover {
    background: #f8f8f8;
    color: #bdbdbd;
    border: 1px solid #bdbdbd; }
  .btn-default:active {
    background: #f8f8f8;
    color: #bdbdbd !important;
    border: 1px solid #bdbdbd; }
  .btn-default:disabled {
    background: #d9d9d9;
    pointer-events: none;
    border: 1px solid #bdbdbd; }
  .btn-default:hover, .btn-default:active, .btn-default:visited, .btn-default:focus {
    color: #333; }
  @media only screen and (max-width: 767px) {
    .btn-default {
      font-size: 0.7em; } }

/*
<div class="select-checkbox">
<input type="checkbox" checked="checked" value="selected value">
<label class="label-after">some text</label>
</div>
*/
.select-checkbox {
  /* to hide the checkbox itself */
  /* checked icon */ }
  .select-checkbox input[type=checkbox] {
    display: none; }
  .select-checkbox label.label-after:after, .select-checkbox label.label-before:before {
    font-family: 'icomoon' !important;
    display: inline-block;
    content: "\e922";
    letter-spacing: 10px;
    line-height: 18px;
    vertical-align: top; }
  .select-checkbox input[type=checkbox]:checked + label.label-after:after, .select-checkbox input[type=checkbox]:checked + label.label-before:before {
     font-family: 'icomoon' !important;
    content: "\e921";
    letter-spacing: 7px;
    color: #68beeb;
    font-size: 21px;
    vertical-align: top;
    margin-left: -1px;
    line-height: 18px; }
.mandatoryField {
	color: #eb0407;
	padding-right: 2px;
}
select{height: 28px; font-size: 1em; border-radius: 3px; padding: 1px 5px;}
select[multiple] {height: 80px!important; font-size: 1em; background-image: none!important;}
form select::-ms-expand {background-color:#dde0e5 !important; border:1px solid #cccccc; display: none;}
select{ -webkit-appearance: none; -moz-appearance: none; appearance: none;text-transform:capitalize;background-image: url(/wms/images/RESCA_sort_arrow.png) !important;background-repeat: no-repeat;background-position: 97% 50%;}
select option:hover {color: #fff; background-color:#00a8b7; box-shadow: inset 20px 20px #00a8b7;}

@media (min-width: 1264px) and (max-width: 1349px) {
	select{
		height: 32px;
	}
}
@media (min-width: 1424px) and (max-width: 1583px) {
	select{
		height: 32px;
	}
}
@media (min-width: 1425px) and (max-width: 1680px) {
	select{
		height: 32px;
	}
}

/* added by Noor responsive media queries */
@media (min-width: 1980px) and (max-width: 2560px) {}
@media (min-width: 1920px) and (max-width: 1979px) {}
@media (min-width: 1680px) and (max-width: 1919px) {}
@media (min-width: 1584px) and (max-width: 1679px) {}
@media (min-width: 1424px) and (max-width: 1583px) {
	button.btn.btn-primary.viewDGRbtn.pull-right, a.btn.btn-primary.viewDGRbtn.pull-right.marginR5 {padding: 0px 5px;}
	.viewDGRbtn i {padding-right: 3px;}
}
@media (min-width: 1333px) and (max-width: 1423px) {
	button.btn.btn-primary.viewDGRbtn.pull-right, a.btn.btn-primary.viewDGRbtn.pull-right.marginR5 {padding: 0px 2px;}
	.viewDGRbtn i {padding-right: 2px;}
}
@media (min-width: 1264px) and (max-width: 1332px) {
	button.btn.btn-primary.viewDGRbtn.pull-right, a.btn.btn-primary.viewDGRbtn.pull-right.marginR5 {padding: 0px 1px;}
	.viewDGRbtn i {padding-right: 0;}
	
}
@media (min-width: 1007px) and (max-width: 1263px) {}
@media (min-width: 947px) and (max-width: 1006px){
	
}
@media (min-width: 767px) and (max-width: 946px) {
	button.btn.btn-primary.viewDGRbtn.pull-right, a.btn.btn-primary.viewDGRbtn.pull-right.marginR5 {padding: 0px 1px;}
	.viewDGRbtn i {padding-right: 0;}
}
@media (min-width: 751px) and (max-width: 766px) {}
@media (min-width: 623px) and (max-width: 750px) {}
@media (min-width: 463px) and (max-width: 622px) {}
@media (min-width: 327px) and (max-width: 462px) {}
@media (min-width: 303px) and (max-width: 326px) {}