@font-face {
    font-family: 'MartianGrotesk';
    src: url('./static/MartianGrotesk-CnRg.ttf') format('truetype');
    font-weight: normal;
    font-style: normal;
}

html {
    line-height: 1.5;
    -webkit-text-size-adjust: 100%;
    -moz-tab-size: 4;
    tab-size: 4;
    font-size: 18px;
    height: 100vh;

    font-family: "MartianGrotesk" !important;
}

table.new-standings {
    margin-left: auto;
    margin-right: auto;
    max-width: 95%;
    border-collapse: collapse;
}

.main-table-shit-class {

    overflow-x: auto;
    overflow-y: auto;
    
}

.main-table-shit-class::-webkit-scrollbar {
    height: 4px;
    width: 4px; 
}

.main-table-shit-class::-webkit-scrollbar-track {
    -webkit-box-shadow: inset 0 0 6px rgb(0 0 0 / 0.1);
}

.main-table-shit-class::-webkit-scrollbar-thumb {

    --tw-bg-opacity: 1;
    background-color: rgb(55 65 81 / var(--tw-bg-opacity, 1));
    outline: 3px solid rgb(55 65 81 / var(--tw-bg-opacity, 1));
}

.table-scroll {
    height: 80vh;
}

.new-standings th, .new-standings td {
    vertical-align: middle !important;
    border: solid black 0;
    min-width: 50px;
}

.body-back {
    --tw-bg-opacity: 1;
    background-color: rgb(17 24 39 / var(--tw-bg-opacity, 1)) !important;
}

.container-fluid {
    padding: 1rem;
    max-width: 99%;
    margin-left: auto;
    margin-right: auto;

    --tw-bg-opacity: 1;
    background-color: rgb(17 24 39 / var(--tw-bg-opacity, 1)) !important;

}

.table-responsive {
    --tw-bg-opacity: 1;
    background-color: rgb(31 41 55 / var(--tw-bg-opacity, 1));
    --tw-shadow: 0 20px 25px -5px rgb(0 0 0 / 0.1), 0 8px 10px -6px rgb(0 0 0 / 0.1);
    --tw-shadow-colored: 0 20px 25px -5px var(--tw-shadow-color), 0 8px 10px -6px var(--tw-shadow-color);
    box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow);
    padding: 2rem;
    border-radius: 1rem;
}

tbody tr {
    border-bottom-width: 1px;
    border-bottom-style: solid;
    border-bottom-color: #969696;
}

.last {
    border-right-width: 1px !important;
    border-right-style: solid !important;
    border-color: #969696 !important;
}

tbody tr:hover {
    --tw-bg-opacity: 1;
    background-color: rgb(55 65 81 / var(--tw-bg-opacity, 1));
}

.allstats {
    pointer-events: none;
}

.sign {
    font-weight: 500;
    font-size: 0.875rem;
    line-height: 1.25rem;
    padding-top: 0.125rem;
    padding-bottom: 0.125rem;
    padding-left: 0.5rem;
    padding-right: 0.5rem;
    border-radius: 0.5rem;

}

.new-standings .ok .sign {
    --tw-text-opacity: 1;
    color: rgb(220 252 231 / var(--tw-text-opacity, 1));
    --tw-bg-opacity: 1;
    background-color: rgb(22 101 52 / var(--tw-bg-opacity, 1));
    text-align: center;
}

.new-standings .firstAC .sign {
    --tw-text-opacity: 1;
    color: rgb(187 247 208 / var(--tw-text-opacity, 1));
    --tw-bg-opacity: 1;
    background-color: rgb(21 128 61 / var(--tw-bg-opacity, 1));

    /*background-color: #c8e6c9;*/
    text-align: center;
}

.new-standings .firstAC .sign:after {
    content: "★"
}


.new-standings .rj .sign {
    --tw-text-opacity: 1;
    color: rgb(254 226 226 / var(--tw-text-opacity, 1));
    --tw-bg-opacity: 1;
    background-color: rgb(153 27 27 / var(--tw-bg-opacity, 1));
    text-align: center;
}

.new-standings .freezed .sign {
    --tw-text-opacity: 1;
    color: rgb(254 240 138 / var(--tw-text-opacity, 1));
    --tw-bg-opacity: 1;
    background-color: rgb(161 98 7 / var(--tw-bg-opacity, 1));
    /*background-color: #ffc107;*/
    text-align: center;
}

.new-standings .stat {
    text-align: center;
}

.new-standings td {
    align-items: center;
    padding-top: 0.5rem;
    padding-bottom: 0.5rem;
    padding-left: 0.1rem;
    padding-right: 0.1rem;
}

.ejudge_copyright {
    margin: 3px 0px;
}

