@import url("https://fonts.googleapis.com/css?family=Open+Sans:300,600"); html, body, div, span, applet, object, iframe, h1, h2, h3, h4, h5, h6, p, blockquote, pre, a, abbr, acronym, address, big, cite, code, del, dfn, em, img, ins, kbd, q, s, samp, small, strike, strong, sub, sup, tt, var, dl, dt, dd, ol, ul, li, fieldset, form, label, legend, table, caption, tbody, tfoot, thead, tr, th, td { margin: 0; padding: 0; border: 0; outline: 0; font-weight: inherit; font-style: inherit; font-family: inherit; font-size: 100%; vertical-align: baseline; } body { line-height: 1; color: #000; background: #fff; } ol, ul { list-style: none; } table { border-collapse: separate; border-spacing: 0; vertical-align: middle; } caption, th, td { text-align: left; font-weight: normal; vertical-align: middle; } a img { border: none; } .ReactTable{position:relative;}.ReactTable table{width:100%;border-collapse:collapse;border:1px solid rgba(0,0,0,0.1);display:block;overflow-x:auto}.ReactTable .-td-inner,.ReactTable .-th-inner{white-space:nowrap;-o-text-overflow:ellipsis;text-overflow:ellipsis;padding:7px 5px;overflow:hidden;z-index:0;-webkit-transition:0.3s ease;-moz-transition:0.3s ease;-o-transition:0.3s ease;-ms-transition:0.3s ease;transition:0.3s ease;-webkit-transition-property:width, min-width, padding, opacity;-moz-transition-property:width, min-width, padding, opacity;-o-transition-property:width, min-width, padding, opacity;-ms-transition-property:width, min-width, padding, opacity;transition-property:width, min-width, padding, opacity}.ReactTable th:hover .-td-inner,.ReactTable td:hover .-td-inner,.ReactTable th:hover .-th-inner,.ReactTable td:hover .-th-inner{position:relative;overflow:visible;z-index:1;text-shadow:0 0 1px #fff,0 0 2px #fff,1px 0 3px #fff,1px 0 4px #fff,2px 0 5px #fff,2px 0 6px #fff,3px 0 7px #fff,3px 0 8px #fff,4px 0 9px #fff,4px 0 10px #fff,5px 0 11px #fff,5px 0 12px #fff,6px 0 13px #fff,6px 0 14px #fff,7px 0 15px #fff,7px 0 16px #fff,8px 0 17px #fff,8px 0 18px #fff,9px 0 19px #fff,9px 0 20px #fff;}.ReactTable th:hover .-td-inner > *,.ReactTable td:hover .-td-inner > *,.ReactTable th:hover .-th-inner > *,.ReactTable td:hover .-th-inner > *{text-shadow:none}.ReactTable th.-hidden,.ReactTable td.-hidden{border:0 !important;opacity:0 !important;-ms-filter:"progid:DXImageTransform.Microsoft.Alpha(Opacity=0)" !important;filter:alpha(opacity=0) !important;}.ReactTable th.-hidden .-th-inner,.ReactTable td.-hidden .-th-inner,.ReactTable th.-hidden .-td-inner,.ReactTable td.-hidden .-td-inner{width:0 !important;min-width:0 !important;padding:0 !important}.ReactTable thead{-webkit-box-shadow:0 5px 20px 0 rgba(0,0,0,0.1);box-shadow:0 5px 20px 0 rgba(0,0,0,0.1);z-index:0;}.ReactTable thead.-headerGroups{border-bottom:1px solid rgba(0,0,0,0.05);}.ReactTable thead.-headerGroups th,.ReactTable thead.-headerGroups td{background:rgba(0,0,0,0.03)}.ReactTable thead tr{text-align:center}.ReactTable thead th,.ReactTable thead td{width:1%;background:#fff;font-weight:500;color:$darkColor;border-right:1px solid rgba(0,0,0,0.05);-webkit-transition:box-shadow 0.3s cubic-bezier(0.175, 0.885, 0.32, 1.275);-moz-transition:box-shadow 0.3s cubic-bezier(0.175, 0.885, 0.32, 1.275);-o-transition:box-shadow 0.3s cubic-bezier(0.175, 0.885, 0.32, 1.275);-ms-transition:box-shadow 0.3s cubic-bezier(0.175, 0.885, 0.32, 1.275);transition:box-shadow 0.3s cubic-bezier(0.175, 0.885, 0.32, 1.275);-webkit-box-shadow:inset 0 0 0 0 transparent;box-shadow:inset 0 0 0 0 transparent;}.ReactTable thead th.-sort-asc,.ReactTable thead td.-sort-asc{-webkit-box-shadow:inset 0 3px 0 0 rgba(0,0,0,0.6);box-shadow:inset 0 3px 0 0 rgba(0,0,0,0.6)}.ReactTable thead th.-sort-desc,.ReactTable thead td.-sort-desc{-webkit-box-shadow:inset 0 -3px 0 0 rgba(0,0,0,0.6);box-shadow:inset 0 -3px 0 0 rgba(0,0,0,0.6)}.ReactTable thead th.-cursor-pointer,.ReactTable thead td.-cursor-pointer{cursor:pointer}.ReactTable tbody{z-index:0;}.ReactTable tbody tr{border-bottom:solid 1px rgba(0,0,0,0.05);}.ReactTable tbody tr:last-child{border-bottom:0}.ReactTable tbody tr:first-child td{-webkit-box-shadow:inset 0 20px 20px -20px rgba(0,0,0,0.2);box-shadow:inset 0 20px 20px -20px rgba(0,0,0,0.2)}.ReactTable tbody td{border-right:1px solid rgba(0,0,0,0.02);}.ReactTable tbody td:last-child{border-right:0}.ReactTable.striped tbody tr:nth-child(even){background:rgba(0,0,0,0.03)}.ReactTable.highlight tbody tr:hover{background:rgba(0,0,0,0.05)}.ReactTable .-pagination{width:100%;display:-webkit-box;display:-moz-box;display:-webkit-flex;display:-ms-flexbox;display:box;display:flex;margin-top:5px;-webkit-box-pack:justify;-moz-box-pack:justify;-o-box-pack:justify;-ms-flex-pack:justify;-webkit-justify-content:space-between;justify-content:space-between;-webkit-box-align:center;-moz-box-align:center;-o-box-align:center;-ms-flex-align:center;-webkit-align-items:center;align-items:center;-webkit-box-lines:multiple;-moz-box-lines:multiple;-o-box-lines:multiple;-webkit-flex-wrap:wrap;-ms-flex-wrap:wrap;flex-wrap:wrap;}.ReactTable .-pagination .-btn{-webkit-appearance:none;-moz-appearance:none;appearance:none;display:block;width:100%;border:0;border-radius:3px;padding:6px;font-size:1em;color:rgba(0,0,0,0.6);background:rgba(0,0,0,0.1);-webkit-transition:all 0.1s ease;-moz-transition:all 0.1s ease;-o-transition:all 0.1s ease;-ms-transition:all 0.1s ease;transition:all 0.1s ease;cursor:pointer;outline:none;}.ReactTable .-pagination .-btn[disabled]{opacity:.5;-ms-filter:"progid:DXImageTransform.Microsoft.Alpha(Opacity=50)";filter:alpha(opacity=50);cursor:default}.ReactTable .-pagination .-btn:not([disabled]):hover{background:rgba(0,0,0,0.3);color:#fff}.ReactTable .-pagination .-left,.ReactTable .-pagination .-center,.ReactTable .-pagination .-right{-webkit-box-flex:1;-moz-box-flex:1;-o-box-flex:1;box-flex:1;-webkit-flex:1;-ms-flex:1;flex:1;margin-bottom:5px}.ReactTable .-pagination .-left,.ReactTable .-pagination .-right{text-align:center}.ReactTable .-pagination .-center{text-align:center;padding:0 5px}.ReactTable .-loading{display:block;position:absolute;left:0;right:0;top:0;bottom:0;background:rgba(255,255,255,0.8);-webkit-transition:all 0.3s ease;-moz-transition:all 0.3s ease;-o-transition:all 0.3s ease;-ms-transition:all 0.3s ease;transition:all 0.3s ease;z-index:2;opacity:0;-ms-filter:"progid:DXImageTransform.Microsoft.Alpha(Opacity=0)";filter:alpha(opacity=0);pointer-events:none;}.ReactTable .-loading > div{position:absolute;display:block;text-align:center;width:100%;top:50%;left:0;font-size:15px;color:rgba(0,0,0,0.6);-webkit-transform:translateY(-52%);-moz-transform:translateY(-52%);-o-transform:translateY(-52%);-ms-transform:translateY(-52%);transform:translateY(-52%);-webkit-transition:all 0.3s cubic-bezier(0.25, 0.46, 0.45, 0.94);-moz-transition:all 0.3s cubic-bezier(0.25, 0.46, 0.45, 0.94);-o-transition:all 0.3s cubic-bezier(0.25, 0.46, 0.45, 0.94);-ms-transition:all 0.3s cubic-bezier(0.25, 0.46, 0.45, 0.94);transition:all 0.3s cubic-bezier(0.25, 0.46, 0.45, 0.94)}.ReactTable .-loading.-active{opacity:1;-ms-filter:none;filter:none;pointer-events:all;}.ReactTable .-loading.-active > div{-webkit-transform:translateY(50%);-moz-transform:translateY(50%);-o-transform:translateY(50%);-ms-transform:translateY(50%);transform:translateY(50%)} * { -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box; } html { min-height: 100vh; } body { background: #003952; background: -webkit-radial-gradient(ellipse at center, #005275 0%, #003952 100%); background: -moz-radial-gradient(ellipse at center, #005275 0%, #003952 100%); background: -o-radial-gradient(ellipse at center, #005275 0%, #003952 100%); background: -ms-radial-gradient(ellipse at center, #005275 0%, #003952 100%); background: radial-gradient(ellipse at center, #005275 0%, #003952 100%); font-family: 'Open Sans', sans-serif; font-weight: 300; padding-bottom: 50px; } h1 { font-size: 2.5em; color: #fff; } a { color: #fff; font-weight: bold; } strong { font-weight: bold; } .container { display: -webkit-box; display: -moz-box; display: -webkit-flex; display: -ms-flexbox; display: box; display: flex; -webkit-box-orient: vertical; -moz-box-orient: vertical; -o-box-orient: vertical; -webkit-flex-direction: column; -ms-flex-direction: column; flex-direction: column; -webkit-box-align: center; -moz-box-align: center; -o-box-align: center; -ms-flex-align: center; -webkit-align-items: center; align-items: center; -webkit-box-pack: center; -moz-box-pack: center; -o-box-pack: center; -ms-flex-pack: center; -webkit-justify-content: center; justify-content: center; min-height: 100vh; padding-top: 20px; } .container .github-addon { font-size: 20px; color: #fff; padding: 10px; } .container .table-wrap { background: #fff; width: 700px; padding: 10px; border-radius: 5px; }