@charset "utf-8";
/* CSS Document */
    
.tabular {}    


.table_box {border: 1px solid #e2e3ea; background: #fff; padding: 1px; padding: 1px;width: 100%; float: left;position: relative; z-index:0;}
#listdetails-salesperson-form-container .table_box, #listdetails-backend-form-container .table_box {border: 0px; background: transparent;}
#listdetails-salesperson-form-container .table-caption {display:none;}


.tabular table {width: 100%;}

.tabular table tr.classOn{background: #e7f0ff;}

.tabular table tbody.quickadd tr, 
.tabular table tbody.quickadd tr.classOn {background: #e7f6ea;}


.tabular table th{
    background: #004b75;
    border-left: 1px solid #fff;
    padding: 0px;
    vertical-align: top;
}

.tabular table th a{
    display: block;
    font: normal 14px Verdana, Arial, Helvetica, sans-serif;
    color: #ffffff;
    
    padding: 13px 13px 13px 4px;
    
    vertical-align: middle;
    text-align: left;
    
    background: url(../images/tabular_th_sorter.gif) no-repeat right 17px #004b75;
}

    .tabular table th a.sorted_desc{
        background: url(../images/tabular_th_sorter.gif) no-repeat right -133px #2e6b8e;
    }
    
    .tabular table th a.sorted_asc{
        background: url(../images/tabular_th_sorter.gif) no-repeat right -283px #2e6b8e;
    }
.tabular table th a:hover{
    color: #d2f4fe;
    text-decoration: none;
}


    .tabular table td a.tbl_icon_receipt{
    display: block;
    height: 19px;
    margin: 1px;
    background: url(../images/tabular_icon_receipt.gif) no-repeat 50% 50% #0087ae;
    }
    
    .tabular table td a.tbl_icon_add{
    display: block;
    height: 19px;
    margin: 1px;
    background: url(../images/tabular_icon_plus.gif) no-repeat 50% 50% #4e8e04;
    }

.tabular table tbody td{
    border-left: 1px solid #d5d5d5;
    border-top: 1px solid #d5d5d5;
    
    font: normal 14px  Arial, Helvetica, sans-serif;
    color: #000000;
    
    padding: 3px 2px;
    
    vertical-align: middle;
}

.tabular table td:first-child, 
.tabular table th:first-child, 
.tabular table td.first, 
.tabular table th.first
 {border-left: none;}

.tabular table td.selectrow, 
.tabular table th.selectrow
 {text-align: center;}

.tabular table td.selectrow {
     border-right: 1px solid #d5d5d5;
 }
.tabular table th.selectrow {
     border-right: 1px solid #fff;
 } 
/*table foot*/

#tfoot {
    background:none;        
    padding: 4px 4px 3px 4px;
    /*devs*/
    /*float: right;*/
    overflow: hidden;
    width: 100%;
}

#tfoot .checkall{
    display: none;
}

#tfoot .table-nav {
    float: right;
    
    font: normal 12px Arial, Helvetica, sans-serif;
    color: #000000;
}

#tfoot .table-nav-goto {display: none;}

#tfoot .table-nav-rows {display: none;}

#tfoot .table-nav-scroller {float: left;}

#tfoot .table-nav-scroller a {
    display: block;
    height: 30px;
    padding: 0px 11px;
    
    float: left;
    margin-right: 3px;
    }
#tfoot .table-nav-scroller a span,
.view-rewards #tfoot .table-nav-scroller a span{
    display: block;
    background-image:url(../images/table-nav-sprite_r.png);
    background-repeat: no-repeat;
    
    float: left;
    }

#tfoot .table-nav-scroller div {
    height: 30px;
    padding: 0px 11px;
    
    float: left;
    margin-right: 3px;
    }

#tfoot .table-nav-scroller div span {display: block;padding-top: 8px;}

.table-nav .tofirst span{width:10px ;height: 10px;background-position: 1px 1px; margin-top: 10px;}
.table-nav .tofirst:hover span{background-position: 1px -39px;}

