.tablesaw { width: 100%; max-width: 100%; empty-cells: show; border-collapse: collapse; border: 0; padding: 0; } .tablesaw * { box-sizing: border-box; } .tablesaw th,.tablesaw td { padding: .5em .7em; } .tablesaw thead tr:first-child th { padding-top: .9em; padding-bottom: .7em; } .tablesaw-bar .btn { border: 1px solid #ccc; border-radius: .25em; background: none; box-shadow: 0 1px 0 rgba(255,255,255,1); color: #4a4a4a; cursor: pointer; display: inline-block; margin: 0; padding: .5em .85em .4em .85em; position: relative; text-align: center; text-decoration: none; text-transform: capitalize; -webkit-appearance: none; -moz-appearance: none; appearance: none; } .tablesaw-bar a.btn { color: #1c95d4; } .tablesaw-bar .btn:hover { text-decoration: none; } .tablesaw-bar .btn:active { background-color: #ddd; } @supports (box-shadow:none){.tablesaw-bar .btn:focus{background-color:#fff;outline:none}.tablesaw-bar .btn:focus{box-shadow:0 0 .35em #4faeef!important}} .tablesaw-bar .btn-select select { background: none; border: none; display: inline-block; position: absolute; left: 0; top: 0; margin: 0; width: 100%; height: 100%; z-index: 2; min-height: 1em; opacity: 0; color: transparent; } .tablesaw-bar .btn select option { background: #fff; color: #000; font-family: sans-serif; } .tablesaw-bar .btn { display: inline-block; width: auto; height: auto; position: relative; top: 0; } .tablesaw-bar .btn.btn-small { font-size: 1.0625em; line-height: 19px; padding: .3em 1em .3em 1em; } .tablesaw-bar .btn.btn-micro { font-size: .8125em; padding: .4em .7em .25em .7em; } .tablesaw-bar .btn-select { display: inline-block; color: #4d4d4d; padding-right: 2.5em; min-width: 7.25em; text-align: left; } .tablesaw-bar .btn-select:after { position: absolute; background: none; background-repeat: no-repeat; background-position: .25em .45em; content: "\25bc"; font-size: .55em; padding-top: 1.2em; padding-left: 1em; left: auto; right: 0; margin: 0; top: 0; bottom: 0; width: 1.8em; } .tablesaw-bar .btn-select.btn-small:after,.tablesaw-bar .btn-select.btn-micro:after { width: 1.2em; font-size: .5em; padding-top: 1em; padding-right: .5em; line-height: 1.65; background: none; box-shadow: none; border-left-width: 0; } .tablesaw-advance .btn { -webkit-appearance: none; -moz-appearance: none; box-sizing: border-box; text-shadow: 0 1px 0 #fff; border-radius: .25em; } .tablesaw-advance .btn.btn-micro { font-size: .8125em; padding: .3em .7em .25em .7em; } .tablesaw-bar .tablesaw-advance a.tablesaw-nav-btn { display: inline-block; overflow: hidden; width: 1.8em; height: 1.8em; background-position: 50% 50%; margin-left: .5em; position: relative; } .tablesaw-bar .tablesaw-advance a.tablesaw-nav-btn.left:before,.tablesaw-bar .tablesaw-advance a.tablesaw-nav-btn.right:before,.tablesaw-bar .tablesaw-advance a.tablesaw-nav-btn.down:before,.tablesaw-bar .tablesaw-advance a.tablesaw-nav-btn.up:before { content: "\0020"; overflow: hidden; width: 0; height: 0; position: absolute; } .tablesaw-bar .tablesaw-advance a.tablesaw-nav-btn.down:before { left: .5em; top: .65em; border-left: 5px solid transparent; border-right: 5px solid transparent; border-top: 5px solid gray; } .tablesaw-bar .tablesaw-advance a.tablesaw-nav-btn.up:before { left: .5em; top: .65em; border-left: 5px solid transparent; border-right: 5px solid transparent; border-bottom: 5px solid gray; } .tablesaw-bar .tablesaw-advance a.tablesaw-nav-btn.left:before,.tablesaw-bar .tablesaw-advance a.tablesaw-nav-btn.right:before { top: .45em; border-top: 5px solid transparent; border-bottom: 5px solid transparent; } .tablesaw-bar .tablesaw-advance a.tablesaw-nav-btn.left:before { left: .6em; border-right: 5px solid gray; } .tablesaw-bar .tablesaw-advance a.tablesaw-nav-btn.right:before { left: .7em; border-left: 5px solid gray; } .tablesaw-advance a.tablesaw-nav-btn.disabled { opacity: .25; cursor: default; pointer-events: none; } .tablesaw-bar { clear: both; font-family: sans-serif; } .tablesaw-toolbar { float: left; } .tablesaw-toolbar label { font-size: .875em; padding: .5em 0; clear: both; display: block; color: #888; margin-right: .5em; text-transform: uppercase; } .tablesaw-bar .btn,.tablesaw-enhanced .tablesaw-bar .btn { margin-top: .5em; margin-bottom: .5em; } .tablesaw-bar .btn-select,.tablesaw-enhanced .tablesaw-bar .btn-select { margin-bottom: 0; } .tablesaw-bar .tablesaw-toolbar .btn { margin-left: .4em; margin-top: 0; text-transform: uppercase; border: none; box-shadow: none; background: transparent; font-family: sans-serif; font-size: 1em; padding-left: .3em; } .tablesaw-bar .tablesaw-toolbar .btn-select { min-width: 0; } .tablesaw-bar .tablesaw-toolbar .btn-select:after { padding-top: .9em; } .tablesaw-bar .tablesaw-toolbar select { color: #888; text-transform: none; background: transparent; } .tablesaw-toolbar~table { clear: both; } .tablesaw-toolbar .a11y-sm { clip: rect(0 0 0 0); height: 1px; overflow: hidden; position: absolute; width: 1px; } @media (min-width:24em) { .tablesaw-toolbar .a11y-sm { clip: none; height: auto; width: auto; position: static; overflow: visible; } } .tablesaw th,.tablesaw td { text-align: left; vertical-align: middle; } .tablesaw thead th { text-align: left; } .tablesaw-row-border tr { border-bottom: 1px solid #dfdfdf; } .tablesaw-row-zebra tr:nth-child(2n) { background-color: #f8f8f8; } .tablesaw caption { text-align: left; margin: .59375em 0; } .tablesaw-swipe .tablesaw-cell-persist { border-right: 2px solid #e4e1de; } .tablesaw-swipe-shadow .tablesaw-cell-persist { border-right-width: 1px; } .tablesaw-swipe-shadow .tablesaw-cell-persist { box-shadow: 3px 0 4px -1px #e4e1de; } .tablesaw-stack td .tablesaw-cell-label,.tablesaw-stack th .tablesaw-cell-label { display: none; } @media only all { .tablesaw-stack td,.tablesaw-stack th { text-align: left; display: block; } .tablesaw-stack tr { clear: both; display: table-row; } .tablesaw-stack td .tablesaw-cell-label,.tablesaw-stack th .tablesaw-cell-label { padding: 1em .6em .3em 0; width: 100%; /* width:30%; display:inline-block;*/ display: block; } .tablesaw-stack th .tablesaw-cell-label-top,.tablesaw-stack td .tablesaw-cell-label-top { display: block; padding: .4em 0; margin: .4em 0; } .tablesaw-cell-label { display: block; } .tablesaw-stack tbody th.group { margin-top: -1px; } .tablesaw-stack th.group b.tablesaw-cell-label { display: none!important; } } @media (max-width:39.9375em) { .tablesaw-stack tbody tr { border-bottom: 1px solid transparent; } .tablesaw-stack thead td,.tablesaw-stack thead th { display: none; } .tablesaw-stack tbody td,.tablesaw-stack tbody th { clear: left; float: left; width: 100%; } .tablesaw-cell-label { vertical-align: top; } .tablesaw-cell-content { /* max-width:67%; */ display: block; /* width: 67%; */ width: 100%; } .tablesaw-stack td:empty,.tablesaw-stack th:empty { display: none; } } @media (min-width:40em) { .tablesaw-stack tr { display: table-row; } .tablesaw-stack td,.tablesaw-stack th,.tablesaw-stack thead td,.tablesaw-stack thead th { display: table-cell; margin: 0; } .tablesaw-stack td .tablesaw-cell-label,.tablesaw-stack th .tablesaw-cell-label { display: none!important; } } .tablesaw-fix-persist { table-layout: fixed; } @media only all { .tablesaw-swipe th.tablesaw-cell-hidden,.tablesaw-swipe td.tablesaw-cell-hidden { display: none; } } .btn.tablesaw-columntoggle-btn span { text-indent: -9999px; display: inline-block; } .tablesaw-columntoggle-btnwrap { position: relative; } .tablesaw-columntoggle-btnwrap .dialog-content { padding: .5em; } .tablesaw-columntoggle tbody td { line-height: 1.5; } .tablesaw-columntoggle-popup { display: none; } .tablesaw-columntoggle-btnwrap.visible .tablesaw-columntoggle-popup { display: block; position: absolute; top: 2em; right: 0; background-color: #fff; padding: .5em .8em; border: 1px solid #ccc; box-shadow: 0 1px 2px #ccc; border-radius: .2em; z-index: 1; } .tablesaw-columntoggle-popup fieldset { margin: 0; } @media only all { .tablesaw-columntoggle th.tablesaw-priority-6,.tablesaw-columntoggle td.tablesaw-priority-6,.tablesaw-columntoggle th.tablesaw-priority-5,.tablesaw-columntoggle td.tablesaw-priority-5,.tablesaw-columntoggle th.tablesaw-priority-4,.tablesaw-columntoggle td.tablesaw-priority-4,.tablesaw-columntoggle th.tablesaw-priority-3,.tablesaw-columntoggle td.tablesaw-priority-3,.tablesaw-columntoggle th.tablesaw-priority-2,.tablesaw-columntoggle td.tablesaw-priority-2,.tablesaw-columntoggle th.tablesaw-priority-1,.tablesaw-columntoggle td.tablesaw-priority-1 { display: none; } } .tablesaw-columntoggle-btnwrap .dialog-content { top: 0!important; right: 1em; left: auto!important; width: 12em; max-width: 18em; margin: -.5em auto 0; } .tablesaw-columntoggle-btnwrap .dialog-content:focus { outline-style: none; } @media (min-width:20em) { .tablesaw-columntoggle th.tablesaw-priority-1,.tablesaw-columntoggle td.tablesaw-priority-1 { display: table-cell; } } @media (min-width:30em) { .tablesaw-columntoggle th.tablesaw-priority-2,.tablesaw-columntoggle td.tablesaw-priority-2 { display: table-cell; } } @media (min-width:40em) { .tablesaw-columntoggle th.tablesaw-priority-3,.tablesaw-columntoggle td.tablesaw-priority-3 { display: table-cell; } .tablesaw-columntoggle tbody td { line-height: 2; } } @media (min-width:50em) { .tablesaw-columntoggle th.tablesaw-priority-4,.tablesaw-columntoggle td.tablesaw-priority-4 { display: table-cell; } } @media (min-width:60em) { .tablesaw-columntoggle th.tablesaw-priority-5,.tablesaw-columntoggle td.tablesaw-priority-5 { display: table-cell; } } @media (min-width:70em) { .tablesaw-columntoggle th.tablesaw-priority-6,.tablesaw-columntoggle td.tablesaw-priority-6 { display: table-cell; } } @media only all { .tablesaw-columntoggle th.tablesaw-cell-hidden,.tablesaw-columntoggle td.tablesaw-cell-hidden { display: none; } .tablesaw-columntoggle th.tablesaw-cell-visible,.tablesaw-columntoggle td.tablesaw-cell-visible { display: table-cell; } } .tablesaw-columntoggle-popup .btn-group>label { display: block; padding: .2em 0; white-space: nowrap; } .tablesaw-columntoggle-popup .btn-group>label input { margin-right: .8em; } .tablesaw-sortable,.tablesaw-sortable thead,.tablesaw-sortable thead tr,.tablesaw-sortable thead tr th { position: relative; } .tablesaw-sortable thead tr th { vertical-align: top; } .tablesaw-sortable th.tablesaw-sortable-head.tablesaw-sortable-head { padding: 0; } .tablesaw-sortable th.tablesaw-sortable-head button { padding-top: .9em; padding-bottom: .7em; padding-left: .6em; padding-right: .6em; } .tablesaw-sortable .tablesaw-sortable-head button { min-width: 100%; color: inherit; background: transparent; border: 0; padding: 0; text-align: left; font: inherit; text-transform: inherit; } .tablesaw-sortable-arrow:after { display: inline-block; width: 10px; height: 14px; content: " "; margin-left: .3125em; } .tablesaw-sortable .tablesaw-sortable-head.tablesaw-sortable-ascending .tablesaw-sortable-arrow:after,.tablesaw-sortable .tablesaw-sortable-head.tablesaw-sortable-descending .tablesaw-sortable-arrow:after { content: "\0020"; } .tablesaw-sortable .tablesaw-sortable-head.tablesaw-sortable-ascending .tablesaw-sortable-arrow:after { content: "\2191"; } .tablesaw-sortable .tablesaw-sortable-head.tablesaw-sortable-descending .tablesaw-sortable-arrow:after { content: "\2193"; } .tablesaw-sortable .not-applicable:after { content: "--"; display: block; } .tablesaw-sortable .not-applicable span { display: none; } .tablesaw-advance { float: right; } .tablesaw-advance.minimap { margin-right: .4em; } .tablesaw-advance-dots { float: left; margin: 0; padding: 0; list-style: none; } .tablesaw-advance-dots li { display: table-cell; margin: 0; padding: .4em .2em; } .tablesaw-advance-dots li i { width: .25em; height: .25em; background: #555; border-radius: 100%; display: inline-block; } .tablesaw-advance-dots-hide { opacity: .25; cursor: default; pointer-events: none; }