table.tbGridUI {
    background:#fff;
    width:100%;
    border-spacing: 0;
    margin:0 0 20px;
}

.tbGridUI thead th,
.tbGridUI tfoot td{
    color:#000;
}

.tbGridUI thead,
.tbGridUI tfoot {
    font-weight:bold;
    text-align:left;
}
.tbGridUI tfoot {
    background:#eee;
}
.tbGridUI thead th{
    border-bottom:1px solid #222;
}
.tbGridUI tfoot td {
    border-top:1px solid #222;
}

.sticky-header thead{
    position: -webkit-sticky;
    position: sticky;
    background: #fff;
    top: 0;
}

.sticky-column{
    z-index:10;
}
.sticky-column th:first-child,
.sticky-column tr td:first-child{
    position: -webkit-sticky;
    position: sticky;
    left: 0;
    background:#fff;
    z-index: 2;
   /* width:120px;
    */
}
.sticky-column td:first-child{
    border-right:1px solid #222;
}

.tbGridUI th,
.tbGridUI td {
    border-bottom:1px solid #e5e5e5;
    padding:0 5px;
    height:30px;
    vertical-align: middle;
}

.tbGridUI th.thumb {
    width:120px;
}

.tbGridUI td.thumb img {
    display:block;
    height:60px;
    max-width:auto;
}

.tbGridUI th.number,
.tbGridUI td.number {
    text-align:right;
}

.tbGridUI th.flow,
.tbGridUI td.flow {
    text-align:right;
    overflow:visible;
}

.tbGridUI tbody tr:hover {
    background:#d5f4ff;
    padding:4px 4px;
}

.tbGridUI .trChecked{
    background:#cce8ff;
}
.tbGridUI .trChecked td{
    border-bottom:1px solid #fff;
}

.tbCellDot th,
.tbCellDot td {
    text-overflow:ellipsis;
    white-space:nowrap;
    overflow:hidden;
}

/******/
table.tbGrid {
    background:#fff;
    width:100%;
    border-collapse:collapse;
}
.tbGrid thead,
.tbGrid tfoot{
    background:#e7e7e7;
}
.tbGrid th,
.tbGrid td{
    padding:10px 10px;
    text-align:left;
    border:1px solid #d5d5d5;
}
.tbGrid tbody tr:hover{
    background:#f0f0f0;
}
.tbGrid tbody tr td:hover{
    background:#d5f4ff;
}

.tbRowalt tbody tr:nth-child(even) {background-color: #f8edd9;}
/*******/

.tbCellDot th,
.tbCellDot td {
    text-overflow:ellipsis;
    white-space:nowrap;
    overflow:hidden;
}

@media(max-width:768px){
    .tb-resp thead{
        display:none;
    }
    
    .tb-resp,
    .tb-resp thead, 
    .tb-resp tbody, 
    .tb-resp th, 
    .tb-resp td, 
    .tb-resp tr 
    {
        float:left;
        clear:both;
        width:100%;
    }
    .tb-resp tr 
    {
        border:1px solid #d5d5d5;
        border-radius:5px;
        margin:0 0 16px;
    }
    .tb-resp th, 
    .tb-resp td 
    {
        padding:8px 10px;
        height:auto;
    }
    .tbCellDot th, 
    .tbCellDot td 
    {
        text-overflow:unset;
    }
}

/*Check custom*/
.checkitem{
    float:left;
    cursor:pointer;
    margin:2px;
    display:flex;
    align-items: center;
    justify-content: center;
}
.checkitem span{
    display:block;
    background:#fff;
    outline:1px solid #c5c5c5;
    border:3px solid #fff;
}
.checkitem span:hover{
    background-color: #d5d5d5;
}
.checkitem span:active{
    background-color: #b5b5b5;
}
.checkitem > .rounded{
    border-radius:50%;
}
.checkitem > .checked{
    background:#07c !important;
    outline:1px solid #07c !important;
    color:#fff;
    font-size:24px;
}

/*
.checkitem > .checked:after{
    display:block;
    text-align: center;
    content: "\2713";
    font-size:.8em;
    font-weight:bold;
    color:#fff;
}
*/

.checkitem > .size16{
    width:16px;
    height:16px;
}
.checkitem > .size18{
    width:18px;
    height:18px;
}
.checkitem > .size20{
    width:20px;
    height:20px;
}
.checkitem > .size22{
    width:22px;
    height:22px;
}
.checkitem > .size24{
    width:24px;
    height:24px;
}
.checkitem > .size26{
    width:26px;
    height:26px;
}
.checkitem > .size32{
    width:32px;
    height:32px;
}