.table-nav .previouspage {background-color: #f2f2f2;}
.table-nav .previouspage span{width:7px ;height: 10px;background-position: -79px 1px; margin-top: 10px; background-color: #f2f2f2}
.table-nav .previouspage:hover span{background-position: -79px -39px;}

.table-nav .pagenum {background-color: #f2f2f2; font-size: 13px; color: #999;}
.table-nav .pagenum:hover {background-color: #f2f2f2; font-size: 13px; color: #212121;}
.table-nav .pagenum.current {background-color: #666; color: #f2f2f2;}
.table-nav .pagenum  span {background-image:none!important; padding-top: 8px; }
    

    
.table-nav .nextpage {background-color: #f2f2f2;}
.table-nav .nextpage span{width:7px ;height: 10px;background-position: -119px 1px; margin-top: 10px; background-color: #f2f2f2}
.table-nav .nextpage:hover span{background-position: -119px -39px;}

.table-nav .tolast span{width:10px ;height: 10px;background-position: -39px 1px; margin-top: 10px;}
.table-nav .tolast:hover span{background-position: -39px -39px;}


/*Statuses for the account tables on the Front End*/

#account-credit {}
#account-credit .status {}

#account-credit .status span{
    display: block;
    background-image: url(../images/status_sprite_fe.png);
    background-repeat: no-repeat;
    background-color: transparent;
    
    padding: 5px 10px 5px 20px;
    }

#account-credit tr.confirmed .status {}
#account-credit tr.confirmed .status span {background-position: 0px 5px; color: #000; font-weight: normal;}

#account-credit tr.pending {background: #f5f5f5;}
#account-credit tr.pending .status {}
#account-credit tr.pending .status span {color: #666;background-position: 0px -295px;}

#account-credit tr.rejected .status {}
#account-credit tr.rejected .status span {color: #c00; background-position: 0px -145px;}
/*Functionalities*/
/*Quick Add*/

.tabular table tbody.quickadd td {padding: 0px 2px; text-align: center;}
.tabular table tbody.quickadd td input, 
.tabular table tbody.quickadd td select 
{
    padding: 2px; width: 95%;
    border: 1px solid #c2c2c2;
}

.submit-quick-add {background: #39b54a;}

.submit-quick-add a {    
    display: block;
    float: right;
    position:relative;
    margin-right: -19px;
    
    background: url(../images/quickadd.png) no-repeat right 0px;    
    padding: 10px 42px 10px 0px;    
    
    
    font-size: 14px;
    font-weight: bold;
    text-transform: uppercase;    
    color: #fff;
    }

.submit-quick-add a:hover {    background-position: right -160px;    text-decoration: none;}




/*Tabular Tools*/

.tool {
    display: block; 
    background-image:url(../images/tabular_tools_sprite.png); 
    background-repeat: no-repeat; 
    padding: 8px 15px 8px 30px; 
    color: #333;
    float: left;
}
.tool:hover{color: #000;text-decoration: none;}

.tool span {display: block;}

.tool.disabled {color: #7e7e7e;}
.tool.disabled:hover {color: #000;}

.toolset .tool {
    float: left;
    padding: 16px 0px 16px 40px;
    /*font-size: 1px;
    line-height: 1px;*/
}


/*Status Tool*/

.tool.status {background-position: 0px -715px;}
.tool.status:hover {background-position: 0px -775px;}

.tool.status.enabled {}
.tool.status.enabled:hover {}

.tool.status.disabled {background-position: 0px -835px;}
.tool.status.disabled:hover {background-position: 0px -775px;}

/*List Tool*/

.tool.list {background-position: 0px 0px;}
.tool.list:hover {background-position: 0px -55px;}

.tool.list.enabled {}
.tool.list.enabled:hover {}

.tool.list.disabled {background-position: 0px -115px;}
.tool.list.disabled:hover {background-position: 0px -55px;}


/*Add Tool*/

.tool.add {background-position: 0px -175px;}
.tool.add:hover {background-position: 0px -235px;}

.tool.add.enabled {}
.tool.add.enabled:hover {}

.tool.add.disabled {background-position: 0px -295px;}
.tool.add.disabled:hover {background-position: 0px -235px;}


/*Edit Tool*/

.tool.edit {background-position: 0px -355px;}
.tool.edit:hover {background-position: 0px -415px;}

.tool.edit.enabled {}
.tool.edit.enabled:hover {}

.tool.edit.disabled {background-position: 0px -475px;}
.tool.edit.disabled:hover {background-position: 0px -415px;}


/*Delete Tool*/

.tool.deleteacc,
.tool.delete {background-position: 0px -535px;}
.tool.deleteacc,
.tool.delete:hover {background-position: 0px -595px;}

.tool.deleteacc.enabled,
.tool.delete.enabled {background-position: 0px -535px;}
.tool.deleteacc.enabled:hover,
.tool.delete.enabled:hover {background-position: 0px -595px;}

.tool.deleteacc.disabled,
.tool.delete.disabled {background-position: 0px -655px;}
.tool.deleteacc.disabled:hover,
.tool.delete.disabled:hover {background-position: 0px -595px;}

/*Confirm Tool*/

.tool.confirm {background-position: 0px -895px;}
.tool.confirm:hover {background-position: 0px -957px;}

.tool.confirm.enabled {}
.tool.confirm.enabled:hover {}

.tool.confirm.disabled {background-position: 0px -1018px;}
.tool.confirm.disabled:hover {background-position: 0px -1018px;}

/*Reject Tool*/

.tool.reject {background-position: 0px -1076px;}
.tool.reject:hover {background-position: 0px -1136px;}

.tool.reject.enabled {}
.tool.reject.enabled:hover {}

.tool.reject.disabled {background-position: 0px -1206px;}
.tool.reject.disabled:hover {background-position: 0px -1206px;}
/*Stop Tool*/

.tool.stop {background-position: 0px -1485px;}
.tool.stop:hover {background-position: 0px -1556px;}

.tool.stop.enabled {}
.tool.stop.enabled:hover {}

.tool.stop.disabled {background-position: 0px -1626px;}
.tool.stop.disabled:hover {background-position: 0px -1626px;}

/*Extend Tool*/

.tool.extend {background-position: 0px -1275px;}
.tool.extend:hover {background-position: 0px -1346px;}

.tool.extend.enabled {}
.tool.extend.enabled:hover {}

.tool.extend.disabled {background-position: 0px -1416px;}
.tool.extend.disabled:hover {background-position: 0px -1416px;}

/*View Tool*/

.tool.view {background-position: 0px -1695px;}
.tool.view:hover {background-position: 0px -1765px;}

.tool.view.enabled {}
.tool.view.enabled:hover {}

.tool.view.disabled {background-position: 0px -1835px;}
.tool.view.disabled:hover {background-position: 0px -1835px;}

/*Move to User Tool*/

.tool.movetouser {background-position: 0px -1905px;}
.tool.movetouser:hover {background-position: 0px -1975px;}

.tool.movetouser.enabled {}
.tool.movetouser.enabled:hover {}

.tool.movetouser.disabled {background-position: 0px -2045px;}
.tool.movetouser.disabled:hover {background-position: 0px -2045px;}

/*Add Sales To User Tool*/

.tool.addsalestouser {background-position: 0px -2115px;}
.tool.addsalestouser:hover  {background-position: 0px -2185px;}

.tool.addsalestouser.enabled  {background-position: 0px -2115px;}
.tool.addsalestouser.enabled:hover {background-position: 0px -2185px;}

.tool.addsalestouser.disabled {background-position: 0px -2255px;}
.tool.addsalestouser.disabled:hover {background-position: 0px -2255px;}


/*Table Tools Multiple Affected*/

.table-tools {float: left; }
.table-tools-box {
    background: url(../images/table-tools-mutiple-box-bgr.gif) repeat-x left bottom #f1f1f1;
    border: #cccccc 1px solid;
    border-radius: 3px;
    
    position: relative;
    
    margin: 10px 0px;
    }
    
.table-tools-arrow {
    width: 15px;
    height: 9px;
    background: url(../images/table-tools-mutiple-arrow.gif) no-repeat left top ;
    
    position: absolute;
    bottom: -8px;
    left: 10px;
    }
    
.table-tools-selectall {float: left;}
    
.table-tools-selectall a {
    display: block;
    line-height: 2em;
    color: #455059;
    padding: 8px 8px 8px 8px;
    }
    
    .table-tools-selectall a:hover {color: #000;}
    
.table-tools-multitools {float: left; background: #fff;}
.table-tools-multitools a,  .table-tools-multitools div{
    display: block;
    line-height: 2em;
    color: #455059;
    height: 100%;
    margin: 0px;    
}
.multitool input[type=submit] {
    color: #455059;
    background: transparent;
    border:none;
    display: inline;
    cursor: hand;
    cursor: pointer;
    text-align: left;
    font-size: 15px;
    padding: 2px 0px 6px 2px;
    margin: 0px;
    overflow: visible;
}

.multitool {
    display: block; 
    background-image:url(../images/tabular_tools_sprite.png); 
    background-repeat: no-repeat; 
    padding: 8px 15px 8px 40px; 
    color: #333;
    float: left;
    
    border-left: #cccccc 1px solid;
    
}

.multitool:hover{color: #000;text-decoration: none;}

.multitool span {display: block;}

.multitool.disabled {color: #7e7e7e; cursor: default;}
.multitool.disabled:hover {color: #000;}

.multitool.first {border: none;}
/*Approve-All Tool*/

.multitool.approveall {background-position: 10px -892px;}
.multitool.approveall:hover {background-position: 10px -954px;}

.multitool.approveall.enabled {}
.multitool.approveall.enabled:hover {}

.multitool.approveall.disabled {background-position: 10px -1014px;}
.multitool.approveall.disabled:hover {background-position: 0px -1014px;}

/*Reject-All Tool*/

.multitool.rejectall {background-position: 10px -1072px;}
.multitool.rejectall:hover {background-position: 10px -1132px;}

.multitool.rejectall.enabled {}
.multitool.rejectall.enabled:hover {}

.multitool.rejectall.disabled {background-position: 10px -1202px;}
.multitool.rejectall.disabled:hover {background-position: 10px -1202px;}
/*Filter Box*/
.filterBox {border: 1px solid #e2e3ea; background: #fff; padding: 15px; margin-bottom: 10px; overflow:hidden}

.filterBox h2{border-bottom: 1px solid #e2e3ea; margin-bottom: 15px; padding-bottom: 10px; font-size: 18px;font-weight: 100;}
.filterBox .form-submit{border-top: 1px solid #e2e3ea; padding-top: 15px;}

.filterBox li .required {display: none;}



#user_administration .filterBox li {
    /*width:12%;*/ 
margin: 0% 1% 1% 0%;}
#user_administration .filterBox .form-submit li{ width:auto; margin: 0% 1% 0% 0%;}



/*Titles and Captions*/

.table-caption {padding: 0 0 20px 0;overflow:hidden}

.table-caption h2{
    font-size: 24px;
    font-weight: 100;
    
    margin: 0px 200px 0px 0px;
    }
.table-caption h1{
    font-size: 26px;
    font-weight: 100;
    margin: 0px 200px 0px 0px;
    font-style: normal;
    color: #000000;
    }
.table-caption.hasThumb h2 div {
    background-image: url("../images/asidemenu_icons.png");
    background-repeat: no-repeat;
    
    width: 50px;
    height: 50px;
    float: left;
}

.table-caption.hasThumb h2 span { margin-left: 60px; display: block; padding-top: 15px;}
.table-caption.hasThumb h2 div.awardedpoints { background-image: url(../images/icon-points.png); background-position: 10px 15px;}
.table-caption.hasThumb h2 span.awardedpoints { margin-left: 60px; display: block; padding-top: 0px;}
.table-caption.hasThumb h2 div.debitedpoints { background-position: 0px -187px;}


.table-caption .table-caption-tools {
    /*float: right;*/
}

    .table-caption .table-caption-tools a{
            float: right;
            display: block;
            width: 28px; 
            height: 28px;
            
            background-image:url(../images/export_options_sprite.png);
            background-repeat: no-repeat;     
            
            margin: 0px 10px 0px 0px;     
        }
    
    .table-caption .table-caption-tools a.export_optn_csv {background-position: 0px 0px;}
    .table-caption .table-caption-tools a.export_optn_csv:hover {background-position: 0px -40px;}
        
    .table-caption .table-caption-tools a.export_optn_excel {background-position: -40px 0px;}
    .table-caption .table-caption-tools a.export_optn_excel:hover {background-position: -40px -40px;}


/*Table Totals*/

.table-totals {padding: /*10px */0px;}

.table-totals .table-total-box{float: right; padding-right: 10px;}

.table-totals .table-total-box p {line-height: 2em}
.table-totals .table-total-box p label { margin-right: 0.5em; color: #000;}
.table-totals .table-total-box p span {display: inline-block; background: #cb1416; padding: 0px 6px; color: #fff; font-weight: bold;}


/*Data grid Box*/
.datagridBox {overflow: auto;border: 1px solid #e2e3ea; background: #fff; padding: 15px;}

.datagridBox h2{border-bottom: 1px solid #e2e3ea; margin-bottom: 15px; padding-bottom: 10px; font-size: 18px;font-weight: 100;}
.datagridBox .form-submit{border-top: 1px solid #e2e3ea; padding-top: 15px;}

#user_administration .datagridBox li {
    /*width:12%;*/ 
margin: 0% 1% 1% 0%;}
#user_administration .datagridBox .form-submit li{ width:auto; margin: 0% 1% 1% 0%;}

.file_pointer{ color: #000; cursor: pointer; background: url('../../images/browse.png') right top no-repeat transparent;padding: 3px 20px 0 0; height: 20px; display: inline-block;}
.file_wrapper{position: relative;display:inline-block;height: 20px;}
.file_container{ display: none; position: absolute; left: auto; bottom: 100%; right: 100%; border: 4px solid #fff; padding: 2px; background-color: #fff; transform: translateX(50%); color: black; box-shadow: 0px 0px 10px rgba(0, 0, 0, .54); }