html 
{
box-sizing:border-box;
}
*,*:before,*:after 
{
box-sizing:inherit;
}
body
{
background-color:#333333;
}
#header
{
top:0px;
height:7vh;
width:100%;
position:fixed;
z-index:1000;
}
#type
{
margin-top:1vh;
margin-bottom:1vh;
color:#ffffff;
}
#description
{
position:relative;
top:7vh;
height:15px;
}
.desc
{
color:#ffffff;
font-size:100%;
}
.orange
{
color:#FF8C00;
}
.white
{
color:#ffffff;
}
.icon
{
color:#FF8C00;
font-size:120%
}
.table-layout 
{
position:relative;
top:9vh;
height:85vh;
width:98vw;
//width: 100%;
table-layout: fixed;
margin:auto;
z-index:1;
overflow:auto;
}
.table-layout table 
{
width: 100%;
min-width: 1024px;
margin: auto;
border: 1px solid #333333;
border-collapse: separate;
border-spacing: 0;
font-family:Arial; font-size:90%; font-style:normal;
}
.table-layout th, .table-layout td 
{
padding:5px 10px;
border:1px solid #333333;
color:#ffffff;
vertical-align:top;
}
.table-layout thead th 
{
background-color:#262626;
border:1px solid #262626;
color:#ffffff;
position:-webkit-sticky;
position:sticky;
top:0;
height:8vh;
font-family:Arial; font-size:100%; font-style:normal;
}
th
{
font-weight:normal;
}
.table-layout tfoot,.table-layout tfoot th,.table-layout tfoot td 
{
position:-webkit-sticky;
position:sticky;
bottom:0;
background-color:#262626;
color:#ffffff;
z-index:5;
height:4vh;
}
th:nth-child(1)
{
position:-webkit-sticky;
position:sticky;
left:0px;
width:50px;
z-index:4;  
}
thead th:nth-child(1),tfoot th:nth-child(1)
{
z-index: 22;
}
th:nth-child(2)
{
position:-webkit-sticky;
position:sticky;
left:50px;
width:250px;
z-index:4; 
}
thead th:nth-child(2),tfoot th:nth-child(2)
{
z-index:20;
}
.table-layout th 
{
font-family:Arial; font-size:90%; font-style:normal;
}
.table-layout tr:nth-child(even) 
{
background-color:#404040;
}
.table-layout tr:nth-child(odd) 
{
background-color:#333333;
}
.table-layout tr:hover 
{
background-color:#757575
}
.column_sort
{
background-color:#333333;
color:#ffffff;
border-color:#ffffff;
cursor: pointer;
width:100%;
height:45px;
border-radius: 5px;
}
.column_sort:hover 
{
background-color:#404040;
color:#f44336;
}
.column_sort:active
{
background-color:#404040;
color:#f44336;
}
.i1
{
color:#D4AF37;
}
.i2
{
color:#F62817;
}
.i3
{
color:#c19a6b;
}
.i4
{
color:#228B22;
}
.i5
{
color:#892d32;
}

.rank
{
background-color:#404040;
}
.name
{
background-color:#404040;
}
.totw
{
width:14vw;
}
.toto45w
{
width:14vw;
}
.totovkw
{
width:14vw;
}
.tothrdw
{
width:14vw;
}
.totnmlw
{
width:14vw;
}
.totesyw
(
width:14vw;
}