
/**
 * JustAjaxTable : MS Office 2007 Style
 */
      
      html, body {
        
      }
      
      table {
        border-collapse:collapse;
      }
      
      #table-area {
        background-color:#444;
        width:100%;
        height:500px;        
        padding-top:20px;
      }
      
      #table-area .table-theaders-resizer {
       position:absolute;
       z-index:1000;
       width:2px;
       background-color:#555;
       height:14px;
      }
      
      #table-area .cell-editor {
        border:2px solid #555;
      }
      
      #table-area .justajax-mainbox {
        width:700px;
        margin: 0px auto;
      }
      
      #table-area .title {
        width:698px;
        border: 1px solid rgb(109,109,109);
        height:22px;
        background-image:url('../data/title-bg.gif');
        background-repeat:repeat-x;
        color:rgb(128,151,196);
        font-size:12px;
        text-align:center;
        padding-top:2px;
      }
      
      #table-area .title span {
        color:#fff;
      }
      
      #table-area .help {
        position:relative;
        top:0px;
      }
      
      #table-area .statusbar {
        width:698px;
        border: 1px solid rgb(109,109,109);
        font-size:12px;
      }
      
      #table-area .statusbar td {
        height:22px;
        background-image:url('../data/title-bg.gif');
        background-repeat:repeat-x;
        color:#fff;
        font-size:11px;
      }
      
      #table-area .statusbar td img {
        margin:0px;
        
      }
      
      #table-area .statusbar .table-status {
        background-image:url('../data/status-sleep.gif');
        background-repeat:no-repeat;
      }
      
      #table-area .statusbar .table-statusonloading {
        background-image:url('../data/status-loading.gif');
        background-repeat:no-repeat;
      }
      
      #table-area .statusbar table.positions td {
        background-image:url('../data/statusbar-bg-right.gif');
        background-repeat:repeat-x;
        color:#ddd;
      }
      
      #table-area .tools-panel {
        width:698px;
        background-image:url('../data/panel-bg.gif');
        background-repeat:repeat-x;
        background-color:rgb(59,59,59);
      }
      
      #table-area .cells {
        width:85px;
        text-align:center;
      }
      
      #table-area .cells span {
        display:block;
        position:relative;
        top:-7px !important;
        top:-8px;
        z-index:2;
        color:#fff;
      }
      
      #table-area .table-record-delete, #table-area .table-record-add {
        cursor:pointer;
      }
      
      #table-area .table-filter-textbox {
        height:20px;
        width:100px;
        margin-right:2px;
        border:1px solid rgb(137,137,137);
        position:relative;
        top:1px !important;
        top:0px;
        background:rgb(232,232,232);
        color:#555;
        font-size:12px;
      }
      
      #table-area .table-filter-textbox:focus {
        background:#fff;
      }
      
      #table-area .table-refresh {
        cursor:pointer;
        margin-right:2px;
      }
      
      #table-area .table-rows-names-box {
        overflow:hidden;
        /* IE Hack */
        width:680px !important; 
        width:681px;
      }
      
      #table-area .table-rows-names {
        height:19px;
        background-image:url('../data/headers-bg.gif');
        background-color:#fff;
        text-align:center;
        border:1px solid rgb(182,182,182);
        border-top:none;
        margin-left:1px;
        width:681px;
      }
     
      #table-area .table-rows-names {
        table-layout:fixed;
      }
     
      #table-area .table-rows-names td {
        color:#222;
        cursor:pointer;        
        /* fixed height for cell ( for IE ) :: necessary parameter */
        height:19px;
        /* canceal new lines ( ignored in IE ) :: necessary parameter */
        white-space: nowrap; 
      }
      
      #table-area .table-rows-name-text {
        font-size:11px;
        text-transform: capitalize;
      }
      
      #table-area .table-rows-names .table-rows-name-textondown {
        background-image:url('../data/pointer-down.gif');
        background-position:right;
        background-repeat:no-repeat;
        padding-right:10px;
        background-color:transparent;
      }
    
      #table-area .table-rows-names .table-rows-name-textonup {
        background-image:url('../data/pointer-up.gif');
        background-position:right;
        background-repeat:no-repeat;
        padding-right:10px;
        background-color:transparent;
      }
    
      #table-area .table-rows-nameonmouseover {
        background-image:url('../data/headers-select-bg.gif');
        background-color:transparent;
      }
      
      #table-area .table-rows-delimiter {
        margin-top:1px;
        cursor:e-resize;
        background-image:url('../data/headers-delimiter.gif');
        background-repeat:no-repeat;
        background-position:left;
        width:5px;
        height:19px;
        position:relative;
        z-index:2;
      }
      
      #table-area .table-rows-contents-box {
        overflow:hidden;
        /* IE Hack */
        width:680px !important; 
        width:681px;
        /* Opera Hack for Content Width */
        border-right:1px solid rgb(192,192,192);
        border-right-width:0px;
      }
      
      #table-area .table-rows-contents {
        border-left:1px solid rgb(192,192,192);
        margin-left:1px;
        
        /* fixed width :: necessary parameter */
        table-layout:fixed;
        width:681px;
      }
      
      #table-area .table-rows-contents td {
        border-right:1px solid rgb(192,192,192);
        border-bottom:1px solid rgb(192,192,192);
        background:#fff;
        height:19px;
        /* necessary parameter */
        white-space: nowrap;
        font-size:12px;
      }

      #table-area .table-rows-contents .onmouseover td {
        background-image:url('../data/content-select-bg.gif');
      }
      
      #table-area .table-rows-contents .selectonmouseover td {
        background-image:url('../data/content-select-bg.gif');
      }
      
      #table-area .table-rows-contents td.onselected {
        background-image:url('../data/headers-select-bg.gif');
      }
      
      #table-area .table-scrollbar {
        background-image:url('../data/scrollbar-bg.gif');
        background-repeat:repeat-y;
        background-color:#000;
        width:16px;
        margin-right:1px;
        min-height:267px;
      }
      
      #table-area .table-scroll-top {
        background-image:url('../data/scrollbar-up.gif');
        background-repeat:no-repeat;
        background-color:#000;
        width:16px;
        height:17px;
      }
      
      #table-area .table-scroll-bottom {
        background-image:url('../data/scrollbar-down.gif');
        background-repeat:no-repeat;
        background-color:#000;
        width:16px;
        height:17px;
      }
 
       #table-area .table-scroll-pointer {
        position:absolute;
        z-index:10;
        background-image:url('../data/scrollbar-pointer.gif');
        background-repeat:no-repeat;
        width:16px;
        height:15px;
       }