.tbl_commission, .tbl_commission_cf {
    background: #fff;
}

.tbl_commission td, .tbl_commission_cf td {
    vertical-align: top;
    font-size: 0.9em;
}

.tbl_commission th, .tbl_commission_cf th {
    vertical-align: top;
    font-size: 0.9em;
    background: #ddd;
    white-space: nowrap;
}

.tbl_commission .td_se_name, .tbl_commission_cf .td_se_name {
    display: none;
}

.tbl_small td {
    padding: 0px;
}

.tbl_small {
    width: 80%;
}

.tbl_small td.td_field {
    font-size: 0.8em;
    text-align: left;
    color: #888;
}

.td_money {
    text-align: right;
}

.tbl_small .tr_total td {
    color: #000;
    border: 0px solid #999;
    border-top: 1px solid #999;
    border-bottom: 3px double #999;
}

.td_inv small,
.td_cust small {
    color: #666;
    padding-right: 5px;
}

.tbl_commission, .tbl_commission_cf {
    margin-top: 10px;
}

.tbl_commission .tr_hdr th, .tbl_commission_cf .tr_hdr th {
    text-align: center !important;
    padding: 0.5em;
    background: #2196F3;
    color: #fff;
}

.tbl_commission td, .tbl_commission_cf td {
    padding: 0.5em;
}

.tbl_commission .td_total , .tbl_commission_cf .td_total {
    text-decoration: underline;
    cursor: pointer;
}

.tbl_commission th, .tbl_commission_cf th {
    border-radius: 0;
}

.tbl_commission th.td_vc_total,
.tbl_commission th.td_hp_total,
.tbl_commission th.td_ic_total,
.tbl_commission th.td_ac_total,
.tbl_commission th.td_csi_total,
.tbl_commission th.td_total {
    background: #000099;
}

.tbl_commission_cf th.td_vc_total,
.tbl_commission_cf th.td_hp_total,
.tbl_commission_cf th.td_ic_total,
.tbl_commission_cf th.td_ac_total,
.tbl_commission_cf th.td_csi_total,
.tbl_commission_cf th.td_total {
    background: #000099;
}

.tbl_modal_commission .tr_asd, .tbl_modal_commission_cf .tr_asd {
    background: rgba(0, 0, 0, 0.1);
    display: none;
}


/* tablet */

@media (max-width:768px) {
    .tbl_commission .td_customer,
    .tbl_commission .td_reg_no {
        display: none;
    }
}


/* phone */

@media (max-width:400px) {
    .tbl_commission .td_vsb_no,
    .tbl_commission .td_model,
    .tbl_commission .td_customer,
    .tbl_commission .td_vc_total,
    .tbl_commission .td_hp_total,
    .tbl_commission .td_ic_total,
    .tbl_commission .td_ac_total,
    .tbl_commission .td_csi_total,
    .tbl_commission .td_reg_no {
        display: none;
    }
}

.tbl_modal_commission td, .tbl_modal_commission_cf td {
    padding: 0.3em;
    border-bottom: 1px solid #ccc !important;
}

.tbl_modal_commission td.td_value, .tbl_modal_commission_cf td.td_value {
    text-align: right;
}

.tbl_modal_commission .tr_total td, .tbl_modal_commission_cf .tr_total td {
    border-bottom: 3px double #bbb !important;
}

.progress {
    height: 15px;
    border-radius: 5px;
}

.tbl_comm_summary th {
    padding: 4px;
}

.tbl_comm_summary td {
    padding: 4px;
    border-bottom: 1px solid #ccc;
}

.tbl_comm_summary .td_count {
    text-align: center;
}


/* sel month */

.div_sel_month {
    background: #fff;
    position: absolute;
    z-index: 10;
    font-size: 0.9em;
    width: 150px;
    box-shadow: 0 0 10px 1px rgba(0, 0, 0, 0.1);
    left: 45%;
    display: none;
    overflow: auto;
    height: 22%;
}

.div_sel_month .div_opt_month {
    padding: 5px;
    border-bottom: 1px solid #bbb;
}

.div_sel_month .div_opt_month:hover {
    cursor: pointer;
    background: #eee;
}

.td_text_center {
    text-align: center;
}

#sm_and_asm_commission_view {
    display: none;
}
#dp_commission_view {
    display: none;
}

.div_comm_cf_title {
    font-size: 1.3em;
    font-family: RegularFont;
    padding: 20px 0px 0px 5px;
}

#txt_month, #txt_year{
    height: auto;
    margin: 0;
    margin-bottom: -10;
    text-align: center;
    width: 50px;
}

.div_selection{
    width: auto !important;
}


/* CSP Changes Start - Alvin */
.img_logo{padding:3px;}
.div_header{margin-top:10px;}
.div_user_info_left{text-align:left;}
.div_user_info_right{text-align:right;}
.div_row{padding-bottom:0px;margin-bottom:0px;}
.div_search{text-align:left;position:relative;}
.keywords{border:1px solid #bbb !important;background:#fafafa !important;padding:10px !important;box-sizing:border-box !important;border-radius:4px !important;}
.a_keywords{position:absolute;top:10px;right:25px;font-size:25px;}
.comm_month{display:inline-block;width:5em;}
.div_info{font-family:FontRegular;font-size:1.5em;text-align:center;}
.div_summary{text-align:center;padding:10px 0px;}
.progress_bar_hide{width: 0;}
.progress_bar_show{width: 100;}
.div_note{font-size:0.8em;margin-top:20px;}
.th_amt{text-align:right;}
.div_table{overflow:auto;box-sizing:border-box;}
.td_se_name{min-width:150px;}
.orange{color:orange;}
.td_inv{min-width:150px;}
.nowrap{white-space:nowrap;}
.td_cust{min-width:160px;}
.div_cal{width:fit-content;border-radius:3px;text-align:center;border:2px solid red;}
.yyyy{background:red;color:#fff;}
.mmm{color:red;}
#modal_total_vehicle_commission{font-size:2em;padding:10px;font-weight:bold;}
#modal_total_vehicle_commission_cf{font-size:2em;padding:10px;font-weight:bold;}
.modal_total_vehicle_commission{font-size:2em;padding:10px;font-weight:bold;}
.modal_total_vehicle_commission_cf{font-size:2em;padding:10px;font-weight:bold;}
.div_modal_header{padding:10px;font-weight:bold;}
.tbl_modal_commission,.tbl_modal_commission_cf{font-size:1em;}
#tbl_commission2{display:none;}
#seList{display:none;}
.div_selection_hide{display:none;}
/* CSP Changes End - Alvin */