/* Drag Drop */
.mygrid-drag {
    position: absolute;
    background-color: #C3DAFA;
    border: solid 1px #6A8CCB;
    padding: 2px 2px 2px 2px;
    color: #6A8CCB;
    font-weight: bold;
    -moz-opacity: 0.5;
    filter: alpha(opacity=50);
    opacity: 0.5;
    white-space: inherit;
}

.mygrid-dragoutline {
    background-color: #FCC;
    border: dashed 1px #DAA;
    color: #DAA;
}

.mygrid-dropactive {
    padding: 2px 2px 2px 2px;
    background-color: #FFE3B1;
    border-color: #6A8CCB;
}

.mygrid-dropped {
    padding: 2px 5px 2px 5px;
    background-color: #B3CCF7;
    border-color: #6A8CCB;
}

.mygrid {
    font-family: Arial, Verdana, Tahoma, MS Reference Sans Serif;
    border-right: solid 1px #dbdbdb;
}

    .mygrid TD {
        padding: 5px 3px;
    }

.mygrid-pager {
    padding: 5px;
    background-color: #ffffff;
    border-top: solid 1px #dbdbdb;
}

.mygrid-group-box {
    background-color: #d1d1d1;
    border: solid 1px #f1f1f1;
    padding: 5px 5px 5px 5px;
}

.mygrid-header {
    border: solid 1px #52639A;
    border-top: solid 1px #52639A;
    border-bottom: solid 1px #52639A;
    border-left: solid 1px #52639A;
    border-right: solid 1px #52639A;
    font-weight: bold;
    font-size: 12px;
    color: #fff;
    background-color: #748db4;
    height: 20px;
    padding: 2px 2px 2px 2px;
    text-align: center;
}

.mygrid-header-over {
    border: solid 1px #52639A;
    border-top: solid 1px #52639A;
    border-bottom: solid 1px #52639A;
    border-left: solid 1px #52639A;
    border-right: solid 1px #52639A;
    font-weight: bold;
    font-size: 12px;
    color: #D8FFFF;
    background-color: #748db4;
    height: 20px;
    padding: 2px 2px 2px 2px;
    text-align: center;
}

.mygrid-filter {
    background-color: #ECEBF7;
    border-left: solid 1px #dbdbdb;
    border-right: solid 1px #d2d2d2;
}

.mygrid-group-corner {
    border-top: solid 1px #D1D1D1;
    border-left: solid 1px #D1D1D1;
    width: 17px;
}

.mygrid-group-left {
    border-left: solid 1px #D1D1D1;
}

.mygrid-group-top {
    border-top: solid 1px #D1D1D1;
    padding: 3px 3px 3px 3px;
    word-wrap: break-word;
    word-break: break-word;
}

.mygrid-group-top-over {
    border-top: solid 1px #D1D1D1;
    padding: 3px 3px 3px 3px;
    word-wrap: break-word;
    word-break: break-word;
    white-space: pre-line;
}

.mygrid-tree {
    border-top: solid 1px #f1f1f1;
    border-left: solid 1px #f1f1f1;
    padding: 3px 3px 3px 3px;
    word-wrap: break-word;
    word-break: break-word;
    white-space: pre-line;
}

.mygrid-tree-over {
    border-top: solid 1px #f1f1f1;
    border-left: solid 1px #f1f1f1;
    padding: 3px 3px 3px 3px;
    word-wrap: break-word;
    word-break: break-word;
    white-space: pre-line;
    color: #0000ff;
}

.mygrid-item {
    background-color: #f1f1f1;
    border-left: solid 1px #dbdbdb;
    border-right: solid 1px #d2d2d2;
    color: #000000;
    white-space: pre-line;
}

.mygrid-item-over {
    background-color: #ebebeb;
    border-left: solid 1px #dbdbdb;
    border-right: solid 1px #d2d2d2;
    color: #0000ff;
    white-space: pre-line;
}

.mygrid-alternating {
    background-color: #ffffff;
    border-left: solid 1px #dbdbdb;
    border-right: solid 1px #d2d2d2;
    color: #000000;
    padding: 3px 3px 3px 3px;
    white-space: pre-line;
}

.mygrid-footer {
    background-color: #ECEBF7;
    border: solid 1px #D1D1D1;
    white-space: pre-line;
}

table.mygrid {
    display: block;
}

    table.mygrid tbody {
        display: block;
        overflow: auto;
        height: 70vh;
    }

    table.mygrid tr:nth-child(2) {
        overflow:hidden;
    }