.contest-shit-info {
    margin-right: auto;
    margin-left: auto;
}

.main-table-shit-class {
    display:flex;
    flex-direction: column;
}

.contest-shit-info {
    color: gray;
    max-width: 50%;
    margin-bottom: 0;
    text-align: center;
}

tbody td {
    height: 30px;

    --tw-text-opacity: 1;
    color: rgb(229 231 235 / var(--tw-text-opacity, 1));
}

thead {
    text-align: center;
    
    box-sizing: border-box;
    border-width: 0;
    border-style: solid;
    border-color: #e5e7eb;

    --tw-text-opacity: 1;
    color: rgb(229 231 235 / var(--tw-text-opacity, 1));

    --tw-bg-opacity: 1;
    background-color: rgb(55 65 81 / var(--tw-bg-opacity, 1));
}

thead th {
    padding-left: 0.5rem;
    padding-right: 0.5rem;

    padding-top: 0.2rem;
    padding-bottom: 0.2rem;
}

thead {
    position: sticky;
    top: 0;
    z-index: 50;
}


@media screen and (min-width: 1000px) {

tr > th.fixed-side:nth-child(1) {
    position: sticky;
    left: 0;
    top: 0;
    z-index: 100;
    
    --tw-bg-opacity: 1;
    background-color: rgb(55 65 81 / var(--tw-bg-opacity, 1));
}

tr > th.fixed-side:nth-child(2) {
    position: sticky;
    left: 5rem;
    top: 0;
    z-index: 100;
    
    --tw-bg-opacity: 1;
    background-color: rgb(55 65 81 / var(--tw-bg-opacity, 1));
}

tr > th.fixed-side:nth-child(3) {
    position: sticky;
    left: 21rem;
    z-index: 100;
    width: 100px !important;
    
    --tw-bg-opacity: 1;
    background-color: rgb(55 65 81 / var(--tw-bg-opacity, 1));
}

tr > th.fixed-side:nth-child(4) {
    position: sticky;
    left: 26rem;
    z-index: 100;
    width: 100px !important;
    
    --tw-bg-opacity: 1;
    background-color: rgb(55 65 81 / var(--tw-bg-opacity, 1));
}




tr > td.fixed-side:nth-child(1) {
    position: sticky !important;
    left: 0;
    z-index: 1;
    
    --tw-bg-opacity: 1;
    background-color: rgb(31 41 55 / var(--tw-bg-opacity, 1));

    border-bottom-width: 1px;
    border-bottom-style: solid;
    border-bottom-color: #969696;
}

tr > td.fixed-side:nth-child(2) {
    position: sticky;
    left: 5rem;
    z-index: 1;
    
    --tw-bg-opacity: 1;
    background-color: rgb(31 41 55 / var(--tw-bg-opacity, 1));

    border-bottom-width: 1px;
    border-bottom-style: solid;
    border-bottom-color: #969696;
}

tr > td.fixed-side:nth-child(3) {
    position: sticky;
    left: 21rem;
    z-index: 1;
    width: 100px !important;
    
    --tw-bg-opacity: 1;
    background-color: rgb(31 41 55 / var(--tw-bg-opacity, 1));

    border-bottom-width: 1px;
    border-bottom-style: solid;
    border-bottom-color: #969696;
}

tr > td.fixed-side:nth-child(4) {
    position: sticky;
    left: 26rem;
    z-index: 1;
    width: 100px !important;
    
    --tw-bg-opacity: 1;
    background-color: rgb(31 41 55 / var(--tw-bg-opacity, 1));

    border-bottom-width: 1px;
    border-bottom-style: solid;
    border-bottom-color: #969696;
}

tr:hover > td.fixed-side:nth-child(2),
tr:hover > td.fixed-side:nth-child(3),
tr:hover > td.fixed-side:nth-child(4),
tr:hover > td.fixed-side:nth-child(1) {
    --tw-bg-opacity: 1;
    background-color: rgb(55 65 81 / var(--tw-bg-opacity, 1));  
}

}

h3 {
    --tw-text-opacity: 1;
    color: rgb(229 231 235 / var(--tw-text-opacity, 1));
}

.penalty-time {
    --tw-text-opacity: 1;
    color: rgb(156 163 175 / var(--tw-text-opacity, 1));
    font-size: 0.75rem;
    line-height: 1rem;
    margin-top: 0.25rem;
    font-size: 0.8rem;
    text-align: center;
}


tr > th.fixed-side:nth-child(1) .new-standings-cell {
    width: 4rem;
}

tr > th.fixed-side:nth-child(2) .new-standings-cell {
    width: 15rem;
}

tr > th.fixed-side:nth-child(3) .new-standings-cell {
    width: 4rem;
}