.grid {
    margin: 0px;
    border: 1px #CCC solid;
    border-top-right-radius: 5px;
    border-top-left-radius: 5px;
}

.gridTop {
    /*background-color: #DDEEFF;*/
    background-color: #F2F2F2;
    height: 30px;
    border-top-right-radius: 5px;
    border-top-left-radius: 5px;
    border-bottom: 1px #CCC solid;
}

.gridTitle {
    float: left;
    width: 50%;
    padding: 3px 0 0 10px;
    font-weight: 500;
    font-size: 11pt;
}

.gridCnt {
    float: right;
    width: 40%;
    font-family: Verdana;
    padding: 7px 10px 0 0;
    font-size: 11px;
    text-align: right;
}

.gridHeader {
    /*display: inline-block;*/
    background: linear-gradient( to bottom, #FFF, #DFDFDF );
    float:left;
    color: #555;
    text-align: center;
    font-weight: 600;
    font-size: 12px;
    height:22px;
    border-right:1px #CCC inset;
    border-bottom:1px #CCC inset;
}

.gridHeader p {
    margin-top: 5px;
}

.gridHeaderFix {
    /*display: inline-block;*/
    background: linear-gradient( to bottom, #F2F2F2, #DFDFDF );
    float:left;
    /*background-color: #333;*/
    color: #555;
    text-align: center;
    font-weight: 600;
    font-size: 12px;
    height:22px;
    border-right:1px #CCC inset;
    border-bottom:1px #CCC inset;
}

.gridHeaderFix p {
    margin-top: 5px;
}

.gridHeaderFixLeft {
    /*display: inline-block;*/
    background: linear-gradient( to bottom, #F2F2F2, #DFDFDF );
    float:left;
    /*background-color: #333;*/
    color: #555;
    text-align: center;
    font-weight: 600;
    font-size: 12px;
    height:22px;
    border-right:1px #CCC inset;
    border-bottom:1px #CCC inset;
}

.gridHeaderFixLeft p {
    margin-top: 3px;
}

.gridBody {
    /*display: inline-block; */
    float:left;
    font-size: 12px;
    height:22px;
    color: #333;
    text-align:center;
    /*border-right:1px #A6C9E2 solid;*/
    /*border-bottom:1px #A6C9E2 solid;*/
    border-right:1px #CCC solid;
    border-bottom:1px #CCC solid;
    white-space:nowrap;
}

.gridBody p {
    padding: 0 3px 0 3px;
    text-overflow: ellipsis;
    overflow: hidden;
    white-space:nowrap;
}

.gridBodyFix {
    /*display: inline-block; */
    float:left;
    font-size: 12px;
    height:22px;
    color: #333;
    text-align:center;
    border-right:1px #CCC solid;
    border-bottom:1px #CCC solid;
    /*text-overflow: ellipsis;*/
    /*overflow: hidden;*/
    /*white-space:nowrap;*/
}


.gridBodyFix p {
    padding: 0 3px 0 3px;
    text-overflow: ellipsis;
    overflow: hidden;
    white-space:nowrap;
    margin-top:2px;
}

.gridBodyFixLeft {
    /*display: inline-block; */
    clear:both;
    float:left;
    font-size: 12px;
    height:22px;
    color: #333;
    text-align:center;
    background: linear-gradient( to bottom, #F2F2F2, #DFDFDF );
    border-right:1px #CCC inset;
    border-bottom:1px #CCC inset;
}

.gridBodyFixLeft p {
    padding: 0 3px 0 3px;
    text-overflow: ellipsis;
    overflow: hidden;
    white-space:nowrap;
    margin-top:2px;
}

.gridBottom {
    margin-top: 16px;
    margin-left:-1px;
    height:25px;
    border:1px #CCC solid;
    background-color: #F2F2F2;
    text-align: center;
}

.pageBox {
    float: left;
    margin-left:3px;
    margin-top:3px;
    width: 17px;
    height: 17px;
    border:1px #ccc solid;
    cursor:pointer;
}
.pageBox:hover {
    float: left;
    margin-left:3px;
    margin-top:3px;
    width: 17px;
    height: 17px;
    border:1px #ccc solid;
    background-color: #E6E6E6;
    color: #FF1100;
    cursor:pointer;
}
.pageBox p {
    margin-top:-2px;
    text-align: center
}

.gridRButton {
    margin: 2px 0 0 2px;
    width: 55px;
    border: 1px solid #ffa6a6;
    background-color: #fff4f4;
    height: 14px;
    border-radius: 3px;
    font-size: 12px;
    -webkit-transition: all .3s ease;
    transition: all .3s ease;
    font-family: 'Raleway', sans-serif, 'Malgun Gothic', 'AppleSDGothic';
    cursor: pointer;
    text-align: center;
    padding-top: 3px;
}