.datatable {
    text-align: center;
    font-style: normal;
    font-weight: 300;
    font-size: 1.4rem;
    line-height: 2rem;
    letter-spacing: 0.01rem;
    color: #212121;
    background-color: #f5f5f5;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
    text-rendering: optimizeLegibility;
}

.datatable {
    text-align: left;
    width: 100%;
}

.datatable {
    display: block;
    overflow: hidden;
    justify-content: center;
    position: relative;
    /**
   * Vertical Scrolling Adjustments
   */
    /**
   * Horizontal Scrolling Adjustments
   */
    /**
   * Fixed Header Height Adjustments
   */
    /**
   * Fixed row height adjustments
   */
    /**
   * Shared Styles
   */
    /**
   * Header Styles
   */
    /**
   * Body Styles
   */
    /**
   * Footer Styles
   */
}

.datatable [hidden] {
    display: none !important;
}

.datatable *,
.datatable *:before,
.datatable *:after {
    -moz-box-sizing: border-box;
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
}

.datatable.scroll-vertical .datatable-body {
    overflow-y: auto;
}

.datatable.scroll-vertical .datatable-body .datatable-body-row {
    position: absolute;
}

.datatable.scroll-horz .datatable-body {
    overflow-x: auto;
}

.datatable.fixed-header .datatable-header .datatable-header-inner {
    white-space: nowrap;
}

.datatable.fixed-header .datatable-header .datatable-header-inner .datatable-header-cell {
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.datatable.fixed-row .datatable-scroll {
    white-space: nowrap;
}

.datatable.fixed-row .datatable-scroll .datatable-body-row {
    white-space: nowrap;
}

.datatable.fixed-row .datatable-scroll .datatable-body-row .datatable-body-cell {
    overflow: hidden;
    white-space: nowrap;
    text-overflow: ellipsis;
}

.datatable .datatable-body-row,
.datatable .datatable-header-inner {
    display: -webkit-box;
    display: -moz-box;
    display: -ms-flexbox;
    display: -webkit-flex;
    display: flex;
    flex-direction: row;
    -webkit-flex-flow: row;
    -moz-flex-flow: row;
    -ms-flex-flow: row;
    -o-flex-flow: row;
    flex-flow: row;
}

.datatable .datatable-body-cell,
.datatable .datatable-header-cell {
    vertical-align: top;
    display: inline-block;
    line-height: 1.625;
    -webkit-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    -o-user-select: none;
    user-select: none;
}

.datatable .datatable-row-left,
.datatable .datatable-row-right {
    z-index: 9;
}

.datatable .datatable-row-left,
.datatable .datatable-row-center,
.datatable .datatable-row-right {
    position: relative;
}

.datatable .datatable-header {
    display: block;
    overflow: hidden;
}

.datatable .datatable-header .datatable-header-inner {
    align-items: stretch;
    -webkit-align-items: stretch;
}

.datatable .datatable-header .datatable-header-cell {
    position: relative;
    display: inline-block;
}

.datatable .datatable-header .datatable-header-cell.longpress {
    cursor: move;
}

.datatable .datatable-header .datatable-header-cell.sortable {
    cursor: pointer;
}

.datatable .datatable-header .datatable-header-cell .sort-btn {
    line-height: 100%;
    vertical-align: middle;
    display: inline-block;
}

.datatable .datatable-header .datatable-header-cell .resize-handle {
    display: inline-block;
    position: absolute;
    right: 0;
    top: 0;
    bottom: 0;
    width: 5px;
    padding: 0 8px;
    visibility: hidden;
    cursor: ew-resize;
}

.datatable .datatable-header .datatable-header-cell.resizeable:hover .resize-handle {
    visibility: visible;
}

.datatable .datatable-body {
    position: relative;
    z-index: 10;
    display: block;
}

.datatable .datatable-body .datatable-scroll {
    display: inline-block;
}

.datatable .datatable-body .datatable-body-row {
    outline: none;
}

.datatable .datatable-body .datatable-body-row> div {
    display: -webkit-box;
    display: -moz-box;
    display: -ms-flexbox;
    display: -webkit-flex;
    display: flex;
}

.datatable .datatable-footer {
    display: block;
    width: 100%;
}

.datatable .datatable-footer> div {
    display: flex;
    align-items: center;
    width: 100%;
}

.datatable .datatable-footer .page-count {
    display: inline-block;
    flex: 1 1 20%;
}

.datatable .icon-prev:before {
    content: "\f100"
}

.datatable .icon-left:before {
    content: "\f104"
}

.datatable .icon-right:before {
    content: "\f105"
}

.datatable .icon-skip:before {
    content: "\f101"
}

.datatable .icon-prev,
.datatable .icon-left,
.datatable .icon-right,
.datatable .icon-skip {
    display: inline-block;
    font: normal normal normal 14px/1 FontAwesome;
    font-size: inherit;
    text-rendering: auto;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale
}

.datatable .datatable-footer .datatable-pager .pager,
.datatable .datatable-footer .datatable-pager .pager li {
    padding: 0;
    margin: 0;
    display: inline-block;
    list-style: none;
}

.datatable .datatable-footer .datatable-pager .pager li,
.datatable .datatable-footer .datatable-pager .pager li a {
    outline: none;
}

.datatable .datatable-footer .datatable-pager .pager li a {
    cursor: pointer;
    display: inline-block;
}

.datatable .datatable-footer .datatable-pager .pager li.disabled a {
    cursor: not-allowed;
}