.ui-jqgrid-htable {
  margin-bottom: 0;
  table-layout: fixed;
}
.ui-jqgrid-htable.table-bordered {
  border: 0;
}
.ui-jqgrid-htable .ui-th-div {
  overflow: hidden;
  margin-right: 1rem;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.ui-jqgrid-btable {
  margin-bottom: 0;
  table-layout: fixed;
}
.ui-jqgrid-btable > tbody > tr td {
  overflow: hidden;
}

.data-overview > tbody > tr:hover td {
  background-color: #DBDBDB;
  cursor: pointer;
}
.data-overview > tbody > tr td {
  transition: background-color 0.3s ease-in;
}
.data-overview > tbody > tr.jqgfirstrow td {
  padding: 0;
}

.ui-jqgrid-hdiv {
  position: sticky;
  position: -webkit-sticky;
  position: -moz-sticky;
  position: -ms-sticky;
  position: -o-sticky;
  top: 134px;
  z-index: 1030;
  padding-top: 1.25rem;
  background: #fff;
}

.ui-jqgrid {
  position: relative;
  -moz-box-sizing: content-box;
  -webkit-box-sizing: content-box;
  box-sizing: content-box;
}
.ui-jqgrid .ui-jqgrid-resize {
  overflow: hidden;
  width: 4px;
  height: 100%;
  cursor: e-resize;
  display: inline;
  position: absolute;
  top: 0;
  right: -4px;
}
.ui-jqgrid .ui-jqgrid-resize:hover {
  background: #AAAAAA;
}
.ui-jqgrid .ui-jqgrid-resize-mark {
  width: 4px;
  left: 0;
  background-color: #AAAAAA;
  cursor: col-resize;
  position: absolute;
  top: 0;
  height: 100px;
  overflow: hidden;
  display: none;
  border: 0 none;
  z-index: 99999;
}
.ui-jqgrid .loading {
  position: absolute;
  top: 45%;
  left: 45%;
  width: auto;
  z-index: 101;
  padding: 0.25rem 0.4rem 0.15rem;
  border: 1px solid #DBDBDB;
  border-radius: 0.3rem;
  background: rgba(255, 255, 255, 0.8);
  display: none;
}
.ui-jqgrid .jqgrid-overlay {
  display: none;
  z-index: 100;
}
.ui-jqgrid .s-ico {
  position: absolute;
  width: 8px;
  height: 11px;
  top: 50%;
  right: 0.5rem;
  margin-top: -5px;
}
.ui-jqgrid .ui-grid-ico-sort {
  overflow: hidden;
  position: absolute;
  display: inline;
  cursor: pointer;
  left: 0;
  width: 0;
  height: 0;
  border-style: solid;
}
.ui-jqgrid .ui-jqgrid-sortable {
  cursor: pointer;
}
.ui-jqgrid .ui-icon-asc {
  top: 0;
  border-width: 0 4px 4px;
  border-color: transparent transparent #0078be;
}
.ui-jqgrid .ui-icon-asc.ui-state-disabled {
  border-bottom-color: #95989A;
}
.ui-jqgrid .ui-icon-desc {
  bottom: 0;
  border-width: 4px 4px 0;
  border-color: #0078be transparent transparent;
}
.ui-jqgrid .ui-icon-desc.ui-state-disabled {
  border-top-color: #95989A;
}

.ui-pager-table {
  font-size: 0.875rem;
  color: #95989A;
  width: 100%;
  table-layout: fixed;
  margin-top: 2.5rem;
}

.ui-pg-button {
  transition: opacity 0.3s ease-in;
  padding: 0;
}
.ui-pg-button .ui-icon {
  display: inline-block;
  width: 2rem;
  text-align: center;
  padding: 0.4rem 0 0;
}
.ui-pg-button:not(.ui-state-disabled):hover {
  opacity: 0.8;
}
.ui-pg-button.ui-state-disabled .ui-icon .icon {
  fill: #BCBEC0;
}

.ui-pg-input {
  width: 3.5rem;
  display: inline-block;
  padding: 0 0.5rem;
  text-align: center;
  min-height: 2rem;
}

.ui-pg-selbox {
  padding: 0 0.25rem;
  min-height: 2rem;
}

.ui-th-column,
.ui-jqgrid .ui-jqgrid-htable .ui-th-column {
  white-space: nowrap;
  text-align: left;
}

.ui-th-column-header,
.ui-jqgrid .ui-jqgrid-htable .ui-th-column-header {
  white-space: nowrap;
  text-align: left;
}

.search-jqgrid {
  clear: both;
  overflow: hidden;
  white-space: nowrap;
  font-size: 0.875rem;
  color: #95989A;
  margin: 0.25rem 0 1.25rem;
}
.search-jqgrid .col-form-label {
  display: inline-block;
  margin-right: 0.5rem;
}
.search-jqgrid .form-control {
  transition: all 0.3s ease-in;
  display: inline-block;
  width: auto;
  min-width: 230px;
  background: #F2F2F2;
  border-color: transparent;
  padding-left: 0.5rem;
  padding-right: 0.5rem;
  font-weight: 300;
}
.search-jqgrid .form-control:hover, .search-jqgrid .form-control:focus {
  background: #D1D1D1;
}

.loading {
  text-align: center;
}
.loading > div {
  width: 12px;
  height: 12px;
  margin: 0 3px;
  background-color: #50a052;
  border-radius: 100%;
  display: inline-block;
  -webkit-animation: sk-bouncedelay 1.4s infinite ease-in-out both;
  animation: sk-bouncedelay 1.4s infinite ease-in-out both;
}
.loading .bounce1 {
  -webkit-animation-delay: -0.32s;
  animation-delay: -0.32s;
}
.loading .bounce2 {
  -webkit-animation-delay: -0.16s;
  animation-delay: -0.16s;
}

@-webkit-keyframes sk-bouncedelay {
  0%, 80%, 100% {
    -webkit-transform: scale(0);
  }
  40% {
    -webkit-transform: scale(1);
  }
}
@keyframes sk-bouncedelay {
  0%, 80%, 100% {
    -webkit-transform: scale(0);
    transform: scale(0);
  }
  40% {
    -webkit-transform: scale(1);
    transform: scale(1);
  }
}
@media (max-width: 767.98px) {
  .search-jqgrid {
    float: none !important;
  }
  .search-jqgrid .form-control {
    width: 100%;
  }

  .ui-jqgrid .ui-jqgrid-view {
    overflow-x: scroll;
    -webkit-overflow-scrolling: touch;
  }
  .ui-jqgrid .ui-jqgrid-view .ui-jqgrid-hdiv {
    width: 800px !important;
  }
  .ui-jqgrid .ui-jqgrid-view .ui-jqgrid-hdiv .ui-jqgrid-htable {
    width: 100% !important;
  }
  .ui-jqgrid .ui-jqgrid-view .ui-jqgrid-bdiv {
    width: 800px !important;
  }
  .ui-jqgrid .ui-jqgrid-view .ui-jqgrid-bdiv .ui-jqgrid-btable {
    width: 100% !important;
  }

  .ui-pager-table {
    display: block;
  }
  .ui-pager-table > tbody {
    display: block;
  }
  .ui-pager-table > tbody > tr {
    display: block;
  }
  .ui-pager-table > tbody > tr > td {
    display: block;
  }

  #gridpager_left,
#gridpager_center,
#gridpager_right {
    display: block;
    font-size: 0.75rem;
  }

  #gridpager_center {
    width: 100% !important;
    white-space: normal !important;
  }

  #input_gridpager {
    white-space: pre;
  }

  .ui-pg-input {
    width: 2.5rem !important;
    font-size: 0.75rem;
  }

  .ui-pg-selbox {
    float: right;
    margin: 1rem 0;
    max-width: 4.5rem;
  }

  .ui-icon svg {
    width: 16px;
    height: auto;
  }

  .ui-paging-pager {
    display: block;
  }
  .ui-paging-pager > tbody {
    display: block;
  }
  .ui-paging-pager > tbody > tr {
    display: block;
  }
  .ui-paging-pager > tbody > tr > td {
    display: inline-block;
  }
  .ui-paging-pager > tbody > tr > td:last-child {
    width: 100%;
  }
}
