| .scrollableContainer { | 
|     /*height: 310px;*/ | 
|     position: relative; | 
|     padding-top: 35px; | 
|     overflow: hidden; | 
| } | 
| .scrollableContainer .headerSpacer { | 
|     border: 1px solid #d5d5d5; | 
|     border-bottom-color: #bbb; | 
|     position: absolute; | 
|     height: 36px; | 
|     top: 0; | 
|     right: 0; | 
|     left: 0; | 
| } | 
| .scrollableContainer th .orderWrapper { | 
|     position: absolute; | 
|     top: 0; | 
|     right: 2px; | 
|     cursor: pointer; | 
| } | 
| .scrollableContainer th .orderWrapper .order { | 
|     font-size: 8pt; | 
|     color: #BDBDBD; | 
| } | 
| .scrollableContainer th .orderWrapper .active { | 
|     color: #464646; | 
| } | 
|   | 
| .scrollArea { | 
|     height: 100%; | 
|     overflow-x: auto; | 
|     overflow-y: auto; | 
|     border: 1px solid #d5d5d5; | 
|     /*  the implementation of this is still quite buggy; specifically, it doesn't like the  | 
|         absolutely positioned headers within  | 
|     -webkit-overflow-scrolling: touch;  */ | 
| } | 
| .scrollArea table { | 
|     overflow-x: hidden; | 
|     overflow-y: auto; | 
|     margin-bottom: 0; | 
|     width: 100%; | 
|     border: none; | 
|     /*border-collapse: separate;*/ | 
| } | 
| .scrollArea table th { | 
|     padding: 0 !important; | 
|     border: none !important; | 
|     min-width: 40px; | 
| } | 
| .scrollArea table .th-inner { | 
|     overflow: hidden; | 
|     text-overflow: ellipsis; | 
|     white-space: nowrap; | 
|     position: absolute; | 
|     top: 0; | 
|     height: 36px; | 
|     line-height: 36px; | 
| } | 
|   | 
| .scrollArea table th .box { | 
|     padding: 0 8px; | 
|     padding-right: 11px;    /*  order icon width*/ | 
|     border-left: 1px solid #ddd; | 
| } | 
|   | 
| /*  to hack fix firefox border issue    */ | 
| @-moz-document url-prefix() { | 
|     .scrollArea table th .box{ | 
|         border-right: 1px solid #ddd; | 
|         border-left: none; | 
|     } | 
| } | 
|   | 
| .scrollArea table .th-inner .ng-scope { | 
|     display: block; | 
|     overflow: hidden; | 
|     text-overflow: ellipsis; | 
| } | 
| .scrollArea table tr th:first-child th .box { | 
|     border-left: none; | 
| } | 
| .scrollArea table .th-inner.condensed { | 
|     padding: 0 3px; | 
| } | 
| .scrollArea table tbody tr td:first-child { | 
|     border-left: none; | 
| } | 
| .scrollArea table tbody tr td:last-child { | 
|     border-right: none; | 
| } | 
| .scrollArea table tbody tr:first-child td { | 
|     border-top: none; | 
| } | 
| .scrollArea table tbody tr:last-child td { | 
|     border-bottom: 2px solid #ddd; | 
| } | 
| .scrollArea table tbody tr td { | 
|     border-bottom: 1px solid #ddd; | 
|     overflow: hidden; | 
|     text-overflow: ellipsis; | 
| } | 
|   | 
| .scrollableContainer .scaler { | 
|     position: absolute; | 
|     top: 0px; | 
|     width: 2px; | 
|     height: 100%; | 
|     background-color: #CFCFCF; | 
| } | 
|   | 
| .scrollableContainer th .resize-rod { | 
|     position: absolute; | 
|     top: 0; | 
|     right: 0; | 
|     cursor: col-resize; | 
|     width: 4px; | 
|     height: 100%; | 
| } | 
|   | 
| .scrollable-resizing .scrollableContainer { | 
|     cursor: col-resize; | 
|     -moz-user-select: none; | 
|     -webkit-user-select: none; | 
|     -ms-user-select: none; | 
| } |